@elabs-ai/components-ui 4.1.0 → 5.0.0

package/dist/chunk-KZWC6JCI.js

@@ -0,0 +1,177 @@
+"use client";
+import {
+  resolveNumberFormat
+} from "./chunk-LDOCY4SU.js";
+import {
+  CopyableValue
+} from "./chunk-XMZ5LXL4.js";
+import {
+  Card,
+  CardContent
+} from "./chunk-URVAZW44.js";
+import {
+  Skeleton
+} from "./chunk-JNWXHPZG.js";
+import {
+  useLocale
+} from "./chunk-EJQYE4MY.js";
+import {
+  cn
+} from "./chunk-KBNWM27Q.js";
+
+// src/components/metric-card/metric-card.tsx
+import { forwardRef } from "react";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+function formatResolvedNumber(resolved, formatNumber, value) {
+  const numeric = formatNumber(resolved.parens ? Math.abs(value) : value, resolved.options);
+  const signed = resolved.parens && value < 0 ? `(${numeric})` : numeric;
+  return `${resolved.prefix}${signed}${resolved.suffix}`;
+}
+var metricValueVariants = cva("tabular-nums text-foreground", {
+  variants: {
+    emphasis: {
+      default: "text-2xl font-semibold tracking-tight",
+      headline: "text-kpi"
+    },
+    /* `md` adds nothing (today's rungs); `sm`/`lg` override the size via `cn()`. */
+    size: {
+      sm: "text-title",
+      md: "",
+      lg: "text-kpi"
+    }
+  },
+  defaultVariants: { emphasis: "default", size: "md" }
+});
+var metricContentVariants = cva("space-y-2", {
+  variants: {
+    emphasis: {
+      default: "p-5",
+      headline: "p-6"
+    },
+    size: {
+      sm: "space-y-1 p-3",
+      md: "",
+      lg: "p-6"
+    }
+  },
+  defaultVariants: { emphasis: "default", size: "md" }
+});
+var metricSparklineVariants = cva("", {
+  variants: {
+    size: {
+      /* never rendered — `sm` drops the slot; kept so the axis is total */
+      sm: "",
+      md: "pt-1",
+      lg: "min-h-12 pt-2"
+    }
+  },
+  defaultVariants: { size: "md" }
+});
+var MetricCard = forwardRef(function MetricCard2({
+  label,
+  value,
+  valueFormat = "compact",
+  currency,
+  copyExactValue = true,
+  description,
+  delta,
+  deltaDirection = "neutral",
+  positiveIsGood = true,
+  icon,
+  visual,
+  sparkline,
+  evidence,
+  emphasis,
+  size,
+  loading = false,
+  announceLoading = true,
+  className,
+  ...props
+}, ref) {
+  const { t, formatNumber } = useLocale();
+  const isNumeric = typeof value === "number";
+  const formattedValue = !isNumeric ? value : typeof valueFormat === "function" ? valueFormat(value) : formatResolvedNumber(
+    resolveNumberFormat(valueFormat, value, currency),
+    formatNumber,
+    value
+  );
+  const showsExact = isNumeric && String(formattedValue) === String(value);
+  const canCopyExact = isNumeric && copyExactValue && typeof valueFormat !== "function" && !showsExact;
+  const good = deltaDirection === "up" ? positiveIsGood : deltaDirection === "down" ? !positiveIsGood : null;
+  const deltaColor = good === null ? "text-muted-foreground" : good ? "text-success-text" : "text-destructive-text";
+  const polarity = good === null ? "neutral" : good ? "good" : "bad";
+  const arrow = deltaDirection === "up" ? "\u2191" : deltaDirection === "down" ? "\u2193" : "";
+  const directionLabel = deltaDirection === "up" ? "up" : deltaDirection === "down" ? "down" : "";
+  const polarityLabel = good === null ? "" : good ? ", favorable" : ", unfavorable";
+  const compact = size === "sm";
+  const valueClassName = cn(metricValueVariants({ emphasis, size }));
+  return /* @__PURE__ */ jsx(Card, { ref, className: cn("overflow-hidden", className), ...props, children: /* @__PURE__ */ jsxs(
+    CardContent,
+    {
+      className: cn(metricContentVariants({ emphasis, size })),
+      ...loading && announceLoading ? { role: "status", "aria-live": "polite" } : {},
+      children: [
+        loading && announceLoading ? /* @__PURE__ */ jsx("span", { className: "sr-only", children: t("ui.metricCard.loading") }) : null,
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          loading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-24" }) : (
+            /* `min-w-0` + `truncate`, not just the text utility: a flex child's
+               default `min-width: auto` refuses to shrink below its content, so
+               without it the label OVERFLOWS the row and `Card`'s own
+               `overflow-hidden` hard-clips it — characters lost mid-word, no
+               ellipsis, no title. Measured on a 230px pane: "Awaiting approval"
+               rendered as "Awaiting approva". See interaction-guidelines.md
+               § Content handling ("flex children need `min-w-0`"). `title` only
+               when the label is a string — there is nothing to put in the
+               attribute otherwise, and the ellipsis needs a way back to the
+               full words. */
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: "min-w-0 truncate text-body font-medium text-muted-foreground",
+                title: typeof label === "string" ? label : void 0,
+                children: label
+              }
+            )
+          ),
+          icon && !compact ? /* @__PURE__ */ jsx("span", { className: "shrink-0 text-muted-foreground [&_svg]:size-4", children: icon }) : null
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-2", children: [
+          loading ? /* @__PURE__ */ jsx(Skeleton, { className: emphasis === "headline" ? "h-9 w-28" : "h-8 w-24" }) : canCopyExact ? /* @__PURE__ */ jsx(
+            CopyableValue,
+            {
+              className: valueClassName,
+              hint: typeof label === "string" ? `${label}, ${t("ui.copyableValue.hint")}` : void 0,
+              value: String(value),
+              children: formattedValue
+            }
+          ) : /* @__PURE__ */ jsx("span", { className: valueClassName, children: formattedValue }),
+          delta && !compact ? loading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-14" }) : /* @__PURE__ */ jsxs(
+            "span",
+            {
+              "data-polarity": polarity,
+              className: cn("text-meta tabular-nums", deltaColor),
+              "aria-label": directionLabel ? `${directionLabel} ${delta}${polarityLabel}` : void 0,
+              children: [
+                arrow ? /* @__PURE__ */ jsxs("span", { "aria-hidden": "true", children: [
+                  arrow,
+                  " "
+                ] }) : null,
+                delta
+              ]
+            }
+          ) : null
+        ] }),
+        sparkline && !compact ? /* @__PURE__ */ jsx("div", { className: metricSparklineVariants({ size }), children: loading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-full" }) : sparkline }) : null,
+        description && !compact ? loading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-32" }) : /* @__PURE__ */ jsx("p", { className: "text-meta font-normal text-muted-foreground", children: description }) : null,
+        visual && !compact ? /* @__PURE__ */ jsx("div", { className: "pt-1", children: loading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-full" }) : visual }) : null,
+        evidence && !compact ? /* @__PURE__ */ jsx("div", { className: "pt-1 text-meta font-normal text-muted-foreground", children: loading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-24" }) : evidence }) : null
+      ]
+    }
+  ) });
+});
+
+export {
+  MetricCard
+};
+//# sourceMappingURL=chunk-KZWC6JCI.js.map

package/dist/chunk-KZWC6JCI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/metric-card/metric-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { Card, CardContent } from \"../card\";\nimport { CopyableValue } from \"../copyable-value\";\nimport { Skeleton } from \"../skeleton\";\nimport { useLocale } from \"../locale-provider\";\nimport { cn } from \"../../lib/cn\";\nimport {\n  type NumberFormat,\n  type ResolvedNumberFormat,\n  resolveNumberFormat,\n} from \"../../lib/compact-number\";\n\n/**\n * Applies a {@link ResolvedNumberFormat}'s `prefix`/`suffix`/`parens` on top\n * of the plain `Intl` string `formatNumber` produces — the two things Intl\n * itself cannot render (RM-109). Twin of `formatResolvedChartValue`\n * (`packages/charts/src/charts/chart-formatters.ts`).\n */\nfunction formatResolvedNumber(\n  resolved: ResolvedNumberFormat,\n  formatNumber: (n: number, opts?: Intl.NumberFormatOptions) => string,\n  value: number,\n): string {\n  const numeric = formatNumber(resolved.parens ? Math.abs(value) : value, resolved.options);\n  const signed = resolved.parens && value < 0 ? `(${numeric})` : numeric;\n  return `${resolved.prefix}${signed}${resolved.suffix}`;\n}\n\n/*\n * ADR 0012: this is the ONE KPI tile — `@elabs-ai/components-charts` re-exports it.\n * RM-072 adds `size` (sm | md | lg) for dashboard-sheet tiles and a `sparkline`\n * slot under the value. `ui` never imports `charts`: the host passes the\n * `<Sparkline …/>` element in.\n */\n\n/*\n * `emphasis` — size/weight/space ONLY, no new hue (research 11 §B.5 KPI-1/5):\n * `headline` is the answer-leading rung (`text-kpi`, ~32px); `default` stays\n * calm on the intermediate 1.5rem reading rung (the pre-#188 step between\n * `title` and `kpi` — no app role exists there, same precedent as the prose\n * h1/h3 rungs; baselined in the text-scale ratchet).\n */\nconst metricValueVariants = cva(\"tabular-nums text-foreground\", {\n  variants: {\n    emphasis: {\n      default: \"text-2xl font-semibold tracking-tight\",\n      headline: \"text-kpi\",\n    },\n    /* `md` adds nothing (today's rungs); `sm`/`lg` override the size via `cn()`. */\n    size: {\n      sm: \"text-title\",\n      md: \"\",\n      lg: \"text-kpi\",\n    },\n  },\n  defaultVariants: { emphasis: \"default\", size: \"md\" },\n});\n\nconst metricContentVariants = cva(\"space-y-2\", {\n  variants: {\n    emphasis: {\n      default: \"p-5\",\n      headline: \"p-6\",\n    },\n    size: {\n      sm: \"space-y-1 p-3\",\n      md: \"\",\n      lg: \"p-6\",\n    },\n  },\n  defaultVariants: { emphasis: \"default\", size: \"md\" },\n});\n\nconst metricSparklineVariants = cva(\"\", {\n  variants: {\n    size: {\n      /* never rendered — `sm` drops the slot; kept so the axis is total */\n      sm: \"\",\n      md: \"pt-1\",\n      lg: \"min-h-12 pt-2\",\n    },\n  },\n  defaultVariants: { size: \"md\" },\n});\n\nexport type MetricCardEmphasis = NonNullable<VariantProps<typeof metricValueVariants>[\"emphasis\"]>;\n\n/**\n * Tile tier (RM-072). `sm`: label + value only (no icon, delta, description,\n * sparkline, visual or evidence); `md`: the default tile; `lg`: the kpi value\n * rung with more room for the `sparkline` slot.\n */\nexport type MetricCardSize = NonNullable<VariantProps<typeof metricValueVariants>[\"size\"]>;\n\n/**\n * How a NUMERIC `value` is rendered. A function takes over completely.\n *\n * `\"compact\"` is the default because a KPI tile is a small box and\n * `50012102.632741` does not fit in one — the exact figure stays one click\n * away via `CopyableValue`. Anything that is not a `number` (a string, an\n * element) is passed through untouched, so every existing call site is\n * unaffected.\n *\n * Also accepts the object form (RM-109, `NumberFormatSpec` —\n * `{ decimals, abbreviate, sign, prefix, suffix, … }`,\n * `packages/ui/src/lib/compact-number.ts`) for a tile that needs e.g.\n * `{ decimals: 1, suffix: \"%\" }` without hand-formatting the string itself.\n * The two preset-string cases render byte-for-byte as before this type\n * widened — only a spec OBJECT argument reaches the new code path.\n */\nexport type MetricCardValueFormat = NumberFormat | ((value: number) => ReactNode);\n\nexport interface MetricCardProps\n  extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof metricValueVariants> {\n  label: ReactNode;\n  value: ReactNode;\n  /**\n   * How to render a NUMERIC `value`. Default: `\"compact\"`. Ignored for every\n   * other `ReactNode` — a string you already formatted is rendered verbatim.\n   */\n  valueFormat?: MetricCardValueFormat;\n  /** ISO 4217 code for `valueFormat: \"currency\"`. Default: `\"USD\"`. */\n  currency?: string;\n  /**\n   * Offer the exact figure on click when a numeric `value` was shortened.\n   * Default: `true`. Turning it off leaves a compacted number with no way back\n   * to its digits, so only do that when the tile is decorative.\n   */\n  copyExactValue?: boolean;\n  /** Secondary line under the value — sublabel / context. */\n  description?: ReactNode;\n  /** Signed change, e.g. \"+12.4%\". Direction colors it. */\n  delta?: string;\n  deltaDirection?: \"up\" | \"down\" | \"neutral\";\n  /** Whether \"up\" is good (green) — flip for metrics where down is good. */\n  positiveIsGood?: boolean;\n  icon?: ReactNode;\n  /** Optional inline visual shown under the value/description. */\n  visual?: ReactNode;\n  /**\n   * Trend slot rendered directly under the value (RM-072) — pass a\n   * `<Sparkline …/>` from `@elabs-ai/components-charts`. Hidden at `size=\"sm\"`.\n   */\n  sparkline?: ReactNode;\n  /**\n   * Optional grounding footer (research 11 §B.5 KPI-3) — connects a cited\n   * figure to its source (e.g. an `EvidenceChip` from `@elabs-ai/components-ai`). Rendered\n   * subdued (`text-meta text-muted-foreground`) under the tile body.\n   */\n  evidence?: ReactNode;\n  /**\n   * Loading vs ready — renders a layout-shaped skeleton (matching the real\n   * box height) instead of the value/label/delta text. Default: `false`.\n   */\n  loading?: boolean;\n  /**\n   * Whether this tile announces its own `loading` state via a live region.\n   * Set to `false` when several tiles are composed inside a container that\n   * already announces once for the whole region (e.g. a loading\n   * `MetricGrid`) — see loading-states.md §a11y (\"one live region per\n   * region, not per box\"). Default: `true`.\n   */\n  announceLoading?: boolean;\n}\n\n/** Compact KPI tile for dashboards. */\nexport const MetricCard = forwardRef<HTMLDivElement, MetricCardProps>(function MetricCard(\n  {\n    label,\n    value,\n    valueFormat = \"compact\",\n    currency,\n    copyExactValue = true,\n    description,\n    delta,\n    deltaDirection = \"neutral\",\n    positiveIsGood = true,\n    icon,\n    visual,\n    sparkline,\n    evidence,\n    emphasis,\n    size,\n    loading = false,\n    announceLoading = true,\n    className,\n    ...props\n  },\n  ref,\n) {\n  const { t, formatNumber } = useLocale();\n\n  // Formatting applies to NUMBERS only. Every shipped call site passes a string\n  // it formatted itself, so this branch is inert for them — that is what makes\n  // a new default safe.\n  const isNumeric = typeof value === \"number\";\n  const formattedValue: ReactNode = !isNumeric\n    ? value\n    : typeof valueFormat === \"function\"\n      ? valueFormat(value)\n      : formatResolvedNumber(\n          resolveNumberFormat(valueFormat, value, currency),\n          formatNumber,\n          value,\n        );\n  // Only offer the exact figure when the display actually differs from it —\n  // a button around a value that was never shortened is noise.\n  const showsExact = isNumeric && String(formattedValue) === String(value);\n  const canCopyExact =\n    isNumeric && copyExactValue && typeof valueFormat !== \"function\" && !showsExact;\n\n  const good =\n    deltaDirection === \"up\" ? positiveIsGood : deltaDirection === \"down\" ? !positiveIsGood : null;\n  const deltaColor =\n    good === null ? \"text-muted-foreground\" : good ? \"text-success-text\" : \"text-destructive-text\";\n  // Stable, theme-agnostic polarity hook. High decoration reveals a non-color\n  // polarity glyph from this attribute (decoration.css); chromatic themes ignore it\n  // and use color. Issue #162.\n  const polarity = good === null ? \"neutral\" : good ? \"good\" : \"bad\";\n  const arrow = deltaDirection === \"up\" ? \"↑\" : deltaDirection === \"down\" ? \"↓\" : \"\";\n  // Direction is conveyed visually by the arrow glyph + color; give AT a single\n  // unambiguous name (\"up 12.4%, favorable\") since neither the glyph nor color is a\n  // reliable signal (high decoration / high-contrast collapse the hue) — and good/bad\n  // polarity is otherwise invisible to AT. See accessibility.md, #162.\n  const directionLabel = deltaDirection === \"up\" ? \"up\" : deltaDirection === \"down\" ? \"down\" : \"\";\n  const polarityLabel = good === null ? \"\" : good ? \", favorable\" : \", unfavorable\";\n  // `sm` is label + value only: every secondary row is dropped (RM-072).\n  const compact = size === \"sm\";\n  const valueClassName = cn(metricValueVariants({ emphasis, size }));\n\n  return (\n    <Card ref={ref} className={cn(\"overflow-hidden\", className)} {...props}>\n      <CardContent\n        className={cn(metricContentVariants({ emphasis, size }))}\n        {...(loading && announceLoading ? { role: \"status\", \"aria-live\": \"polite\" as const } : {})}\n      >\n        {loading && announceLoading ? (\n          <span className=\"sr-only\">{t(\"ui.metricCard.loading\")}</span>\n        ) : null}\n        <div className=\"flex items-center justify-between\">\n          {loading ? (\n            <Skeleton className=\"h-4 w-24\" />\n          ) : (\n            /* `min-w-0` + `truncate`, not just the text utility: a flex child's\n               default `min-width: auto` refuses to shrink below its content, so\n               without it the label OVERFLOWS the row and `Card`'s own\n               `overflow-hidden` hard-clips it — characters lost mid-word, no\n               ellipsis, no title. Measured on a 230px pane: \"Awaiting approval\"\n               rendered as \"Awaiting approva\". See interaction-guidelines.md\n               § Content handling (\"flex children need `min-w-0`\"). `title` only\n               when the label is a string — there is nothing to put in the\n               attribute otherwise, and the ellipsis needs a way back to the\n               full words. */\n            <span\n              className=\"min-w-0 truncate text-body font-medium text-muted-foreground\"\n              title={typeof label === \"string\" ? label : undefined}\n            >\n              {label}\n            </span>\n          )}\n          {/* `shrink-0`: the icon is a fixed 16px mark, so the LABEL is what\n              gives way when the row runs out of width. */}\n          {icon && !compact ? (\n            <span className=\"shrink-0 text-muted-foreground [&_svg]:size-4\">{icon}</span>\n          ) : null}\n        </div>\n        <div className=\"flex items-baseline gap-2\">\n          {loading ? (\n            <Skeleton className={emphasis === \"headline\" ? \"h-9 w-28\" : \"h-8 w-24\"} />\n          ) : canCopyExact ? (\n            <CopyableValue\n              className={valueClassName}\n              // Two tiles in one grid can compact to the same display (\"$1.2M\"),\n              // and the visible label is a sibling node the button's name does\n              // not include — so without this a screen-reader user tabbing the\n              // grid hears the identical name twice. A non-string label has no\n              // text to borrow; the default hint stands.\n              hint={\n                typeof label === \"string\" ? `${label}, ${t(\"ui.copyableValue.hint\")}` : undefined\n              }\n              value={String(value)}\n            >\n              {formattedValue}\n            </CopyableValue>\n          ) : (\n            <span className={valueClassName}>{formattedValue}</span>\n          )}\n          {delta && !compact ? (\n            loading ? (\n              <Skeleton className=\"h-4 w-14\" />\n            ) : (\n              <span\n                data-polarity={polarity}\n                className={cn(\"text-meta tabular-nums\", deltaColor)}\n                aria-label={\n                  directionLabel ? `${directionLabel} ${delta}${polarityLabel}` : undefined\n                }\n              >\n                {arrow ? <span aria-hidden=\"true\">{arrow} </span> : null}\n                {delta}\n              </span>\n            )\n          ) : null}\n        </div>\n        {sparkline && !compact ? (\n          <div className={metricSparklineVariants({ size })}>\n            {loading ? <Skeleton className=\"h-8 w-full\" /> : sparkline}\n          </div>\n        ) : null}\n        {description && !compact ? (\n          loading ? (\n            <Skeleton className=\"h-3 w-32\" />\n          ) : (\n            <p className=\"text-meta font-normal text-muted-foreground\">{description}</p>\n          )\n        ) : null}\n        {visual && !compact ? (\n          <div className=\"pt-1\">{loading ? <Skeleton className=\"h-8 w-full\" /> : visual}</div>\n        ) : null}\n        {evidence && !compact ? (\n          <div className=\"pt-1 text-meta font-normal text-muted-foreground\">\n            {loading ? <Skeleton className=\"h-3 w-24\" /> : evidence}\n          </div>\n        ) : null}\n      </CardContent>\n    </Card>\n  );\n});\n"],"mappings":"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","names":["MetricCard"]}

package/dist/chunk-L37QZALU.js

@@ -0,0 +1,17 @@
+"use client";
+
+// src/lib/merge-refs.ts
+function mergeRefs(...refs) {
+  return (node) => {
+    for (const ref of refs) {
+      if (!ref) continue;
+      if (typeof ref === "function") ref(node);
+      else ref.current = node;
+    }
+  };
+}
+
+export {
+  mergeRefs
+};
+//# sourceMappingURL=chunk-L37QZALU.js.map

package/dist/chunk-L37QZALU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/merge-refs.ts"],"sourcesContent":["\"use client\";\n\nimport type { ForwardedRef } from \"react\";\n\n/**\n * Combine a `forwardRef`-forwarded ref with one or more locally-owned refs so\n * both end up pointing at the same DOM node. Returns a stable callback ref\n * wrapper — memoize the result (`useMemo`) keyed on the forwarded ref so it\n * doesn't detach/reattach on every render.\n */\nexport function mergeRefs<T>(...refs: Array<ForwardedRef<T> | undefined>) {\n  return (node: T | null) => {\n    for (const ref of refs) {\n      if (!ref) continue;\n      if (typeof ref === \"function\") ref(node);\n      else ref.current = node;\n    }\n  };\n}\n"],"mappings":";;;AAUO,SAAS,aAAgB,MAA0C;AACxE,SAAO,CAAC,SAAmB;AACzB,eAAW,OAAO,MAAM;AACtB,UAAI,CAAC,IAAK;AACV,UAAI,OAAO,QAAQ,WAAY,KAAI,IAAI;AAAA,UAClC,KAAI,UAAU;AAAA,IACrB;AAAA,EACF;AACF;","names":[]}

package/dist/chunk-L3SHPHLK.js

@@ -0,0 +1,35 @@
+"use client";
+
+// src/components/dialog/use-dialog-dismiss-guard.ts
+import { useCallback, useState } from "react";
+function useDialogDismissGuard({
+  dirty,
+  onClose,
+  onOpen
+}) {
+  const [confirmOpen, setConfirmOpen] = useState(false);
+  const onOpenChange = useCallback(
+    (open) => {
+      if (open) {
+        onOpen?.();
+        return;
+      }
+      if (dirty) {
+        setConfirmOpen(true);
+        return;
+      }
+      onClose();
+    },
+    [dirty, onClose, onOpen]
+  );
+  const confirmDiscard = useCallback(() => {
+    setConfirmOpen(false);
+    onClose();
+  }, [onClose]);
+  return { onOpenChange, confirmOpen, onConfirmOpenChange: setConfirmOpen, confirmDiscard };
+}
+
+export {
+  useDialogDismissGuard
+};
+//# sourceMappingURL=chunk-L3SHPHLK.js.map

package/dist/chunk-L3SHPHLK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/dialog/use-dialog-dismiss-guard.ts"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useState } from \"react\";\n\nexport interface UseDialogDismissGuardOptions {\n  /**\n   * Does the dialog currently hold unsaved changes? **App-owned** — brand-ui is\n   * a presentation layer (`docs/DECISIONS.md` §D5) and cannot know what \"dirty\"\n   * means for your form. Compute it (a `react-hook-form` `isDirty`, a deep\n   * compare, a store flag) and pass it in.\n   */\n  dirty: boolean;\n  /** Close the dialog — the app sets its own `open` state to `false`. */\n  onClose: () => void;\n  /**\n   * Open the dialog. Only needed when a `DialogTrigger` (rather than the app)\n   * opens it, because Radix routes that through the same `onOpenChange`.\n   */\n  onOpen?: () => void;\n}\n\nexport interface DialogDismissGuard {\n  /**\n   * Spread onto `<Dialog onOpenChange={…}>`. Intercepts EVERY user dismissal —\n   * Escape, overlay click, the built-in close ✕ and any `DialogClose` — because\n   * Radix funnels all four through `onOpenChange(false)`.\n   */\n  onOpenChange: (open: boolean) => void;\n  /** Controlled `open` for the discard confirmation. */\n  confirmOpen: boolean;\n  /** Controlled `onOpenChange` for the discard confirmation. */\n  onConfirmOpenChange: (open: boolean) => void;\n  /** Confirm the discard: closes the confirmation AND calls `onClose()`. */\n  confirmDiscard: () => void;\n}\n\n/**\n * Warn before a dialog with unsaved changes is dismissed (#341).\n *\n * `.claude/rules/interaction-guidelines.md` (Forms) requires warning before\n * navigating away from unsaved changes; this is that rule for dialogs, as a HOOK\n * rather than a prop because the component must not own app state — the app owns\n * `open` and decides what `dirty` means (D5).\n *\n * ## The asymmetry is structural, not a flag\n *\n * A **user dismissal** reaches Radix's `onOpenChange`, so the guard sees it and\n * can hold the dialog open. A **programmatic close** (the app setting its own\n * `open` to `false` after a successful save) never touches the guard, so it is\n * unobservable here and closes silently. That is exactly the wanted behaviour,\n * and it falls out of the wiring — there is no \"skip the guard\" option to get\n * wrong.\n *\n * The name is literal: it guards DISMISSALS routed through the returned\n * `onOpenChange`. It is not a navigation blocker and it cannot intercept a tab\n * close, a router navigation, or an `open` prop that the app flips itself.\n *\n * ```tsx\n * const [open, setOpen] = useState(false);\n * const guard = useDialogDismissGuard({\n *   dirty,\n *   onClose: () => setOpen(false),\n *   onOpen: () => setOpen(true),\n * });\n *\n * <Dialog open={open} onOpenChange={guard.onOpenChange}>…</Dialog>\n * <ConfirmDialog\n *   open={guard.confirmOpen}\n *   onOpenChange={guard.onConfirmOpenChange}\n *   onConfirm={guard.confirmDiscard}\n *   tone=\"destructive\"\n *   title=\"Discard changes?\"\n *   description=\"Your edits to this project have not been saved.\"\n *   confirmLabel=\"Discard\"\n * />\n * ```\n *\n * The `ConfirmDialog` is a SIBLING of the guarded dialog, not a child of it.\n */\nexport function useDialogDismissGuard({\n  dirty,\n  onClose,\n  onOpen,\n}: UseDialogDismissGuardOptions): DialogDismissGuard {\n  const [confirmOpen, setConfirmOpen] = useState(false);\n\n  const onOpenChange = useCallback(\n    (open: boolean) => {\n      // Opening is never guarded; a `DialogTrigger` routes through here too.\n      if (open) {\n        onOpen?.();\n        return;\n      }\n      if (dirty) {\n        setConfirmOpen(true);\n        return;\n      }\n      onClose();\n    },\n    [dirty, onClose, onOpen],\n  );\n\n  const confirmDiscard = useCallback(() => {\n    setConfirmOpen(false);\n    onClose();\n  }, [onClose]);\n\n  return { onOpenChange, confirmOpen, onConfirmOpenChange: setConfirmOpen, confirmDiscard };\n}\n"],"mappings":";;;AAEA,SAAS,aAAa,gBAAgB;AA6E/B,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AACF,GAAqD;AACnD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,KAAK;AAEpD,QAAM,eAAe;AAAA,IACnB,CAAC,SAAkB;AAEjB,UAAI,MAAM;AACR,iBAAS;AACT;AAAA,MACF;AACA,UAAI,OAAO;AACT,uBAAe,IAAI;AACnB;AAAA,MACF;AACA,cAAQ;AAAA,IACV;AAAA,IACA,CAAC,OAAO,SAAS,MAAM;AAAA,EACzB;AAEA,QAAM,iBAAiB,YAAY,MAAM;AACvC,mBAAe,KAAK;AACpB,YAAQ;AAAA,EACV,GAAG,CAAC,OAAO,CAAC;AAEZ,SAAO,EAAE,cAAc,aAAa,qBAAqB,gBAAgB,eAAe;AAC1F;","names":[]}

package/dist/chunk-L66VJIRD.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-L66VJIRD.js.map

package/dist/chunk-L66VJIRD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-LDOCY4SU.js

@@ -0,0 +1,68 @@
+"use client";
+
+// src/lib/compact-number.ts
+var PRESET_NUMBER_FORMAT_SPECS = {
+  number: { style: "number", abbreviate: false },
+  compact: { style: "number", abbreviate: "auto" },
+  currency: { style: "currency", abbreviate: "auto" },
+  percent: { style: "percent", abbreviate: false }
+};
+function resolveNumberFormatSpec(format) {
+  return typeof format === "string" ? PRESET_NUMBER_FORMAT_SPECS[format] ?? PRESET_NUMBER_FORMAT_SPECS.compact : format;
+}
+var COMPACT_THRESHOLD = 1e3;
+var DEFAULT_CURRENCY = "USD";
+var DEFAULT_MAX_FRACTION_DIGITS = 1;
+function shouldCompact(value) {
+  return Number.isFinite(value) && Math.abs(value) >= COMPACT_THRESHOLD;
+}
+function resolveNumberFormat(format, value, currency = DEFAULT_CURRENCY, maxFractionDigits) {
+  const spec = resolveNumberFormatSpec(format);
+  const style = spec.style ?? "number";
+  const isPercent = style === "percent";
+  const options = {};
+  if (style === "currency") {
+    options.style = "currency";
+    options.currency = spec.currency ?? currency;
+  } else if (isPercent) {
+    options.style = "percent";
+  }
+  const wantsAbbreviate = !isPercent && (spec.abbreviate === true || spec.abbreviate !== false && shouldCompact(value));
+  if (wantsAbbreviate) {
+    options.notation = "compact";
+    options.compactDisplay = "short";
+  }
+  const exactValueEscapeHatch = style === "number" && spec.abbreviate === false;
+  const digits = spec.decimals ?? maxFractionDigits ?? (exactValueEscapeHatch ? void 0 : DEFAULT_MAX_FRACTION_DIGITS);
+  if (digits !== void 0) {
+    options.maximumFractionDigits = digits;
+    if (spec.optionalDecimals === false) {
+      options.minimumFractionDigits = digits;
+    }
+  }
+  if (spec.grouping === false) {
+    options.useGrouping = false;
+  }
+  let parens = false;
+  if (spec.sign === "always") {
+    options.signDisplay = "always";
+  } else if (spec.sign === "parens") {
+    options.signDisplay = "never";
+    parens = true;
+  }
+  return { options, prefix: spec.prefix ?? "", suffix: spec.suffix ?? "", parens };
+}
+function numberFormatOptions(format, value, currency = DEFAULT_CURRENCY, maxFractionDigits) {
+  return resolveNumberFormat(format, value, currency, maxFractionDigits).options;
+}
+
+export {
+  resolveNumberFormatSpec,
+  COMPACT_THRESHOLD,
+  DEFAULT_CURRENCY,
+  DEFAULT_MAX_FRACTION_DIGITS,
+  shouldCompact,
+  resolveNumberFormat,
+  numberFormatOptions
+};
+//# sourceMappingURL=chunk-LDOCY4SU.js.map

package/dist/chunk-LDOCY4SU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/compact-number.ts"],"sourcesContent":["/**\n * compact-number.ts — the same \"shown short, copied exact\" number rule the\n * charts package applies to axis ticks and tooltips, available to `ui` surfaces\n * that display a figure (today: `MetricCard`).\n *\n * DELIBERATE TWIN of `packages/charts/src/charts/value-format.ts`. Dependencies\n * flow one way — `tokens → ui → charts` — so `ui` cannot import the charts\n * module, and a chart-domain union does not belong in the `ui` public API just\n * to be shared. The duplication is ~20 lines and the two must stay in step:\n * **change one, change the other**, and keep {@link COMPACT_THRESHOLD} equal in\n * both. `metric-card.test.tsx` and `value-format.test.ts` pin the same cases on\n * each side so a drift shows up as a failing test rather than as two surfaces\n * disagreeing about what `1500` looks like.\n */\n\n/** How a numeric value is rendered. Mirrors the charts `ChartValueFormatPreset`. */\nexport type NumberFormatKind = \"number\" | \"compact\" | \"currency\" | \"percent\";\n\n/**\n * The object form of {@link NumberFormat} (RM-109) — decimals, sign,\n * prefix/suffix and abbreviation as independent knobs. Mirrors the charts\n * `ChartValueFormatSpec` field-for-field; see that type's docblock\n * (`packages/charts/src/charts/value-format.ts`) for the full contract of\n * each field — this is the DELIBERATE TWIN, not a reinterpretation.\n */\nexport interface NumberFormatSpec {\n  style?: \"number\" | \"currency\" | \"percent\";\n  decimals?: number;\n  optionalDecimals?: boolean;\n  abbreviate?: boolean | \"auto\";\n  sign?: \"auto\" | \"always\" | \"parens\";\n  prefix?: string;\n  suffix?: string;\n  grouping?: boolean;\n  currency?: string;\n}\n\n/** A preset string or the {@link NumberFormatSpec} object form (RM-109). */\nexport type NumberFormat = NumberFormatKind | NumberFormatSpec;\n\n/** The preset strings' shape, expressed as specs — the union's one resolved shape. */\nconst PRESET_NUMBER_FORMAT_SPECS: Record<NumberFormatKind, NumberFormatSpec> = {\n  number: { style: \"number\", abbreviate: false },\n  compact: { style: \"number\", abbreviate: \"auto\" },\n  currency: { style: \"currency\", abbreviate: \"auto\" },\n  percent: { style: \"percent\", abbreviate: false },\n};\n\n/** Normalizes a preset string or a spec object to one {@link NumberFormatSpec} shape. */\nexport function resolveNumberFormatSpec(format: NumberFormat): NumberFormatSpec {\n  return typeof format === \"string\"\n    ? (PRESET_NUMBER_FORMAT_SPECS[format] ?? PRESET_NUMBER_FORMAT_SPECS.compact)\n    : format;\n}\n\n/** Magnitude at or above which `compact`/`currency` switch to compact notation. */\nexport const COMPACT_THRESHOLD = 1000;\n\n/** Used when a caller asks for currency without naming one. */\nexport const DEFAULT_CURRENCY = \"USD\";\n\n/** One decimal keeps `1.5M` readable without implying precision it lacks. */\nexport const DEFAULT_MAX_FRACTION_DIGITS = 1;\n\n/** Whether `value`'s magnitude earns compact notation. */\nexport function shouldCompact(value: number): boolean {\n  return Number.isFinite(value) && Math.abs(value) >= COMPACT_THRESHOLD;\n}\n\n/**\n * The full answer for `format` at this magnitude: `Intl.NumberFormatOptions`\n * plus the two things Intl cannot express — literal `prefix`/`suffix` text\n * and `sign: \"parens\"` (accounting-style negatives). Twin of\n * `resolveChartValueFormat` (`value-format.ts`) — same fields, same rules.\n */\nexport interface ResolvedNumberFormat {\n  /** Pure `Intl.NumberFormatOptions` — everything Intl itself can render. */\n  options: Intl.NumberFormatOptions;\n  /** Literal text before the formatted number. */\n  prefix: string;\n  /** Literal text after the formatted number. */\n  suffix: string;\n  /** `true` when a negative value renders as `(…)` instead of a minus sign. */\n  parens: boolean;\n}\n\nexport function resolveNumberFormat(\n  format: NumberFormat,\n  value: number,\n  currency: string = DEFAULT_CURRENCY,\n  maxFractionDigits?: number,\n): ResolvedNumberFormat {\n  const spec = resolveNumberFormatSpec(format);\n  const style = spec.style ?? \"number\";\n  const isPercent = style === \"percent\";\n  const options: Intl.NumberFormatOptions = {};\n\n  if (style === \"currency\") {\n    options.style = \"currency\";\n    options.currency = spec.currency ?? currency;\n  } else if (isPercent) {\n    options.style = \"percent\";\n  }\n\n  const wantsAbbreviate =\n    !isPercent && (spec.abbreviate === true || (spec.abbreviate !== false && shouldCompact(value)));\n  if (wantsAbbreviate) {\n    options.notation = \"compact\";\n    options.compactDisplay = \"short\";\n  }\n\n  const exactValueEscapeHatch = style === \"number\" && spec.abbreviate === false;\n  const digits =\n    spec.decimals ??\n    maxFractionDigits ??\n    (exactValueEscapeHatch ? undefined : DEFAULT_MAX_FRACTION_DIGITS);\n  if (digits !== undefined) {\n    options.maximumFractionDigits = digits;\n    if (spec.optionalDecimals === false) {\n      options.minimumFractionDigits = digits;\n    }\n  }\n\n  if (spec.grouping === false) {\n    options.useGrouping = false;\n  }\n\n  let parens = false;\n  if (spec.sign === \"always\") {\n    options.signDisplay = \"always\";\n  } else if (spec.sign === \"parens\") {\n    options.signDisplay = \"never\";\n    parens = true;\n  }\n\n  return { options, prefix: spec.prefix ?? \"\", suffix: spec.suffix ?? \"\", parens };\n}\n\n/**\n * `Intl.NumberFormatOptions` for `format` at this magnitude — the pure-Intl\n * subset of {@link resolveNumberFormat}, kept as its own export because it is\n * the one every existing call site (and test) already depends on.\n */\nexport function numberFormatOptions(\n  format: NumberFormatKind,\n  value: number,\n  currency: string = DEFAULT_CURRENCY,\n  maxFractionDigits?: number,\n): Intl.NumberFormatOptions {\n  return resolveNumberFormat(format, value, currency, maxFractionDigits).options;\n}\n"],"mappings":";;;AAyCA,IAAM,6BAAyE;AAAA,EAC7E,QAAQ,EAAE,OAAO,UAAU,YAAY,MAAM;AAAA,EAC7C,SAAS,EAAE,OAAO,UAAU,YAAY,OAAO;AAAA,EAC/C,UAAU,EAAE,OAAO,YAAY,YAAY,OAAO;AAAA,EAClD,SAAS,EAAE,OAAO,WAAW,YAAY,MAAM;AACjD;AAGO,SAAS,wBAAwB,QAAwC;AAC9E,SAAO,OAAO,WAAW,WACpB,2BAA2B,MAAM,KAAK,2BAA2B,UAClE;AACN;AAGO,IAAM,oBAAoB;AAG1B,IAAM,mBAAmB;AAGzB,IAAM,8BAA8B;AAGpC,SAAS,cAAc,OAAwB;AACpD,SAAO,OAAO,SAAS,KAAK,KAAK,KAAK,IAAI,KAAK,KAAK;AACtD;AAmBO,SAAS,oBACd,QACA,OACA,WAAmB,kBACnB,mBACsB;AACtB,QAAM,OAAO,wBAAwB,MAAM;AAC3C,QAAM,QAAQ,KAAK,SAAS;AAC5B,QAAM,YAAY,UAAU;AAC5B,QAAM,UAAoC,CAAC;AAE3C,MAAI,UAAU,YAAY;AACxB,YAAQ,QAAQ;AAChB,YAAQ,WAAW,KAAK,YAAY;AAAA,EACtC,WAAW,WAAW;AACpB,YAAQ,QAAQ;AAAA,EAClB;AAEA,QAAM,kBACJ,CAAC,cAAc,KAAK,eAAe,QAAS,KAAK,eAAe,SAAS,cAAc,KAAK;AAC9F,MAAI,iBAAiB;AACnB,YAAQ,WAAW;AACnB,YAAQ,iBAAiB;AAAA,EAC3B;AAEA,QAAM,wBAAwB,UAAU,YAAY,KAAK,eAAe;AACxE,QAAM,SACJ,KAAK,YACL,sBACC,wBAAwB,SAAY;AACvC,MAAI,WAAW,QAAW;AACxB,YAAQ,wBAAwB;AAChC,QAAI,KAAK,qBAAqB,OAAO;AACnC,cAAQ,wBAAwB;AAAA,IAClC;AAAA,EACF;AAEA,MAAI,KAAK,aAAa,OAAO;AAC3B,YAAQ,cAAc;AAAA,EACxB;AAEA,MAAI,SAAS;AACb,MAAI,KAAK,SAAS,UAAU;AAC1B,YAAQ,cAAc;AAAA,EACxB,WAAW,KAAK,SAAS,UAAU;AACjC,YAAQ,cAAc;AACtB,aAAS;AAAA,EACX;AAEA,SAAO,EAAE,SAAS,QAAQ,KAAK,UAAU,IAAI,QAAQ,KAAK,UAAU,IAAI,OAAO;AACjF;AAOO,SAAS,oBACd,QACA,OACA,WAAmB,kBACnB,mBAC0B;AAC1B,SAAO,oBAAoB,QAAQ,OAAO,UAAU,iBAAiB,EAAE;AACzE;","names":[]}

package/dist/chunk-LJGWA2XL.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-LJGWA2XL.js.map

package/dist/chunk-LJGWA2XL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-LLQWLZ75.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-LLQWLZ75.js.map

package/dist/chunk-LLQWLZ75.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-LMO3QK7Q.js

@@ -0,0 +1,137 @@
+"use client";
+import {
+  useLocale
+} from "./chunk-EJQYE4MY.js";
+import {
+  cn
+} from "./chunk-KBNWM27Q.js";
+
+// src/components/sheet/sheet.tsx
+import {
+  forwardRef
+} from "react";
+import * as SheetPrimitive from "@radix-ui/react-dialog";
+import { cva } from "class-variance-authority";
+import { X } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Sheet = SheetPrimitive.Root;
+var SheetTrigger = SheetPrimitive.Trigger;
+var SheetClose = SheetPrimitive.Close;
+var SheetPortal = SheetPrimitive.Portal;
+var SheetOverlay = forwardRef(function SheetOverlay2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    SheetPrimitive.Overlay,
+    {
+      ref,
+      "data-slot": "sheet-overlay",
+      className: cn(
+        "fixed inset-0 z-50 bg-overlay backdrop-blur-overlay data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        className
+      ),
+      ...props
+    }
+  );
+});
+var sheetVariants = cva(
+  // `overflow-y-auto` so content taller than the sheet scrolls INSIDE it
+  // instead of overflowing the fixed-position box (unreachable below the
+  // viewport edge).
+  "fixed z-50 gap-4 overflow-y-auto overscroll-contain bg-card p-6 text-card-foreground shadow-dialog transition duration-slow ease-standard data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=open]:[--tw-ease:var(--ease-entrance)] data-[state=closed]:[--tw-ease:var(--ease-exit)]",
+  {
+    variants: {
+      side: {
+        // `top`/`bottom` have no inherent height ceiling, so long content grows
+        // past the viewport; cap it at 90dvh (matching Dialog's dvh unit — ADR
+        // on mobile browser chrome) so the scroll rule above actually engages.
+        top: "inset-x-0 top-0 max-h-[90dvh] border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+        bottom: "inset-x-0 bottom-0 max-h-[90dvh] border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
+        // `side` is an explicit physical edge of the screen (like Radix's own
+        // Popper `side`), not a logical start/end — a caller who picks `"left"`
+        // wants the panel on the physical left even in an RTL layout, so these
+        // stay physical `left-0`/`right-0` and `border-r`/`border-l` on purpose.
+        left: "inset-y-0 left-0 h-full w-3/4 max-w-sm border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left",
+        right: "inset-y-0 right-0 h-full w-3/4 max-w-sm border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right"
+      }
+    },
+    defaultVariants: { side: "right" }
+  }
+);
+var SheetContent = forwardRef(function SheetContent2({ side = "right", className, children, ...props }, ref) {
+  const { t } = useLocale();
+  return /* @__PURE__ */ jsxs(SheetPortal, { children: [
+    /* @__PURE__ */ jsx(SheetOverlay, {}),
+    /* @__PURE__ */ jsxs(
+      SheetPrimitive.Content,
+      {
+        ref,
+        "data-slot": "sheet-content",
+        className: cn(sheetVariants({ side }), className),
+        ...props,
+        children: [
+          children,
+          /* @__PURE__ */ jsx(
+            SheetPrimitive.Close,
+            {
+              "data-slot": "sheet-close",
+              className: "absolute end-4 top-4 rounded-md p-1 text-muted-foreground opacity-70 transition-opacity hover:opacity-100 focus-ring",
+              "aria-label": t("close"),
+              children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+            }
+          )
+        ]
+      }
+    )
+  ] });
+});
+function SheetHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "sheet-header", className: cn("flex flex-col gap-1.5", className), ...props });
+}
+function SheetFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sheet-footer",
+      className: cn("mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className),
+      ...props
+    }
+  );
+}
+var SheetTitle = forwardRef(function SheetTitle2({ className, ...props }, ref) {
+  return (
+    // `text-title`, matching `DialogTitle` (#286) — was `text-lg font-semibold`,
+    // one rung below Dialog's for the same anatomical role (a modal title).
+    /* @__PURE__ */ jsx(
+      SheetPrimitive.Title,
+      {
+        ref,
+        "data-slot": "sheet-title",
+        className: cn("text-title leading-none", className),
+        ...props
+      }
+    )
+  );
+});
+var SheetDescription = forwardRef(function SheetDescription2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    SheetPrimitive.Description,
+    {
+      ref,
+      "data-slot": "sheet-description",
+      className: cn("text-body text-muted-foreground", className),
+      ...props
+    }
+  );
+});
+
+export {
+  Sheet,
+  SheetTrigger,
+  SheetClose,
+  SheetPortal,
+  SheetContent,
+  SheetHeader,
+  SheetFooter,
+  SheetTitle,
+  SheetDescription
+};
+//# sourceMappingURL=chunk-LMO3QK7Q.js.map

package/dist/chunk-LMO3QK7Q.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/sheet/sheet.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  forwardRef,\n  type ComponentPropsWithoutRef,\n  type ElementRef,\n  type HTMLAttributes,\n} from \"react\";\nimport * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../../lib/cn\";\nimport { useLocale } from \"../locale-provider\";\n\nexport const Sheet = SheetPrimitive.Root;\nexport const SheetTrigger = SheetPrimitive.Trigger;\nexport const SheetClose = SheetPrimitive.Close;\nexport const SheetPortal = SheetPrimitive.Portal;\n\nconst SheetOverlay = forwardRef<\n  ElementRef<typeof SheetPrimitive.Overlay>,\n  ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(function SheetOverlay({ className, ...props }, ref) {\n  return (\n    <SheetPrimitive.Overlay\n      ref={ref}\n      data-slot=\"sheet-overlay\"\n      className={cn(\n        \"fixed inset-0 z-50 bg-overlay backdrop-blur-overlay data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n});\n\nconst sheetVariants = cva(\n  // `overflow-y-auto` so content taller than the sheet scrolls INSIDE it\n  // instead of overflowing the fixed-position box (unreachable below the\n  // viewport edge).\n  \"fixed z-50 gap-4 overflow-y-auto overscroll-contain bg-card p-6 text-card-foreground shadow-dialog transition duration-slow ease-standard data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=open]:[--tw-ease:var(--ease-entrance)] data-[state=closed]:[--tw-ease:var(--ease-exit)]\",\n  {\n    variants: {\n      side: {\n        // `top`/`bottom` have no inherent height ceiling, so long content grows\n        // past the viewport; cap it at 90dvh (matching Dialog's dvh unit — ADR\n        // on mobile browser chrome) so the scroll rule above actually engages.\n        top: \"inset-x-0 top-0 max-h-[90dvh] border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n        bottom:\n          \"inset-x-0 bottom-0 max-h-[90dvh] border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n        // `side` is an explicit physical edge of the screen (like Radix's own\n        // Popper `side`), not a logical start/end — a caller who picks `\"left\"`\n        // wants the panel on the physical left even in an RTL layout, so these\n        // stay physical `left-0`/`right-0` and `border-r`/`border-l` on purpose.\n        left: \"inset-y-0 left-0 h-full w-3/4 max-w-sm border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left\",\n        right:\n          \"inset-y-0 right-0 h-full w-3/4 max-w-sm border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right\",\n      },\n    },\n    defaultVariants: { side: \"right\" },\n  },\n);\n\nexport interface SheetContentProps\n  extends\n    ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,\n    VariantProps<typeof sheetVariants> {}\n\nexport const SheetContent = forwardRef<\n  ElementRef<typeof SheetPrimitive.Content>,\n  SheetContentProps\n>(function SheetContent({ side = \"right\", className, children, ...props }, ref) {\n  const { t } = useLocale();\n  return (\n    <SheetPortal>\n      <SheetOverlay />\n      <SheetPrimitive.Content\n        ref={ref}\n        data-slot=\"sheet-content\"\n        className={cn(sheetVariants({ side }), className)}\n        {...props}\n      >\n        {children}\n        {/* Matches Dialog's close button exactly (radius, padding, ink,\n            opacity choreography) — a 24px target (`p-1` + the 16px glyph)\n            instead of the previous bare 16px hit area (#286). */}\n        <SheetPrimitive.Close\n          data-slot=\"sheet-close\"\n          className=\"absolute end-4 top-4 rounded-md p-1 text-muted-foreground opacity-70 transition-opacity hover:opacity-100 focus-ring\"\n          aria-label={t(\"close\")}\n        >\n          <X className=\"size-4\" />\n        </SheetPrimitive.Close>\n      </SheetPrimitive.Content>\n    </SheetPortal>\n  );\n});\n\nexport function SheetHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div data-slot=\"sheet-header\" className={cn(\"flex flex-col gap-1.5\", className)} {...props} />\n  );\n}\nexport function SheetFooter({ className, ...props }: HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"sheet-footer\"\n      className={cn(\"mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\", className)}\n      {...props}\n    />\n  );\n}\nexport const SheetTitle = forwardRef<\n  ElementRef<typeof SheetPrimitive.Title>,\n  ComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(function SheetTitle({ className, ...props }, ref) {\n  return (\n    // `text-title`, matching `DialogTitle` (#286) — was `text-lg font-semibold`,\n    // one rung below Dialog's for the same anatomical role (a modal title).\n    <SheetPrimitive.Title\n      ref={ref}\n      data-slot=\"sheet-title\"\n      className={cn(\"text-title leading-none\", className)}\n      {...props}\n    />\n  );\n});\nexport const SheetDescription = forwardRef<\n  ElementRef<typeof SheetPrimitive.Description>,\n  ComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(function SheetDescription({ className, ...props }, ref) {\n  return (\n    <SheetPrimitive.Description\n      ref={ref}\n      data-slot=\"sheet-description\"\n      className={cn(\"text-body text-muted-foreground\", className)}\n      {...props}\n    />\n  );\n});\n"],"mappings":";;;;;;;;;AAEA;AAAA,EACE;AAAA,OAIK;AACP,YAAY,oBAAoB;AAChC,SAAS,WAA8B;AACvC,SAAS,SAAS;AAcd,cAoDE,YApDF;AAVG,IAAM,QAAuB;AAC7B,IAAM,eAA8B;AACpC,IAAM,aAA4B;AAClC,IAAM,cAA6B;AAE1C,IAAM,eAAe,WAGnB,SAASA,cAAa,EAAE,WAAW,GAAG,MAAM,GAAG,KAAK;AACpD,SACE;AAAA,IAAgB;AAAA,IAAf;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,IAAM,gBAAgB;AAAA;AAAA;AAAA;AAAA,EAIpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA;AAAA;AAAA;AAAA,QAIJ,KAAK;AAAA,QACL,QACE;AAAA;AAAA;AAAA;AAAA;AAAA,QAKF,MAAM;AAAA,QACN,OACE;AAAA,MACJ;AAAA,IACF;AAAA,IACA,iBAAiB,EAAE,MAAM,QAAQ;AAAA,EACnC;AACF;AAOO,IAAM,eAAe,WAG1B,SAASC,cAAa,EAAE,OAAO,SAAS,WAAW,UAAU,GAAG,MAAM,GAAG,KAAK;AAC9E,QAAM,EAAE,EAAE,IAAI,UAAU;AACxB,SACE,qBAAC,eACC;AAAA,wBAAC,gBAAa;AAAA,IACd;AAAA,MAAgB;AAAA,MAAf;AAAA,QACC;AAAA,QACA,aAAU;AAAA,QACV,WAAW,GAAG,cAAc,EAAE,KAAK,CAAC,GAAG,SAAS;AAAA,QAC/C,GAAG;AAAA,QAEH;AAAA;AAAA,UAID;AAAA,YAAgB;AAAA,YAAf;AAAA,cACC,aAAU;AAAA,cACV,WAAU;AAAA,cACV,cAAY,EAAE,OAAO;AAAA,cAErB,8BAAC,KAAE,WAAU,UAAS;AAAA;AAAA,UACxB;AAAA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ,CAAC;AAEM,SAAS,YAAY,EAAE,WAAW,GAAG,MAAM,GAAmC;AACnF,SACE,oBAAC,SAAI,aAAU,gBAAe,WAAW,GAAG,yBAAyB,SAAS,GAAI,GAAG,OAAO;AAEhG;AACO,SAAS,YAAY,EAAE,WAAW,GAAG,MAAM,GAAmC;AACnF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,kEAAkE,SAAS;AAAA,MACxF,GAAG;AAAA;AAAA,EACN;AAEJ;AACO,IAAM,aAAa,WAGxB,SAASC,YAAW,EAAE,WAAW,GAAG,MAAM,GAAG,KAAK;AAClD;AAAA;AAAA;AAAA,IAGE;AAAA,MAAgB;AAAA,MAAf;AAAA,QACC;AAAA,QACA,aAAU;AAAA,QACV,WAAW,GAAG,2BAA2B,SAAS;AAAA,QACjD,GAAG;AAAA;AAAA,IACN;AAAA;AAEJ,CAAC;AACM,IAAM,mBAAmB,WAG9B,SAASC,kBAAiB,EAAE,WAAW,GAAG,MAAM,GAAG,KAAK;AACxD,SACE;AAAA,IAAgB;AAAA,IAAf;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MACV,WAAW,GAAG,mCAAmC,SAAS;AAAA,MACzD,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;","names":["SheetOverlay","SheetContent","SheetTitle","SheetDescription"]}