var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/pro/skuDetailModal/components/weighing/index.tsx
var weighing_exports = {};
__export(weighing_exports, {
  default: () => weighing_default
});
module.exports = __toCommonJS(weighing_exports);
var import_react = __toESM(require("react"));
var import_materials = require("@pisell/materials");
var import_antd = require("antd");
var import_utils = require("@pisell/utils");
var import_keyboards = require("../../../keyboards");
var import_useEngineContext = __toESM(require("../../../../hooks/useEngineContext"));
var import_TareManagementPanel = require("./TareManagementPanel");
var import_locales = __toESM(require("./locales"));
var import_utils2 = require("./utils");
var import_grid = require("./grid");
var import_index = require("./index.less");
var MAX_RETAIL_SCALE_WEIGHT_KG = 1e3;
var WEIGHT_PRECISION = 3;
var DEFAULT_OUTPUT_WEIGHT_PRECISION = 3;
var DEFAULT_OUTPUT_UNIT_PRICE_PRECISION = 2;
var formatOutputWeight = (value) => Number(value || 0).toFixed(DEFAULT_OUTPUT_WEIGHT_PRECISION);
var formatOutputUnitPrice = (value) => Number(value || 0).toFixed(DEFAULT_OUTPUT_UNIT_PRICE_PRECISION);
var Weighing = (props) => {
  var _a, _b, _c, _d, _e, _f, _g, _h;
  const context = (0, import_useEngineContext.default)();
  import_utils.locales.init(import_locales.default, ((_b = (_a = context == null ? void 0 : context.engine) == null ? void 0 : _a.props) == null ? void 0 : _b.locale) || "en");
  const getText = (key, fallback) => import_utils.locales.getText(key) || fallback;
  const noTareLabel = getText(
    "pisell2.text.sku.detail.modal.weighing.none.tare",
    "No Tare"
  );
  const {
    tareOptions: tareOptionsProp = [],
    initialValue,
    unit: scaleUnit = "KILOGRAMS",
    currencySymbol = "$",
    scalePriceProduct,
    onChange
  } = props;
  const nativeScaleTools = (_h = (_g = (_f = (_e = (_d = (_c = context == null ? void 0 : context.appHelper) == null ? void 0 : _c.utils) == null ? void 0 : _d.getApp) == null ? void 0 : _e.call(_d)) == null ? void 0 : _f.plugins) == null ? void 0 : _g.get) == null ? void 0 : _h.call(_g, "nativeScaleTools");
  if (!nativeScaleTools) {
    throw new Error(
      "[Weighing] nativeScaleTools plugin is required. Please register it via app.plugins."
    );
  }
  const { useNativeScale, calculateScaleItemTotal, convertWeight } = nativeScaleTools;
  const unitLabel = import_utils2.UNIT_LABEL[scaleUnit];
  const initialMode = (initialValue == null ? void 0 : initialValue.mode) ?? "auto";
  const initialManualWeight = initialValue != null ? (0, import_utils2.formatWeight)(Number(initialValue.weight)) : "0.000";
  const initialTare = initialValue == null ? void 0 : initialValue.tare;
  const initialTareValue = Number((initialTare == null ? void 0 : initialTare.value) ?? 0);
  const rootRef = (0, import_react.useRef)(null);
  const [tarePopoverOpen, setTarePopoverOpen] = (0, import_react.useState)(false);
  const [componentWidth, setComponentWidth] = (0, import_react.useState)(0);
  const [keyboardOpen, setKeyboardOpen] = (0, import_react.useState)(false);
  const [customTareOptions, setCustomTareOptions] = (0, import_react.useState)(
    () => {
      const stored = (0, import_utils2.readCustomTares)();
      if (!initialTare || initialTareValue === 0) {
        return stored;
      }
      const baseOpts = tareOptionsProp.length ? tareOptionsProp : [{ id: "none", label: noTareLabel, value: 0 }];
      const allOpts = [...baseOpts, ...stored];
      const hasIdMatch = Boolean(initialTare.id) && allOpts.some((t) => t.id === initialTare.id);
      const hasMatch = allOpts.some(
        (t) => t.label === initialTare.label && Math.abs(t.value - initialTareValue) < 1e-3
      );
      if (hasIdMatch || hasMatch) {
        return stored;
      }
      const restoredId = initialTare.id || (0, import_utils2.getRestoredTareId)({
        label: initialTare.label,
        value: initialTareValue
      });
      return [
        {
          id: restoredId,
          label: initialTare.label,
          value: initialTareValue,
          unit: initialTare.unit
        },
        ...stored
      ];
    }
  );
  const [weightRefreshing, setWeightRefreshing] = (0, import_react.useState)(false);
  const [selectedMode, setSelectedMode] = (0, import_react.useState)(initialMode);
  const isEditMode = initialValue != null;
  const [autoReadingStarted, setAutoReadingStarted] = (0, import_react.useState)(!isEditMode);
  const frozenWeight = Number((initialValue == null ? void 0 : initialValue.weight) ?? 0);
  const productTareKey = (scalePriceProduct == null ? void 0 : scalePriceProduct.id) ? (0, import_utils2.getProductTareKey)(scalePriceProduct.id, scalePriceProduct.variant_id) : void 0;
  const productTareKeyRef = (0, import_react.useRef)(void 0);
  const [selectedTare, setSelectedTare] = (0, import_react.useState)(() => {
    if (!initialTare) {
      if (scalePriceProduct == null ? void 0 : scalePriceProduct.id) {
        const key = (0, import_utils2.getProductTareKey)(
          scalePriceProduct.id,
          scalePriceProduct.variant_id
        );
        const map = (0, import_utils2.readProductTareMap)();
        if (map[key]) return map[key];
      }
      return (0, import_utils2.readDefaultTareId)();
    }
    if (initialTareValue === 0) {
      return "none";
    }
    const baseOpts = tareOptionsProp.length ? tareOptionsProp : [{ id: "none", label: noTareLabel, value: 0 }];
    const stored = (0, import_utils2.readCustomTares)();
    const allOpts = [...baseOpts, ...stored];
    const matchById = initialTare.id ? allOpts.find((t) => t.id === initialTare.id) : void 0;
    if (matchById) {
      return matchById.id;
    }
    const matchByLabelValue = allOpts.find(
      (t) => t.label === initialTare.label && Math.abs(t.value - initialTareValue) < 1e-3
    );
    return matchByLabelValue ? matchByLabelValue.id : initialTare.id || (0, import_utils2.getRestoredTareId)({
      label: initialTare.label,
      value: initialTareValue
    });
  });
  const [manualWeight, setManualWeight] = (0, import_react.useState)(initialManualWeight);
  const tareOptions = (0, import_react.useMemo)(() => {
    const noneOption = { id: "none", label: noTareLabel, value: 0 };
    const optionMap = /* @__PURE__ */ new Map();
    [noneOption, ...tareOptionsProp, ...customTareOptions].forEach((item) => {
      if (!optionMap.has(item.id)) {
        optionMap.set(item.id, item);
      }
    });
    return Array.from(optionMap.values());
  }, [customTareOptions, noTareLabel, tareOptionsProp]);
  const customTareIdSet = (0, import_react.useMemo)(
    () => new Set(customTareOptions.map((item) => item.id)),
    [customTareOptions]
  );
  const convertTareValue = (0, import_react.useCallback)(
    (option) => {
      const fromUnit = option.unit ?? scaleUnit;
      if (!option.value) {
        return 0;
      }
      const result = convertWeight(option.value, fromUnit, scaleUnit);
      return result.valid ? result.value : 0;
    },
    [convertWeight, scaleUnit]
  );
  const selectedTareOption = tareOptions.find(
    (item) => item.id === selectedTare
  );
  const tareWeight = selectedTareOption ? convertTareValue(selectedTareOption) : 0;
  const scale = useNativeScale({
    unit: scaleUnit,
    precision: WEIGHT_PRECISION,
    tareWeight,
    autoStart: autoReadingStarted
  });
  (0, import_react.useEffect)(() => {
    scale.updateParams({ tareWeight, unit: scaleUnit });
  }, [scale.updateParams, scaleUnit, tareWeight]);
  const hasLiveData = scale.rawData != null;
  const sourceWeight = selectedMode === "manual" ? Number(manualWeight || 0) : autoReadingStarted && hasLiveData ? scale.grossWeight : frozenWeight;
  const netWeight = selectedMode === "manual" ? Math.max(Number(manualWeight || 0) - tareWeight, 0) : autoReadingStarted && hasLiveData ? scale.netWeight : Math.max(frozenWeight - tareWeight, 0);
  const product = (0, import_react.useMemo)(
    () => ({
      unit: (scalePriceProduct == null ? void 0 : scalePriceProduct.unit) ?? scaleUnit,
      unit_value: (scalePriceProduct == null ? void 0 : scalePriceProduct.unit_value) ?? 1,
      price: (scalePriceProduct == null ? void 0 : scalePriceProduct.price) ?? 0
    }),
    [scalePriceProduct, scaleUnit]
  );
  const computeTotalPrice = (0, import_react.useCallback)(
    (weightInScaleUnit) => {
      const result = calculateScaleItemTotal(
        {
          netWeight: weightInScaleUnit,
          unit: scaleUnit,
          precision: WEIGHT_PRECISION,
          pricePrecision: DEFAULT_OUTPUT_UNIT_PRICE_PRECISION
        },
        product
      );
      return result.valid ? result.totalPrice : 0;
    },
    [calculateScaleItemTotal, product, scaleUnit]
  );
  const finalPrice = (0, import_react.useMemo)(
    () => computeTotalPrice(netWeight),
    [computeTotalPrice, netWeight]
  );
  const displayUnitPrice = (0, import_react.useMemo)(
    () => computeTotalPrice(1),
    [computeTotalPrice]
  );
  const manualWeightMax = (0, import_react.useMemo)(() => {
    const result = convertWeight(
      MAX_RETAIL_SCALE_WEIGHT_KG,
      "KILOGRAMS",
      scaleUnit
    );
    return result.valid ? result.value : MAX_RETAIL_SCALE_WEIGHT_KG;
  }, [convertWeight, scaleUnit]);
  const scaleFactor = Math.max(0.5, Math.min((componentWidth || 360) / 420, 1));
  const compactPadding = Math.max(4, Math.round(12 * scaleFactor));
  const compactRadius = Math.max(4, Math.round(18 * scaleFactor));
  const compactGap = Math.max(4, Math.round(12 * scaleFactor));
  const compactInputRadius = Math.max(4, Math.round(12 * scaleFactor));
  const isConnected = scale.isListening && !scale.error;
  const connectionDotClass = isConnected ? "pisell-sku-detail-weighing__connection-dot--connected" : "pisell-sku-detail-weighing__connection-dot--error";
  const scaleHasError = Boolean(scale.error);
  const scaleOverloaded = scale.status === "overload";
  const showScaleAlert = selectedMode === "auto" && (scaleHasError || scaleOverloaded);
  const modeDescription = (() => {
    if (selectedMode === "manual") {
      return getText(
        "pisell2.text.sku.detail.modal.weighing.mode.desc.manual",
        "Manual entry"
      );
    }
    if (scaleHasError) {
      return getText(
        "pisell2.text.sku.detail.modal.weighing.mode.desc.error",
        "Scale error"
      );
    }
    if (scaleOverloaded) {
      return getText(
        "pisell2.text.sku.detail.modal.weighing.mode.desc.overload",
        "Scale overload"
      );
    }
    if (!scale.isListening) {
      return getText(
        "pisell2.text.sku.detail.modal.weighing.mode.desc.paused",
        "Paused"
      );
    }
    return getText(
      "pisell2.text.sku.detail.modal.weighing.mode.desc.auto",
      "Scale reading"
    );
  })();
  const componentStyle = {
    "--weighing-scale": String(scaleFactor),
    "--weighing-padding": `${compactPadding}px`,
    "--weighing-radius": `${compactRadius}px`,
    "--weighing-gap": `${compactGap}px`,
    "--weighing-input-radius": `${compactInputRadius}px`
  };
  const metricsGridParams = (0, import_react.useMemo)(
    () => ({
      containerWidth: Math.max(componentWidth - compactPadding * 2, 0),
      gap: compactGap
    }),
    [compactGap, compactPadding, componentWidth]
  );
  const metricsColumns = (0, import_react.useMemo)(
    () => (0, import_grid.getWeighingMetricGridColumns)(metricsGridParams),
    [metricsGridParams]
  );
  const metricsGridStyle = (0, import_react.useMemo)(
    () => (0, import_grid.getWeighingMetricGridStyle)(metricsGridParams),
    [metricsGridParams]
  );
  const isTareBarCompact = metricsColumns < 4;
  (0, import_react.useEffect)(() => {
    const element = rootRef.current;
    if (!element) {
      return void 0;
    }
    const updateWidth = () => {
      setComponentWidth(element.getBoundingClientRect().width);
    };
    updateWidth();
    const observer = new ResizeObserver(updateWidth);
    observer.observe(element);
    return () => {
      observer.disconnect();
    };
  }, []);
  (0, import_react.useEffect)(() => {
    if (typeof window === "undefined") {
      return;
    }
    window.localStorage.setItem(
      import_utils2.CUSTOM_TARE_STORAGE_KEY,
      JSON.stringify(customTareOptions)
    );
  }, [customTareOptions]);
  (0, import_react.useEffect)(() => {
    if (typeof window === "undefined" || !selectedTare) {
      return;
    }
    window.localStorage.setItem(import_utils2.DEFAULT_TARE_STORAGE_KEY, selectedTare);
  }, [selectedTare]);
  (0, import_react.useEffect)(() => {
    var _a2;
    if (!tareOptions.some((item) => item.id === selectedTare)) {
      setSelectedTare(((_a2 = tareOptions[0]) == null ? void 0 : _a2.id) || "none");
    }
  }, [selectedTare, tareOptions]);
  (0, import_react.useEffect)(() => {
    const prevKey = productTareKeyRef.current;
    productTareKeyRef.current = productTareKey;
    if (prevKey === void 0 || prevKey === productTareKey || isEditMode || !productTareKey) {
      return;
    }
    const map = (0, import_utils2.readProductTareMap)();
    const savedTareId = map[productTareKey];
    if (savedTareId) {
      setSelectedTare(savedTareId);
    }
  }, [productTareKey, isEditMode]);
  (0, import_react.useEffect)(() => {
    if (!selectedTare || !productTareKey) {
      return;
    }
    (0, import_utils2.saveProductTarePref)(productTareKey, selectedTare);
  }, [selectedTare, productTareKey]);
  (0, import_react.useEffect)(() => {
    const _value = {
      mode: selectedMode,
      weight: formatOutputWeight(sourceWeight),
      tare: {
        id: selectedTareOption == null ? void 0 : selectedTareOption.id,
        label: (selectedTareOption == null ? void 0 : selectedTareOption.label) ?? getText(
          "pisell2.text.sku.detail.modal.weighing.none.tare",
          "No Tare"
        ),
        value: formatOutputWeight(tareWeight),
        unit: scaleUnit
      },
      net_weight: formatOutputWeight(netWeight),
      total_amount: finalPrice,
      unit: scaleUnit,
      unit_weight: formatOutputWeight(1),
      unit_price: formatOutputUnitPrice(displayUnitPrice),
      scalePriceProduct
    };
    onChange == null ? void 0 : onChange(_value);
  }, [
    displayUnitPrice,
    finalPrice,
    netWeight,
    onChange,
    selectedMode,
    selectedTareOption,
    sourceWeight,
    tareWeight,
    scalePriceProduct,
    scaleUnit
  ]);
  const handleTareSelect = (tareId) => {
    setSelectedTare(tareId);
    setTarePopoverOpen(false);
  };
  const handleAddCustomTare = (params) => {
    const trimmedLabel = params.label.trim();
    const normalizedLabel = trimmedLabel.toLocaleLowerCase();
    const inputValue = Number(params.value);
    if (!trimmedLabel || tareOptions.some(
      (item) => item.label.trim().toLocaleLowerCase() === normalizedLabel
    ) || !Number.isFinite(inputValue) || inputValue < 0 || inputValue > manualWeightMax) {
      return false;
    }
    const nextOption = {
      id: `custom-${Date.now()}`,
      label: trimmedLabel,
      value: inputValue,
      unit: scaleUnit
    };
    setCustomTareOptions((prev) => [...prev, nextOption]);
    setSelectedTare(nextOption.id);
    setTarePopoverOpen(false);
    return true;
  };
  const handleReRead = async () => {
    if (weightRefreshing) {
      return;
    }
    setWeightRefreshing(true);
    try {
      if (!autoReadingStarted) {
        setAutoReadingStarted(true);
        return;
      }
      await scale.stopListening();
      await scale.startListening();
    } catch {
    }
  };
  const handleDeleteCustomTare = (tareId) => {
    setCustomTareOptions((prev) => prev.filter((item) => item.id !== tareId));
  };
  (0, import_react.useEffect)(() => {
    if (!weightRefreshing) {
      return void 0;
    }
    const timer = window.setTimeout(() => {
      setWeightRefreshing(false);
    }, 300);
    return () => {
      window.clearTimeout(timer);
    };
  }, [weightRefreshing]);
  const handleManualKeyboardConfirm = (value) => {
    const nextValue = (0, import_utils2.sanitizeManualWeight)(value);
    setManualWeight(nextValue);
    setKeyboardOpen(false);
  };
  const tareManagementContent = /* @__PURE__ */ import_react.default.createElement(
    import_TareManagementPanel.TareManagementPanel,
    {
      componentStyle,
      tareOptions,
      selectedTare,
      customTareIdSet,
      unitLabel,
      maxTareValue: manualWeightMax,
      convertTareValue,
      getText,
      onSelectTare: handleTareSelect,
      onDeleteCustomTare: handleDeleteCustomTare,
      onAddCustomTare: handleAddCustomTare
    }
  );
  const modeSwitcher = /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__mode-switcher" }, /* @__PURE__ */ import_react.default.createElement(
    "button",
    {
      type: "button",
      onClick: () => setSelectedMode("auto"),
      className: `pisell-sku-detail-weighing__mode-tab${selectedMode === "auto" ? " pisell-sku-detail-weighing__mode-tab--active" : ""}`,
      "aria-pressed": selectedMode === "auto"
    },
    getText("pisell2.text.sku.detail.modal.weighing.mode.auto", "Auto")
  ), /* @__PURE__ */ import_react.default.createElement(
    "button",
    {
      type: "button",
      onClick: () => setSelectedMode("manual"),
      className: `pisell-sku-detail-weighing__mode-tab${selectedMode === "manual" ? " pisell-sku-detail-weighing__mode-tab--active" : ""}`,
      "aria-pressed": selectedMode === "manual"
    },
    getText(
      "pisell2.text.sku.detail.modal.weighing.mode.manual",
      "Manual"
    )
  ));
  const weightIcon = selectedMode === "auto" ? /* @__PURE__ */ import_react.default.createElement(
    "span",
    {
      className: weightRefreshing ? "pisell-sku-detail-weighing__icon--spinning" : void 0
    },
    /* @__PURE__ */ import_react.default.createElement(import_materials.Iconfont, { type: "pisell2-refresh-cw-05", size: 18 })
  ) : null;
  const tareIcon = /* @__PURE__ */ import_react.default.createElement(import_materials.Iconfont, { type: "pisell2-switch-horizontal-01", size: 18 });
  const manualWeightMetricCard = /* @__PURE__ */ import_react.default.createElement(
    MetricCard,
    {
      label: getText(
        "pisell2.text.sku.detail.modal.weighing.metric.weight",
        "Weight"
      ),
      value: (0, import_utils2.formatWeight)(sourceWeight),
      unit: unitLabel,
      description: selectedMode === "auto" ? getText(
        "pisell2.text.sku.detail.modal.weighing.metric.weight.desc.auto",
        "click to re-read"
      ) : void 0,
      highlight: true,
      editable: selectedMode === "manual",
      icon: weightIcon,
      onCardClick: selectedMode === "auto" ? handleReRead : void 0
    }
  );
  return /* @__PURE__ */ import_react.default.createElement(
    "div",
    {
      ref: rootRef,
      style: componentStyle,
      className: `pisell-sku-detail-weighing pisell-sku-detail-weighing--${selectedMode}`
    },
    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__header" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__header-main" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__title-row" }, /* @__PURE__ */ import_react.default.createElement(
      "span",
      {
        className: `pisell-sku-detail-weighing__connection-dot ${connectionDotClass}`
      }
    ), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__title" }, getText(
      "pisell2.text.sku.detail.modal.weighing.title",
      "Weighing"
    ))), /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        className: `pisell-sku-detail-weighing__subtitle${showScaleAlert ? " pisell-sku-detail-weighing__subtitle--error" : ""}`
      },
      modeDescription
    )), modeSwitcher),
    /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        className: "pisell-sku-detail-weighing__metrics",
        style: metricsGridStyle
      },
      /* @__PURE__ */ import_react.default.createElement(
        MetricCard,
        {
          label: getText(
            "pisell2.text.sku.detail.modal.weighing.metric.unit.price",
            "Unit Price"
          ),
          value: (0, import_utils2.formatMoney)(displayUnitPrice, currencySymbol),
          unit: `/${unitLabel}`
        }
      ),
      selectedMode === "manual" ? /* @__PURE__ */ import_react.default.createElement(
        import_keyboards.NumberKeyboard,
        {
          originalValue: manualWeight,
          defaultValue: manualWeight,
          mode: "decimal",
          min: 0,
          max: manualWeightMax,
          precision: 3,
          onEnter: handleManualKeyboardConfirm,
          containerProps: {
            className: "pisell-sku-detail-weighing__keyboard-popover",
            renderType: "popover",
            placement: "right",
            open: keyboardOpen,
            onOpenChange: setKeyboardOpen
          }
        },
        /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__popover-trigger" }, manualWeightMetricCard)
      ) : manualWeightMetricCard,
      /* @__PURE__ */ import_react.default.createElement(
        import_antd.Popover,
        {
          trigger: "click",
          placement: "bottomRight",
          open: tarePopoverOpen,
          content: tareManagementContent,
          overlayClassName: "pisell-sku-detail-weighing__popover",
          onOpenChange: setTarePopoverOpen
        },
        /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__popover-trigger" }, /* @__PURE__ */ import_react.default.createElement(
          MetricCard,
          {
            label: getText(
              "pisell2.text.sku.detail.modal.weighing.metric.tare",
              "Tare"
            ),
            value: (0, import_utils2.formatWeight)(tareWeight),
            unit: unitLabel,
            description: selectedTareOption && selectedTareOption.id !== "none" ? selectedTareOption.label : getText(
              "pisell2.text.sku.detail.modal.weighing.metric.tare.desc",
              "click to change"
            ),
            icon: tareIcon
          }
        ))
      ),
      /* @__PURE__ */ import_react.default.createElement(
        MetricCard,
        {
          label: getText(
            "pisell2.text.sku.detail.modal.weighing.metric.net.weight",
            "Net Weight"
          ),
          value: (0, import_utils2.formatWeight)(netWeight),
          unit: unitLabel
        }
      )
    ),
    /* @__PURE__ */ import_react.default.createElement(
      import_TareManagementPanel.TareQuickBar,
      {
        options: tareOptions,
        selected: selectedTare,
        compact: isTareBarCompact,
        unitLabel,
        convertTareValue,
        onSelect: handleTareSelect
      }
    )
  );
};
function MetricCard(props) {
  const {
    label,
    value,
    unit,
    description,
    highlight = false,
    editable = false,
    icon,
    onCardClick
  } = props;
  const interactive = Boolean(onCardClick);
  return /* @__PURE__ */ import_react.default.createElement(
    "div",
    {
      className: `pisell-sku-detail-weighing__metric-card${highlight ? " pisell-sku-detail-weighing__metric-card--highlight" : ""}${interactive ? " pisell-sku-detail-weighing__metric-card--interactive" : ""}`,
      onClick: onCardClick,
      onKeyDown: (event) => {
        if (!interactive) return;
        if (event.key === "Enter" || event.key === " ") {
          event.preventDefault();
          onCardClick == null ? void 0 : onCardClick();
        }
      },
      role: interactive ? "button" : void 0,
      tabIndex: interactive ? 0 : void 0
    },
    icon ? /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        className: "pisell-sku-detail-weighing__metric-icon",
        "aria-hidden": "true"
      },
      icon
    ) : null,
    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__metric-top" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__metric-label" }, label), description ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-sku-detail-weighing__metric-description" }, description) : null),
    /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        className: `pisell-sku-detail-weighing__metric-value-row${editable ? " pisell-sku-detail-weighing__metric-value-row--editable" : ""}`
      },
      /* @__PURE__ */ import_react.default.createElement(
        "span",
        {
          className: `pisell-sku-detail-weighing__metric-value${editable ? " pisell-sku-detail-weighing__metric-value--editable" : ""}`
        },
        /* @__PURE__ */ import_react.default.createElement(import_materials.AutoResizeText, null, value)
      ),
      /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-sku-detail-weighing__metric-unit" }, unit)
    )
  );
}
var weighing_default = Weighing;
