@photon-ai/pho-ui 1.1.0 → 1.2.0

package/dist/chunks/IconCheck-D2WuculQ.js

@@ -0,0 +1,11 @@
+"use client";
+import { t as e } from "./createReactComponent-BqCmnqfX.js";
+var t = [["path", {
+  d: "M5 12l5 5l10 -10",
+  key: "svg-0"
+}]], o = e("outline", "check", "Check", t);
+export {
+  o as t
+};
+
+//# sourceMappingURL=IconCheck-D2WuculQ.js.map

package/dist/chunks/IconCheck-D2WuculQ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconCheck-D2WuculQ.js","names":[],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.44.0_react@19.2.7/node_modules/@tabler/icons-react/dist/esm/icons/IconCheck.mjs"],"sourcesContent":["/**\n * @license @tabler/icons-react v3.44.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M5 12l5 5l10 -10\", \"key\": \"svg-0\" }]];\nconst IconCheck = createReactComponent(\"outline\", \"check\", \"Check\", __iconNode);\n\nexport { __iconNode, IconCheck as default };\n//# sourceMappingURL=IconCheck.mjs.map\n"],"x_google_ignoreList":[0],"mappings":";;AASA,IAAM,IAAa,CAAC,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAoB,KAAO;AAAQ,CAAC,CAAC,GACnE,IAAY,EAAqB,WAAW,SAAS,SAAS,CAAU"}

package/dist/chunks/card-9cGnv-VD.js

@@ -0,0 +1,56 @@
+"use client";
+import { t as r } from "./cn-DTiB6ek_.js";
+import "react";
+import { jsx as o } from "react/jsx-runtime";
+var a = "border-pho-secondary bg-pho-primary rounded-lg border";
+function i({ className: e, ...t }) {
+  return /* @__PURE__ */ o("div", {
+    className: r(a, "flex flex-col gap-4 pt-5 pb-4", e),
+    ...t
+  });
+}
+function s({ className: e, ...t }) {
+  return /* @__PURE__ */ o("div", {
+    className: r("flex flex-col gap-0.5 px-5", e),
+    ...t
+  });
+}
+function p({ className: e, children: t, ...n }) {
+  return /* @__PURE__ */ o("h3", {
+    className: r("text-display-xs text-pho-primary font-medium", e),
+    ...n,
+    children: t
+  });
+}
+function c({ className: e, ...t }) {
+  return /* @__PURE__ */ o("p", {
+    className: r("text-display-xs text-pho-description font-normal", e),
+    ...t
+  });
+}
+function l({ className: e, ...t }) {
+  return /* @__PURE__ */ o("div", {
+    className: r("px-5", e),
+    ...t
+  });
+}
+function m({ className: e, ...t }) {
+  return /* @__PURE__ */ o("div", {
+    className: r("flex items-center gap-2 px-5", e),
+    ...t
+  });
+}
+var u = {
+  Root: i,
+  Header: s,
+  Title: p,
+  Description: c,
+  Content: l,
+  Footer: m
+};
+export {
+  u as n,
+  a as t
+};
+
+//# sourceMappingURL=card-9cGnv-VD.js.map

package/dist/chunks/card-9cGnv-VD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-9cGnv-VD.js","names":[],"sources":["../../src/components/card/card.tsx"],"sourcesContent":["import { type ComponentProps, type Ref } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Design notes:\n * - A card is a flat bordered panel on the page surface — hairline border,\n *   primary background, no shadow. Elevation shadows stay on floating layers\n *   (menus, dialogs); see the same rule on Input and Select.\n * - Radius sits at the `lg` stop (16px) like Dialog — a standalone content\n *   panel reads bigger than a control, so it takes the panel radius rather\n *   than the control default (`base`).\n * - Vertical rhythm: `pt-5` / `pb-4`, `gap-4` between parts. Parts carry\n *   `px-5`, so a child without padding (an image, a table, a `Separator`)\n *   runs edge-to-edge on its own.\n * - No size or color axes. A card is chrome, not a signal — content sets the\n *   tone. Sizing belongs to the layout that places the card.\n */\n\n/** Surface chrome — exported for hosts that need the look on another element. */\nexport const CARD_SURFACE =\n  \"border-pho-secondary bg-pho-primary rounded-lg border\";\n\n/** The panel: bordered surface, vertical rhythm between parts. */\nfunction Root({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div\n      className={cn(CARD_SURFACE, \"flex flex-col gap-4 pt-5 pb-4\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Title + optional description pair, kept tight (`gap-0.5`). */\nfunction Header({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div className={cn(\"flex flex-col gap-0.5 px-5\", className)} {...props} />\n  );\n}\n\n/**\n * Card heading — an `<h3>` so it nests under page (`h1`) and section (`h2`)\n * headings without skipping levels.\n */\nfunction Title({\n  className,\n  children,\n  ...props\n}: ComponentProps<\"h3\"> & { ref?: Ref<HTMLHeadingElement> }) {\n  return (\n    <h3\n      className={cn(\"text-display-xs text-pho-primary font-medium\", className)}\n      {...props}\n    >\n      {children}\n    </h3>\n  );\n}\n\n/** Supporting copy under the title — same step, secondary tone. */\nfunction Description({\n  className,\n  ...props\n}: ComponentProps<\"p\"> & { ref?: Ref<HTMLParagraphElement> }) {\n  return (\n    <p\n      className={cn(\n        \"text-display-xs text-pho-description font-normal\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** The card body. Carries the horizontal padding; bring your own layout. */\nfunction Content({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return <div className={cn(\"px-5\", className)} {...props} />;\n}\n\n/**\n * Trailing row — actions, a status line. Unopinionated about justification;\n * add `justify-end` for a dialog-style action bar.\n */\nfunction Footer({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div className={cn(\"flex items-center gap-2 px-5\", className)} {...props} />\n  );\n}\n\n/**\n * Card — a bordered content panel: header (title + description), body,\n * optional footer. It's static chrome with no interactivity of its own.\n * For a settings label/control list use `Settings.Card`; for a featured\n * block on the page surface use `Settings.Callout`.\n *\n * ```tsx\n * <Card.Root>\n *   <Card.Header>\n *     <Card.Title>Usage</Card.Title>\n *     <Card.Description>Since Aug 1.</Card.Description>\n *   </Card.Header>\n *   <Card.Content>…</Card.Content>\n *   <Card.Footer className=\"justify-end\">\n *     <Button size=\"sm\">Upgrade</Button>\n *   </Card.Footer>\n * </Card.Root>\n * ```\n */\nexport const Card = {\n  Root,\n  Header,\n  Title,\n  Description,\n  Content,\n  Footer,\n};\n"],"mappings":";;;;AAmBA,IAAa,IACX;AAGF,SAAS,EAAK,EACZ,WAAA,GACA,GAAG,EAAA,GACqD;AACxD,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,WAAW,EAAG,GAAc,iCAAiC,CAAS;AAAA,IACtE,GAAI;AAAA,EACL,CAAA;AAEL;AAGA,SAAS,EAAO,EACd,WAAA,GACA,GAAG,EAAA,GACqD;AACxD,SACE,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAW,EAAG,8BAA8B,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE7E;AAMA,SAAS,EAAM,EACb,WAAA,GACA,UAAA,GACA,GAAG,EAAA,GACwD;AAC3D,SACE,gBAAA,EAAC,MAAD;AAAA,IACE,WAAW,EAAG,gDAAgD,CAAS;AAAA,IACvE,GAAI;AAAA,IAEH,UAAA;AAAA,EACC,CAAA;AAER;AAGA,SAAS,EAAY,EACnB,WAAA,GACA,GAAG,EAAA,GACyD;AAC5D,SACE,gBAAA,EAAC,KAAD;AAAA,IACE,WAAW,EACT,oDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAGA,SAAS,EAAQ,EACf,WAAA,GACA,GAAG,EAAA,GACqD;AACxD,SAAO,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAW,EAAG,QAAQ,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAC5D;AAMA,SAAS,EAAO,EACd,WAAA,GACA,GAAG,EAAA,GACqD;AACxD,SACE,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAW,EAAG,gCAAgC,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE/E;AAqBA,IAAa,IAAO;AAAA,EAClB,MAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AACF"}

package/dist/chunks/{input-BSJGBUbf.js → input-CxS7ndpb.js}

@@ -45,14 +45,14 @@ var S = [
 }, P = {
   sm: "",
   md: "",
-  lg: r("isolate before:pointer-events-none before:absolute before:-z-10 before:content-['']", "before:bg-pho-primary before:inset-px before:rounded-[calc(var(--radius-base)-1px)]", "has-[input:focus-visible]:before:inset-0.5 has-[input:focus-visible]:before:rounded-[calc(var(--radius-base)-2px)]", "before:transition-[inset,border-radius] before:duration-100 before:ease-linear")
+  lg: r("isolate before:pointer-events-none before:absolute before:-z-10 before:content-['']", "before:bg-pho-primary before:inset-px before:rounded-[calc(var(--radius-base)-1px)]", "data-[invalid]:before:inset-[1.5px] data-[invalid]:before:rounded-[calc(var(--radius-base)-1.5px)]", "has-[input:focus-visible]:before:inset-0.5 has-[input:focus-visible]:before:rounded-[calc(var(--radius-base)-2px)]", "before:transition-[inset,border-radius] before:duration-100 before:ease-linear")
 }, T = {
   sm: "autofill:rounded-[calc(var(--radius-base)-2px)]",
   md: "autofill:rounded-[calc(var(--radius-base)-2px)]",
   lg: "autofill:rounded-[calc(var(--radius-base)-2px)]"
 };
-function Z({ label: d, hint: c, size: a = "md", invalid: t, icon: i, labelTrailing: f, disabled: b, required: p, type: u = "text", className: v, wrapperClassName: h, id: x, ref: g, ...y }) {
-  const [m, N] = A(!1), o = u === "password", I = o && m ? "text" : u, _ = !!i, E = o || t;
+function Z({ label: d, hint: c, size: a = "md", invalid: t, icon: i, labelTrailing: m, disabled: b, required: p, type: u = "text", className: v, wrapperClassName: h, id: x, ref: g, ...y }) {
+  const [f, N] = A(!1), o = u === "password", I = o && f ? "text" : u, _ = !!i, E = o || t;
   return /* @__PURE__ */ s(l.Root, {
     disabled: b,
     className: "group/field flex w-full flex-col gap-1.5",
@@ -65,11 +65,11 @@ function Z({ label: d, hint: c, size: a = "md", invalid: t, icon: i, labelTraili
             className: "text-pho-brand",
             children: "*"
           })]
-        }), f]
+        }), m]
       }),
       /* @__PURE__ */ s("div", {
         "data-invalid": t || void 0,
-        className: r("bg-pho-primary ring-pho-primary relative flex w-full items-center p-0.5 ring-1 transition-shadow duration-100 ease-linear ring-inset", F[a], P[a], "has-[input:focus-visible]:ring-pho-brand has-[input:focus-visible]:ring-2", "data-[invalid]:ring-pho-error-subtle data-[invalid]:has-[input:focus-visible]:ring-pho-error", "group-data-[disabled]/field:cursor-not-allowed group-data-[disabled]/field:opacity-50", h),
+        className: r("bg-pho-primary ring-pho-primary relative flex w-full items-center p-0.5 ring-1 transition-shadow duration-100 ease-linear ring-inset", F[a], P[a], "has-[input:focus-visible]:ring-pho-brand has-[input:focus-visible]:ring-2", "data-[invalid]:ring-pho-error-subtle data-[invalid]:has-[input:focus-visible]:ring-pho-error data-[invalid]:ring-[1.5px]", "group-data-[disabled]/field:cursor-not-allowed group-data-[disabled]/field:opacity-50", h),
         children: [
           i && /* @__PURE__ */ e(i, { className: r("text-pho-secondary pointer-events-none absolute", z[a]) }),
           /* @__PURE__ */ e(l.Control, {
@@ -87,7 +87,7 @@ function Z({ label: d, hint: c, size: a = "md", invalid: t, icon: i, labelTraili
             "aria-label": "Toggle password visibility",
             onClick: () => N((w) => !w),
             className: "text-pho-secondary hover:text-pho-secondary-hover absolute right-3 flex cursor-pointer items-center transition duration-100 ease-linear focus:outline-none",
-            children: m ? /* @__PURE__ */ e(k, { className: "size-4" }) : /* @__PURE__ */ e(D, { className: "size-4" })
+            children: f ? /* @__PURE__ */ e(k, { className: "size-4" }) : /* @__PURE__ */ e(D, { className: "size-4" })
           })
         ]
       }),
@@ -103,4 +103,4 @@ export {
   Z as t
 };
 
-//# sourceMappingURL=input-BSJGBUbf.js.map
+//# sourceMappingURL=input-CxS7ndpb.js.map

package/dist/chunks/input-CxS7ndpb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-CxS7ndpb.js","names":["__iconNode","__iconNode"],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.44.0_react@19.2.7/node_modules/@tabler/icons-react/dist/esm/icons/IconEyeOff.mjs","../../../../node_modules/.pnpm/@tabler+icons-react@3.44.0_react@19.2.7/node_modules/@tabler/icons-react/dist/esm/icons/IconEye.mjs","../../../../node_modules/.pnpm/@tabler+icons-react@3.44.0_react@19.2.7/node_modules/@tabler/icons-react/dist/esm/icons/IconAlertCircleFilled.mjs","../../src/components/input/input.tsx"],"sourcesContent":["/**\n * @license @tabler/icons-react v3.44.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M10.585 10.587a2 2 0 0 0 2.829 2.828\", \"key\": \"svg-0\" }], [\"path\", { \"d\": \"M16.681 16.673a8.717 8.717 0 0 1 -4.681 1.327c-3.6 0 -6.6 -2 -9 -6c1.272 -2.12 2.712 -3.678 4.32 -4.674m2.86 -1.146a9.055 9.055 0 0 1 1.82 -.18c3.6 0 6.6 2 9 6c-.666 1.11 -1.379 2.067 -2.138 2.87\", \"key\": \"svg-1\" }], [\"path\", { \"d\": \"M3 3l18 18\", \"key\": \"svg-2\" }]];\nconst IconEyeOff = createReactComponent(\"outline\", \"eye-off\", \"EyeOff\", __iconNode);\n\nexport { __iconNode, IconEyeOff as default };\n//# sourceMappingURL=IconEyeOff.mjs.map\n","/**\n * @license @tabler/icons-react v3.44.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0\", \"key\": \"svg-0\" }], [\"path\", { \"d\": \"M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6\", \"key\": \"svg-1\" }]];\nconst IconEye = createReactComponent(\"outline\", \"eye\", \"Eye\", __iconNode);\n\nexport { __iconNode, IconEye as default };\n//# sourceMappingURL=IconEye.mjs.map\n","/**\n * @license @tabler/icons-react v3.44.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M12 2c5.523 0 10 4.477 10 10a10 10 0 0 1 -19.995 .324l-.005 -.324l.004 -.28c.148 -5.393 4.566 -9.72 9.996 -9.72zm.01 13l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007zm-.01 -8a1 1 0 0 0 -.993 .883l-.007 .117v4l.007 .117a1 1 0 0 0 1.986 0l.007 -.117v-4l-.007 -.117a1 1 0 0 0 -.993 -.883z\", \"key\": \"svg-0\" }]];\nconst IconAlertCircleFilled = createReactComponent(\"filled\", \"alert-circle-filled\", \"AlertCircleFilled\", __iconNode);\n\nexport { __iconNode, IconAlertCircleFilled as default };\n//# sourceMappingURL=IconAlertCircleFilled.mjs.map\n","import {\n  useState,\n  type ComponentType,\n  type InputHTMLAttributes,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport {\n  IconAlertCircleFilled,\n  IconEye,\n  IconEyeOff,\n} from \"@tabler/icons-react\";\nimport { Field } from \"@base-ui/react/field\";\nimport { cn } from \"../../utils/cn\";\n\nexport type InputSize = \"sm\" | \"md\" | \"lg\";\n\n// Control padding per size. The wrapper carries a 2px inset (`p-0.5`) so the\n// control's border box — and the browser's autofill fill it paints — sits\n// inside the ring instead of over it; these paddings are the documented\n// effective padding (sm/md 12/8px, lg 14/10px) minus that 2px inset, so the\n// text position and total field height are unchanged.\nconst SIZE_PAD: Record<InputSize, string> = {\n  // 16px on small viewports — iOS zooms into any focused field under 16px.\n  sm: \"px-2.5 py-1.5 text-md md:text-base\",\n  md: \"px-2.5 py-1.5 text-md\",\n  lg: \"px-3 py-2 text-md\",\n};\n// Effective icon clearance minus the wrapper's 2px inset.\nconst LEADING_PAD: Record<InputSize, string> = {\n  sm: \"pl-8.5\",\n  md: \"pl-9.5\",\n  lg: \"pl-10\",\n};\n// Icons are absolutely positioned, so they're placed from the wrapper's\n// padding edge — which, with no border, is the visible field edge; the\n// wrapper's `p-0.5` does not offset them.\nconst LEADING_ICON_POS: Record<InputSize, string> = {\n  sm: \"left-3 size-4\",\n  md: \"left-3 size-5\",\n  lg: \"left-3.5 size-5\",\n};\n// Wrapper corner radius — `rounded-base` (12px) at every size; `lg` also gets\n// `squircle` superellipse smoothing (the ring is a box-shadow on this wrapper,\n// so it follows the border-radius automatically).\nconst SIZE_RADIUS: Record<InputSize, string> = {\n  sm: \"rounded-base\",\n  md: \"rounded-base\",\n  lg: \"squircle rounded-base\",\n};\n// Concentric inner-curve cover, `lg` only. Nested corner radii must follow\n// innerRadius = outerRadius − inset, so the hairline's inner edge at a 12px\n// outer radius is 11px at rest (ring-1) and 10px when focused (ring-2).\n// Browsers derive that automatically for plain round corners, but with\n// `corner-shape: superellipse(...)` shipping engines still scale (rather than\n// offset) the inner shadow curve, which renders the ring visibly thicker at\n// the four corners (see w3c/csswg-drafts#12961). This ::before repaints the\n// field surface over everything inside the correct concentric curve — a round\n// radius is the right parallel-offset approximation of the mild superellipse —\n// so the ring reads as a uniform hairline in every engine. `isolate` +\n// `-z-10` slot the cover above the wrapper's background/ring but below the\n// control's text, icons, and autofill fill. `sm`/`md` have no corner-shape,\n// so the native (already concentric) rendering is kept there.\n// The ::before is absolutely positioned, so its inset is measured from the\n// wrapper's border box (border 0): 1px in at rest, 2px in when focused.\nconst SIZE_RING_COVER: Record<InputSize, string> = {\n  sm: \"\",\n  md: \"\",\n  lg: cn(\n    \"isolate before:pointer-events-none before:absolute before:-z-10 before:content-['']\",\n    \"before:bg-pho-primary before:inset-px before:rounded-[calc(var(--radius-base)-1px)]\",\n    // Invalid sits between rest (1px) and focus (2px) — keep the cover concentric.\n    \"data-[invalid]:before:inset-[1.5px] data-[invalid]:before:rounded-[calc(var(--radius-base)-1.5px)]\",\n    \"has-[input:focus-visible]:before:inset-0.5 has-[input:focus-visible]:before:rounded-[calc(var(--radius-base)-2px)]\",\n    \"before:transition-[inset,border-radius] before:duration-100 before:ease-linear\",\n  ),\n};\n// The control's border box sits 2px inside the wrapper (its `p-0.5` inset),\n// clear of both ring widths, so the browser's autofill fill paints inside the\n// hairline instead of over it. Rounding follows inner = outer − gap, derived\n// from the token with calc. Round (not squircle) — the parallel offset of\n// the wrapper's mild superellipse is effectively circular.\nconst SIZE_AUTOFILL_RADIUS: Record<InputSize, string> = {\n  sm: \"autofill:rounded-[calc(var(--radius-base)-2px)]\",\n  md: \"autofill:rounded-[calc(var(--radius-base)-2px)]\",\n  lg: \"autofill:rounded-[calc(var(--radius-base)-2px)]\",\n};\n\nexport interface InputProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  \"size\"\n> {\n  /** Field label (associated for accessibility). */\n  label?: ReactNode;\n  /** Helper text below the field; rendered in the error color when `invalid`. */\n  hint?: ReactNode;\n  /** Size variant. @default \"md\" */\n  size?: InputSize;\n  /** Render the invalid state (ring + icon + error-colored hint). */\n  invalid?: boolean;\n  /** Leading icon component (e.g. a Tabler icon). */\n  icon?: ComponentType<{ className?: string }>;\n  /** Node rendered at the right edge of the label row (e.g. \"Forgot?\"). */\n  labelTrailing?: ReactNode;\n  /** Class applied to the input wrapper. */\n  wrapperClassName?: string;\n  ref?: Ref<HTMLInputElement>;\n}\n\n/**\n * Text input built on Base UI `Field` (label/description a11y wiring) with\n * Pho's bordered surface, leading icon, invalid state, and a built-in password\n * reveal toggle.\n */\nexport function Input({\n  label,\n  hint,\n  size = \"md\",\n  invalid,\n  icon: Icon,\n  labelTrailing,\n  disabled,\n  required,\n  type = \"text\",\n  className,\n  wrapperClassName,\n  id,\n  ref,\n  ...props\n}: InputProps) {\n  const [reveal, setReveal] = useState(false);\n  const isPassword = type === \"password\";\n  const resolvedType = isPassword && reveal ? \"text\" : type;\n  const hasLeadingIcon = Boolean(Icon);\n  const hasTrailingIcon = isPassword || invalid;\n\n  return (\n    <Field.Root\n      disabled={disabled}\n      className=\"group/field flex w-full flex-col gap-1.5\"\n    >\n      {label && (\n        <div className=\"flex items-center justify-between gap-2\">\n          <Field.Label className=\"text-pho-secondary flex cursor-default items-center gap-0.5 text-base font-medium\">\n            {label}\n            {required && <span className=\"text-pho-brand\">*</span>}\n          </Field.Label>\n          {labelTrailing}\n        </div>\n      )}\n\n      <div\n        data-invalid={invalid || undefined}\n        className={cn(\n          // Flat field surface — hairline ring only; elevation shadows are\n          // reserved for floating layers (menus/popovers/dialogs). `p-0.5`\n          // insets the control 2px (the focused ring width) so its background\n          // and the browser's autofill fill nest inside the ring; the size\n          // maps compensate so effective padding/height are unchanged.\n          \"bg-pho-primary ring-pho-primary relative flex w-full items-center p-0.5 ring-1 transition-shadow duration-100 ease-linear ring-inset\",\n          SIZE_RADIUS[size],\n          SIZE_RING_COVER[size],\n          \"has-[input:focus-visible]:ring-pho-brand has-[input:focus-visible]:ring-2\",\n          // Invalid is mid-weight: thicker than the 1px rest hairline, thinner\n          // than the 2px focus ring. Rest uses the subtle error ink; focus\n          // steps up to the solid error (same hue, full opacity).\n          \"data-[invalid]:ring-pho-error-subtle data-[invalid]:has-[input:focus-visible]:ring-pho-error data-[invalid]:ring-[1.5px]\",\n          \"group-data-[disabled]/field:cursor-not-allowed group-data-[disabled]/field:opacity-50\",\n          wrapperClassName,\n        )}\n      >\n        {Icon && (\n          <Icon\n            className={cn(\n              \"text-pho-secondary pointer-events-none absolute\",\n              LEADING_ICON_POS[size],\n            )}\n          />\n        )}\n\n        <Field.Control\n          ref={ref}\n          id={id}\n          type={resolvedType}\n          required={required}\n          {...props}\n          className={cn(\n            \"text-pho-primary placeholder:text-pho-placeholder m-0 w-full bg-transparent outline-none disabled:cursor-not-allowed\",\n            SIZE_PAD[size],\n            SIZE_AUTOFILL_RADIUS[size],\n            hasLeadingIcon && LEADING_PAD[size],\n            // 34px + the wrapper's 2px inset = the previous 36px clearance.\n            hasTrailingIcon && \"pr-8.5\",\n            className,\n          )}\n        />\n\n        {invalid && !isPassword && (\n          <IconAlertCircleFilled className=\"text-pho-error pointer-events-none absolute right-3 size-4\" />\n        )}\n\n        {isPassword && (\n          <button\n            type=\"button\"\n            // Reachable by click but skipped in tab order so Tab moves field→field.\n            tabIndex={-1}\n            aria-label=\"Toggle password visibility\"\n            onClick={() => setReveal((v) => !v)}\n            className=\"text-pho-secondary hover:text-pho-secondary-hover absolute right-3 flex cursor-pointer items-center transition duration-100 ease-linear focus:outline-none\"\n          >\n            {reveal ? (\n              <IconEyeOff className=\"size-4\" />\n            ) : (\n              <IconEye className=\"size-4\" />\n            )}\n          </button>\n        )}\n      </div>\n\n      {hint && (\n        <Field.Description\n          className={cn(\n            \"text-pho-description text-base\",\n            invalid && \"text-pho-error\",\n          )}\n        >\n          {hint}\n        </Field.Description>\n      )}\n    </Field.Root>\n  );\n}\n\nInput.displayName = \"Input\";\n"],"x_google_ignoreList":[0,1,2],"mappings":";;;;;;AASA,IAAMA,IAAa;AAAA,EAAC,CAAC,QAAQ;AAAA,IAAE,GAAK;AAAA,IAAwC,KAAO;AAAA,EAAQ,CAAC;AAAA,EAAG,CAAC,QAAQ;AAAA,IAAE,GAAK;AAAA,IAAuM,KAAO;AAAA,EAAQ,CAAC;AAAA,EAAG,CAAC,QAAQ;AAAA,IAAE,GAAK;AAAA,IAAc,KAAO;AAAA,EAAQ,CAAC;AAAC,GAClX,IAAa,EAAqB,WAAW,WAAW,UAAUA,CAAU,GCD5EC,IAAa,CAAC,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAuC,KAAO;AAAQ,CAAC,GAAG,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAqF,KAAO;AAAQ,CAAC,CAAC,GAC9M,IAAU,EAAqB,WAAW,OAAO,OAAOA,CAAU,GCDlE,IAAa,CAAC,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAoU,KAAO;AAAQ,CAAC,CAAC,GACnX,IAAwB,EAAqB,UAAU,uBAAuB,qBAAqB,CAAU,GCY7G,IAAsC;AAAA,EAE1C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEM,IAAyC;AAAA,EAC7C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAIM,IAA8C;AAAA,EAClD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAIM,IAAyC;AAAA,EAC7C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAgBM,IAA6C;AAAA,EACjD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI,EACF,uFACA,uFAEA,sGACA,sHACA,gFACF;AACF,GAMM,IAAkD;AAAA,EACtD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AA4BA,SAAgB,EAAM,EACpB,OAAA,GACA,MAAA,GACA,MAAA,IAAO,MACP,SAAA,GACA,MAAM,GACN,eAAA,GACA,UAAA,GACA,UAAA,GACA,MAAA,IAAO,QACP,WAAA,GACA,kBAAA,GACA,IAAA,GACA,KAAA,GACA,GAAG,EAAA,GACU;AACb,QAAM,CAAC,GAAQ,CAAA,IAAa,EAAS,EAAK,GACpC,IAAa,MAAS,YACtB,IAAe,KAAc,IAAS,SAAS,GAC/C,IAAiB,EAAQ,GACzB,IAAkB,KAAc;AAEtC,SACE,gBAAA,EAAC,EAAM,MAAP;AAAA,IACY,UAAA;AAAA,IACV,WAAU;AAAA,cAFZ;AAAA,MAIG,KACC,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAf,CACE,gBAAA,EAAC,EAAM,OAAP;AAAA,UAAa,WAAU;AAAA,oBAAvB,CACG,GACA,KAAY,gBAAA,EAAC,QAAD;AAAA,YAAM,WAAU;AAAA,sBAAiB;AAAA,UAAO,CAAA,CAC1C;AAAA,YACZ,CACE;AAAA;MAGP,gBAAA,EAAC,OAAD;AAAA,QACE,gBAAc,KAAW;AAAA,QACzB,WAAW,EAMT,wIACA,EAAY,CAAA,GACZ,EAAgB,CAAA,GAChB,6EAIA,4HACA,yFACA,CACF;AAAA,kBAlBF;AAAA,UAoBG,KACC,gBAAA,EAAC,GAAD,EACE,WAAW,EACT,mDACA,EAAiB,CAAA,CACnB,EACD,CAAA;AAAA,UAGH,gBAAA,EAAC,EAAM,SAAP;AAAA,YACO,KAAA;AAAA,YACD,IAAA;AAAA,YACJ,MAAM;AAAA,YACI,UAAA;AAAA,YACV,GAAI;AAAA,YACJ,WAAW,EACT,wHACA,EAAS,CAAA,GACT,EAAqB,CAAA,GACrB,KAAkB,EAAY,CAAA,GAE9B,KAAmB,UACnB,CACF;AAAA,UACD,CAAA;AAAA,UAEA,KAAW,CAAC,KACX,gBAAA,EAAC,GAAD,EAAuB,WAAU,6DAA8D,CAAA;AAAA,UAGhG,KACC,gBAAA,EAAC,UAAD;AAAA,YACE,MAAK;AAAA,YAEL,UAAU;AAAA,YACV,cAAW;AAAA,YACX,SAAA,MAAe,EAAA,CAAW,MAAM,CAAC,CAAC;AAAA,YAClC,WAAU;AAAA,sBAET,IACC,gBAAA,EAAC,GAAD,EAAY,WAAU,SAAU,CAAA,IAEhC,gBAAA,EAAC,GAAD,EAAS,WAAU,SAAU,CAAA;AAAA,UAEzB,CAAA;AAAA,QAEP;AAAA;MAEJ,KACC,gBAAA,EAAC,EAAM,aAAP;AAAA,QACE,WAAW,EACT,kCACA,KAAW,gBACb;AAAA,kBAEC;AAAA,MACgB,CAAA;AAAA,IAEX;AAAA;AAEhB;AAEA,EAAM,cAAc"}

package/dist/chunks/input-group-D6dlma8k.js

@@ -0,0 +1,85 @@
+"use client";
+import { t as i } from "./cn-DTiB6ek_.js";
+import { createContext as b, useContext as p } from "react";
+import { jsx as n } from "react/jsx-runtime";
+import { Field as f } from "@base-ui/react/field";
+import { Separator as m } from "@base-ui/react/separator";
+var l = b({
+  size: "md",
+  invalid: !1
+}), v = {
+  sm: "gap-2 px-3 text-md md:text-base",
+  md: "gap-2 px-3 text-md",
+  lg: "gap-2 px-3.5 text-md"
+}, h = {
+  sm: "my-0.5 py-1.5",
+  md: "my-0.5 py-1.5",
+  lg: "my-0.5 py-2"
+}, g = {
+  sm: "[&_svg]:size-4",
+  md: "[&_svg]:size-5",
+  lg: "[&_svg]:size-5"
+}, x = {
+  sm: "rounded-base",
+  md: "rounded-base",
+  lg: "squircle rounded-base"
+}, y = {
+  sm: "",
+  md: "",
+  lg: i("isolate before:pointer-events-none before:absolute before:-z-10 before:content-['']", "before:bg-pho-primary before:inset-px before:rounded-[calc(var(--radius-base)-1px)]", "data-[invalid]:before:inset-[1.5px] data-[invalid]:before:rounded-[calc(var(--radius-base)-1.5px)]", "has-[:focus-visible]:before:inset-0.5 has-[:focus-visible]:before:rounded-[calc(var(--radius-base)-2px)]", "before:transition-[inset,border-radius] before:duration-100 before:ease-linear")
+};
+function I({ size: e = "md", invalid: r, className: a, onPointerDown: o, ref: s, ...u }) {
+  const c = (t) => {
+    if (o?.(t), t.defaultPrevented || t.target.closest("input, button, a, select, textarea, label")) return;
+    const d = t.currentTarget.querySelector("input");
+    !d || d.disabled || (t.preventDefault(), d.focus());
+  };
+  return /* @__PURE__ */ n(l.Provider, {
+    value: {
+      size: e,
+      invalid: !!r
+    },
+    children: /* @__PURE__ */ n("div", {
+      ref: s,
+      "data-invalid": r || void 0,
+      onPointerDown: c,
+      className: i("bg-pho-primary ring-pho-primary relative flex w-full cursor-text items-center ring-1 transition-shadow duration-100 ease-linear ring-inset", v[e], x[e], y[e], "has-[:focus-visible]:ring-pho-brand has-[:focus-visible]:ring-2", "has-[button[data-popup-open]]:ring-pho-brand has-[button[data-popup-open]]:ring-2", "data-[invalid]:ring-pho-error-subtle data-[invalid]:has-[:focus-visible]:ring-pho-error data-[invalid]:has-[button[data-popup-open]]:ring-pho-error data-[invalid]:ring-[1.5px]", "has-[input:disabled]:cursor-not-allowed has-[input:disabled]:opacity-50", a),
+      ...u
+    })
+  });
+}
+function _({ className: e, ref: r, ...a }) {
+  const { size: o, invalid: s } = p(l);
+  return /* @__PURE__ */ n(f.Control, {
+    ref: r,
+    "aria-invalid": s || void 0,
+    ...a,
+    className: i("text-pho-primary placeholder:text-pho-placeholder m-0 w-full min-w-0 flex-1 bg-transparent outline-none disabled:cursor-not-allowed", "autofill:rounded-[calc(var(--radius-base)-2px)]", h[o], e)
+  });
+}
+function S({ className: e, ref: r, ...a }) {
+  const { size: o } = p(l);
+  return /* @__PURE__ */ n("div", {
+    ref: r,
+    className: i("text-pho-secondary flex shrink-0 items-center gap-1 select-none", "[&_svg]:shrink-0", g[o], e),
+    ...a
+  });
+}
+function w({ className: e, orientation: r = "vertical", ...a }) {
+  return /* @__PURE__ */ n(m, {
+    orientation: r,
+    className: i("my-0.5 w-px shrink-0 self-stretch bg-[var(--border-color-pho-secondary)]", e),
+    ...a
+  });
+}
+var R = {
+  Root: I,
+  Input: _,
+  Addon: S,
+  Separator: w
+};
+export {
+  R as t
+};
+
+//# sourceMappingURL=input-group-D6dlma8k.js.map

package/dist/chunks/input-group-D6dlma8k.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-group-D6dlma8k.js","names":[],"sources":["../../src/components/input-group/input-group.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  type ComponentProps,\n  type ElementType,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type PointerEvent,\n  type Ref,\n} from \"react\";\nimport { Field } from \"@base-ui/react/field\";\nimport { Separator as BaseSeparator } from \"@base-ui/react/separator\";\nimport { cn } from \"../../utils/cn\";\n\n/** Override Base UI's `string | (state) => string` className with plain string. */\ntype StyledProps<T extends ElementType> = Omit<\n  ComponentProps<T>,\n  \"className\"\n> & {\n  className?: string;\n};\n\nexport type InputGroupSize = \"sm\" | \"md\" | \"lg\";\n\n/** Lets `Addon` and the control read the Root's size/invalid state. */\nconst InputGroupContext = createContext<{\n  size: InputGroupSize;\n  invalid: boolean;\n}>({ size: \"md\", invalid: false });\n\n// Mirrors Input's size math (see input.tsx): the group surface carries the\n// horizontal padding and text scale, the control carries the vertical\n// padding. Effective metrics — sm/md 12/8px, lg 14/10px — land the same\n// 36/40/44px field heights, so grouped and plain inputs align in a form.\nconst SIZE_ROOT: Record<InputGroupSize, string> = {\n  // 16px on small viewports — iOS zooms into any focused field under 16px.\n  sm: \"gap-2 px-3 text-md md:text-base\",\n  md: \"gap-2 px-3 text-md\",\n  lg: \"gap-2 px-3.5 text-md\",\n};\n// `my-0.5` insets the control 2px (the focused ring width) so the browser's\n// autofill fill nests inside the ring; `py` makes up the rest of the height.\nconst SIZE_CONTROL: Record<InputGroupSize, string> = {\n  sm: \"my-0.5 py-1.5\",\n  md: \"my-0.5 py-1.5\",\n  lg: \"my-0.5 py-2\",\n};\n// In-field icon size per group size — same scale as Input's leading icon.\nconst SIZE_ADDON_ICON: Record<InputGroupSize, string> = {\n  sm: \"[&_svg]:size-4\",\n  md: \"[&_svg]:size-5\",\n  lg: \"[&_svg]:size-5\",\n};\n// `lg` gets the squircle treatment like Input; sm/md stay plain round.\nconst SIZE_RADIUS: Record<InputGroupSize, string> = {\n  sm: \"rounded-base\",\n  md: \"rounded-base\",\n  lg: \"squircle rounded-base\",\n};\n// Concentric inner-curve cover for the `lg` squircle — same engine workaround\n// as Input (see input.tsx `SIZE_RING_COVER` for the full story).\nconst SIZE_RING_COVER: Record<InputGroupSize, string> = {\n  sm: \"\",\n  md: \"\",\n  lg: cn(\n    \"isolate before:pointer-events-none before:absolute before:-z-10 before:content-['']\",\n    \"before:bg-pho-primary before:inset-px before:rounded-[calc(var(--radius-base)-1px)]\",\n    // Invalid sits between rest (1px) and focus (2px) — keep the cover concentric.\n    \"data-[invalid]:before:inset-[1.5px] data-[invalid]:before:rounded-[calc(var(--radius-base)-1.5px)]\",\n    \"has-[:focus-visible]:before:inset-0.5 has-[:focus-visible]:before:rounded-[calc(var(--radius-base)-2px)]\",\n    \"before:transition-[inset,border-radius] before:duration-100 before:ease-linear\",\n  ),\n};\n\nexport interface InputGroupRootProps extends HTMLAttributes<HTMLDivElement> {\n  /** Size variant, matching Input's scale. @default \"md\" */\n  size?: InputGroupSize;\n  /** Render the invalid state (error ring; `aria-invalid` on the control). */\n  invalid?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * The shared field surface: one hairline ring around the control and its\n * addons, with the same focus / invalid / disabled treatment as `Input`.\n * Clicking anywhere on the surface (addon text, icons, blank space) focuses\n * the control, so the whole group reads as a single field.\n */\nfunction Root({\n  size = \"md\",\n  invalid,\n  className,\n  onPointerDown,\n  ref,\n  ...props\n}: InputGroupRootProps) {\n  const handlePointerDown = (event: PointerEvent<HTMLDivElement>) => {\n    onPointerDown?.(event);\n    if (event.defaultPrevented) return;\n    // Interactive children keep their own pointer behavior (and the control\n    // itself keeps native caret placement).\n    const target = event.target as HTMLElement;\n    if (target.closest(\"input, button, a, select, textarea, label\")) return;\n    const input = event.currentTarget.querySelector(\"input\");\n    if (!input || input.disabled) return;\n    // Focus the control instead of the wrapper — and don't blur it again.\n    event.preventDefault();\n    input.focus();\n  };\n\n  return (\n    <InputGroupContext.Provider value={{ size, invalid: Boolean(invalid) }}>\n      <div\n        ref={ref}\n        data-invalid={invalid || undefined}\n        onPointerDown={handlePointerDown}\n        className={cn(\n          // Flat field surface — hairline ring only, same as Input; elevation\n          // shadows are reserved for floating layers.\n          \"bg-pho-primary ring-pho-primary relative flex w-full cursor-text items-center ring-1 transition-shadow duration-100 ease-linear ring-inset\",\n          SIZE_ROOT[size],\n          SIZE_RADIUS[size],\n          SIZE_RING_COVER[size],\n          // Any focusable child (input, a Select trigger, an addon button)\n          // lights the shared ring — including an open Select popup.\n          \"has-[:focus-visible]:ring-pho-brand has-[:focus-visible]:ring-2\",\n          \"has-[button[data-popup-open]]:ring-pho-brand has-[button[data-popup-open]]:ring-2\",\n          // Invalid is mid-weight: thicker than the 1px rest hairline, thinner\n          // than the 2px focus / open ring. Rest uses the subtle error ink;\n          // focus / open steps up to the solid error.\n          \"data-[invalid]:ring-pho-error-subtle data-[invalid]:has-[:focus-visible]:ring-pho-error data-[invalid]:has-[button[data-popup-open]]:ring-pho-error data-[invalid]:ring-[1.5px]\",\n          \"has-[input:disabled]:cursor-not-allowed has-[input:disabled]:opacity-50\",\n          className,\n        )}\n        {...props}\n      />\n    </InputGroupContext.Provider>\n  );\n}\n\nexport interface InputGroupInputProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  \"size\"\n> {\n  ref?: Ref<HTMLInputElement>;\n}\n\n/**\n * The text control. Rendered as Base UI `Field.Control`, so inside a\n * `Field.Root` it picks up the label and description wiring automatically;\n * standalone it behaves as a plain `<input>` (pass `aria-label` then).\n */\nfunction GroupInput({ className, ref, ...props }: InputGroupInputProps) {\n  const { size, invalid } = useContext(InputGroupContext);\n  return (\n    <Field.Control\n      ref={ref}\n      aria-invalid={invalid || undefined}\n      {...props}\n      className={cn(\n        \"text-pho-primary placeholder:text-pho-placeholder m-0 w-full min-w-0 flex-1 bg-transparent outline-none disabled:cursor-not-allowed\",\n        // Rounding for the autofill fill nested 2px inside the ring.\n        \"autofill:rounded-[calc(var(--radius-base)-2px)]\",\n        SIZE_CONTROL[size],\n        className,\n      )}\n    />\n  );\n}\n\n/**\n * Inline content beside the control — prefix/suffix text, an icon, a `Kbd`\n * hint, or a small button. Text and icons render in the secondary tone so the\n * value stays the loudest thing on the surface.\n */\nfunction Addon({\n  className,\n  ref,\n  ...props\n}: HTMLAttributes<HTMLDivElement> & { ref?: Ref<HTMLDivElement> }) {\n  const { size } = useContext(InputGroupContext);\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        \"text-pho-secondary flex shrink-0 items-center gap-1 select-none\",\n        \"[&_svg]:shrink-0\",\n        SIZE_ADDON_ICON[size],\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * A hairline between segments — turns an addon into a boxed section\n * (`https:// │ workspace │ .photon.dev`).\n */\nfunction GroupSeparator({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: StyledProps<typeof BaseSeparator>) {\n  return (\n    <BaseSeparator\n      orientation={orientation}\n      className={cn(\n        // `my-0.5` keeps the line 2px clear of the ring (children paint over\n        // the inset box-shadow, so a full-bleed line would notch it) — the\n        // same inset the control itself uses, covering the focused 2px ring.\n        \"my-0.5 w-px shrink-0 self-stretch bg-[var(--border-color-pho-secondary)]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Input Group — one field surface shared by a text control and its addons:\n * prefix/suffix text, icons, keyboard hints, or a trailing button. Same\n * ring, sizes, and focus / invalid / disabled behavior as `Input`, so grouped\n * and plain fields align in the same form. For a leading icon alone, plain\n * `Input` with `icon` is enough.\n */\nexport const InputGroup = {\n  Root,\n  Input: GroupInput,\n  Addon,\n  Separator: GroupSeparator,\n};\n"],"mappings":";;;;;;AAyBA,IAAM,IAAoB,EAGvB;AAAA,EAAE,MAAM;AAAA,EAAM,SAAS;AAAM,CAAC,GAM3B,IAA4C;AAAA,EAEhD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAGM,IAA+C;AAAA,EACnD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEM,IAAkD;AAAA,EACtD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEM,IAA8C;AAAA,EAClD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAGM,IAAkD;AAAA,EACtD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI,EACF,uFACA,uFAEA,sGACA,4GACA,gFACF;AACF;AAgBA,SAAS,EAAK,EACZ,MAAA,IAAO,MACP,SAAA,GACA,WAAA,GACA,eAAA,GACA,KAAA,GACA,GAAG,EAAA,GACmB;AACtB,QAAM,IAAA,CAAqB,MAAwC;AAMjE,QALA,IAAgB,CAAK,GACjB,EAAM,oBAGK,EAAM,OACV,QAAQ,2CAA2C,EAAG;AACjE,UAAM,IAAQ,EAAM,cAAc,cAAc,OAAO;AACvD,IAAI,CAAC,KAAS,EAAM,aAEpB,EAAM,eAAe,GACrB,EAAM,MAAM;AAAA,EACd;AAEA,SACE,gBAAA,EAAC,EAAkB,UAAnB;AAAA,IAA4B,OAAO;AAAA,MAAE,MAAA;AAAA,MAAM,SAAS,EAAQ;AAAA,IAAS;AAAA,cACnE,gBAAA,EAAC,OAAD;AAAA,MACO,KAAA;AAAA,MACL,gBAAc,KAAW;AAAA,MACzB,eAAe;AAAA,MACf,WAAW,EAGT,8IACA,EAAU,CAAA,GACV,EAAY,CAAA,GACZ,EAAgB,CAAA,GAGhB,mEACA,qFAIA,mLACA,2EACA,CACF;AAAA,MACA,GAAI;AAAA,IACL,CAAA;AAAA,EACyB,CAAA;AAEhC;AAcA,SAAS,EAAW,EAAE,WAAA,GAAW,KAAA,GAAK,GAAG,EAAA,GAA+B;AACtE,QAAM,EAAE,MAAA,GAAM,SAAA,EAAA,IAAY,EAAW,CAAiB;AACtD,SACE,gBAAA,EAAC,EAAM,SAAP;AAAA,IACO,KAAA;AAAA,IACL,gBAAc,KAAW;AAAA,IACzB,GAAI;AAAA,IACJ,WAAW,EACT,uIAEA,mDACA,EAAa,CAAA,GACb,CACF;AAAA,EACD,CAAA;AAEL;AAOA,SAAS,EAAM,EACb,WAAA,GACA,KAAA,GACA,GAAG,EAAA,GAC8D;AACjE,QAAM,EAAE,MAAA,EAAA,IAAS,EAAW,CAAiB;AAC7C,SACE,gBAAA,EAAC,OAAD;AAAA,IACO,KAAA;AAAA,IACL,WAAW,EACT,mEACA,oBACA,EAAgB,CAAA,GAChB,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAMA,SAAS,EAAe,EACtB,WAAA,GACA,aAAA,IAAc,YACd,GAAG,EAAA,GACiC;AACpC,SACE,gBAAA,EAAC,GAAD;AAAA,IACe,aAAA;AAAA,IACb,WAAW,EAIT,4EACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AASA,IAAa,IAAa;AAAA,EACxB,MAAA;AAAA,EACA,OAAO;AAAA,EACP,OAAA;AAAA,EACA,WAAW;AACb"}

package/dist/chunks/{menu-Dan0oRvL.js → menu-BSXds3Rt.js}

@@ -4,8 +4,8 @@ import { t as I } from "./resolve-variant-CcD8iG5l.js";
 import { n as S } from "./spinner-Cy8bkyJf.js";
 import { createContext as E, useCallback as T, useContext as P, useEffect as N, useMemo as G, useRef as b, useState as C } from "react";
 import { Fragment as U, jsx as r, jsxs as x } from "react/jsx-runtime";
-import { Menu as t } from "@base-ui/react/menu";
 import { Separator as _ } from "@base-ui/react/separator";
+import { Menu as t } from "@base-ui/react/menu";
 var y = E(null);
 function ce() {
   return P(y)?.pending ?? !1;
@@ -205,4 +205,4 @@ export {
   f as t
 };
 
-//# sourceMappingURL=menu-Dan0oRvL.js.map
+//# sourceMappingURL=menu-BSXds3Rt.js.map

package/dist/chunks/{menu-Dan0oRvL.js.map → menu-BSXds3Rt.js.map}

@@ -1 +1 @@
-{"version":3,"file":"menu-Dan0oRvL.js","names":[],"sources":["../../src/components/menu/menu-pending.tsx","../../src/components/menu/menu.tsx"],"sourcesContent":["import {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ComponentType,\n  type MouseEvent as ReactMouseEvent,\n  type ReactNode,\n  type RefObject,\n} from \"react\";\nimport { Spinner } from \"../spinner/spinner\";\n\n/** Imperative actions exposed by Base UI menu `actionsRef`. */\ninterface RootActions {\n  unmount: () => void;\n  close: () => void;\n}\n\ninterface MenuPendingContextValue {\n  /** True while a menu item promise is in flight. */\n  pending: boolean;\n  beginPending: () => void;\n  endPending: () => void;\n  /** Close the menu imperatively (used by async items on resolve). */\n  close: () => void;\n}\n\nconst MenuPendingContext = createContext<MenuPendingContextValue | null>(null);\n\n/**\n * Whether the surrounding menu has an async item promise in flight —\n * use it to disable sibling items while work is pending.\n * Returns `false` outside a `Menu.Root` / `ContextMenu.Root`.\n */\nexport function useMenuPending(): boolean {\n  return useContext(MenuPendingContext)?.pending ?? false;\n}\n\nexport function isThenable(value: unknown): value is Promise<unknown> {\n  return (\n    value != null && typeof (value as { then?: unknown }).then === \"function\"\n  );\n}\n\ntype PreventableMouseEvent = ReactMouseEvent<HTMLElement> & {\n  preventBaseUIHandler?: () => void;\n};\n\ntype RootWithPendingProps = {\n  onOpenChange?: (open: boolean, eventDetails: { cancel: () => void }) => void;\n  actionsRef?: RefObject<RootActions | null>;\n  children?: ReactNode;\n};\n\n/**\n * Wraps a Base UI menu root so async `Menu.Item` clicks can lock dismissal\n * (outside press, Escape) until the promise settles.\n */\nexport function withMenuPendingRoot<P extends RootWithPendingProps>(\n  BaseRoot: ComponentType<P>,\n): ComponentType<P> {\n  function PendingRoot({ onOpenChange, actionsRef, ...props }: P) {\n    const [pending, setPending] = useState(false);\n    // Guard reads a ref so a resolve → close() in the same tick isn't blocked\n    // by a not-yet-flushed state update.\n    const pendingRef = useRef(false);\n    const internalActionsRef = useRef<RootActions | null>(null);\n\n    useEffect(() => {\n      if (!actionsRef) return;\n      // Proxy so callers always hit the live Base UI actions, even if the\n      // popup remounts after this effect runs.\n      actionsRef.current = {\n        unmount: () => internalActionsRef.current?.unmount(),\n        close: () => internalActionsRef.current?.close(),\n      };\n      return () => {\n        actionsRef.current = null;\n      };\n    }, [actionsRef]);\n\n    const handleOpenChange = useCallback(\n      (open: boolean, eventDetails: { cancel: () => void }) => {\n        if (!open && pendingRef.current) {\n          eventDetails.cancel();\n          return;\n        }\n        onOpenChange?.(open, eventDetails);\n      },\n      [onOpenChange],\n    );\n\n    const contextValue = useMemo<MenuPendingContextValue>(\n      () => ({\n        pending,\n        beginPending: () => {\n          pendingRef.current = true;\n          setPending(true);\n        },\n        endPending: () => {\n          pendingRef.current = false;\n          setPending(false);\n        },\n        close: () => internalActionsRef.current?.close(),\n      }),\n      [pending],\n    );\n\n    return (\n      <MenuPendingContext.Provider value={contextValue}>\n        <BaseRoot\n          {...(props as P)}\n          actionsRef={internalActionsRef}\n          onOpenChange={handleOpenChange}\n        />\n      </MenuPendingContext.Provider>\n    );\n  }\n\n  return PendingRoot as ComponentType<P>;\n}\n\nexport type AsyncMenuItemClick = (\n  event: ReactMouseEvent<HTMLElement>,\n) => void | Promise<unknown>;\n\n/**\n * Shared click handler for `Menu.Item` / `ContextMenu.Item` promise support.\n * Returns whether the item should show its loading state.\n */\nexport function useAsyncMenuItem({\n  onClick,\n  closeOnClick = true,\n  loading = false,\n  disabled = false,\n}: {\n  onClick?: AsyncMenuItemClick;\n  closeOnClick?: boolean;\n  loading?: boolean;\n  disabled?: boolean;\n}) {\n  const pendingContext = useContext(MenuPendingContext);\n  const menuPending = pendingContext?.pending ?? false;\n  const [busy, setBusy] = useState(false);\n  const mountedRef = useRef(true);\n\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  const inert = busy || loading;\n  // Disable siblings while any item promise is in flight — not the busy item itself.\n  const blocked = disabled || (menuPending && !busy);\n\n  function handleClick(event: ReactMouseEvent<HTMLElement>) {\n    if (inert || (menuPending && !busy)) {\n      (event as PreventableMouseEvent).preventBaseUIHandler?.();\n      return;\n    }\n    const result = onClick?.(event);\n    if (!isThenable(result)) {\n      return;\n    }\n    // Stop Base UI's closeOnClick for this press; close on resolve instead.\n    (event as PreventableMouseEvent).preventBaseUIHandler?.();\n    setBusy(true);\n    pendingContext?.beginPending();\n    result.then(\n      () => {\n        pendingContext?.endPending();\n        if (mountedRef.current) setBusy(false);\n        if (closeOnClick) pendingContext?.close();\n      },\n      (error: unknown) => {\n        pendingContext?.endPending();\n        if (mountedRef.current) setBusy(false);\n        if (\n          typeof process !== \"undefined\" &&\n          process.env?.NODE_ENV !== \"production\"\n        ) {\n          console.error(\"Menu.Item: async onClick rejected —\", error);\n        }\n      },\n    );\n  }\n\n  return { inert, blocked, handleClick };\n}\n\n/** Menu-row spinner — keeps `data-menu-spinner` for the hide-siblings CSS. */\nexport function MenuItemSpinner() {\n  return <Spinner data-menu-spinner=\"\" size=\"md\" />;\n}\n","import {\n  type ComponentProps,\n  type ElementType,\n  type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { Menu as BaseMenu } from \"@base-ui/react/menu\";\nimport { Separator as BaseSeparator } from \"@base-ui/react/separator\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant, type VariantMap } from \"../../utils/resolve-variant\";\nimport {\n  MenuItemSpinner,\n  useAsyncMenuItem,\n  useMenuPending,\n  withMenuPendingRoot,\n  type AsyncMenuItemClick,\n} from \"./menu-pending\";\n\nexport { useMenuPending };\n\n/** Override Base UI's `string | (state) => string` className with plain string. */\ntype StyledProps<T extends ElementType> = Omit<\n  ComponentProps<T>,\n  \"className\" | \"color\"\n> & {\n  className?: string;\n};\n\n/** Shared popup + item styles, reused by `ContextMenu` and `Menubar` menus. */\n// Floating layer: keeps its elevation shadow, sits on the primary surface\n// with the site's hairline (ring-pho-secondary, #eee/#202020) as its edge.\n// `base` radius + p-1.5 inset — the highlight floats 6px clear of the edge.\nexport const MENU_POPUP =\n  \"bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-secondary origin-[var(--transform-origin)] min-w-44 rounded-base p-1.5 ring-1 ring-inset outline-none transition-[transform,opacity] duration-150 ease-out data-[starting-style]:scale-95 data-[starting-style]:opacity-0 data-[ending-style]:scale-95 data-[ending-style]:opacity-0\";\n// Rest at secondary; highlighted lifts to primary with the quiet ghost wash.\n// Icons use `text-current` so they follow the row ink (including destructive).\n// While loading, the spinner is first; hide the rest of the leading icons.\n// Concentric correction (see /scale): row radius = popup radius − popup\n// padding (base − 6px). py-2 + 20px line-height lands the 36px row height.\nexport const MENU_ITEM =\n  \"relative flex cursor-pointer items-center gap-2 rounded-[calc(var(--radius-base)-6px)] py-2 pr-2.5 pl-2.5 text-base text-pho-secondary outline-none select-none data-[highlighted]:bg-pho-ghost-hover data-[highlighted]:text-pho-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-loading:data-[disabled]:opacity-100 data-loading:[&>svg:not([data-menu-spinner])]:hidden [&>svg]:size-4 [&>svg]:text-current\";\n\n/** Semantic ink for `Menu.Item` / `LinkItem` / `ContextMenu.Item`. */\nexport const MENU_ITEM_COLORS = {\n  default: { classes: \"\", description: \"Secondary → primary on highlight\" },\n  destructive: {\n    classes:\n      \"text-pho-error data-[highlighted]:bg-pho-error-primary data-[highlighted]:text-pho-error\",\n    description: \"Error ink + error wash on highlight\",\n  },\n} satisfies VariantMap;\n\nexport type MenuItemColor = keyof typeof MENU_ITEM_COLORS;\n\ntype ItemColorProps = {\n  /** Semantic ink. @default \"default\" */\n  color?: MenuItemColor;\n};\n\nexport type MenuItemProps = Omit<StyledProps<typeof BaseMenu.Item>, \"onClick\"> &\n  ItemColorProps & {\n    /**\n     * Action handler. Return a promise to keep the menu open while it runs:\n     * the item shows a spinner, dismissal is locked, and the menu closes when\n     * the promise resolves (if `closeOnClick`). On rejection the menu stays\n     * open — surface errors inside the handler.\n     */\n    onClick?: AsyncMenuItemClick;\n    /**\n     * Declarative loading state (same visual as an in-flight promise).\n     * @default false\n     */\n    loading?: boolean;\n  };\n\nconst Root = withMenuPendingRoot(BaseMenu.Root);\nconst Trigger = BaseMenu.Trigger;\nconst Portal = BaseMenu.Portal;\nconst Group = BaseMenu.Group;\nconst RadioGroup = BaseMenu.RadioGroup;\n// Don't wrap SubmenuRoot — nested pending context would shadow the parent\n// Root and fail to lock dismissal for async items inside a submenu.\nconst SubmenuRoot = BaseMenu.SubmenuRoot;\n\nfunction Positioner({\n  className,\n  sideOffset = 6,\n  ...props\n}: StyledProps<typeof BaseMenu.Positioner>) {\n  return (\n    <BaseMenu.Positioner\n      sideOffset={sideOffset}\n      className={cn(\"z-50\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({ className, ...props }: StyledProps<typeof BaseMenu.Popup>) {\n  return <BaseMenu.Popup className={cn(MENU_POPUP, className)} {...props} />;\n}\n\nfunction Item({\n  className,\n  color = \"default\",\n  onClick,\n  closeOnClick = true,\n  loading = false,\n  disabled = false,\n  children,\n  ...props\n}: MenuItemProps) {\n  const { inert, blocked, handleClick } = useAsyncMenuItem({\n    onClick,\n    closeOnClick,\n    loading,\n    disabled,\n  });\n\n  return (\n    <BaseMenu.Item\n      className={cn(\n        MENU_ITEM,\n        resolveVariant(MENU_ITEM_COLORS, color),\n        className,\n      )}\n      closeOnClick={closeOnClick}\n      disabled={blocked}\n      data-loading={inert || undefined}\n      aria-busy={inert || undefined}\n      onClick={handleClick as (event: ReactMouseEvent<HTMLElement>) => void}\n      {...props}\n    >\n      {inert ? (\n        <>\n          <MenuItemSpinner />\n          <output className=\"sr-only\" aria-live=\"polite\" />\n        </>\n      ) : null}\n      {children}\n    </BaseMenu.Item>\n  );\n}\n\nfunction LinkItem({\n  className,\n  color = \"default\",\n  ...props\n}: StyledProps<typeof BaseMenu.LinkItem> & ItemColorProps) {\n  return (\n    <BaseMenu.LinkItem\n      className={cn(\n        MENU_ITEM,\n        resolveVariant(MENU_ITEM_COLORS, color),\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction GroupLabel({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.GroupLabel>) {\n  return (\n    <BaseMenu.GroupLabel\n      className={cn(\n        \"text-pho-secondary px-2.5 py-1.5 text-xs font-medium\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Separator({ className, ...props }: StyledProps<typeof BaseSeparator>) {\n  return (\n    <BaseSeparator\n      className={cn(\n        \"-mx-1.5 my-1.5 h-px bg-[var(--border-color-pho-secondary)]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction SubmenuTrigger({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.SubmenuTrigger>) {\n  return (\n    <BaseMenu.SubmenuTrigger\n      className={cn(\n        MENU_ITEM,\n        \"data-[popup-open]:bg-pho-ghost-hover\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction CheckboxItem({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.CheckboxItem>) {\n  return (\n    <BaseMenu.CheckboxItem\n      className={cn(MENU_ITEM, \"pl-8\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction RadioItem({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.RadioItem>) {\n  return (\n    <BaseMenu.RadioItem\n      className={cn(MENU_ITEM, \"pl-8\", className)}\n      {...props}\n    />\n  );\n}\n\nconst CHECK_INDICATOR =\n  \"text-pho-brand absolute left-2.5 flex items-center [&>svg]:size-4\";\n\nfunction CheckboxItemIndicator({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.CheckboxItemIndicator>) {\n  return (\n    <BaseMenu.CheckboxItemIndicator\n      className={cn(CHECK_INDICATOR, className)}\n      {...props}\n    />\n  );\n}\n\nfunction RadioItemIndicator({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.RadioItemIndicator>) {\n  return (\n    <BaseMenu.RadioItemIndicator\n      className={cn(CHECK_INDICATOR, className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Dropdown menu built on Base UI `Menu` — a list of actions opened from a\n * trigger. Supports grouped items, separators, submenus\n * (`SubmenuRoot` + `SubmenuTrigger`), and stateful `CheckboxItem` /\n * `RadioItem`s. `Menu.Item` has native promise support (spinner + locked\n * dismissal while pending). For a right-click menu use `ContextMenu`.\n */\nexport const Menu = {\n  Root,\n  Trigger,\n  Portal,\n  Positioner,\n  Popup,\n  Item,\n  LinkItem,\n  Group,\n  GroupLabel,\n  Separator,\n  SubmenuRoot,\n  SubmenuTrigger,\n  CheckboxItem,\n  CheckboxItemIndicator,\n  RadioGroup,\n  RadioItem,\n  RadioItemIndicator,\n};\n"],"mappings":"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"}
+{"version":3,"file":"menu-BSXds3Rt.js","names":[],"sources":["../../src/components/menu/menu-pending.tsx","../../src/components/menu/menu.tsx"],"sourcesContent":["import {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ComponentType,\n  type MouseEvent as ReactMouseEvent,\n  type ReactNode,\n  type RefObject,\n} from \"react\";\nimport { Spinner } from \"../spinner/spinner\";\n\n/** Imperative actions exposed by Base UI menu `actionsRef`. */\ninterface RootActions {\n  unmount: () => void;\n  close: () => void;\n}\n\ninterface MenuPendingContextValue {\n  /** True while a menu item promise is in flight. */\n  pending: boolean;\n  beginPending: () => void;\n  endPending: () => void;\n  /** Close the menu imperatively (used by async items on resolve). */\n  close: () => void;\n}\n\nconst MenuPendingContext = createContext<MenuPendingContextValue | null>(null);\n\n/**\n * Whether the surrounding menu has an async item promise in flight —\n * use it to disable sibling items while work is pending.\n * Returns `false` outside a `Menu.Root` / `ContextMenu.Root`.\n */\nexport function useMenuPending(): boolean {\n  return useContext(MenuPendingContext)?.pending ?? false;\n}\n\nexport function isThenable(value: unknown): value is Promise<unknown> {\n  return (\n    value != null && typeof (value as { then?: unknown }).then === \"function\"\n  );\n}\n\ntype PreventableMouseEvent = ReactMouseEvent<HTMLElement> & {\n  preventBaseUIHandler?: () => void;\n};\n\ntype RootWithPendingProps = {\n  onOpenChange?: (open: boolean, eventDetails: { cancel: () => void }) => void;\n  actionsRef?: RefObject<RootActions | null>;\n  children?: ReactNode;\n};\n\n/**\n * Wraps a Base UI menu root so async `Menu.Item` clicks can lock dismissal\n * (outside press, Escape) until the promise settles.\n */\nexport function withMenuPendingRoot<P extends RootWithPendingProps>(\n  BaseRoot: ComponentType<P>,\n): ComponentType<P> {\n  function PendingRoot({ onOpenChange, actionsRef, ...props }: P) {\n    const [pending, setPending] = useState(false);\n    // Guard reads a ref so a resolve → close() in the same tick isn't blocked\n    // by a not-yet-flushed state update.\n    const pendingRef = useRef(false);\n    const internalActionsRef = useRef<RootActions | null>(null);\n\n    useEffect(() => {\n      if (!actionsRef) return;\n      // Proxy so callers always hit the live Base UI actions, even if the\n      // popup remounts after this effect runs.\n      actionsRef.current = {\n        unmount: () => internalActionsRef.current?.unmount(),\n        close: () => internalActionsRef.current?.close(),\n      };\n      return () => {\n        actionsRef.current = null;\n      };\n    }, [actionsRef]);\n\n    const handleOpenChange = useCallback(\n      (open: boolean, eventDetails: { cancel: () => void }) => {\n        if (!open && pendingRef.current) {\n          eventDetails.cancel();\n          return;\n        }\n        onOpenChange?.(open, eventDetails);\n      },\n      [onOpenChange],\n    );\n\n    const contextValue = useMemo<MenuPendingContextValue>(\n      () => ({\n        pending,\n        beginPending: () => {\n          pendingRef.current = true;\n          setPending(true);\n        },\n        endPending: () => {\n          pendingRef.current = false;\n          setPending(false);\n        },\n        close: () => internalActionsRef.current?.close(),\n      }),\n      [pending],\n    );\n\n    return (\n      <MenuPendingContext.Provider value={contextValue}>\n        <BaseRoot\n          {...(props as P)}\n          actionsRef={internalActionsRef}\n          onOpenChange={handleOpenChange}\n        />\n      </MenuPendingContext.Provider>\n    );\n  }\n\n  return PendingRoot as ComponentType<P>;\n}\n\nexport type AsyncMenuItemClick = (\n  event: ReactMouseEvent<HTMLElement>,\n) => void | Promise<unknown>;\n\n/**\n * Shared click handler for `Menu.Item` / `ContextMenu.Item` promise support.\n * Returns whether the item should show its loading state.\n */\nexport function useAsyncMenuItem({\n  onClick,\n  closeOnClick = true,\n  loading = false,\n  disabled = false,\n}: {\n  onClick?: AsyncMenuItemClick;\n  closeOnClick?: boolean;\n  loading?: boolean;\n  disabled?: boolean;\n}) {\n  const pendingContext = useContext(MenuPendingContext);\n  const menuPending = pendingContext?.pending ?? false;\n  const [busy, setBusy] = useState(false);\n  const mountedRef = useRef(true);\n\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  const inert = busy || loading;\n  // Disable siblings while any item promise is in flight — not the busy item itself.\n  const blocked = disabled || (menuPending && !busy);\n\n  function handleClick(event: ReactMouseEvent<HTMLElement>) {\n    if (inert || (menuPending && !busy)) {\n      (event as PreventableMouseEvent).preventBaseUIHandler?.();\n      return;\n    }\n    const result = onClick?.(event);\n    if (!isThenable(result)) {\n      return;\n    }\n    // Stop Base UI's closeOnClick for this press; close on resolve instead.\n    (event as PreventableMouseEvent).preventBaseUIHandler?.();\n    setBusy(true);\n    pendingContext?.beginPending();\n    result.then(\n      () => {\n        pendingContext?.endPending();\n        if (mountedRef.current) setBusy(false);\n        if (closeOnClick) pendingContext?.close();\n      },\n      (error: unknown) => {\n        pendingContext?.endPending();\n        if (mountedRef.current) setBusy(false);\n        if (\n          typeof process !== \"undefined\" &&\n          process.env?.NODE_ENV !== \"production\"\n        ) {\n          console.error(\"Menu.Item: async onClick rejected —\", error);\n        }\n      },\n    );\n  }\n\n  return { inert, blocked, handleClick };\n}\n\n/** Menu-row spinner — keeps `data-menu-spinner` for the hide-siblings CSS. */\nexport function MenuItemSpinner() {\n  return <Spinner data-menu-spinner=\"\" size=\"md\" />;\n}\n","import {\n  type ComponentProps,\n  type ElementType,\n  type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { Menu as BaseMenu } from \"@base-ui/react/menu\";\nimport { Separator as BaseSeparator } from \"@base-ui/react/separator\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant, type VariantMap } from \"../../utils/resolve-variant\";\nimport {\n  MenuItemSpinner,\n  useAsyncMenuItem,\n  useMenuPending,\n  withMenuPendingRoot,\n  type AsyncMenuItemClick,\n} from \"./menu-pending\";\n\nexport { useMenuPending };\n\n/** Override Base UI's `string | (state) => string` className with plain string. */\ntype StyledProps<T extends ElementType> = Omit<\n  ComponentProps<T>,\n  \"className\" | \"color\"\n> & {\n  className?: string;\n};\n\n/** Shared popup + item styles, reused by `ContextMenu` and `Menubar` menus. */\n// Floating layer: keeps its elevation shadow, sits on the primary surface\n// with the site's hairline (ring-pho-secondary, #eee/#202020) as its edge.\n// `base` radius + p-1.5 inset — the highlight floats 6px clear of the edge.\nexport const MENU_POPUP =\n  \"bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-secondary origin-[var(--transform-origin)] min-w-44 rounded-base p-1.5 ring-1 ring-inset outline-none transition-[transform,opacity] duration-150 ease-out data-[starting-style]:scale-95 data-[starting-style]:opacity-0 data-[ending-style]:scale-95 data-[ending-style]:opacity-0\";\n// Rest at secondary; highlighted lifts to primary with the quiet ghost wash.\n// Icons use `text-current` so they follow the row ink (including destructive).\n// While loading, the spinner is first; hide the rest of the leading icons.\n// Concentric correction (see /scale): row radius = popup radius − popup\n// padding (base − 6px). py-2 + 20px line-height lands the 36px row height.\nexport const MENU_ITEM =\n  \"relative flex cursor-pointer items-center gap-2 rounded-[calc(var(--radius-base)-6px)] py-2 pr-2.5 pl-2.5 text-base text-pho-secondary outline-none select-none data-[highlighted]:bg-pho-ghost-hover data-[highlighted]:text-pho-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-loading:data-[disabled]:opacity-100 data-loading:[&>svg:not([data-menu-spinner])]:hidden [&>svg]:size-4 [&>svg]:text-current\";\n\n/** Semantic ink for `Menu.Item` / `LinkItem` / `ContextMenu.Item`. */\nexport const MENU_ITEM_COLORS = {\n  default: { classes: \"\", description: \"Secondary → primary on highlight\" },\n  destructive: {\n    classes:\n      \"text-pho-error data-[highlighted]:bg-pho-error-primary data-[highlighted]:text-pho-error\",\n    description: \"Error ink + error wash on highlight\",\n  },\n} satisfies VariantMap;\n\nexport type MenuItemColor = keyof typeof MENU_ITEM_COLORS;\n\ntype ItemColorProps = {\n  /** Semantic ink. @default \"default\" */\n  color?: MenuItemColor;\n};\n\nexport type MenuItemProps = Omit<StyledProps<typeof BaseMenu.Item>, \"onClick\"> &\n  ItemColorProps & {\n    /**\n     * Action handler. Return a promise to keep the menu open while it runs:\n     * the item shows a spinner, dismissal is locked, and the menu closes when\n     * the promise resolves (if `closeOnClick`). On rejection the menu stays\n     * open — surface errors inside the handler.\n     */\n    onClick?: AsyncMenuItemClick;\n    /**\n     * Declarative loading state (same visual as an in-flight promise).\n     * @default false\n     */\n    loading?: boolean;\n  };\n\nconst Root = withMenuPendingRoot(BaseMenu.Root);\nconst Trigger = BaseMenu.Trigger;\nconst Portal = BaseMenu.Portal;\nconst Group = BaseMenu.Group;\nconst RadioGroup = BaseMenu.RadioGroup;\n// Don't wrap SubmenuRoot — nested pending context would shadow the parent\n// Root and fail to lock dismissal for async items inside a submenu.\nconst SubmenuRoot = BaseMenu.SubmenuRoot;\n\nfunction Positioner({\n  className,\n  sideOffset = 6,\n  ...props\n}: StyledProps<typeof BaseMenu.Positioner>) {\n  return (\n    <BaseMenu.Positioner\n      sideOffset={sideOffset}\n      className={cn(\"z-50\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({ className, ...props }: StyledProps<typeof BaseMenu.Popup>) {\n  return <BaseMenu.Popup className={cn(MENU_POPUP, className)} {...props} />;\n}\n\nfunction Item({\n  className,\n  color = \"default\",\n  onClick,\n  closeOnClick = true,\n  loading = false,\n  disabled = false,\n  children,\n  ...props\n}: MenuItemProps) {\n  const { inert, blocked, handleClick } = useAsyncMenuItem({\n    onClick,\n    closeOnClick,\n    loading,\n    disabled,\n  });\n\n  return (\n    <BaseMenu.Item\n      className={cn(\n        MENU_ITEM,\n        resolveVariant(MENU_ITEM_COLORS, color),\n        className,\n      )}\n      closeOnClick={closeOnClick}\n      disabled={blocked}\n      data-loading={inert || undefined}\n      aria-busy={inert || undefined}\n      onClick={handleClick as (event: ReactMouseEvent<HTMLElement>) => void}\n      {...props}\n    >\n      {inert ? (\n        <>\n          <MenuItemSpinner />\n          <output className=\"sr-only\" aria-live=\"polite\" />\n        </>\n      ) : null}\n      {children}\n    </BaseMenu.Item>\n  );\n}\n\nfunction LinkItem({\n  className,\n  color = \"default\",\n  ...props\n}: StyledProps<typeof BaseMenu.LinkItem> & ItemColorProps) {\n  return (\n    <BaseMenu.LinkItem\n      className={cn(\n        MENU_ITEM,\n        resolveVariant(MENU_ITEM_COLORS, color),\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction GroupLabel({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.GroupLabel>) {\n  return (\n    <BaseMenu.GroupLabel\n      className={cn(\n        \"text-pho-secondary px-2.5 py-1.5 text-xs font-medium\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Separator({ className, ...props }: StyledProps<typeof BaseSeparator>) {\n  return (\n    <BaseSeparator\n      className={cn(\n        \"-mx-1.5 my-1.5 h-px bg-[var(--border-color-pho-secondary)]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction SubmenuTrigger({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.SubmenuTrigger>) {\n  return (\n    <BaseMenu.SubmenuTrigger\n      className={cn(\n        MENU_ITEM,\n        \"data-[popup-open]:bg-pho-ghost-hover\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction CheckboxItem({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.CheckboxItem>) {\n  return (\n    <BaseMenu.CheckboxItem\n      className={cn(MENU_ITEM, \"pl-8\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction RadioItem({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.RadioItem>) {\n  return (\n    <BaseMenu.RadioItem\n      className={cn(MENU_ITEM, \"pl-8\", className)}\n      {...props}\n    />\n  );\n}\n\nconst CHECK_INDICATOR =\n  \"text-pho-brand absolute left-2.5 flex items-center [&>svg]:size-4\";\n\nfunction CheckboxItemIndicator({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.CheckboxItemIndicator>) {\n  return (\n    <BaseMenu.CheckboxItemIndicator\n      className={cn(CHECK_INDICATOR, className)}\n      {...props}\n    />\n  );\n}\n\nfunction RadioItemIndicator({\n  className,\n  ...props\n}: StyledProps<typeof BaseMenu.RadioItemIndicator>) {\n  return (\n    <BaseMenu.RadioItemIndicator\n      className={cn(CHECK_INDICATOR, className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Dropdown menu built on Base UI `Menu` — a list of actions opened from a\n * trigger. Supports grouped items, separators, submenus\n * (`SubmenuRoot` + `SubmenuTrigger`), and stateful `CheckboxItem` /\n * `RadioItem`s. `Menu.Item` has native promise support (spinner + locked\n * dismissal while pending). For a right-click menu use `ContextMenu`.\n */\nexport const Menu = {\n  Root,\n  Trigger,\n  Portal,\n  Positioner,\n  Popup,\n  Item,\n  LinkItem,\n  Group,\n  GroupLabel,\n  Separator,\n  SubmenuRoot,\n  SubmenuTrigger,\n  CheckboxItem,\n  CheckboxItemIndicator,\n  RadioGroup,\n  RadioItem,\n  RadioItemIndicator,\n};\n"],"mappings":"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"}

package/dist/chunks/settings-B0vhLoMi.js

@@ -0,0 +1,134 @@
+"use client";
+import { t as r } from "./cn-DTiB6ek_.js";
+import "react";
+import { jsx as a, jsxs as s } from "react/jsx-runtime";
+var p = "divide-y divide-pho-secondary rounded-base border border-pho-secondary bg-pho-primary", c = "flex flex-col gap-3 rounded-base border border-pho-secondary bg-pho-page p-5", m = "flex min-h-[4.25rem] flex-col gap-3 px-5 py-4 sm:flex-row sm:items-center sm:justify-between sm:gap-6";
+function x({ className: e, ...t }) {
+  return /* @__PURE__ */ a("div", {
+    className: r("mx-auto w-full max-w-2xl py-12", e),
+    ...t
+  });
+}
+function u({ className: e, children: t, ...n }) {
+  return /* @__PURE__ */ a("h1", {
+    className: r("text-display-base text-pho-primary px-5 font-medium", e),
+    ...n,
+    children: t
+  });
+}
+function d({ className: e, ...t }) {
+  return /* @__PURE__ */ a("div", {
+    className: r("mt-6 flex flex-col gap-10", "*:flex *:flex-col *:gap-3", e),
+    ...t
+  });
+}
+function f({ className: e, ...t }) {
+  return /* @__PURE__ */ a("div", {
+    className: r("flex flex-col gap-0.5", e),
+    ...t
+  });
+}
+function h({ className: e, children: t, ...n }) {
+  return /* @__PURE__ */ a("h2", {
+    className: r("text-display-xs text-pho-primary px-5 font-medium", e),
+    ...n,
+    children: t
+  });
+}
+function N({ className: e, ...t }) {
+  return /* @__PURE__ */ a("p", {
+    className: r("text-display-xs text-pho-description px-5 font-normal", e),
+    ...t
+  });
+}
+function y({ className: e, ...t }) {
+  return /* @__PURE__ */ a("div", {
+    className: r(p, e),
+    ...t
+  });
+}
+function b({ className: e, ...t }) {
+  return /* @__PURE__ */ a("div", {
+    className: r(c, e),
+    ...t
+  });
+}
+function v({ className: e, children: t, ...n }) {
+  return /* @__PURE__ */ a("h2", {
+    className: r("text-display-xs text-pho-primary font-medium", e),
+    ...n,
+    children: t
+  });
+}
+function g({ className: e, ...t }) {
+  return /* @__PURE__ */ a("p", {
+    className: r("text-display-xs text-pho-description font-normal", e),
+    ...t
+  });
+}
+function w({ label: e, description: t, htmlFor: n, className: o, children: i, ...l }) {
+  return /* @__PURE__ */ s("div", {
+    className: r(m, o),
+    ...l,
+    children: [/* @__PURE__ */ s("div", {
+      className: "min-w-0",
+      children: [n ? /* @__PURE__ */ a("label", {
+        htmlFor: n,
+        className: "text-pho-primary block text-base font-normal",
+        children: e
+      }) : /* @__PURE__ */ a("p", {
+        className: "text-pho-primary text-base font-normal",
+        children: e
+      }), t ? /* @__PURE__ */ a("p", {
+        className: "text-pho-description mt-0.5 text-xs",
+        children: t
+      }) : null]
+    }), /* @__PURE__ */ a("div", {
+      className: "flex w-full min-w-0 items-center gap-2 sm:w-auto",
+      children: i
+    })]
+  });
+}
+function T({ className: e, ...t }) {
+  return /* @__PURE__ */ a("p", {
+    className: r("text-pho-description truncate text-base", e),
+    ...t
+  });
+}
+function S({ className: e, ...t }) {
+  return /* @__PURE__ */ a("p", {
+    role: "alert",
+    className: r("text-pho-error px-5 pb-3 text-xs", e),
+    ...t
+  });
+}
+function C({ className: e, ...t }) {
+  return /* @__PURE__ */ a("div", {
+    className: r("flex items-center justify-between gap-6 px-5 py-4", e),
+    ...t
+  });
+}
+var E = {
+  Page: x,
+  PageTitle: u,
+  Stack: d,
+  Header: f,
+  SectionTitle: h,
+  Description: N,
+  Card: y,
+  Callout: b,
+  CalloutTitle: v,
+  CalloutDescription: g,
+  Row: w,
+  Value: T,
+  Alert: S,
+  Footer: C
+};
+export {
+  E as i,
+  p as n,
+  m as r,
+  c as t
+};
+
+//# sourceMappingURL=settings-B0vhLoMi.js.map

package/dist/chunks/settings-B0vhLoMi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings-B0vhLoMi.js","names":[],"sources":["../../src/sections/settings/settings.tsx"],"sourcesContent":["import { type ComponentProps, type ReactNode, type Ref } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Settings — Pho's settings-page section: a page title, section titles, and\n * bordered cards of label/control rows.\n *\n * Spacing: wrap the page in `Page` (`max-w-2xl`, vertical padding). `Stack`\n * separates blocks (`gap-10`). Inside a block, children share `gap-3`. Wrap a\n * section title + description in `Header` (`gap-0.5`) so that pair stays tight\n * — don't put them as loose siblings. Parts already carry `px-5`.\n */\n\n/* ------------------------------- class map ------------------------------- */\n\n/** Bordered card that stacks rows with hairline dividers. */\nexport const SETTINGS_CARD =\n  \"divide-y divide-pho-secondary rounded-base border border-pho-secondary bg-pho-primary\";\n\n/**\n * Standalone callout surface — featured block (invite form, notice, etc.).\n * Don't wrap in `Card`; this is the outer chrome.\n */\nexport const SETTINGS_CALLOUT =\n  \"flex flex-col gap-3 rounded-base border border-pho-secondary bg-pho-page p-5\";\n\n/**\n * One settings row — label (+ optional description) left, control right.\n * `min-h-[4.25rem]` (68px) keeps avatar/control rows from collapsing shorter\n * than a comfortable touch target.\n */\nexport const SETTINGS_ROW =\n  \"flex min-h-[4.25rem] flex-col gap-3 px-5 py-4 sm:flex-row sm:items-center sm:justify-between sm:gap-6\";\n\n/* --------------------------------- parts --------------------------------- */\n\n/**\n * Page chrome — centered column at the settings content width. Hosts\n * `PageTitle` + `Stack` (and any route-level siblings). Prefer this over\n * ad-hoc `max-w-*` wrappers in the app shell.\n */\nfunction Page({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div\n      className={cn(\"mx-auto w-full max-w-2xl py-12\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Page title — largest heading on the surface. */\nfunction PageTitle({\n  className,\n  children,\n  ...props\n}: ComponentProps<\"h1\"> & { ref?: Ref<HTMLHeadingElement> }) {\n  return (\n    <h1\n      className={cn(\n        \"text-display-base text-pho-primary px-5 font-medium\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </h1>\n  );\n}\n\n/**\n * Vertical stack under the page title. Blocks (forms / sections) use `gap-10`;\n * each block lays out its children with `gap-3`.\n */\nfunction Stack({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div\n      className={cn(\n        \"mt-6 flex flex-col gap-10\",\n        \"*:flex *:flex-col *:gap-3\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Title + optional description pair. Keeps that couple tight (`gap-0.5`) so\n * the block's `gap-3` only applies between this header and the card.\n */\nfunction Header({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return <div className={cn(\"flex flex-col gap-0.5\", className)} {...props} />;\n}\n\n/** Section heading — same padding as the page title, smaller type. */\nfunction SectionTitle({\n  className,\n  children,\n  ...props\n}: ComponentProps<\"h2\"> & { ref?: Ref<HTMLHeadingElement> }) {\n  return (\n    <h2\n      className={cn(\n        \"text-display-xs text-pho-primary px-5 font-medium\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </h2>\n  );\n}\n\n/**\n * Supporting copy under a section title. Same display step as the title;\n * color + normal weight keep it secondary. Always wrap with `Header`.\n */\nfunction Description({\n  className,\n  ...props\n}: ComponentProps<\"p\"> & { ref?: Ref<HTMLParagraphElement> }) {\n  return (\n    <p\n      className={cn(\n        \"text-display-xs text-pho-description px-5 font-normal\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Bordered card that stacks settings rows with hairline dividers. */\nfunction Card({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return <div className={cn(SETTINGS_CARD, className)} {...props} />;\n}\n\n/**\n * Standalone callout. Pair with `CalloutTitle` / `CalloutDescription` (and\n * optional actions) for a featured block — e.g. an invite form. Do not wrap\n * in `Card`; this is already the outer surface.\n */\nfunction Callout({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return <div className={cn(SETTINGS_CALLOUT, className)} {...props} />;\n}\n\n/** Callout heading — same type as `SectionTitle`. */\nfunction CalloutTitle({\n  className,\n  children,\n  ...props\n}: ComponentProps<\"h2\"> & { ref?: Ref<HTMLHeadingElement> }) {\n  return (\n    <h2\n      className={cn(\"text-display-xs text-pho-primary font-medium\", className)}\n      {...props}\n    >\n      {children}\n    </h2>\n  );\n}\n\n/** Supporting copy under a callout title. */\nfunction CalloutDescription({\n  className,\n  ...props\n}: ComponentProps<\"p\"> & { ref?: Ref<HTMLParagraphElement> }) {\n  return (\n    <p\n      className={cn(\n        \"text-display-xs text-pho-description font-normal\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport interface SettingsRowProps extends Omit<ComponentProps<\"div\">, \"title\"> {\n  /** Left-side field name. */\n  label: string;\n  /** Optional helper under the label. */\n  description?: ReactNode;\n  /** Associates the label with a control id. When omitted, the label is not a `<label>`. */\n  htmlFor?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * One settings row: label (+ optional description) left, control right.\n * Pass `htmlFor` when the row wraps a labelled input; omit it for display/\n * action rows (avatar, danger-zone delete).\n */\nfunction Row({\n  label,\n  description,\n  htmlFor,\n  className,\n  children,\n  ...props\n}: SettingsRowProps) {\n  return (\n    <div className={cn(SETTINGS_ROW, className)} {...props}>\n      <div className=\"min-w-0\">\n        {htmlFor ? (\n          <label\n            htmlFor={htmlFor}\n            className=\"text-pho-primary block text-base font-normal\"\n          >\n            {label}\n          </label>\n        ) : (\n          <p className=\"text-pho-primary text-base font-normal\">{label}</p>\n        )}\n        {description ? (\n          <p className=\"text-pho-description mt-0.5 text-xs\">{description}</p>\n        ) : null}\n      </div>\n      <div className=\"flex w-full min-w-0 items-center gap-2 sm:w-auto\">\n        {children}\n      </div>\n    </div>\n  );\n}\n\n/** Read-only value on the right side of a row (email, etc.). */\nfunction Value({\n  className,\n  ...props\n}: ComponentProps<\"p\"> & { ref?: Ref<HTMLParagraphElement> }) {\n  return (\n    <p\n      className={cn(\"text-pho-description truncate text-base\", className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Inline error under a row (still inside the card). Matches card horizontal\n * padding so hosts don't re-apply `px-5`.\n */\nfunction Alert({\n  className,\n  ...props\n}: ComponentProps<\"p\"> & { ref?: Ref<HTMLParagraphElement> }) {\n  return (\n    <p\n      role=\"alert\"\n      className={cn(\"text-pho-error px-5 pb-3 text-xs\", className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Trailing bar inside a card — typically a save status + submit button that\n * appears after the form is dirty. Same horizontal/vertical padding as a row.\n */\nfunction Footer({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div\n      className={cn(\n        \"flex items-center justify-between gap-6 px-5 py-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/* -------------------------------- assembly ------------------------------- */\n\n/**\n * Settings page layout. One stack, one gap rhythm — only title scale differs:\n *\n * ```tsx\n * <Settings.Page>\n *   <Settings.PageTitle>Profile</Settings.PageTitle>\n *   <Settings.Stack>\n *     <form>\n *       <Settings.Card>\n *         <Settings.Row label=\"Name\" htmlFor=\"first-name\">\n *           <Input id=\"first-name\" size=\"sm\" />\n *         </Settings.Row>\n *       </Settings.Card>\n *     </form>\n *     <form>\n *       <Settings.Header>\n *         <Settings.SectionTitle>Agent profile</Settings.SectionTitle>\n *         <Settings.Description>…</Settings.Description>\n *       </Settings.Header>\n *       <Settings.Card>…</Settings.Card>\n *     </form>\n *     <div>\n *       <Settings.SectionTitle>Danger zone</Settings.SectionTitle>\n *       <Settings.Card>\n *         <Settings.Row label=\"Delete account\" description=\"…\">\n *           <Button color=\"destructive\" size=\"sm\">Delete</Button>\n *         </Settings.Row>\n *       </Settings.Card>\n *     </div>\n *     <Settings.Callout>\n *       <Settings.Header>\n *         <Settings.CalloutTitle>Invitations</Settings.CalloutTitle>\n *         <Settings.CalloutDescription>…</Settings.CalloutDescription>\n *       </Settings.Header>\n *       …invite form…\n *     </Settings.Callout>\n *   </Settings.Stack>\n * </Settings.Page>\n * ```\n */\nexport const Settings = {\n  Page,\n  PageTitle,\n  Stack,\n  Header,\n  SectionTitle,\n  Description,\n  Card,\n  Callout,\n  CalloutTitle,\n  CalloutDescription,\n  Row,\n  Value,\n  Alert,\n  Footer,\n};\n"],"mappings":"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"}