const require_runtime = require("../../../../_virtual/_rolldown/runtime.js");
const require_index = require("../../../keyboards/numberKeyboard/index.js");
const require_utils = require("./utils.js");
let react = require("react");
react = require_runtime.__toESM(react);
let _pisell_materials = require("@pisell/materials");
//#region src/pro/skuDetailModal/components/weighing/TareManagementPanel.tsx
function TareQuickBar({ options, selected, compact, unitLabel, convertTareValue, onSelect }) {
	return /* @__PURE__ */ react.default.createElement("div", { className: `pisell-sku-detail-weighing__tare-quick-bar${compact ? " pisell-sku-detail-weighing__tare-quick-bar--compact" : " pisell-sku-detail-weighing__tare-quick-bar--expanded"}` }, options.map((opt) => {
		const active = opt.id === selected;
		const displayValue = convertTareValue(opt);
		const showValue = !compact && opt.id !== "none";
		return /* @__PURE__ */ react.default.createElement("button", {
			key: opt.id,
			type: "button",
			className: `pisell-sku-detail-weighing__tare-chip${active ? " pisell-sku-detail-weighing__tare-chip--active" : ""}${showValue ? "" : " pisell-sku-detail-weighing__tare-chip--no-value"}`,
			onClick: () => onSelect(opt.id),
			"aria-pressed": active
		}, /* @__PURE__ */ react.default.createElement("span", { className: "pisell-sku-detail-weighing__tare-chip-label" }, opt.label), showValue && /* @__PURE__ */ react.default.createElement("span", { className: "pisell-sku-detail-weighing__tare-chip-value" }, require_utils.formatWeight(displayValue), " ", unitLabel));
	}));
}
function TareManagementPanel(props) {
	const { componentStyle, tareOptions, selectedTare, customTareIdSet, unitLabel, maxTareValue, convertTareValue, getText, onSelectTare, onDeleteCustomTare, onAddCustomTare } = props;
	const [newTareLabel, setNewTareLabel] = (0, react.useState)("");
	const [newTareValue, setNewTareValue] = (0, react.useState)("");
	const [newTareKeyboardOpen, setNewTareKeyboardOpen] = (0, react.useState)(false);
	const trimmedNewTareLabel = newTareLabel.trim();
	const normalizedNewTareLabel = trimmedNewTareLabel.toLocaleLowerCase();
	const isDuplicateTareLabel = normalizedNewTareLabel !== "" && tareOptions.some((item) => item.label.trim().toLocaleLowerCase() === normalizedNewTareLabel);
	const parsedNewTareValue = newTareValue === "" ? NaN : Number(newTareValue);
	const isAddDisabled = !trimmedNewTareLabel || isDuplicateTareLabel || !Number.isFinite(parsedNewTareValue) || parsedNewTareValue < 0 || parsedNewTareValue > maxTareValue;
	const handleNewTareValueChange = (value) => {
		const nextValue = require_utils.sanitizeManualWeight(value);
		if (!nextValue) {
			setNewTareValue("");
			return;
		}
		const parsedValue = Number(nextValue);
		if (!Number.isFinite(parsedValue) || parsedValue > maxTareValue) return;
		setNewTareValue(nextValue);
	};
	const handleNewTareKeyboardConfirm = (value) => {
		handleNewTareValueChange(value);
		setNewTareKeyboardOpen(false);
	};
	const handleAddCustomTare = () => {
		if (isAddDisabled) return;
		if (!onAddCustomTare({
			label: newTareLabel,
			value: parsedNewTareValue
		})) return;
		setNewTareLabel("");
		setNewTareValue("");
		setNewTareKeyboardOpen(false);
	};
	const handleAddCustomTareInputKeyDown = (event) => {
		if (event.key !== "Enter") return;
		event.preventDefault();
		if (isAddDisabled) return;
		handleAddCustomTare();
	};
	return /* @__PURE__ */ react.default.createElement("div", {
		className: "pisell-sku-detail-weighing__settings-panel",
		style: componentStyle
	}, /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-detail-weighing__settings-group" }, /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-detail-weighing__settings-group-header" }, /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-detail-weighing__settings-label" }, getText("pisell2.text.sku.detail.modal.weighing.metric.tare", "Tare")), /* @__PURE__ */ react.default.createElement("button", {
		type: "button",
		onClick: () => onSelectTare("none"),
		className: "pisell-sku-detail-weighing__settings-link"
	}, getText("pisell2.text.sku.detail.modal.weighing.settings.clear", "Clear"))), /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-detail-weighing__settings-subtitle" }, getText("pisell2.text.sku.detail.modal.weighing.settings.tare.subtitle", "If the reading is tared, please choose \"No Tare\".")), /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-detail-weighing__settings-tare-list" }, tareOptions.map((item) => {
		const active = selectedTare === item.id;
		const isCustom = customTareIdSet.has(item.id);
		const tareValueForDisplay = convertTareValue(item);
		return /* @__PURE__ */ react.default.createElement("div", {
			key: item.id,
			className: `pisell-sku-detail-weighing__tare-option${active ? " pisell-sku-detail-weighing__tare-option--active" : ""}`,
			onClick: () => onSelectTare(item.id),
			onKeyDown: (event) => {
				if (event.key === "Enter" || event.key === " ") {
					event.preventDefault();
					onSelectTare(item.id);
				}
			},
			role: "button",
			tabIndex: 0,
			"aria-pressed": active
		}, /* @__PURE__ */ react.default.createElement("span", { className: "pisell-sku-detail-weighing__tare-option-content" }, /* @__PURE__ */ react.default.createElement("span", { className: "pisell-sku-detail-weighing__tare-option-label" }, item.label), /* @__PURE__ */ react.default.createElement("span", { className: "pisell-sku-detail-weighing__tare-option-value" }, `${require_utils.formatWeight(tareValueForDisplay)} ${unitLabel}`)), isCustom ? /* @__PURE__ */ react.default.createElement("button", {
			type: "button",
			className: "pisell-sku-detail-weighing__tare-delete",
			onClick: (event) => {
				event.stopPropagation();
				onDeleteCustomTare(item.id);
			},
			"aria-label": getText("pisell2.text.sku.detail.modal.weighing.settings.delete.tare", "Delete tare")
		}, /* @__PURE__ */ react.default.createElement(_pisell_materials.Iconfont, {
			type: "pisell2-trash-01",
			size: 14
		})) : null);
	}))), /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-detail-weighing__settings-group" }, /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-detail-weighing__settings-label" }, getText("pisell2.text.sku.detail.modal.weighing.settings.add.tare", "Add Tare")), /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-detail-weighing__settings-form" }, /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-detail-weighing__settings-form-row" }, /* @__PURE__ */ react.default.createElement("input", {
		value: newTareLabel,
		onChange: (event) => setNewTareLabel(event.target.value),
		onKeyDown: handleAddCustomTareInputKeyDown,
		placeholder: getText("pisell2.text.sku.detail.modal.weighing.settings.label.placeholder", "Label"),
		className: `pisell-sku-detail-weighing__settings-input${isDuplicateTareLabel ? " pisell-sku-detail-weighing__settings-input--error" : ""}`,
		"aria-invalid": isDuplicateTareLabel
	}), /* @__PURE__ */ react.default.createElement(require_index.default, {
		defaultValue: newTareValue,
		originalValue: newTareValue,
		mode: "decimal",
		min: 0,
		max: maxTareValue,
		precision: 3,
		onEnter: handleNewTareKeyboardConfirm,
		containerProps: {
			className: "pisell-sku-detail-weighing__keyboard-popover",
			renderType: "popover",
			placement: "bottom",
			open: newTareKeyboardOpen,
			onOpenChange: setNewTareKeyboardOpen
		}
	}, /* @__PURE__ */ react.default.createElement("input", {
		value: newTareValue,
		onClick: () => setNewTareKeyboardOpen(true),
		onFocus: () => setNewTareKeyboardOpen(true),
		onKeyDown: handleAddCustomTareInputKeyDown,
		placeholder: unitLabel,
		inputMode: "decimal",
		className: "pisell-sku-detail-weighing__settings-input pisell-sku-detail-weighing__settings-input--readonly",
		readOnly: true
	})), /* @__PURE__ */ react.default.createElement("button", {
		type: "button",
		onClick: handleAddCustomTare,
		className: "pisell-sku-detail-weighing__settings-action",
		disabled: isAddDisabled
	}, getText("pisell2.text.sku.detail.modal.weighing.settings.add", "Add"))))));
}
//#endregion
exports.TareManagementPanel = TareManagementPanel;
exports.TareQuickBar = TareQuickBar;
