"use client";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { useT } from "@open-mercato/shared/lib/i18n/context";
import { cn } from "@open-mercato/shared/lib/utils";
import { inputWrapperVariants, inputElementVariants } from "./input.js";
import {
  Select,
  SelectContent,
  SelectItem,
  SelectItemLeading,
  SelectTrigger
} from "./select.js";
const AMOUNT_CURRENCIES = [
  { code: "EUR", symbol: "\u20AC", label: "Euro", flag: "\u{1F1EA}\u{1F1FA}" },
  { code: "USD", symbol: "$", label: "US Dollar", flag: "\u{1F1FA}\u{1F1F8}" },
  { code: "GBP", symbol: "\xA3", label: "Pound Sterling", flag: "\u{1F1EC}\u{1F1E7}" },
  { code: "PLN", symbol: "z\u0142", label: "Polish Z\u0142oty", flag: "\u{1F1F5}\u{1F1F1}" },
  { code: "CHF", symbol: "CHF", label: "Swiss Franc", flag: "\u{1F1E8}\u{1F1ED}" },
  { code: "SEK", symbol: "kr", label: "Swedish Krona", flag: "\u{1F1F8}\u{1F1EA}" },
  { code: "CZK", symbol: "K\u010D", label: "Czech Koruna", flag: "\u{1F1E8}\u{1F1FF}" },
  { code: "JPY", symbol: "\xA5", label: "Japanese Yen", flag: "\u{1F1EF}\u{1F1F5}" },
  { code: "AUD", symbol: "A$", label: "Australian Dollar", flag: "\u{1F1E6}\u{1F1FA}" },
  { code: "CAD", symbol: "C$", label: "Canadian Dollar", flag: "\u{1F1E8}\u{1F1E6}" }
];
const DEFAULT_CURRENCY = AMOUNT_CURRENCIES[0];
function findCurrency(code, list) {
  return list.find((c) => c.code === code) ?? list[0] ?? DEFAULT_CURRENCY;
}
const AmountInput = React.forwardRef(
  ({
    className,
    inputClassName,
    size,
    value,
    onChange,
    currencies: currenciesProp,
    showCurrency = true,
    placeholder,
    disabled,
    ...props
  }, ref) => {
    const t = useT();
    const resolvedPlaceholder = placeholder ?? t("ui.inputs.amountInput.placeholder", "0.00");
    const currencies = currenciesProp ?? AMOUNT_CURRENCIES;
    const current = findCurrency(value.currency, currencies);
    const handleAmountChange = React.useCallback(
      (event) => {
        onChange({ amount: event.target.value, currency: current.code });
      },
      [current.code, onChange]
    );
    const handleCurrencyChange = React.useCallback(
      (nextCode) => {
        onChange({ amount: value.amount, currency: nextCode });
      },
      [onChange, value.amount]
    );
    return /* @__PURE__ */ jsxs(
      "div",
      {
        className: cn(inputWrapperVariants({ size }), "px-0 overflow-hidden", className),
        "data-slot": "amount-input-wrapper",
        children: [
          /* @__PURE__ */ jsxs("div", { className: "flex flex-1 min-w-0 items-center gap-2 pl-3", children: [
            /* @__PURE__ */ jsx(
              "span",
              {
                className: "text-sm text-muted-foreground select-none shrink-0 tabular-nums",
                "aria-hidden": "true",
                children: current.symbol
              }
            ),
            /* @__PURE__ */ jsx(
              "input",
              {
                ref,
                type: "text",
                inputMode: "decimal",
                value: value.amount,
                onChange: handleAmountChange,
                placeholder: resolvedPlaceholder,
                disabled,
                className: cn(
                  inputElementVariants({ size }),
                  "pr-3 tabular-nums",
                  inputClassName
                ),
                ...props
              }
            )
          ] }),
          showCurrency ? /* @__PURE__ */ jsxs(Fragment, { children: [
            /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "w-px self-stretch bg-input" }),
            /* @__PURE__ */ jsxs(Select, { value: current.code, onValueChange: handleCurrencyChange, disabled, children: [
              /* @__PURE__ */ jsxs(
                SelectTrigger,
                {
                  "aria-label": t("ui.inputs.amountInput.currencyLabel", "Currency"),
                  className: cn(
                    "h-auto w-auto shrink-0 gap-1.5 rounded-none border-0 bg-transparent px-2.5 py-2 shadow-none",
                    "hover:bg-muted/40 focus:bg-muted/40 focus-visible:shadow-none focus-visible:border-0",
                    "disabled:bg-transparent disabled:hover:bg-transparent"
                  ),
                  children: [
                    current.flag ? /* @__PURE__ */ jsx("span", { className: "text-base leading-none", "aria-hidden": "true", children: current.flag }) : null,
                    /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground tabular-nums", children: current.code })
                  ]
                }
              ),
              /* @__PURE__ */ jsx(SelectContent, { align: "end", children: currencies.map((c) => /* @__PURE__ */ jsxs(SelectItem, { value: c.code, children: [
                c.flag ? /* @__PURE__ */ jsx(SelectItemLeading, { children: /* @__PURE__ */ jsx("span", { className: "text-base leading-none", children: c.flag }) }) : null,
                /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", children: c.label }),
                /* @__PURE__ */ jsx("span", { className: "ml-2 text-xs text-muted-foreground tabular-nums", children: c.code })
              ] }, c.code)) })
            ] })
          ] }) : null
        ]
      }
    );
  }
);
AmountInput.displayName = "AmountInput";
export {
  AMOUNT_CURRENCIES,
  AmountInput
};
//# sourceMappingURL=amount-input.js.map
