@photon-ai/pho-ui 0.7.2 → 1.0.0

package/dist/components/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","names":["__iconNode"],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.44.0_react@19.2.7/node_modules/@tabler/icons-react/dist/esm/icons/IconCheck.mjs","../../../../node_modules/.pnpm/@tabler+icons-react@3.44.0_react@19.2.7/node_modules/@tabler/icons-react/dist/esm/icons/IconMinus.mjs","../../src/components/checkbox/checkbox.tsx","../../src/components/checkbox/checkbox-group.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\": \"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","/**\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 12l14 0\", \"key\": \"svg-0\" }]];\nconst IconMinus = createReactComponent(\"outline\", \"minus\", \"Minus\", __iconNode);\n\nexport { __iconNode, IconMinus as default };\n//# sourceMappingURL=IconMinus.mjs.map\n","import { type ComponentProps, type ReactNode } from \"react\";\nimport { Checkbox as BaseCheckbox } from \"@base-ui/react/checkbox\";\nimport { IconCheck, IconMinus } from \"@tabler/icons-react\";\nimport { cn } from \"../../utils/cn\";\n\nexport type CheckboxSize = \"sm\" | \"md\";\n\nconst BOX: Record<CheckboxSize, string> = { sm: \"size-4\", md: \"size-5\" };\nconst ICON: Record<CheckboxSize, string> = { sm: \"size-3\", md: \"size-3.5\" };\n\nexport interface CheckboxProps extends Omit<\n  ComponentProps<typeof BaseCheckbox.Root>,\n  \"className\"\n> {\n  className?: string;\n  /** Text rendered beside the box; the whole row toggles the checkbox. */\n  label?: ReactNode;\n  /** Size variant. @default \"md\" */\n  size?: CheckboxSize;\n}\n\n/**\n * Checkbox built on Base UI `Checkbox`. Supports checked, unchecked, and\n * `indeterminate` states; pass `label` for a clickable text row, or omit it\n * and provide an `aria-label`. For a set of related options that submit\n * together, wrap them in `CheckboxGroup`.\n */\nexport function Checkbox({\n  className,\n  label,\n  size = \"md\",\n  ...props\n}: CheckboxProps) {\n  const box = (\n    <BaseCheckbox.Root\n      className={cn(\n        // Flat field surface with the input-strength ring; the glyph only shows\n        // on the brand-solid checked fill, so it must be on-brand (not white —\n        // brand-solid is white in dark mode).\n        \"group/cb squircle outline-pho-brand bg-pho-primary ring-pho-primary text-pho-on-brand flex shrink-0 cursor-pointer items-center justify-center rounded-md ring-1 transition duration-100 ease-linear ring-inset focus-visible:outline-2 focus-visible:outline-offset-2\",\n        \"data-[checked]:bg-pho-brand-solid data-[checked]:ring-transparent\",\n        \"data-[indeterminate]:bg-pho-brand-solid data-[indeterminate]:ring-transparent\",\n        \"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n        BOX[size],\n        className,\n      )}\n      {...props}\n    >\n      <BaseCheckbox.Indicator className=\"flex items-center justify-center\">\n        <IconCheck\n          className={cn(ICON[size], \"group-data-[indeterminate]/cb:hidden\")}\n        />\n        <IconMinus\n          className={cn(\n            ICON[size],\n            \"hidden group-data-[indeterminate]/cb:block\",\n          )}\n        />\n      </BaseCheckbox.Indicator>\n    </BaseCheckbox.Root>\n  );\n\n  if (!label) return box;\n  return (\n    <label className=\"flex cursor-pointer items-center gap-2 select-none\">\n      {box}\n      <span className=\"text-pho-secondary text-sm\">{label}</span>\n    </label>\n  );\n}\n\nCheckbox.displayName = \"Checkbox\";\n","import { type ComponentProps } from \"react\";\nimport { CheckboxGroup as BaseCheckboxGroup } from \"@base-ui/react/checkbox-group\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface CheckboxGroupProps extends Omit<\n  ComponentProps<typeof BaseCheckboxGroup>,\n  \"className\"\n> {\n  className?: string;\n}\n\n/**\n * Groups related `Checkbox`es and tracks their values as one. Built on Base UI\n * `CheckboxGroup` — supports a parent \"select all\" checkbox via `allValues`.\n * Control with `value` / `onValueChange` or leave uncontrolled with\n * `defaultValue`.\n */\nexport function CheckboxGroup({ className, ...props }: CheckboxGroupProps) {\n  return (\n    <BaseCheckboxGroup\n      className={cn(\"flex flex-col gap-3\", className)}\n      {...props}\n    />\n  );\n}\n\nCheckboxGroup.displayName = \"CheckboxGroup\";\n"],"x_google_ignoreList":[0,1],"mappings":";;;;;;;AASA,IAAMA,IAAa,CAAC,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAoB,KAAO;AAAQ,CAAC,CAAC,GACnE,IAAY,EAAqB,WAAW,SAAS,SAASA,CAAU,GCDxE,IAAa,CAAC,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAc,KAAO;AAAQ,CAAC,CAAC,GAC7D,IAAY,EAAqB,WAAW,SAAS,SAAS,CAAU,GCHxE,IAAoC;AAAA,EAAE,IAAI;AAAA,EAAU,IAAI;AAAS,GACjE,IAAqC;AAAA,EAAE,IAAI;AAAA,EAAU,IAAI;AAAW;AAmB1E,SAAgB,EAAS,EACvB,WAAA,GACA,OAAA,GACA,MAAA,IAAO,MACP,GAAG,EAAA,GACa;AAChB,QAAM,IACJ,gBAAA,EAAC,EAAa,MAAd;AAAA,IACE,WAAW,EAIT,0QACA,qEACA,iFACA,iEACA,EAAI,CAAA,GACJ,CACF;AAAA,IACA,GAAI;AAAA,cAEJ,gBAAA,EAAC,EAAa,WAAd;AAAA,MAAwB,WAAU;AAAA,gBAAlC,CACE,gBAAA,EAAC,GAAD,EACE,WAAW,EAAG,EAAK,CAAA,GAAO,sCAAsC,EACjE,CAAA,GACD,gBAAA,EAAC,GAAD,EACE,WAAW,EACT,EAAK,CAAA,GACL,4CACF,EACD,CAAA,CACqB;AAAA;EACP,CAAA;AAGrB,SAAK,IAEH,gBAAA,EAAC,SAAD;AAAA,IAAO,WAAU;AAAA,cAAjB,CACG,GACD,gBAAA,EAAC,QAAD;AAAA,MAAM,WAAU;AAAA,gBAA8B;AAAA,IAAY,CAAA,CACrD;AAAA,OALU;AAOrB;AAEA,EAAS,cAAc;ACtDvB,SAAgB,EAAc,EAAE,WAAA,GAAW,GAAG,EAAA,GAA6B;AACzE,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,WAAW,EAAG,uBAAuB,CAAS;AAAA,IAC9C,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,EAAc,cAAc"}
+{"version":3,"file":"checkbox.js","names":["__iconNode"],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.44.0_react@19.2.7/node_modules/@tabler/icons-react/dist/esm/icons/IconCheck.mjs","../../../../node_modules/.pnpm/@tabler+icons-react@3.44.0_react@19.2.7/node_modules/@tabler/icons-react/dist/esm/icons/IconMinus.mjs","../../src/components/checkbox/checkbox.tsx","../../src/components/checkbox/checkbox-group.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\": \"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","/**\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 12l14 0\", \"key\": \"svg-0\" }]];\nconst IconMinus = createReactComponent(\"outline\", \"minus\", \"Minus\", __iconNode);\n\nexport { __iconNode, IconMinus as default };\n//# sourceMappingURL=IconMinus.mjs.map\n","import { type ComponentProps, type ReactNode } from \"react\";\nimport { Checkbox as BaseCheckbox } from \"@base-ui/react/checkbox\";\nimport { IconCheck, IconMinus } from \"@tabler/icons-react\";\nimport { cn } from \"../../utils/cn\";\n\nexport type CheckboxSize = \"sm\" | \"md\";\n\nconst BOX: Record<CheckboxSize, string> = { sm: \"size-4\", md: \"size-5\" };\nconst ICON: Record<CheckboxSize, string> = { sm: \"size-3\", md: \"size-3.5\" };\n\nexport interface CheckboxProps extends Omit<\n  ComponentProps<typeof BaseCheckbox.Root>,\n  \"className\"\n> {\n  className?: string;\n  /** Text rendered beside the box; the whole row toggles the checkbox. */\n  label?: ReactNode;\n  /** Size variant. @default \"md\" */\n  size?: CheckboxSize;\n}\n\n/**\n * Checkbox built on Base UI `Checkbox`. Supports checked, unchecked, and\n * `indeterminate` states; pass `label` for a clickable text row, or omit it\n * and provide an `aria-label`. For a set of related options that submit\n * together, wrap them in `CheckboxGroup`.\n */\nexport function Checkbox({\n  className,\n  label,\n  size = \"md\",\n  ...props\n}: CheckboxProps) {\n  const box = (\n    <BaseCheckbox.Root\n      className={cn(\n        // Flat field surface with the input-strength ring; the glyph only shows\n        // on the brand-solid checked fill, so it must be on-brand (not white —\n        // brand-solid is white in dark mode).\n        \"group/cb outline-pho-brand bg-pho-primary ring-pho-primary text-pho-on-brand flex shrink-0 cursor-pointer items-center justify-center rounded-sm ring-1 transition duration-100 ease-linear ring-inset focus-visible:outline-2 focus-visible:outline-offset-2\",\n        \"data-[checked]:bg-pho-brand-solid data-[checked]:ring-transparent\",\n        \"data-[indeterminate]:bg-pho-brand-solid data-[indeterminate]:ring-transparent\",\n        \"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n        BOX[size],\n        className,\n      )}\n      {...props}\n    >\n      <BaseCheckbox.Indicator className=\"flex items-center justify-center\">\n        <IconCheck\n          className={cn(ICON[size], \"group-data-[indeterminate]/cb:hidden\")}\n        />\n        <IconMinus\n          className={cn(\n            ICON[size],\n            \"hidden group-data-[indeterminate]/cb:block\",\n          )}\n        />\n      </BaseCheckbox.Indicator>\n    </BaseCheckbox.Root>\n  );\n\n  if (!label) return box;\n  return (\n    <label className=\"flex cursor-pointer items-center gap-2 select-none\">\n      {box}\n      <span className=\"text-pho-secondary text-base\">{label}</span>\n    </label>\n  );\n}\n\nCheckbox.displayName = \"Checkbox\";\n","import { type ComponentProps } from \"react\";\nimport { CheckboxGroup as BaseCheckboxGroup } from \"@base-ui/react/checkbox-group\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface CheckboxGroupProps extends Omit<\n  ComponentProps<typeof BaseCheckboxGroup>,\n  \"className\"\n> {\n  className?: string;\n}\n\n/**\n * Groups related `Checkbox`es and tracks their values as one. Built on Base UI\n * `CheckboxGroup` — supports a parent \"select all\" checkbox via `allValues`.\n * Control with `value` / `onValueChange` or leave uncontrolled with\n * `defaultValue`.\n */\nexport function CheckboxGroup({ className, ...props }: CheckboxGroupProps) {\n  return (\n    <BaseCheckboxGroup\n      className={cn(\"flex flex-col gap-3\", className)}\n      {...props}\n    />\n  );\n}\n\nCheckboxGroup.displayName = \"CheckboxGroup\";\n"],"x_google_ignoreList":[0,1],"mappings":";;;;;;;AASA,IAAMA,IAAa,CAAC,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAoB,KAAO;AAAQ,CAAC,CAAC,GACnE,IAAY,EAAqB,WAAW,SAAS,SAASA,CAAU,GCDxE,IAAa,CAAC,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAc,KAAO;AAAQ,CAAC,CAAC,GAC7D,IAAY,EAAqB,WAAW,SAAS,SAAS,CAAU,GCHxE,IAAoC;AAAA,EAAE,IAAI;AAAA,EAAU,IAAI;AAAS,GACjE,IAAqC;AAAA,EAAE,IAAI;AAAA,EAAU,IAAI;AAAW;AAmB1E,SAAgB,EAAS,EACvB,WAAA,GACA,OAAA,GACA,MAAA,IAAO,MACP,GAAG,EAAA,GACa;AAChB,QAAM,IACJ,gBAAA,EAAC,EAAa,MAAd;AAAA,IACE,WAAW,EAIT,iQACA,qEACA,iFACA,iEACA,EAAI,CAAA,GACJ,CACF;AAAA,IACA,GAAI;AAAA,cAEJ,gBAAA,EAAC,EAAa,WAAd;AAAA,MAAwB,WAAU;AAAA,gBAAlC,CACE,gBAAA,EAAC,GAAD,EACE,WAAW,EAAG,EAAK,CAAA,GAAO,sCAAsC,EACjE,CAAA,GACD,gBAAA,EAAC,GAAD,EACE,WAAW,EACT,EAAK,CAAA,GACL,4CACF,EACD,CAAA,CACqB;AAAA;EACP,CAAA;AAGrB,SAAK,IAEH,gBAAA,EAAC,SAAD;AAAA,IAAO,WAAU;AAAA,cAAjB,CACG,GACD,gBAAA,EAAC,QAAD;AAAA,MAAM,WAAU;AAAA,gBAAgC;AAAA,IAAY,CAAA,CACvD;AAAA,OALU;AAOrB;AAEA,EAAS,cAAc;ACtDvB,SAAgB,EAAc,EAAE,WAAA,GAAW,GAAG,EAAA,GAA6B;AACzE,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,WAAW,EAAG,uBAAuB,CAAS;AAAA,IAC9C,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,EAAc,cAAc"}

package/dist/components/collapsible.js

@@ -1,12 +1,12 @@
 "use client";
-import { t as r } from "../chunks/cn-7uGUzCOM.js";
+import { t as r } from "../chunks/cn-DTiB6ek_.js";
 import "react";
 import { jsx as i } from "react/jsx-runtime";
 import { Collapsible as o } from "@base-ui/react/collapsible";
-var n = o.Root;
-function a({ className: e, ...t }) {
+var a = o.Root;
+function n({ className: e, ...t }) {
   return /* @__PURE__ */ i(o.Trigger, {
-    className: r("outline-pho-brand text-pho-secondary hover:text-pho-secondary-hover flex w-full cursor-pointer items-center justify-between gap-2 rounded-md text-sm font-medium transition focus-visible:outline-2 focus-visible:outline-offset-2", "[&>svg]:size-4 [&>svg]:transition-transform [&>svg]:duration-150 data-[panel-open]:[&>svg]:rotate-180", e),
+    className: r("outline-pho-brand text-pho-secondary hover:text-pho-secondary-hover flex w-full cursor-pointer items-center justify-between gap-2 rounded-sm text-base font-medium transition focus-visible:outline-2 focus-visible:outline-offset-2", "[&>svg]:size-4 [&>svg]:transition-transform [&>svg]:duration-150 data-[panel-open]:[&>svg]:rotate-180", e),
     ...t
   });
 }
@@ -16,13 +16,13 @@ function s({ className: e, ...t }) {
     ...t
   });
 }
-var f = {
-  Root: n,
-  Trigger: a,
+var d = {
+  Root: a,
+  Trigger: n,
   Panel: s
 };
 export {
-  f as Collapsible
+  d as Collapsible
 };
 
 //# sourceMappingURL=collapsible.js.map

package/dist/components/collapsible.js.map

@@ -1 +1 @@
-{"version":3,"file":"collapsible.js","names":[],"sources":["../../src/components/collapsible/collapsible.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { Collapsible as BaseCollapsible } from \"@base-ui/react/collapsible\";\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\nconst Root = BaseCollapsible.Root;\n\nfunction Trigger({\n  className,\n  ...props\n}: StyledProps<typeof BaseCollapsible.Trigger>) {\n  return (\n    <BaseCollapsible.Trigger\n      className={cn(\n        \"outline-pho-brand text-pho-secondary hover:text-pho-secondary-hover flex w-full cursor-pointer items-center justify-between gap-2 rounded-md text-sm font-medium transition focus-visible:outline-2 focus-visible:outline-offset-2\",\n        \"[&>svg]:size-4 [&>svg]:transition-transform [&>svg]:duration-150 data-[panel-open]:[&>svg]:rotate-180\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Panel({\n  className,\n  ...props\n}: StyledProps<typeof BaseCollapsible.Panel>) {\n  return (\n    <BaseCollapsible.Panel\n      className={cn(\n        \"h-[var(--collapsible-panel-height)] overflow-hidden transition-[height] duration-150 ease-out\",\n        \"data-[ending-style]:h-0 data-[starting-style]:h-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Show/hide a region of content, built on Base UI `Collapsible` with a smooth\n * height animation. Control with `open` / `onOpenChange` or leave uncontrolled\n * via `defaultOpen`. For several sections where one expands at a time, use\n * `Accordion`.\n */\nexport const Collapsible = { Root, Trigger, Panel };\n"],"mappings":";;;;;AAYA,IAAM,IAAO,EAAgB;AAE7B,SAAS,EAAQ,EACf,WAAA,GACA,GAAG,EAAA,GAC2C;AAC9C,SACE,gBAAA,EAAC,EAAgB,SAAjB;AAAA,IACE,WAAW,EACT,sOACA,yGACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACyC;AAC5C,SACE,gBAAA,EAAC,EAAgB,OAAjB;AAAA,IACE,WAAW,EACT,iGACA,qDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAQA,IAAa,IAAc;AAAA,EAAE,MAAA;AAAA,EAAM,SAAA;AAAA,EAAS,OAAA;AAAM"}
+{"version":3,"file":"collapsible.js","names":[],"sources":["../../src/components/collapsible/collapsible.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { Collapsible as BaseCollapsible } from \"@base-ui/react/collapsible\";\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\nconst Root = BaseCollapsible.Root;\n\nfunction Trigger({\n  className,\n  ...props\n}: StyledProps<typeof BaseCollapsible.Trigger>) {\n  return (\n    <BaseCollapsible.Trigger\n      className={cn(\n        \"outline-pho-brand text-pho-secondary hover:text-pho-secondary-hover flex w-full cursor-pointer items-center justify-between gap-2 rounded-sm text-base font-medium transition focus-visible:outline-2 focus-visible:outline-offset-2\",\n        \"[&>svg]:size-4 [&>svg]:transition-transform [&>svg]:duration-150 data-[panel-open]:[&>svg]:rotate-180\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Panel({\n  className,\n  ...props\n}: StyledProps<typeof BaseCollapsible.Panel>) {\n  return (\n    <BaseCollapsible.Panel\n      className={cn(\n        \"h-[var(--collapsible-panel-height)] overflow-hidden transition-[height] duration-150 ease-out\",\n        \"data-[ending-style]:h-0 data-[starting-style]:h-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Show/hide a region of content, built on Base UI `Collapsible` with a smooth\n * height animation. Control with `open` / `onOpenChange` or leave uncontrolled\n * via `defaultOpen`. For several sections where one expands at a time, use\n * `Accordion`.\n */\nexport const Collapsible = { Root, Trigger, Panel };\n"],"mappings":";;;;;AAYA,IAAM,IAAO,EAAgB;AAE7B,SAAS,EAAQ,EACf,WAAA,GACA,GAAG,EAAA,GAC2C;AAC9C,SACE,gBAAA,EAAC,EAAgB,SAAjB;AAAA,IACE,WAAW,EACT,wOACA,yGACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACyC;AAC5C,SACE,gBAAA,EAAC,EAAgB,OAAjB;AAAA,IACE,WAAW,EACT,iGACA,qDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAQA,IAAa,IAAc;AAAA,EAAE,MAAA;AAAA,EAAM,SAAA;AAAA,EAAS,OAAA;AAAM"}

package/dist/components/combobox.js

@@ -1,117 +1,117 @@
 "use client";
-import { t as o } from "../chunks/cn-7uGUzCOM.js";
+import { t as o } from "../chunks/cn-DTiB6ek_.js";
 import "react";
 import { jsx as n } from "react/jsx-runtime";
-import { Combobox as t } from "@base-ui/react/combobox";
-var i = t.Root, s = t.Value, p = t.Portal, l = t.Group, u = t.Collection;
-function c({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.InputGroup, {
+import { Combobox as r } from "@base-ui/react/combobox";
+var i = r.Root, s = r.Value, p = r.Portal, c = r.Group, l = r.Collection;
+function h({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.InputGroup, {
     className: o("relative flex items-center", e),
-    ...r
+    ...t
   });
 }
-function m({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.Input, {
-    className: o("squircle bg-pho-primary ring-pho-primary text-pho-primary placeholder:text-pho-placeholder focus-visible:ring-pho-brand w-full rounded-lg px-3 py-2 text-sm ring-1 transition-shadow duration-100 ease-linear outline-none ring-inset focus-visible:ring-2 disabled:cursor-not-allowed disabled:opacity-50", e),
-    ...r
+function u({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.Input, {
+    className: o("bg-pho-primary ring-pho-primary text-pho-primary placeholder:text-pho-placeholder focus-visible:ring-pho-brand text-md rounded-base w-full px-3 py-2 ring-1 transition-shadow duration-100 ease-linear outline-none ring-inset focus-visible:ring-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-base", e),
+    ...t
   });
 }
-function h({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.Clear, {
-    className: o("combobox-clear text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover absolute right-2.5 flex cursor-pointer items-center [&>svg]:size-4", e),
-    ...r
+function m({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.Clear, {
+    className: o("combobox-clear text-pho-secondary hover:text-pho-secondary-hover absolute right-2.5 flex cursor-pointer items-center [&>svg]:size-4", e),
+    ...t
   });
 }
-function g({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.Trigger, {
-    className: o("text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover absolute right-2.5 flex cursor-pointer items-center [&>svg]:size-4", e),
-    ...r
+function d({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.Trigger, {
+    className: o("text-pho-secondary hover:text-pho-secondary-hover absolute right-2.5 flex cursor-pointer items-center [&>svg]:size-4", e),
+    ...t
   });
 }
-function d({ className: e, sideOffset: r = 6, ...a }) {
-  return /* @__PURE__ */ n(t.Positioner, {
-    sideOffset: r,
+function g({ className: e, sideOffset: t = 6, ...a }) {
+  return /* @__PURE__ */ n(r.Positioner, {
+    sideOffset: t,
     className: o("z-50 outline-none", e),
     ...a
   });
 }
-function x({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.Popup, {
-    className: o("squircle bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-secondary w-[var(--anchor-width)] max-w-[var(--available-width)] origin-[var(--transform-origin)] rounded-xl p-1 ring-1 transition-[transform,opacity] duration-150 ease-out outline-none ring-inset", "data-[starting-style]:scale-95 data-[starting-style]:opacity-0", "data-[ending-style]:scale-95 data-[ending-style]:opacity-0", e),
-    ...r
+function x({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.Popup, {
+    className: o("bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-secondary rounded-base w-[var(--anchor-width)] max-w-[var(--available-width)] origin-[var(--transform-origin)] p-1 ring-1 transition-[transform,opacity] duration-150 ease-out outline-none ring-inset", "data-[starting-style]:scale-95 data-[starting-style]:opacity-0", "data-[ending-style]:scale-95 data-[ending-style]:opacity-0", e),
+    ...t
   });
 }
-function f({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.List, {
+function y({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.List, {
     className: o("max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain", e),
-    ...r
+    ...t
   });
 }
-function y({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.Empty, {
-    className: o("text-pho-tertiary px-2.5 py-6 text-center text-sm empty:m-0 empty:p-0", e),
-    ...r
+function b({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.Empty, {
+    className: o("text-pho-description px-2.5 py-6 text-center text-base empty:m-0 empty:p-0", e),
+    ...t
   });
 }
-function v({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.Item, {
-    className: o("text-pho-secondary grid cursor-pointer grid-cols-[1rem_1fr] items-center gap-2 rounded-lg py-1.5 pr-2.5 pl-2 text-sm outline-none select-none", "data-[highlighted]:bg-pho-ghost-hover data-[highlighted]:text-pho-primary", e),
-    ...r
+function f({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.Item, {
+    className: o("text-pho-secondary rounded-base grid cursor-pointer grid-cols-[1rem_1fr] items-center gap-2 py-1.5 pr-2.5 pl-2 text-base outline-none select-none", "data-[highlighted]:bg-pho-ghost-hover data-[highlighted]:text-pho-primary", e),
+    ...t
   });
 }
-function b({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.ItemIndicator, {
+function v({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.ItemIndicator, {
     className: o("text-pho-brand col-start-1 flex items-center [&>svg]:size-4", e),
-    ...r
+    ...t
   });
 }
-function N({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.GroupLabel, {
-    className: o("text-pho-quaternary px-2.5 py-1.5 text-xs font-medium", e),
-    ...r
+function N({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.GroupLabel, {
+    className: o("text-pho-secondary px-2.5 py-1.5 text-xs font-medium", e),
+    ...t
   });
 }
-function C({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.Chips, {
-    className: o("squircle bg-pho-primary ring-pho-primary focus-within:ring-pho-brand flex flex-wrap items-center gap-1.5 rounded-lg p-1.5 ring-1 ring-inset focus-within:ring-2", e),
-    ...r
+function C({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.Chips, {
+    className: o("bg-pho-primary ring-pho-primary focus-within:ring-pho-brand rounded-base flex flex-wrap items-center gap-1.5 p-1.5 ring-1 ring-inset focus-within:ring-2", e),
+    ...t
   });
 }
-function w({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.Chip, {
-    className: o("bg-pho-tertiary text-pho-secondary data-[highlighted]:bg-pho-quaternary flex items-center gap-1 rounded-md py-0.5 pr-1 pl-2 text-sm", e),
-    ...r
+function w({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.Chip, {
+    className: o("bg-pho-secondary text-pho-secondary data-[highlighted]:bg-pho-inverse data-[highlighted]:text-pho-inverse flex items-center gap-1 rounded-sm py-0.5 pr-1 pl-2 text-base", e),
+    ...t
   });
 }
-function q({ className: e, ...r }) {
-  return /* @__PURE__ */ n(t.ChipRemove, {
-    className: o("text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover flex cursor-pointer items-center rounded-sm [&>svg]:size-3.5", e),
-    ...r
+function I({ className: e, ...t }) {
+  return /* @__PURE__ */ n(r.ChipRemove, {
+    className: o("text-pho-secondary hover:text-pho-secondary-hover in-data-[highlighted]:text-pho-inverse flex cursor-pointer items-center rounded-sm [&>svg]:size-3.5", e),
+    ...t
   });
 }
-var L = {
+var R = {
   Root: i,
   Value: s,
-  InputGroup: c,
-  Input: m,
-  Trigger: g,
-  Clear: h,
+  InputGroup: h,
+  Input: u,
+  Trigger: d,
+  Clear: m,
   Portal: p,
-  Positioner: d,
+  Positioner: g,
   Popup: x,
-  List: f,
-  Collection: u,
-  Empty: y,
-  Item: v,
-  ItemIndicator: b,
-  Group: l,
+  List: y,
+  Collection: l,
+  Empty: b,
+  Item: f,
+  ItemIndicator: v,
+  Group: c,
   GroupLabel: N,
   Chips: C,
   Chip: w,
-  ChipRemove: q
+  ChipRemove: I
 };
 export {
-  L as Combobox
+  R as Combobox
 };
 
 //# sourceMappingURL=combobox.js.map

package/dist/components/combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.js","names":[],"sources":["../../src/components/combobox/combobox.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { Combobox as BaseCombobox } from \"@base-ui/react/combobox\";\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\nconst Root = BaseCombobox.Root;\nconst Value = BaseCombobox.Value;\nconst Portal = BaseCombobox.Portal;\nconst Group = BaseCombobox.Group;\nconst Collection = BaseCombobox.Collection;\n\nfunction InputGroup({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.InputGroup>) {\n  return (\n    <BaseCombobox.InputGroup\n      className={cn(\"relative flex items-center\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Input({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Input>) {\n  return (\n    <BaseCombobox.Input\n      className={cn(\n        \"squircle bg-pho-primary ring-pho-primary text-pho-primary placeholder:text-pho-placeholder focus-visible:ring-pho-brand w-full rounded-lg px-3 py-2 text-sm ring-1 transition-shadow duration-100 ease-linear outline-none ring-inset focus-visible:ring-2 disabled:cursor-not-allowed disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Clear({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Clear>) {\n  return (\n    <BaseCombobox.Clear\n      className={cn(\n        \"combobox-clear text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover absolute right-2.5 flex cursor-pointer items-center [&>svg]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Trigger({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Trigger>) {\n  return (\n    <BaseCombobox.Trigger\n      className={cn(\n        \"text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover absolute right-2.5 flex cursor-pointer items-center [&>svg]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Positioner({\n  className,\n  sideOffset = 6,\n  ...props\n}: StyledProps<typeof BaseCombobox.Positioner>) {\n  return (\n    <BaseCombobox.Positioner\n      sideOffset={sideOffset}\n      className={cn(\"z-50 outline-none\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Popup>) {\n  return (\n    <BaseCombobox.Popup\n      className={cn(\n        \"squircle bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-secondary w-[var(--anchor-width)] max-w-[var(--available-width)] origin-[var(--transform-origin)] rounded-xl p-1 ring-1 transition-[transform,opacity] duration-150 ease-out outline-none ring-inset\",\n        \"data-[starting-style]:scale-95 data-[starting-style]:opacity-0\",\n        \"data-[ending-style]:scale-95 data-[ending-style]:opacity-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction List({ className, ...props }: StyledProps<typeof BaseCombobox.List>) {\n  return (\n    <BaseCombobox.List\n      className={cn(\n        \"max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Empty({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Empty>) {\n  return (\n    <BaseCombobox.Empty\n      className={cn(\n        \"text-pho-tertiary px-2.5 py-6 text-center text-sm empty:m-0 empty:p-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Item({ className, ...props }: StyledProps<typeof BaseCombobox.Item>) {\n  return (\n    <BaseCombobox.Item\n      className={cn(\n        \"text-pho-secondary grid cursor-pointer grid-cols-[1rem_1fr] items-center gap-2 rounded-lg py-1.5 pr-2.5 pl-2 text-sm outline-none select-none\",\n        \"data-[highlighted]:bg-pho-ghost-hover data-[highlighted]:text-pho-primary\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ItemIndicator({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.ItemIndicator>) {\n  return (\n    <BaseCombobox.ItemIndicator\n      className={cn(\n        \"text-pho-brand col-start-1 flex items-center [&>svg]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction GroupLabel({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.GroupLabel>) {\n  return (\n    <BaseCombobox.GroupLabel\n      className={cn(\n        \"text-pho-quaternary px-2.5 py-1.5 text-xs font-medium\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Chips({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Chips>) {\n  return (\n    <BaseCombobox.Chips\n      className={cn(\n        \"squircle bg-pho-primary ring-pho-primary focus-within:ring-pho-brand flex flex-wrap items-center gap-1.5 rounded-lg p-1.5 ring-1 ring-inset focus-within:ring-2\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Chip({ className, ...props }: StyledProps<typeof BaseCombobox.Chip>) {\n  return (\n    <BaseCombobox.Chip\n      className={cn(\n        \"bg-pho-tertiary text-pho-secondary data-[highlighted]:bg-pho-quaternary flex items-center gap-1 rounded-md py-0.5 pr-1 pl-2 text-sm\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ChipRemove({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.ChipRemove>) {\n  return (\n    <BaseCombobox.ChipRemove\n      className={cn(\n        \"text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover flex cursor-pointer items-center rounded-sm [&>svg]:size-3.5\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Combobox built on Base UI `Combobox` — a text input that filters a list as\n * you type and commits to a value from it. Pass `items` to `Combobox.Root`;\n * `Combobox.List` takes a render function mapping each (filtered) item to a\n * `Combobox.Item`. Add `Combobox.Chips` for multi-select. For free-form text\n * with suggestions, use `Autocomplete`; for a small fixed set, use `Select`.\n */\nexport const Combobox = {\n  Root,\n  Value,\n  InputGroup,\n  Input,\n  Trigger,\n  Clear,\n  Portal,\n  Positioner,\n  Popup,\n  List,\n  Collection,\n  Empty,\n  Item,\n  ItemIndicator,\n  Group,\n  GroupLabel,\n  Chips,\n  Chip,\n  ChipRemove,\n};\n"],"mappings":";;;;;AAYA,IAAM,IAAO,EAAa,MACpB,IAAQ,EAAa,OACrB,IAAS,EAAa,QACtB,IAAQ,EAAa,OACrB,IAAa,EAAa;AAEhC,SAAS,EAAW,EAClB,WAAA,GACA,GAAG,EAAA,GAC2C;AAC9C,SACE,gBAAA,EAAC,EAAa,YAAd;AAAA,IACE,WAAW,EAAG,8BAA8B,CAAS;AAAA,IACrD,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAa,OAAd;AAAA,IACE,WAAW,EACT,8SACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAa,OAAd;AAAA,IACE,WAAW,EACT,+IACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAQ,EACf,WAAA,GACA,GAAG,EAAA,GACwC;AAC3C,SACE,gBAAA,EAAC,EAAa,SAAd;AAAA,IACE,WAAW,EACT,gIACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAW,EAClB,WAAA,GACA,YAAA,IAAa,GACb,GAAG,EAAA,GAC2C;AAC9C,SACE,gBAAA,EAAC,EAAa,YAAd;AAAA,IACc,YAAA;AAAA,IACZ,WAAW,EAAG,qBAAqB,CAAS;AAAA,IAC5C,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAa,OAAd;AAAA,IACE,WAAW,EACT,wQACA,kEACA,8DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgD;AAC5E,SACE,gBAAA,EAAC,EAAa,MAAd;AAAA,IACE,WAAW,EACT,iFACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAa,OAAd;AAAA,IACE,WAAW,EACT,yEACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgD;AAC5E,SACE,gBAAA,EAAC,EAAa,MAAd;AAAA,IACE,WAAW,EACT,iJACA,6EACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAc,EACrB,WAAA,GACA,GAAG,EAAA,GAC8C;AACjD,SACE,gBAAA,EAAC,EAAa,eAAd;AAAA,IACE,WAAW,EACT,+DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAW,EAClB,WAAA,GACA,GAAG,EAAA,GAC2C;AAC9C,SACE,gBAAA,EAAC,EAAa,YAAd;AAAA,IACE,WAAW,EACT,yDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAa,OAAd;AAAA,IACE,WAAW,EACT,mKACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgD;AAC5E,SACE,gBAAA,EAAC,EAAa,MAAd;AAAA,IACE,WAAW,EACT,uIACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAW,EAClB,WAAA,GACA,GAAG,EAAA,GAC2C;AAC9C,SACE,gBAAA,EAAC,EAAa,YAAd;AAAA,IACE,WAAW,EACT,0HACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AASA,IAAa,IAAW;AAAA,EACtB,MAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,eAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AACF"}
+{"version":3,"file":"combobox.js","names":[],"sources":["../../src/components/combobox/combobox.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { Combobox as BaseCombobox } from \"@base-ui/react/combobox\";\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\nconst Root = BaseCombobox.Root;\nconst Value = BaseCombobox.Value;\nconst Portal = BaseCombobox.Portal;\nconst Group = BaseCombobox.Group;\nconst Collection = BaseCombobox.Collection;\n\nfunction InputGroup({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.InputGroup>) {\n  return (\n    <BaseCombobox.InputGroup\n      className={cn(\"relative flex items-center\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Input({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Input>) {\n  return (\n    <BaseCombobox.Input\n      className={cn(\n        // text-md on small viewports — iOS zooms into fields under 16px.\n        \"bg-pho-primary ring-pho-primary text-pho-primary placeholder:text-pho-placeholder focus-visible:ring-pho-brand text-md rounded-base w-full px-3 py-2 ring-1 transition-shadow duration-100 ease-linear outline-none ring-inset focus-visible:ring-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-base\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Clear({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Clear>) {\n  return (\n    <BaseCombobox.Clear\n      className={cn(\n        \"combobox-clear text-pho-secondary hover:text-pho-secondary-hover absolute right-2.5 flex cursor-pointer items-center [&>svg]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Trigger({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Trigger>) {\n  return (\n    <BaseCombobox.Trigger\n      className={cn(\n        \"text-pho-secondary hover:text-pho-secondary-hover absolute right-2.5 flex cursor-pointer items-center [&>svg]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Positioner({\n  className,\n  sideOffset = 6,\n  ...props\n}: StyledProps<typeof BaseCombobox.Positioner>) {\n  return (\n    <BaseCombobox.Positioner\n      sideOffset={sideOffset}\n      className={cn(\"z-50 outline-none\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Popup>) {\n  return (\n    <BaseCombobox.Popup\n      className={cn(\n        \"bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-secondary rounded-base w-[var(--anchor-width)] max-w-[var(--available-width)] origin-[var(--transform-origin)] p-1 ring-1 transition-[transform,opacity] duration-150 ease-out outline-none ring-inset\",\n        \"data-[starting-style]:scale-95 data-[starting-style]:opacity-0\",\n        \"data-[ending-style]:scale-95 data-[ending-style]:opacity-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction List({ className, ...props }: StyledProps<typeof BaseCombobox.List>) {\n  return (\n    <BaseCombobox.List\n      className={cn(\n        \"max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Empty({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Empty>) {\n  return (\n    <BaseCombobox.Empty\n      className={cn(\n        \"text-pho-description px-2.5 py-6 text-center text-base empty:m-0 empty:p-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Item({ className, ...props }: StyledProps<typeof BaseCombobox.Item>) {\n  return (\n    <BaseCombobox.Item\n      className={cn(\n        \"text-pho-secondary rounded-base grid cursor-pointer grid-cols-[1rem_1fr] items-center gap-2 py-1.5 pr-2.5 pl-2 text-base outline-none select-none\",\n        \"data-[highlighted]:bg-pho-ghost-hover data-[highlighted]:text-pho-primary\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ItemIndicator({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.ItemIndicator>) {\n  return (\n    <BaseCombobox.ItemIndicator\n      className={cn(\n        \"text-pho-brand col-start-1 flex items-center [&>svg]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction GroupLabel({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.GroupLabel>) {\n  return (\n    <BaseCombobox.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 Chips({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.Chips>) {\n  return (\n    <BaseCombobox.Chips\n      className={cn(\n        \"bg-pho-primary ring-pho-primary focus-within:ring-pho-brand rounded-base flex flex-wrap items-center gap-1.5 p-1.5 ring-1 ring-inset focus-within:ring-2\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Chip({ className, ...props }: StyledProps<typeof BaseCombobox.Chip>) {\n  return (\n    <BaseCombobox.Chip\n      className={cn(\n        // Keyboard-highlighted chip flips to the inverse chip surface.\n        \"bg-pho-secondary text-pho-secondary data-[highlighted]:bg-pho-inverse data-[highlighted]:text-pho-inverse flex items-center gap-1 rounded-sm py-0.5 pr-1 pl-2 text-base\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ChipRemove({\n  className,\n  ...props\n}: StyledProps<typeof BaseCombobox.ChipRemove>) {\n  return (\n    <BaseCombobox.ChipRemove\n      className={cn(\n        \"text-pho-secondary hover:text-pho-secondary-hover in-data-[highlighted]:text-pho-inverse flex cursor-pointer items-center rounded-sm [&>svg]:size-3.5\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Combobox built on Base UI `Combobox` — a text input that filters a list as\n * you type and commits to a value from it. Pass `items` to `Combobox.Root`;\n * `Combobox.List` takes a render function mapping each (filtered) item to a\n * `Combobox.Item`. Add `Combobox.Chips` for multi-select. For free-form text\n * with suggestions, use `Autocomplete`; for a small fixed set, use `Select`.\n */\nexport const Combobox = {\n  Root,\n  Value,\n  InputGroup,\n  Input,\n  Trigger,\n  Clear,\n  Portal,\n  Positioner,\n  Popup,\n  List,\n  Collection,\n  Empty,\n  Item,\n  ItemIndicator,\n  Group,\n  GroupLabel,\n  Chips,\n  Chip,\n  ChipRemove,\n};\n"],"mappings":"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"}

package/dist/components/context-menu.js

@@ -1,63 +1,76 @@
 "use client";
-import { t as e } from "../chunks/cn-7uGUzCOM.js";
-import { n as u, t as n } from "../chunks/menu-BfaNHnOp.js";
+import { t } from "../chunks/cn-DTiB6ek_.js";
+import { t as g } from "../chunks/resolve-variant-CcD8iG5l.js";
+import { a as b, c as v, n as x, o as M, r as P, t as s } from "../chunks/menu-COLB_liS.js";
 import "react";
-import { jsx as a } from "react/jsx-runtime";
-import { ContextMenu as t } from "@base-ui/react/context-menu";
-import { Separator as p } from "@base-ui/react/separator";
-var m = t.Root, i = t.Trigger, s = t.Portal, c = t.Group, f = t.RadioGroup, l = t.SubmenuRoot;
-function g({ className: r, ...o }) {
-  return /* @__PURE__ */ a(t.Positioner, {
-    className: e("z-50", r),
-    ...o
+import { jsx as a, jsxs as h } from "react/jsx-runtime";
+import { ContextMenu as e } from "@base-ui/react/context-menu";
+import { Separator as N } from "@base-ui/react/separator";
+var S = v(e.Root), R = e.Trigger, y = e.Portal, G = e.Group, I = e.RadioGroup, T = e.SubmenuRoot;
+function C({ className: o, ...r }) {
+  return /* @__PURE__ */ a(e.Positioner, {
+    className: t("z-50", o),
+    ...r
   });
 }
-function x({ className: r, ...o }) {
-  return /* @__PURE__ */ a(t.Popup, {
-    className: e(u, r),
-    ...o
+function E({ className: o, ...r }) {
+  return /* @__PURE__ */ a(e.Popup, {
+    className: t(P, o),
+    ...r
   });
 }
-function b({ className: r, ...o }) {
-  return /* @__PURE__ */ a(t.Item, {
-    className: e(n, r),
-    ...o
+function U({ className: o, color: r = "default", onClick: i, closeOnClick: u = !0, loading: p = !1, disabled: m = !1, children: l, ...c }) {
+  const { inert: n, blocked: d, handleClick: f } = M({
+    onClick: i,
+    closeOnClick: u,
+    loading: p,
+    disabled: m
+  });
+  return /* @__PURE__ */ h(e.Item, {
+    className: t(s, g(x, r), o),
+    closeOnClick: u,
+    disabled: d,
+    "data-loading": n || void 0,
+    "aria-busy": n || void 0,
+    onClick: f,
+    ...c,
+    children: [n ? /* @__PURE__ */ a(b, {}) : null, l]
   });
 }
-function v({ className: r, ...o }) {
-  return /* @__PURE__ */ a(t.GroupLabel, {
-    className: e("text-pho-quaternary px-2.5 py-1.5 text-xs font-medium", r),
-    ...o
+function _({ className: o, ...r }) {
+  return /* @__PURE__ */ a(e.GroupLabel, {
+    className: t("text-pho-secondary px-2.5 py-1.5 text-xs font-medium", o),
+    ...r
   });
 }
-function P({ className: r, ...o }) {
-  return /* @__PURE__ */ a(p, {
-    className: e("-mx-1 my-1 h-px bg-[var(--border-color-pho-secondary)]", r),
-    ...o
+function L({ className: o, ...r }) {
+  return /* @__PURE__ */ a(N, {
+    className: t("-mx-1 my-1 h-px bg-[var(--border-color-pho-secondary)]", o),
+    ...r
   });
 }
-function N({ className: r, ...o }) {
-  return /* @__PURE__ */ a(t.SubmenuTrigger, {
-    className: e(n, "data-[popup-open]:bg-pho-ghost-hover", r),
-    ...o
+function j({ className: o, ...r }) {
+  return /* @__PURE__ */ a(e.SubmenuTrigger, {
+    className: t(s, "data-[popup-open]:bg-pho-ghost-hover", o),
+    ...r
   });
 }
-var T = {
-  Root: m,
-  Trigger: i,
-  Portal: s,
-  Positioner: g,
-  Popup: x,
-  Item: b,
-  Group: c,
-  GroupLabel: v,
-  Separator: P,
-  SubmenuRoot: l,
-  SubmenuTrigger: N,
-  RadioGroup: f
+var q = {
+  Root: S,
+  Trigger: R,
+  Portal: y,
+  Positioner: C,
+  Popup: E,
+  Item: U,
+  Group: G,
+  GroupLabel: _,
+  Separator: L,
+  SubmenuRoot: T,
+  SubmenuTrigger: j,
+  RadioGroup: I
 };
 export {
-  T as ContextMenu
+  q as ContextMenu
 };
 
 //# sourceMappingURL=context-menu.js.map

package/dist/components/context-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"context-menu.js","names":[],"sources":["../../src/components/context-menu/context-menu.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { ContextMenu as BaseContextMenu } from \"@base-ui/react/context-menu\";\nimport { Separator as BaseSeparator } from \"@base-ui/react/separator\";\nimport { cn } from \"../../utils/cn\";\nimport { MENU_POPUP, MENU_ITEM } from \"../menu/menu\";\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\nconst Root = BaseContextMenu.Root;\nconst Trigger = BaseContextMenu.Trigger;\nconst Portal = BaseContextMenu.Portal;\nconst Group = BaseContextMenu.Group;\nconst RadioGroup = BaseContextMenu.RadioGroup;\nconst SubmenuRoot = BaseContextMenu.SubmenuRoot;\n\nfunction Positioner({\n  className,\n  ...props\n}: StyledProps<typeof BaseContextMenu.Positioner>) {\n  return (\n    <BaseContextMenu.Positioner className={cn(\"z-50\", className)} {...props} />\n  );\n}\n\nfunction Popup({\n  className,\n  ...props\n}: StyledProps<typeof BaseContextMenu.Popup>) {\n  return (\n    <BaseContextMenu.Popup className={cn(MENU_POPUP, className)} {...props} />\n  );\n}\n\nfunction Item({\n  className,\n  ...props\n}: StyledProps<typeof BaseContextMenu.Item>) {\n  return (\n    <BaseContextMenu.Item className={cn(MENU_ITEM, className)} {...props} />\n  );\n}\n\nfunction GroupLabel({\n  className,\n  ...props\n}: StyledProps<typeof BaseContextMenu.GroupLabel>) {\n  return (\n    <BaseContextMenu.GroupLabel\n      className={cn(\n        \"text-pho-quaternary 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 my-1 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 BaseContextMenu.SubmenuTrigger>) {\n  return (\n    <BaseContextMenu.SubmenuTrigger\n      className={cn(\n        MENU_ITEM,\n        \"data-[popup-open]:bg-pho-ghost-hover\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Right-click (context) menu built on Base UI `ContextMenu`. `ContextMenu.Trigger`\n * wraps the area that opens the menu on right-click / long-press; the popup\n * shares its look with `Menu`. Always mirror these actions somewhere visible —\n * a context menu must not be the only way to reach them.\n */\nexport const ContextMenu = {\n  Root,\n  Trigger,\n  Portal,\n  Positioner,\n  Popup,\n  Item,\n  Group,\n  GroupLabel,\n  Separator,\n  SubmenuRoot,\n  SubmenuTrigger,\n  RadioGroup,\n};\n"],"mappings":";;;;;;;AAcA,IAAM,IAAO,EAAgB,MACvB,IAAU,EAAgB,SAC1B,IAAS,EAAgB,QACzB,IAAQ,EAAgB,OACxB,IAAa,EAAgB,YAC7B,IAAc,EAAgB;AAEpC,SAAS,EAAW,EAClB,WAAA,GACA,GAAG,EAAA,GAC8C;AACjD,SACE,gBAAA,EAAC,EAAgB,YAAjB;AAAA,IAA4B,WAAW,EAAG,QAAQ,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE9E;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACyC;AAC5C,SACE,gBAAA,EAAC,EAAgB,OAAjB;AAAA,IAAuB,WAAW,EAAG,GAAY,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE7E;AAEA,SAAS,EAAK,EACZ,WAAA,GACA,GAAG,EAAA,GACwC;AAC3C,SACE,gBAAA,EAAC,EAAgB,MAAjB;AAAA,IAAsB,WAAW,EAAG,GAAW,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE3E;AAEA,SAAS,EAAW,EAClB,WAAA,GACA,GAAG,EAAA,GAC8C;AACjD,SACE,gBAAA,EAAC,EAAgB,YAAjB;AAAA,IACE,WAAW,EACT,yDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAU,EAAE,WAAA,GAAW,GAAG,EAAA,GAA4C;AAC7E,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,WAAW,EACT,0DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAe,EACtB,WAAA,GACA,GAAG,EAAA,GACkD;AACrD,SACE,gBAAA,EAAC,EAAgB,gBAAjB;AAAA,IACE,WAAW,EACT,GACA,wCACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAQA,IAAa,IAAc;AAAA,EACzB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA,YAAA;AACF"}
+{"version":3,"file":"context-menu.js","names":[],"sources":["../../src/components/context-menu/context-menu.tsx"],"sourcesContent":["import {\n  type ComponentProps,\n  type ElementType,\n  type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { ContextMenu as BaseContextMenu } from \"@base-ui/react/context-menu\";\nimport { Separator as BaseSeparator } from \"@base-ui/react/separator\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant } from \"../../utils/resolve-variant\";\nimport {\n  MENU_POPUP,\n  MENU_ITEM,\n  MENU_ITEM_COLORS,\n  type MenuItemColor,\n} from \"../menu/menu\";\nimport {\n  MenuItemSpinner,\n  useAsyncMenuItem,\n  withMenuPendingRoot,\n  type AsyncMenuItemClick,\n} from \"../menu/menu-pending\";\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\ntype ContextMenuItemProps = Omit<\n  StyledProps<typeof BaseContextMenu.Item>,\n  \"onClick\"\n> & {\n  /** Semantic ink. @default \"default\" */\n  color?: MenuItemColor;\n  /**\n   * Action handler. Return a promise to keep the menu open while it runs —\n   * same behavior as `Menu.Item`.\n   */\n  onClick?: AsyncMenuItemClick;\n  /** Declarative loading state. @default false */\n  loading?: boolean;\n};\n\nconst Root = withMenuPendingRoot(BaseContextMenu.Root);\nconst Trigger = BaseContextMenu.Trigger;\nconst Portal = BaseContextMenu.Portal;\nconst Group = BaseContextMenu.Group;\nconst RadioGroup = BaseContextMenu.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 = BaseContextMenu.SubmenuRoot;\n\nfunction Positioner({\n  className,\n  ...props\n}: StyledProps<typeof BaseContextMenu.Positioner>) {\n  return (\n    <BaseContextMenu.Positioner className={cn(\"z-50\", className)} {...props} />\n  );\n}\n\nfunction Popup({\n  className,\n  ...props\n}: StyledProps<typeof BaseContextMenu.Popup>) {\n  return (\n    <BaseContextMenu.Popup className={cn(MENU_POPUP, className)} {...props} />\n  );\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}: ContextMenuItemProps) {\n  const { inert, blocked, handleClick } = useAsyncMenuItem({\n    onClick,\n    closeOnClick,\n    loading,\n    disabled,\n  });\n\n  return (\n    <BaseContextMenu.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 ? <MenuItemSpinner /> : null}\n      {children}\n    </BaseContextMenu.Item>\n  );\n}\n\nfunction GroupLabel({\n  className,\n  ...props\n}: StyledProps<typeof BaseContextMenu.GroupLabel>) {\n  return (\n    <BaseContextMenu.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 my-1 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 BaseContextMenu.SubmenuTrigger>) {\n  return (\n    <BaseContextMenu.SubmenuTrigger\n      className={cn(\n        MENU_ITEM,\n        \"data-[popup-open]:bg-pho-ghost-hover\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Right-click (context) menu built on Base UI `ContextMenu`. `ContextMenu.Trigger`\n * wraps the area that opens the menu on right-click / long-press; the popup\n * shares its look with `Menu`. `ContextMenu.Item` has the same native promise\n * support as `Menu.Item`. Always mirror these actions somewhere visible —\n * a context menu must not be the only way to reach them.\n */\nexport const ContextMenu = {\n  Root,\n  Trigger,\n  Portal,\n  Positioner,\n  Popup,\n  Item,\n  Group,\n  GroupLabel,\n  Separator,\n  SubmenuRoot,\n  SubmenuTrigger,\n  RadioGroup,\n};\n"],"mappings":";;;;;;;;AA6CA,IAAM,IAAO,EAAoB,EAAgB,IAAI,GAC/C,IAAU,EAAgB,SAC1B,IAAS,EAAgB,QACzB,IAAQ,EAAgB,OACxB,IAAa,EAAgB,YAG7B,IAAc,EAAgB;AAEpC,SAAS,EAAW,EAClB,WAAA,GACA,GAAG,EAAA,GAC8C;AACjD,SACE,gBAAA,EAAC,EAAgB,YAAjB;AAAA,IAA4B,WAAW,EAAG,QAAQ,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE9E;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACyC;AAC5C,SACE,gBAAA,EAAC,EAAgB,OAAjB;AAAA,IAAuB,WAAW,EAAG,GAAY,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE7E;AAEA,SAAS,EAAK,EACZ,WAAA,GACA,OAAA,IAAQ,WACR,SAAA,GACA,cAAA,IAAe,IACf,SAAA,IAAU,IACV,UAAA,IAAW,IACX,UAAA,GACA,GAAG,EAAA,GACoB;AACvB,QAAM,EAAE,OAAA,GAAO,SAAA,GAAS,aAAA,EAAA,IAAgB,EAAiB;AAAA,IACvD,SAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,EACF,CAAC;AAED,SACE,gBAAA,EAAC,EAAgB,MAAjB;AAAA,IACE,WAAW,EACT,GACA,EAAe,GAAkB,CAAK,GACtC,CACF;AAAA,IACc,cAAA;AAAA,IACd,UAAU;AAAA,IACV,gBAAc,KAAS;AAAA,IACvB,aAAW,KAAS;AAAA,IACpB,SAAS;AAAA,IACT,GAAI;AAAA,cAXN,CAaG,IAAQ,gBAAA,EAAC,GAAD,CAAkB,CAAA,IAAI,MAC9B,CACmB;AAAA;AAE1B;AAEA,SAAS,EAAW,EAClB,WAAA,GACA,GAAG,EAAA,GAC8C;AACjD,SACE,gBAAA,EAAC,EAAgB,YAAjB;AAAA,IACE,WAAW,EACT,wDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAU,EAAE,WAAA,GAAW,GAAG,EAAA,GAA4C;AAC7E,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,WAAW,EACT,0DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAe,EACtB,WAAA,GACA,GAAG,EAAA,GACkD;AACrD,SACE,gBAAA,EAAC,EAAgB,gBAAjB;AAAA,IACE,WAAW,EACT,GACA,wCACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AASA,IAAa,IAAc;AAAA,EACzB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA,YAAA;AACF"}

package/dist/components/dialog.js

@@ -1,5 +1,6 @@
 "use client";
-import { t } from "../chunks/dialog-7oOe-eaO.js";
+import { n as i, t as o } from "../chunks/dialog-Bgb2Z1_v.js";
 export {
-  t as Dialog
+  o as Dialog,
+  i as useDialogPending
 };

package/dist/components/drawer.js

@@ -1,42 +1,42 @@
 "use client";
-import { t as a } from "../chunks/cn-7uGUzCOM.js";
+import { t as e } from "../chunks/cn-DTiB6ek_.js";
 import "react";
 import { jsx as o } from "react/jsx-runtime";
-import { Drawer as e } from "@base-ui/react/drawer";
-var n = e.Root, i = e.Trigger, s = e.Portal, l = e.Close;
+import { Drawer as a } from "@base-ui/react/drawer";
+var n = a.Root, i = a.Trigger, s = a.Portal, l = a.Close;
 function p({ className: t, ...r }) {
-  return /* @__PURE__ */ o(e.Backdrop, {
-    className: a("bg-pho-overlay fixed inset-0 z-50 backdrop-blur-[2px] transition-opacity duration-300 ease-out", "data-[ending-style]:opacity-0 data-[starting-style]:opacity-0 data-[swiping]:duration-0", t),
+  return /* @__PURE__ */ o(a.Backdrop, {
+    className: e("bg-pho-overlay fixed inset-0 z-50 transition-opacity duration-300 ease-out", "data-[ending-style]:opacity-0 data-[starting-style]:opacity-0 data-[swiping]:duration-0", t),
     ...r
   });
 }
 function c({ className: t, ...r }) {
-  return /* @__PURE__ */ o(e.Viewport, {
-    className: a("fixed inset-0 z-50 flex items-stretch justify-end", t),
+  return /* @__PURE__ */ o(a.Viewport, {
+    className: e("fixed inset-0 z-50 flex items-stretch justify-end", t),
     ...r
   });
 }
 function u({ className: t, ...r }) {
-  return /* @__PURE__ */ o(e.Popup, {
-    className: a("squircle border-pho-secondary bg-pho-primary shadow-pho-xl h-full w-[22rem] max-w-[calc(100vw-3rem)] overflow-y-auto overscroll-contain border-l p-6 outline-none", "[transform:translateX(var(--drawer-swipe-movement-x,0px))] transition-transform duration-300 ease-out", "data-[ending-style]:translate-x-full data-[starting-style]:translate-x-full data-[swiping]:duration-0", t),
+  return /* @__PURE__ */ o(a.Popup, {
+    className: e("border-pho-secondary bg-pho-primary shadow-pho-xl h-full w-[22rem] max-w-[calc(100vw-3rem)] overflow-y-auto overscroll-contain border-l p-6 outline-none", "[transform:translateX(var(--drawer-swipe-movement-x,0px))] transition-transform duration-300 ease-out", "data-[ending-style]:translate-x-full data-[starting-style]:translate-x-full data-[swiping]:duration-0", t),
     ...r
   });
 }
 function m({ className: t, ...r }) {
-  return /* @__PURE__ */ o(e.Content, {
-    className: a("flex h-full flex-col", t),
+  return /* @__PURE__ */ o(a.Content, {
+    className: e("flex h-full flex-col", t),
     ...r
   });
 }
 function d({ className: t, ...r }) {
-  return /* @__PURE__ */ o(e.Title, {
-    className: a("text-pho-primary text-lg font-semibold", t),
+  return /* @__PURE__ */ o(a.Title, {
+    className: e("text-pho-primary font-display text-display-sm font-medium text-balance", t),
     ...r
   });
 }
 function f({ className: t, ...r }) {
-  return /* @__PURE__ */ o(e.Description, {
-    className: a("text-pho-tertiary mt-1 text-sm", t),
+  return /* @__PURE__ */ o(a.Description, {
+    className: e("text-pho-description text-display-xs mt-1 font-normal", t),
     ...r
   });
 }

package/dist/components/drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.js","names":[],"sources":["../../src/components/drawer/drawer.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { Drawer as BaseDrawer } from \"@base-ui/react/drawer\";\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\nconst Root = BaseDrawer.Root;\nconst Trigger = BaseDrawer.Trigger;\nconst Portal = BaseDrawer.Portal;\nconst Close = BaseDrawer.Close;\n\nfunction Backdrop({\n  className,\n  ...props\n}: StyledProps<typeof BaseDrawer.Backdrop>) {\n  return (\n    <BaseDrawer.Backdrop\n      className={cn(\n        \"bg-pho-overlay fixed inset-0 z-50 backdrop-blur-[2px] transition-opacity duration-300 ease-out\",\n        \"data-[ending-style]:opacity-0 data-[starting-style]:opacity-0 data-[swiping]:duration-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Viewport({\n  className,\n  ...props\n}: StyledProps<typeof BaseDrawer.Viewport>) {\n  return (\n    <BaseDrawer.Viewport\n      className={cn(\n        \"fixed inset-0 z-50 flex items-stretch justify-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({ className, ...props }: StyledProps<typeof BaseDrawer.Popup>) {\n  return (\n    <BaseDrawer.Popup\n      className={cn(\n        // Floating layer: keeps its elevation shadow; hairline edge is the\n        // site card stroke (border-pho-secondary), not the interactive edge.\n        \"squircle border-pho-secondary bg-pho-primary shadow-pho-xl h-full w-[22rem] max-w-[calc(100vw-3rem)] overflow-y-auto overscroll-contain border-l p-6 outline-none\",\n        \"[transform:translateX(var(--drawer-swipe-movement-x,0px))] transition-transform duration-300 ease-out\",\n        \"data-[ending-style]:translate-x-full data-[starting-style]:translate-x-full data-[swiping]:duration-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Content({\n  className,\n  ...props\n}: StyledProps<typeof BaseDrawer.Content>) {\n  return (\n    <BaseDrawer.Content\n      className={cn(\"flex h-full flex-col\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Title({ className, ...props }: StyledProps<typeof BaseDrawer.Title>) {\n  return (\n    <BaseDrawer.Title\n      className={cn(\"text-pho-primary text-lg font-semibold\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Description({\n  className,\n  ...props\n}: StyledProps<typeof BaseDrawer.Description>) {\n  return (\n    <BaseDrawer.Description\n      className={cn(\"text-pho-tertiary mt-1 text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Drawer built on Base UI `Drawer` — a panel that slides in from the edge\n * (here, the right) with swipe-to-dismiss. Use it for secondary tasks and\n * navigation that should keep page context; for a forced decision use\n * `AlertDialog`, and for a centered modal use `Dialog`. Compose `Drawer.Portal`\n * → `Backdrop` → `Viewport` → `Popup` → `Content`.\n */\nexport const Drawer = {\n  Root,\n  Trigger,\n  Portal,\n  Backdrop,\n  Viewport,\n  Popup,\n  Content,\n  Title,\n  Description,\n  Close,\n};\n"],"mappings":";;;;;AAYA,IAAM,IAAO,EAAW,MAClB,IAAU,EAAW,SACrB,IAAS,EAAW,QACpB,IAAQ,EAAW;AAEzB,SAAS,EAAS,EAChB,WAAA,GACA,GAAG,EAAA,GACuC;AAC1C,SACE,gBAAA,EAAC,EAAW,UAAZ;AAAA,IACE,WAAW,EACT,kGACA,2FACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAS,EAChB,WAAA,GACA,GAAG,EAAA,GACuC;AAC1C,SACE,gBAAA,EAAC,EAAW,UAAZ;AAAA,IACE,WAAW,EACT,qDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EAAE,WAAA,GAAW,GAAG,EAAA,GAA+C;AAC5E,SACE,gBAAA,EAAC,EAAW,OAAZ;AAAA,IACE,WAAW,EAGT,qKACA,yGACA,yGACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAQ,EACf,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAW,SAAZ;AAAA,IACE,WAAW,EAAG,wBAAwB,CAAS;AAAA,IAC/C,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EAAE,WAAA,GAAW,GAAG,EAAA,GAA+C;AAC5E,SACE,gBAAA,EAAC,EAAW,OAAZ;AAAA,IACE,WAAW,EAAG,0CAA0C,CAAS;AAAA,IACjE,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAY,EACnB,WAAA,GACA,GAAG,EAAA,GAC0C;AAC7C,SACE,gBAAA,EAAC,EAAW,aAAZ;AAAA,IACE,WAAW,EAAG,kCAAkC,CAAS;AAAA,IACzD,GAAI;AAAA,EACL,CAAA;AAEL;AASA,IAAa,IAAS;AAAA,EACpB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA;AAAA,EACA,UAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA;AAAA,EACA,OAAA;AACF"}
+{"version":3,"file":"drawer.js","names":[],"sources":["../../src/components/drawer/drawer.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { Drawer as BaseDrawer } from \"@base-ui/react/drawer\";\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\nconst Root = BaseDrawer.Root;\nconst Trigger = BaseDrawer.Trigger;\nconst Portal = BaseDrawer.Portal;\nconst Close = BaseDrawer.Close;\n\nfunction Backdrop({\n  className,\n  ...props\n}: StyledProps<typeof BaseDrawer.Backdrop>) {\n  return (\n    <BaseDrawer.Backdrop\n      className={cn(\n        \"bg-pho-overlay fixed inset-0 z-50 transition-opacity duration-300 ease-out\",\n        \"data-[ending-style]:opacity-0 data-[starting-style]:opacity-0 data-[swiping]:duration-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Viewport({\n  className,\n  ...props\n}: StyledProps<typeof BaseDrawer.Viewport>) {\n  return (\n    <BaseDrawer.Viewport\n      className={cn(\n        \"fixed inset-0 z-50 flex items-stretch justify-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({ className, ...props }: StyledProps<typeof BaseDrawer.Popup>) {\n  return (\n    <BaseDrawer.Popup\n      className={cn(\n        // Floating layer: keeps its elevation shadow; hairline edge is the\n        // site card stroke (border-pho-secondary), not the interactive edge.\n        \"border-pho-secondary bg-pho-primary shadow-pho-xl h-full w-[22rem] max-w-[calc(100vw-3rem)] overflow-y-auto overscroll-contain border-l p-6 outline-none\",\n        \"[transform:translateX(var(--drawer-swipe-movement-x,0px))] transition-transform duration-300 ease-out\",\n        \"data-[ending-style]:translate-x-full data-[starting-style]:translate-x-full data-[swiping]:duration-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Content({\n  className,\n  ...props\n}: StyledProps<typeof BaseDrawer.Content>) {\n  return (\n    <BaseDrawer.Content\n      className={cn(\"flex h-full flex-col\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Title({ className, ...props }: StyledProps<typeof BaseDrawer.Title>) {\n  return (\n    <BaseDrawer.Title\n      className={cn(\n        \"text-pho-primary font-display text-display-sm font-medium text-balance\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Description({\n  className,\n  ...props\n}: StyledProps<typeof BaseDrawer.Description>) {\n  return (\n    <BaseDrawer.Description\n      className={cn(\n        \"text-pho-description text-display-xs mt-1 font-normal\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Drawer built on Base UI `Drawer` — a panel that slides in from the edge\n * (here, the right) with swipe-to-dismiss. Use it for secondary tasks and\n * navigation that should keep page context; for a forced decision use\n * `AlertDialog`, and for a centered modal use `Dialog`. Compose `Drawer.Portal`\n * → `Backdrop` → `Viewport` → `Popup` → `Content`.\n */\nexport const Drawer = {\n  Root,\n  Trigger,\n  Portal,\n  Backdrop,\n  Viewport,\n  Popup,\n  Content,\n  Title,\n  Description,\n  Close,\n};\n"],"mappings":";;;;;AAYA,IAAM,IAAO,EAAW,MAClB,IAAU,EAAW,SACrB,IAAS,EAAW,QACpB,IAAQ,EAAW;AAEzB,SAAS,EAAS,EAChB,WAAA,GACA,GAAG,EAAA,GACuC;AAC1C,SACE,gBAAA,EAAC,EAAW,UAAZ;AAAA,IACE,WAAW,EACT,8EACA,2FACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAS,EAChB,WAAA,GACA,GAAG,EAAA,GACuC;AAC1C,SACE,gBAAA,EAAC,EAAW,UAAZ;AAAA,IACE,WAAW,EACT,qDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EAAE,WAAA,GAAW,GAAG,EAAA,GAA+C;AAC5E,SACE,gBAAA,EAAC,EAAW,OAAZ;AAAA,IACE,WAAW,EAGT,4JACA,yGACA,yGACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAQ,EACf,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAW,SAAZ;AAAA,IACE,WAAW,EAAG,wBAAwB,CAAS;AAAA,IAC/C,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EAAE,WAAA,GAAW,GAAG,EAAA,GAA+C;AAC5E,SACE,gBAAA,EAAC,EAAW,OAAZ;AAAA,IACE,WAAW,EACT,0EACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAY,EACnB,WAAA,GACA,GAAG,EAAA,GAC0C;AAC7C,SACE,gBAAA,EAAC,EAAW,aAAZ;AAAA,IACE,WAAW,EACT,yDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AASA,IAAa,IAAS;AAAA,EACpB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA;AAAA,EACA,UAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA;AAAA,EACA,OAAA;AACF"}