"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { X } from "lucide-react";
import {
  Popover,
  PopoverContent,
  PopoverTrigger
} from "@open-mercato/ui/primitives/popover";
import { Button } from "@open-mercato/ui/primitives/button";
import { IconButton } from "@open-mercato/ui/primitives/icon-button";
import { useT } from "@open-mercato/shared/lib/i18n/context";
import { translateWithFallback } from "@open-mercato/shared/lib/i18n/translate";
import { ChipButton } from "./ChipButton.js";
function CurrencyFilterPopover({
  rows,
  baseCurrencyCode,
  totalInBaseCurrency,
  headingLabel,
  headingCount,
  selectedCurrency,
  onApply
}) {
  const t = useT();
  const [open, setOpen] = React.useState(false);
  const [draft, setDraft] = React.useState(selectedCurrency);
  React.useEffect(() => {
    if (open) setDraft(selectedCurrency);
  }, [open, selectedCurrency]);
  const base = baseCurrencyCode?.toUpperCase() ?? null;
  const chipLabel = translateWithFallback(t, "customers.deals.kanban.currencyFilter.chipLabel", "Currency");
  const chipValue = selectedCurrency ? selectedCurrency.toUpperCase() : translateWithFallback(t, "customers.deals.kanban.filter.all", "All");
  const closeLabel = translateWithFallback(t, "customers.deals.kanban.filter.close", "Close");
  const applyLabel = translateWithFallback(
    t,
    "customers.deals.kanban.currencyFilter.apply",
    "Apply filter"
  );
  const handleApply = () => {
    onApply(draft);
    setOpen(false);
  };
  const handleKeyDown = (event) => {
    if ((event.metaKey || event.ctrlKey) && event.key === "Enter") {
      event.preventDefault();
      handleApply();
    }
  };
  const headingCountLabel = translateWithFallback(
    t,
    "customers.deals.kanban.currencyBreakdown.headingCount",
    "({count} deals)",
    { count: headingCount }
  );
  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
      ChipButton,
      {
        label: chipLabel,
        value: chipValue,
        active: selectedCurrency !== null
      }
    ) }),
    /* @__PURE__ */ jsx(
      PopoverContent,
      {
        align: "start",
        className: "w-96 rounded-2xl border-border bg-transparent p-0 shadow-xl",
        onKeyDown: handleKeyDown,
        children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col overflow-hidden rounded-2xl bg-card", children: [
          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b border-border bg-card px-5 py-4", children: [
            /* @__PURE__ */ jsx("span", { className: "text-base font-bold leading-normal text-foreground", children: translateWithFallback(
              t,
              "customers.deals.kanban.currencyFilter.title",
              "Filter kanban by currency"
            ) }),
            /* @__PURE__ */ jsx(
              IconButton,
              {
                variant: "ghost",
                size: "xs",
                onClick: () => setOpen(false),
                "aria-label": closeLabel,
                className: "flex size-7 items-center justify-center rounded-md border border-border bg-card text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
                children: /* @__PURE__ */ jsx(X, { className: "size-3.5", "aria-hidden": "true" })
              }
            )
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "flex flex-col bg-card pt-3.5", children: [
            /* @__PURE__ */ jsx("div", { className: "px-6 pb-2", children: /* @__PURE__ */ jsx("span", { className: "text-overline font-semibold uppercase tracking-wider text-muted-foreground", children: translateWithFallback(
              t,
              "customers.deals.kanban.currencyFilter.subtitle",
              "{label} \xB7 {count} deals \xB7 {total} {currency}",
              {
                label: headingLabel,
                count: headingCount,
                total: formatAmount(totalInBaseCurrency),
                currency: baseCurrencyCode ?? ""
              }
            ) }) }),
            /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
              /* @__PURE__ */ jsx(
                CurrencyRow,
                {
                  isAllCurrencies: true,
                  selected: draft === null,
                  onClick: () => setDraft(null),
                  label: translateWithFallback(
                    t,
                    "customers.deals.kanban.currencyFilter.allCurrencies",
                    "All currencies"
                  ),
                  amount: totalInBaseCurrency,
                  amountCurrency: baseCurrencyCode ?? "",
                  count: headingCount
                }
              ),
              rows.map((row) => {
                const code = row.currency.toUpperCase();
                const isBase = base !== null && code === base;
                const isSelected = draft === code;
                return /* @__PURE__ */ jsx(
                  CurrencyRow,
                  {
                    selected: isSelected,
                    onClick: () => setDraft(code),
                    label: code,
                    showBasePill: isBase,
                    amount: row.total,
                    amountCurrency: code,
                    count: row.count
                  },
                  row.currency
                );
              })
            ] }),
            /* @__PURE__ */ jsx("div", { className: "px-6 pt-3 pb-3.5", children: /* @__PURE__ */ jsx("p", { className: "text-xs font-normal leading-normal text-muted-foreground", children: translateWithFallback(
              t,
              "customers.deals.kanban.currencyFilter.footerCredit",
              "NBP mid conversion rate \xB7 {date}",
              { date: formatToday() }
            ) }) })
          ] }),
          /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end border-t border-border bg-muted px-5 py-3.5", children: /* @__PURE__ */ jsx(
            Button,
            {
              type: "button",
              onClick: handleApply,
              className: "h-auto rounded-lg bg-foreground px-5 py-2 text-sm font-semibold text-background hover:bg-foreground/90",
              children: applyLabel
            }
          ) })
        ] })
      }
    )
  ] });
}
function CurrencyRow({
  isAllCurrencies = false,
  selected,
  onClick,
  label,
  showBasePill = false,
  amount,
  amountCurrency,
  count
}) {
  const t = useT();
  const rowBg = selected ? "bg-brand-violet/10" : "bg-card hover:bg-muted";
  const codeColor = selected ? "text-brand-violet" : "text-foreground";
  const amountColor = selected ? "text-brand-violet font-semibold" : "text-foreground font-normal";
  const currencyColor = selected ? "text-brand-violet/80" : "text-muted-foreground";
  const countColor = selected ? "text-brand-violet font-semibold" : "text-foreground/80 font-normal";
  return /* @__PURE__ */ jsxs(
    Button,
    {
      type: "button",
      variant: "ghost",
      role: "radio",
      "aria-checked": selected,
      onClick,
      className: `h-auto w-full justify-start gap-3 rounded-none px-6 py-2.5 text-left font-normal ${rowBg}`,
      children: [
        /* @__PURE__ */ jsx(RadioDot, { selected }),
        /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5", children: [
          /* @__PURE__ */ jsx("span", { className: `text-sm leading-normal ${codeColor} ${selected ? "font-semibold" : "font-normal"}`, children: label }),
          showBasePill ? (
            // text-[9px] is an intentional Figma exception for the BASE badge (node 1251:671).
            // The DS scale bottoms out at text-xs (12px); this 9px is design-system tracked as
            // a tiny-badge exception and should not be migrated to text-overline.
            /* @__PURE__ */ jsx("span", { className: "inline-flex items-center rounded-sm bg-muted px-1.5 py-px text-[9px] font-bold uppercase leading-normal tracking-wider text-muted-foreground", children: translateWithFallback(t, "customers.deals.kanban.currencyBreakdown.basePill", "BASE") })
          ) : null
        ] }),
        /* @__PURE__ */ jsx("span", { className: "flex-1", "aria-hidden": "true" }),
        /* @__PURE__ */ jsxs("span", { className: "flex items-baseline gap-1", children: [
          /* @__PURE__ */ jsx("span", { className: `text-sm leading-normal tabular-nums ${amountColor}`, children: formatAmount(amount) }),
          !isAllCurrencies || amountCurrency ? /* @__PURE__ */ jsx("span", { className: `text-xs leading-normal ${currencyColor}`, children: amountCurrency }) : null
        ] }),
        /* @__PURE__ */ jsx("span", { className: `pl-5 text-xs leading-normal tabular-nums ${countColor}`, children: count })
      ]
    }
  );
}
function RadioDot({ selected }) {
  return /* @__PURE__ */ jsx(
    "span",
    {
      className: `flex size-4 shrink-0 items-center justify-center rounded-full border ${selected ? "border-brand-violet" : "border-input bg-card"}`,
      "aria-hidden": "true",
      children: selected ? /* @__PURE__ */ jsx("span", { className: "size-2 rounded-full bg-brand-violet" }) : null
    }
  );
}
function formatAmount(amount) {
  return new Intl.NumberFormat(void 0, {
    style: "decimal",
    maximumFractionDigits: 0,
    useGrouping: true
  }).format(Math.round(amount));
}
function formatToday() {
  return new Intl.DateTimeFormat(void 0, {
    year: "numeric",
    month: "short",
    day: "2-digit"
  }).format(/* @__PURE__ */ new Date());
}
var CurrencyFilterPopover_default = CurrencyFilterPopover;
export {
  CurrencyFilterPopover,
  CurrencyFilterPopover_default as default
};
//# sourceMappingURL=CurrencyFilterPopover.js.map
