@photon-ai/pho-ui 0.1.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-menu.js","names":[],"sources":["../../src/components/navigation-menu/navigation-menu.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { NavigationMenu as BaseNav } from \"@base-ui/react/navigation-menu\";\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\nfunction Root({ className, ...props }: StyledProps<typeof BaseNav.Root>) {\n  return (\n    <BaseNav.Root className={cn(\"relative min-w-max\", className)} {...props} />\n  );\n}\n\nfunction List({ className, ...props }: StyledProps<typeof BaseNav.List>) {\n  return (\n    <BaseNav.List\n      className={cn(\"relative flex items-center gap-1\", className)}\n      {...props}\n    />\n  );\n}\n\nconst Item = BaseNav.Item;\nconst Icon = BaseNav.Icon;\n\nfunction Trigger({ className, ...props }: StyledProps<typeof BaseNav.Trigger>) {\n  return (\n    <BaseNav.Trigger\n      className={cn(\n        \"outline-pho-brand text-pho-secondary hover:bg-pho-secondary data-[popup-open]:bg-pho-secondary inline-flex cursor-pointer items-center gap-1 rounded-md px-3 py-2 text-sm font-medium transition focus-visible:outline-2 focus-visible:-outline-offset-1\",\n        \"[&>svg]:size-4 [&>svg]:transition-transform [&>svg]:duration-150 data-[popup-open]:[&>svg]:rotate-180\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Content({ className, ...props }: StyledProps<typeof BaseNav.Content>) {\n  return <BaseNav.Content className={cn(\"w-full p-2\", className)} {...props} />;\n}\n\nfunction Link({ className, ...props }: StyledProps<typeof BaseNav.Link>) {\n  return (\n    <BaseNav.Link\n      className={cn(\n        \"outline-pho-brand text-pho-secondary hover:bg-pho-secondary hover:text-pho-primary block rounded-lg px-3 py-2 text-sm transition focus-visible:outline-2 focus-visible:-outline-offset-1\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nconst Portal = BaseNav.Portal;\n\nfunction Positioner({\n  className,\n  sideOffset = 8,\n  ...props\n}: StyledProps<typeof BaseNav.Positioner>) {\n  return (\n    <BaseNav.Positioner\n      sideOffset={sideOffset}\n      className={cn(\"z-50\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({ className, ...props }: StyledProps<typeof BaseNav.Popup>) {\n  return (\n    <BaseNav.Popup\n      className={cn(\n        \"squircle bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-interactive relative h-[var(--popup-height)] w-[var(--popup-width)] origin-[var(--transform-origin)] rounded-xl ring-1 transition-[opacity,transform,width,height] 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 Viewport({\n  className,\n  ...props\n}: StyledProps<typeof BaseNav.Viewport>) {\n  return (\n    <BaseNav.Viewport\n      className={cn(\"relative h-full w-full overflow-hidden\", className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Site navigation menu built on Base UI `NavigationMenu` — a horizontal bar\n * whose items open animated dropdown panels that resize to their content. Each\n * `Item` pairs a `Trigger` with `Content` (rendered into the shared\n * `Viewport`). Use it for primary site nav with grouped links; for app action\n * menus use `Menu`.\n */\nexport const NavigationMenu = {\n  Root,\n  List,\n  Item,\n  Trigger,\n  Content,\n  Link,\n  Icon,\n  Portal,\n  Positioner,\n  Popup,\n  Viewport,\n};\n"],"mappings":";;;;;AAYA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAA2C;AACvE,SACE,gBAAA,EAAC,EAAQ,MAAT;AAAA,IAAc,WAAW,EAAG,sBAAsB,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE9E;AAEA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAA2C;AACvE,SACE,gBAAA,EAAC,EAAQ,MAAT;AAAA,IACE,WAAW,EAAG,oCAAoC,CAAS;AAAA,IAC3D,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,IAAM,IAAO,EAAQ,MACf,IAAO,EAAQ;AAErB,SAAS,EAAQ,EAAE,WAAA,GAAW,GAAG,EAAA,GAA8C;AAC7E,SACE,gBAAA,EAAC,EAAQ,SAAT;AAAA,IACE,WAAW,EACT,4PACA,yGACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAQ,EAAE,WAAA,GAAW,GAAG,EAAA,GAA8C;AAC7E,SAAO,gBAAA,EAAC,EAAQ,SAAT;AAAA,IAAiB,WAAW,EAAG,cAAc,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAC9E;AAEA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAA2C;AACvE,SACE,gBAAA,EAAC,EAAQ,MAAT;AAAA,IACE,WAAW,EACT,4LACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,IAAM,IAAS,EAAQ;AAEvB,SAAS,EAAW,EAClB,WAAA,GACA,YAAA,IAAa,GACb,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAQ,YAAT;AAAA,IACc,YAAA;AAAA,IACZ,WAAW,EAAG,QAAQ,CAAS;AAAA,IAC/B,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EAAE,WAAA,GAAW,GAAG,EAAA,GAA4C;AACzE,SACE,gBAAA,EAAC,EAAQ,OAAT;AAAA,IACE,WAAW,EACT,oRACA,kEACA,8DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAS,EAChB,WAAA,GACA,GAAG,EAAA,GACoC;AACvC,SACE,gBAAA,EAAC,EAAQ,UAAT;AAAA,IACE,WAAW,EAAG,0CAA0C,CAAS;AAAA,IACjE,GAAI;AAAA,EACL,CAAA;AAEL;AASA,IAAa,IAAiB;AAAA,EAC5B,MAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,UAAA;AACF"}

package/dist/components/notification.js

@@ -0,0 +1,91 @@
+"use client";
+import { t } from "../chunks/cn-D6jQqeRj.js";
+import { t as v } from "../chunks/resolve-variant-CcD8iG5l.js";
+import "react";
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { CheckCircle as N, Info as n, WarningCircle as l, X as y } from "@phosphor-icons/react";
+var w = {
+  brand: {
+    classes: "text-fg-pho-brand",
+    description: "Informational / product update (default)"
+  },
+  gray: {
+    classes: "text-fg-pho-secondary",
+    description: "Neutral, low-stakes note"
+  },
+  success: {
+    classes: "text-pho-success",
+    description: "An action completed"
+  },
+  warning: {
+    classes: "text-pho-warning",
+    description: "Needs attention, not yet failed"
+  },
+  error: {
+    classes: "text-fg-pho-error",
+    description: "Something went wrong"
+  }
+}, C = {
+  brand: n,
+  gray: n,
+  success: N,
+  warning: l,
+  error: l
+}, c = "cursor-pointer text-sm font-semibold outline-pho-brand transition duration-100 ease-linear focus-visible:outline-2 focus-visible:outline-offset-2";
+function I({ color: i = "brand", title: d, description: o, confirmLabel: a, onConfirm: p, dismissLabel: h = "Dismiss", onClose: s, icon: u, className: m, ref: f, ...x }) {
+  const g = u ?? C[i], b = !!a;
+  return /* @__PURE__ */ r("div", {
+    ref: f,
+    ...x,
+    className: t("squircle ring-pho-interactive bg-pho-primary shadow-pho-lg relative flex w-full max-w-sm gap-4 rounded-xl p-4 ring-1 ring-inset", m),
+    children: [
+      /* @__PURE__ */ e(g, {
+        "aria-hidden": "true",
+        className: t("mt-0.5 size-5 shrink-0", v(w, i))
+      }),
+      /* @__PURE__ */ r("div", {
+        className: "flex flex-1 flex-col gap-3 pr-6",
+        children: [/* @__PURE__ */ r("div", {
+          className: "flex flex-col gap-1",
+          children: [/* @__PURE__ */ e("p", {
+            className: "text-pho-primary text-sm font-semibold",
+            children: d
+          }), o != null && o !== !1 && /* @__PURE__ */ e("p", {
+            className: "text-pho-tertiary text-sm",
+            children: o
+          })]
+        }), b && /* @__PURE__ */ r("div", {
+          className: "flex gap-4",
+          children: [/* @__PURE__ */ e("button", {
+            type: "button",
+            onClick: p,
+            className: t(c, "text-pho-brand hover:text-pho-brand-hover"),
+            children: a
+          }), /* @__PURE__ */ e("button", {
+            type: "button",
+            onClick: s,
+            className: t(c, "text-pho-secondary hover:text-pho-secondary-hover"),
+            children: h
+          })]
+        })]
+      }),
+      s && /* @__PURE__ */ e("button", {
+        type: "button",
+        onClick: s,
+        "aria-label": "Dismiss",
+        className: "text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover hover:bg-pho-secondary outline-pho-brand absolute top-2.5 right-2.5 flex size-6 cursor-pointer items-center justify-center rounded-md transition focus-visible:outline-2 [&>svg]:size-4",
+        children: /* @__PURE__ */ e(y, {
+          "aria-hidden": "true",
+          weight: "bold"
+        })
+      })
+    ]
+  });
+}
+I.displayName = "Notification";
+export {
+  w as NOTIFICATION_COLORS,
+  I as Notification
+};
+
+//# sourceMappingURL=notification.js.map

package/dist/components/notification.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"notification.js","names":[],"sources":["../../src/components/notification/notification.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, type Ref } from \"react\";\nimport {\n  CheckCircle,\n  Info,\n  WarningCircle,\n  X,\n  type Icon,\n} from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant, type VariantMap } from \"../../utils/resolve-variant\";\n\n/**\n * Design notes (Geist-aligned):\n * - ONE closed, semantic axis: `color`. It selects a status glyph *and* its\n *   tint together — you never pick an icon and a color separately. This is the\n *   `IconNotification` flavor from the app; the unused avatar/image variants of\n *   the source family are intentionally dropped.\n * - The action row is a single reduced pair: a brand `confirmLabel` link beside\n *   a gray dismiss link. It appears only when there's something to confirm.\n * - `onClose` is the only thing that renders the top-right close button — no\n *   separate boolean flag to keep in sync.\n */\n\n/** Status color → icon tint. A bare status-tinted glyph, no badge surface. */\nexport const NOTIFICATION_COLORS = {\n  brand: {\n    classes: \"text-fg-pho-brand\",\n    description: \"Informational / product update (default)\",\n  },\n  gray: {\n    classes: \"text-fg-pho-secondary\",\n    description: \"Neutral, low-stakes note\",\n  },\n  success: {\n    classes: \"text-pho-success\",\n    description: \"An action completed\",\n  },\n  warning: {\n    classes: \"text-pho-warning\",\n    description: \"Needs attention, not yet failed\",\n  },\n  error: {\n    classes: \"text-fg-pho-error\",\n    description: \"Something went wrong\",\n  },\n} satisfies VariantMap;\n\nexport type NotificationColor = keyof typeof NOTIFICATION_COLORS;\n\n/** Status color → glyph. Mirrors the source's `iconMap` semantics. */\nconst ICON_MAP = {\n  brand: Info,\n  gray: Info,\n  success: CheckCircle,\n  warning: WarningCircle,\n  error: WarningCircle,\n} satisfies Record<NotificationColor, Icon>;\n\nexport interface NotificationProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  \"title\" | \"color\"\n> {\n  /** Status color — selects the glyph and its tint. @default \"brand\" */\n  color?: NotificationColor;\n  /** Bold heading line. */\n  title: ReactNode;\n  /** Supporting line under the title. */\n  description?: ReactNode;\n  /** Confirm action label — renders a brand link paired with a dismiss link. */\n  confirmLabel?: string;\n  /** Called when the confirm link is clicked. */\n  onConfirm?: () => void;\n  /** Dismiss link label, shown beside the confirm link. @default \"Dismiss\" */\n  dismissLabel?: string;\n  /** Called on dismiss. Its presence also renders the top-right close button. */\n  onClose?: () => void;\n  /** Override the status glyph while keeping the color's tint. */\n  icon?: Icon;\n  className?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst LINK_CLASS =\n  \"cursor-pointer text-sm font-semibold outline-pho-brand transition duration-100 ease-linear focus-visible:outline-2 focus-visible:outline-offset-2\";\n\n/**\n * Notification — the standalone status card ported from the app's\n * `IconNotification`: a status glyph, a title/description, an optional\n * confirm+dismiss link pair, and an optional close button. It is a *card*, not a\n * lifecycle: it owns its surface but nothing about timing or stacking.\n *\n * For a transient, auto-stacking toast, drop it inside pho-ui's Base UI\n * {@link Toast} — render it as the child of a `Toast.Root` whose own surface you\n * neutralize (`className=\"bg-transparent p-0 shadow-none ring-0\"`) so the\n * manager owns motion and swipe while this card owns the look. For a choice the\n * user must make, use `AlertDialog` instead.\n */\nexport function Notification({\n  color = \"brand\",\n  title,\n  description,\n  confirmLabel,\n  onConfirm,\n  dismissLabel = \"Dismiss\",\n  onClose,\n  icon,\n  className,\n  ref,\n  ...props\n}: NotificationProps) {\n  const Glyph = icon ?? ICON_MAP[color];\n  const showActions = Boolean(confirmLabel);\n\n  return (\n    <div\n      ref={ref}\n      {...props}\n      className={cn(\n        \"squircle ring-pho-interactive bg-pho-primary shadow-pho-lg relative flex w-full max-w-sm gap-4 rounded-xl p-4 ring-1 ring-inset\",\n        className,\n      )}\n    >\n      <Glyph\n        aria-hidden=\"true\"\n        className={cn(\n          \"mt-0.5 size-5 shrink-0\",\n          resolveVariant(NOTIFICATION_COLORS, color),\n        )}\n      />\n\n      <div className=\"flex flex-1 flex-col gap-3 pr-6\">\n        <div className=\"flex flex-col gap-1\">\n          <p className=\"text-pho-primary text-sm font-semibold\">{title}</p>\n          {description != null && description !== false && (\n            <p className=\"text-pho-tertiary text-sm\">{description}</p>\n          )}\n        </div>\n\n        {showActions && (\n          <div className=\"flex gap-4\">\n            <button\n              type=\"button\"\n              onClick={onConfirm}\n              className={cn(\n                LINK_CLASS,\n                \"text-pho-brand hover:text-pho-brand-hover\",\n              )}\n            >\n              {confirmLabel}\n            </button>\n            <button\n              type=\"button\"\n              onClick={onClose}\n              className={cn(\n                LINK_CLASS,\n                \"text-pho-secondary hover:text-pho-secondary-hover\",\n              )}\n            >\n              {dismissLabel}\n            </button>\n          </div>\n        )}\n      </div>\n\n      {onClose && (\n        <button\n          type=\"button\"\n          onClick={onClose}\n          aria-label=\"Dismiss\"\n          className=\"text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover hover:bg-pho-secondary outline-pho-brand absolute top-2.5 right-2.5 flex size-6 cursor-pointer items-center justify-center rounded-md transition focus-visible:outline-2 [&>svg]:size-4\"\n        >\n          <X aria-hidden=\"true\" weight=\"bold\" />\n        </button>\n      )}\n    </div>\n  );\n}\n\nNotification.displayName = \"Notification\";\n"],"mappings":";;;;;;AAwBA,IAAa,IAAsB;AAAA,EACjC,OAAO;AAAA,IACL,SAAS;AAAA,IACT,aAAa;AAAA,EACf;AAAA,EACA,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,aAAa;AAAA,EACf;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,aAAa;AAAA,EACf;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,aAAa;AAAA,EACf;AAAA,EACA,OAAO;AAAA,IACL,SAAS;AAAA,IACT,aAAa;AAAA,EACf;AACF,GAKM,IAAW;AAAA,EACf,OAAO;AAAA,EACP,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AACT,GA0BM,IACJ;AAcF,SAAgB,EAAa,EAC3B,OAAA,IAAQ,SACR,OAAA,GACA,aAAA,GACA,cAAA,GACA,WAAA,GACA,cAAA,IAAe,WACf,SAAA,GACA,MAAA,GACA,WAAA,GACA,KAAA,GACA,GAAG,EAAA,GACiB;AACpB,QAAM,IAAQ,KAAQ,EAAS,CAAA,GACzB,IAAc,EAAQ;AAE5B,SACE,gBAAA,EAAC,OAAD;AAAA,IACO,KAAA;AAAA,IACL,GAAI;AAAA,IACJ,WAAW,EACT,mIACA,CACF;AAAA,cANF;AAAA,MAQE,gBAAA,EAAC,GAAD;AAAA,QACE,eAAY;AAAA,QACZ,WAAW,EACT,0BACA,EAAe,GAAqB,CAAK,CAC3C;AAAA,MACD,CAAA;AAAA,MAED,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAf,CACE,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAAf,CACE,gBAAA,EAAC,KAAD;AAAA,YAAG,WAAU;AAAA,sBAA0C;AAAA,UAAS,CAAA,GAC/D,KAAe,QAAQ,MAAgB,MACtC,gBAAA,EAAC,KAAD;AAAA,YAAG,WAAU;AAAA,sBAA6B;AAAA,UAAe,CAAA,CAExD;AAAA,YAEJ,KACC,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAAf,CACE,gBAAA,EAAC,UAAD;AAAA,YACE,MAAK;AAAA,YACL,SAAS;AAAA,YACT,WAAW,EACT,GACA,2CACF;AAAA,sBAEC;AAAA,UACK,CAAA,GACR,gBAAA,EAAC,UAAD;AAAA,YACE,MAAK;AAAA,YACL,SAAS;AAAA,YACT,WAAW,EACT,GACA,mDACF;AAAA,sBAEC;AAAA,UACK,CAAA,CACL;AAAA,UAEJ;AAAA;MAEJ,KACC,gBAAA,EAAC,UAAD;AAAA,QACE,MAAK;AAAA,QACL,SAAS;AAAA,QACT,cAAW;AAAA,QACX,WAAU;AAAA,kBAEV,gBAAA,EAAC,GAAD;AAAA,UAAG,eAAY;AAAA,UAAO,QAAO;AAAA,QAAQ,CAAA;AAAA,MAC/B,CAAA;AAAA,IAEP;AAAA;AAET;AAEA,EAAa,cAAc"}

package/dist/components/number-field.js

@@ -0,0 +1,56 @@
+"use client";
+import { t as n } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as o } from "react/jsx-runtime";
+import { NumberField as t } from "@base-ui/react/number-field";
+function i({ className: r, ...e }) {
+  return /* @__PURE__ */ o(t.Root, {
+    className: n("flex flex-col gap-1.5", r),
+    ...e
+  });
+}
+function s({ className: r, ...e }) {
+  return /* @__PURE__ */ o(t.Group, {
+    className: n("bg-pho-primary shadow-pho-xs ring-pho-primary inline-flex items-stretch rounded-lg ring-1 transition-shadow duration-100 ease-linear ring-inset", "has-[input:focus-visible]:ring-pho-brand has-[input:focus-visible]:ring-2", r),
+    ...e
+  });
+}
+var a = n("text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover hover:bg-pho-primary-hover flex w-9 cursor-pointer items-center justify-center transition duration-100 ease-linear select-none first:rounded-l-lg last:rounded-r-lg", "disabled:cursor-not-allowed disabled:opacity-50 [&>svg]:size-4");
+function u({ className: r, ...e }) {
+  return /* @__PURE__ */ o(t.Decrement, {
+    className: n(a, r),
+    ...e
+  });
+}
+function c({ className: r, ...e }) {
+  return /* @__PURE__ */ o(t.Increment, {
+    className: n(a, r),
+    ...e
+  });
+}
+function l({ className: r, ...e }) {
+  return /* @__PURE__ */ o(t.Input, {
+    className: n("text-pho-primary text-md w-16 border-x border-[var(--border-color-pho-secondary)] bg-transparent px-2 py-2 text-center tabular-nums outline-none", r),
+    ...e
+  });
+}
+function p({ className: r, ...e }) {
+  return /* @__PURE__ */ o(t.ScrubArea, {
+    className: n("cursor-ew-resize select-none", r),
+    ...e
+  });
+}
+var h = {
+  Root: i,
+  Group: s,
+  Decrement: u,
+  Increment: c,
+  Input: l,
+  ScrubArea: p,
+  ScrubAreaCursor: t.ScrubAreaCursor
+};
+export {
+  h as NumberField
+};
+
+//# sourceMappingURL=number-field.js.map

package/dist/components/number-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-field.js","names":[],"sources":["../../src/components/number-field/number-field.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { NumberField as BaseNumberField } from \"@base-ui/react/number-field\";\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\nfunction Root({\n  className,\n  ...props\n}: StyledProps<typeof BaseNumberField.Root>) {\n  return (\n    <BaseNumberField.Root\n      className={cn(\"flex flex-col gap-1.5\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Group({\n  className,\n  ...props\n}: StyledProps<typeof BaseNumberField.Group>) {\n  return (\n    <BaseNumberField.Group\n      className={cn(\n        \"bg-pho-primary shadow-pho-xs ring-pho-primary inline-flex items-stretch rounded-lg ring-1 transition-shadow duration-100 ease-linear ring-inset\",\n        \"has-[input:focus-visible]:ring-pho-brand has-[input:focus-visible]:ring-2\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nconst STEPPER = cn(\n  \"text-fg-pho-quaternary hover:text-fg-pho-quaternary-hover hover:bg-pho-primary-hover flex w-9 cursor-pointer items-center justify-center transition duration-100 ease-linear select-none first:rounded-l-lg last:rounded-r-lg\",\n  \"disabled:cursor-not-allowed disabled:opacity-50 [&>svg]:size-4\",\n);\n\nfunction Decrement({\n  className,\n  ...props\n}: StyledProps<typeof BaseNumberField.Decrement>) {\n  return (\n    <BaseNumberField.Decrement className={cn(STEPPER, className)} {...props} />\n  );\n}\n\nfunction Increment({\n  className,\n  ...props\n}: StyledProps<typeof BaseNumberField.Increment>) {\n  return (\n    <BaseNumberField.Increment className={cn(STEPPER, className)} {...props} />\n  );\n}\n\nfunction Input({\n  className,\n  ...props\n}: StyledProps<typeof BaseNumberField.Input>) {\n  return (\n    <BaseNumberField.Input\n      className={cn(\n        \"text-pho-primary text-md w-16 border-x border-[var(--border-color-pho-secondary)] bg-transparent px-2 py-2 text-center tabular-nums outline-none\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ScrubArea({\n  className,\n  ...props\n}: StyledProps<typeof BaseNumberField.ScrubArea>) {\n  return (\n    <BaseNumberField.ScrubArea\n      className={cn(\"cursor-ew-resize select-none\", className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Numeric input with stepper buttons, built on Base UI `NumberField`. Compose\n * `NumberField.Group` with a `Decrement`, `Input`, and `Increment`; it handles\n * clamping, keyboard step, and pointer scrubbing. Use it over a plain text\n * input whenever the value is a number with a sensible range.\n */\nexport const NumberField = {\n  Root,\n  Group,\n  Decrement,\n  Increment,\n  Input,\n  ScrubArea,\n  ScrubAreaCursor: BaseNumberField.ScrubAreaCursor,\n};\n"],"mappings":";;;;;AAYA,SAAS,EAAK,EACZ,WAAA,GACA,GAAG,EAAA,GACwC;AAC3C,SACE,gBAAA,EAAC,EAAgB,MAAjB;AAAA,IACE,WAAW,EAAG,yBAAyB,CAAS;AAAA,IAChD,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACyC;AAC5C,SACE,gBAAA,EAAC,EAAgB,OAAjB;AAAA,IACE,WAAW,EACT,mJACA,6EACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,IAAM,IAAU,EACd,iOACA,gEACF;AAEA,SAAS,EAAU,EACjB,WAAA,GACA,GAAG,EAAA,GAC6C;AAChD,SACE,gBAAA,EAAC,EAAgB,WAAjB;AAAA,IAA2B,WAAW,EAAG,GAAS,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE9E;AAEA,SAAS,EAAU,EACjB,WAAA,GACA,GAAG,EAAA,GAC6C;AAChD,SACE,gBAAA,EAAC,EAAgB,WAAjB;AAAA,IAA2B,WAAW,EAAG,GAAS,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE9E;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACyC;AAC5C,SACE,gBAAA,EAAC,EAAgB,OAAjB;AAAA,IACE,WAAW,EACT,oJACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAU,EACjB,WAAA,GACA,GAAG,EAAA,GAC6C;AAChD,SACE,gBAAA,EAAC,EAAgB,WAAjB;AAAA,IACE,WAAW,EAAG,gCAAgC,CAAS;AAAA,IACvD,GAAI;AAAA,EACL,CAAA;AAEL;AAQA,IAAa,IAAc;AAAA,EACzB,MAAA;AAAA,EACA,OAAA;AAAA,EACA,WAAA;AAAA,EACA,WAAA;AAAA,EACA,OAAA;AAAA,EACA,WAAA;AAAA,EACA,iBAAiB,EAAgB;AACnC"}

package/dist/components/otp-field.js

@@ -0,0 +1,19 @@
+"use client";
+import { t as r } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as e } from "react/jsx-runtime";
+import { OTPField as o } from "@base-ui/react/otp-field";
+function s({ className: t, length: i, ...a }) {
+  return /* @__PURE__ */ e(o.Root, {
+    length: i,
+    className: r("flex items-center gap-2", t),
+    ...a,
+    children: Array.from({ length: i }, (d, n) => /* @__PURE__ */ e(o.Input, { className: r("squircle bg-pho-primary shadow-pho-xs ring-pho-primary text-pho-primary size-11 rounded-lg text-center text-lg font-medium ring-1 transition-shadow duration-100 ease-linear outline-none ring-inset", "focus-visible:ring-pho-brand focus-visible:ring-2", "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50") }, n))
+  });
+}
+s.displayName = "OtpField";
+export {
+  s as OtpField
+};
+
+//# sourceMappingURL=otp-field.js.map

package/dist/components/otp-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"otp-field.js","names":[],"sources":["../../src/components/otp-field/otp-field.tsx"],"sourcesContent":["import { type ComponentProps } from \"react\";\nimport { OTPField as BaseOTPField } from \"@base-ui/react/otp-field\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface OtpFieldProps extends Omit<\n  ComponentProps<typeof BaseOTPField.Root>,\n  \"className\"\n> {\n  /** Class applied to the cell row. */\n  className?: string;\n  /** Number of single-character cells. */\n  length: number;\n}\n\n/**\n * One-time-code input built on Base UI `OTPField` — a row of single-character\n * cells with paste, arrow-key, and auto-advance handling. Control with `value`\n * / `onValueChange`, or read the completed code via `onValueChange`.\n */\nexport function OtpField({ className, length, ...props }: OtpFieldProps) {\n  return (\n    <BaseOTPField.Root\n      length={length}\n      className={cn(\"flex items-center gap-2\", className)}\n      {...props}\n    >\n      {Array.from({ length }, (_, i) => (\n        <BaseOTPField.Input\n          key={i}\n          className={cn(\n            \"squircle bg-pho-primary shadow-pho-xs ring-pho-primary text-pho-primary size-11 rounded-lg text-center text-lg font-medium ring-1 transition-shadow duration-100 ease-linear outline-none ring-inset\",\n            \"focus-visible:ring-pho-brand focus-visible:ring-2\",\n            \"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n          )}\n        />\n      ))}\n    </BaseOTPField.Root>\n  );\n}\n\nOtpField.displayName = \"OtpField\";\n"],"mappings":";;;;;AAmBA,SAAgB,EAAS,EAAE,WAAA,GAAW,QAAA,GAAQ,GAAG,EAAA,GAAwB;AACvE,SACE,gBAAA,EAAC,EAAa,MAAd;AAAA,IACU,QAAA;AAAA,IACR,WAAW,EAAG,2BAA2B,CAAS;AAAA,IAClD,GAAI;AAAA,cAEH,MAAM,KAAK,EAAE,QAAA,EAAO,GAAA,CAAI,GAAG,MAC1B,gBAAA,EAAC,EAAa,OAAd,EAEE,WAAW,EACT,wMACA,qDACA,+DACF,EACD,GANM,CAMN,CACF;AAAA,EACgB,CAAA;AAEvB;AAEA,EAAS,cAAc"}

package/dist/components/popover.js

@@ -0,0 +1,46 @@
+"use client";
+import { t as e } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as i } from "react/jsx-runtime";
+import { Popover as t } from "@base-ui/react/popover";
+var n = t.Root, s = t.Trigger, p = t.Portal, l = t.Close;
+function m({ className: r, sideOffset: o = 8, ...a }) {
+  return /* @__PURE__ */ i(t.Positioner, {
+    sideOffset: o,
+    className: e("z-50", r),
+    ...a
+  });
+}
+function c({ className: r, ...o }) {
+  return /* @__PURE__ */ i(t.Popup, {
+    className: e("squircle bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-interactive max-w-[calc(100vw-2rem)] origin-[var(--transform-origin)] rounded-xl p-4 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", r),
+    ...o
+  });
+}
+function u({ className: r, ...o }) {
+  return /* @__PURE__ */ i(t.Title, {
+    className: e("text-pho-primary text-sm font-semibold", r),
+    ...o
+  });
+}
+function g({ className: r, ...o }) {
+  return /* @__PURE__ */ i(t.Description, {
+    className: e("text-pho-tertiary mt-1 text-sm", r),
+    ...o
+  });
+}
+var x = {
+  Root: n,
+  Trigger: s,
+  Portal: p,
+  Positioner: m,
+  Popup: c,
+  Title: u,
+  Description: g,
+  Close: l
+};
+export {
+  x as Popover
+};
+
+//# sourceMappingURL=popover.js.map

package/dist/components/popover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover.js","names":[],"sources":["../../src/components/popover/popover.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { Popover as BasePopover } from \"@base-ui/react/popover\";\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 = BasePopover.Root;\nconst Trigger = BasePopover.Trigger;\nconst Portal = BasePopover.Portal;\nconst Close = BasePopover.Close;\n\nfunction Positioner({\n  className,\n  sideOffset = 8,\n  ...props\n}: StyledProps<typeof BasePopover.Positioner>) {\n  return (\n    <BasePopover.Positioner\n      sideOffset={sideOffset}\n      className={cn(\"z-50\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({ className, ...props }: StyledProps<typeof BasePopover.Popup>) {\n  return (\n    <BasePopover.Popup\n      className={cn(\n        \"squircle bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-interactive max-w-[calc(100vw-2rem)] origin-[var(--transform-origin)] rounded-xl p-4 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 Title({ className, ...props }: StyledProps<typeof BasePopover.Title>) {\n  return (\n    <BasePopover.Title\n      className={cn(\"text-pho-primary text-sm font-semibold\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Description({\n  className,\n  ...props\n}: StyledProps<typeof BasePopover.Description>) {\n  return (\n    <BasePopover.Description\n      className={cn(\"text-pho-tertiary mt-1 text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Popover built on Base UI `Popover` — a click-triggered floating panel\n * anchored to its trigger, for rich, interactive content (forms, menus of\n * actions, details). Unlike a `Tooltip`, it can hold focusable controls and is\n * dismissed by clicking away or pressing Escape.\n */\nexport const Popover = {\n  Root,\n  Trigger,\n  Portal,\n  Positioner,\n  Popup,\n  Title,\n  Description,\n  Close,\n};\n"],"mappings":";;;;;AAYA,IAAM,IAAO,EAAY,MACnB,IAAU,EAAY,SACtB,IAAS,EAAY,QACrB,IAAQ,EAAY;AAE1B,SAAS,EAAW,EAClB,WAAA,GACA,YAAA,IAAa,GACb,GAAG,EAAA,GAC0C;AAC7C,SACE,gBAAA,EAAC,EAAY,YAAb;AAAA,IACc,YAAA;AAAA,IACZ,WAAW,EAAG,QAAQ,CAAS;AAAA,IAC/B,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgD;AAC7E,SACE,gBAAA,EAAC,EAAY,OAAb;AAAA,IACE,WAAW,EACT,4OACA,kEACA,8DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgD;AAC7E,SACE,gBAAA,EAAC,EAAY,OAAb;AAAA,IACE,WAAW,EAAG,0CAA0C,CAAS;AAAA,IACjE,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAY,EACnB,WAAA,GACA,GAAG,EAAA,GAC2C;AAC9C,SACE,gBAAA,EAAC,EAAY,aAAb;AAAA,IACE,WAAW,EAAG,kCAAkC,CAAS;AAAA,IACzD,GAAI;AAAA,EACL,CAAA;AAEL;AAQA,IAAa,IAAU;AAAA,EACrB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA;AAAA,EACA,OAAA;AACF"}

package/dist/components/preview-card.js

@@ -0,0 +1,31 @@
+"use client";
+import { t as i } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as o } from "react/jsx-runtime";
+import { PreviewCard as r } from "@base-ui/react/preview-card";
+var n = r.Root, s = r.Trigger, p = r.Portal;
+function g({ className: t, sideOffset: a = 8, ...e }) {
+  return /* @__PURE__ */ o(r.Positioner, {
+    sideOffset: a,
+    className: i("z-50", t),
+    ...e
+  });
+}
+function l({ className: t, ...a }) {
+  return /* @__PURE__ */ o(r.Popup, {
+    className: i("squircle bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-interactive w-72 origin-[var(--transform-origin)] rounded-xl p-4 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", t),
+    ...a
+  });
+}
+var v = {
+  Root: n,
+  Trigger: s,
+  Portal: p,
+  Positioner: g,
+  Popup: l
+};
+export {
+  v as PreviewCard
+};
+
+//# sourceMappingURL=preview-card.js.map

package/dist/components/preview-card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-card.js","names":[],"sources":["../../src/components/preview-card/preview-card.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { PreviewCard as BasePreviewCard } from \"@base-ui/react/preview-card\";\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 = BasePreviewCard.Root;\nconst Trigger = BasePreviewCard.Trigger;\nconst Portal = BasePreviewCard.Portal;\n\nfunction Positioner({\n  className,\n  sideOffset = 8,\n  ...props\n}: StyledProps<typeof BasePreviewCard.Positioner>) {\n  return (\n    <BasePreviewCard.Positioner\n      sideOffset={sideOffset}\n      className={cn(\"z-50\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({\n  className,\n  ...props\n}: StyledProps<typeof BasePreviewCard.Popup>) {\n  return (\n    <BasePreviewCard.Popup\n      className={cn(\n        \"squircle bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-interactive w-72 origin-[var(--transform-origin)] rounded-xl p-4 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\n/**\n * Preview card built on Base UI `PreviewCard` — a hover-triggered card that\n * previews what's behind a link (a profile, a repo, an article). Like a\n * `Tooltip` it opens on hover/focus, but it holds richer, non-essential\n * content. Keep the underlying link fully usable without opening the card.\n */\nexport const PreviewCard = { Root, Trigger, Portal, Positioner, Popup };\n"],"mappings":";;;;;AAYA,IAAM,IAAO,EAAgB,MACvB,IAAU,EAAgB,SAC1B,IAAS,EAAgB;AAE/B,SAAS,EAAW,EAClB,WAAA,GACA,YAAA,IAAa,GACb,GAAG,EAAA,GAC8C;AACjD,SACE,gBAAA,EAAC,EAAgB,YAAjB;AAAA,IACc,YAAA;AAAA,IACZ,WAAW,EAAG,QAAQ,CAAS;AAAA,IAC/B,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACyC;AAC5C,SACE,gBAAA,EAAC,EAAgB,OAAjB;AAAA,IACE,WAAW,EACT,wNACA,kEACA,8DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAQA,IAAa,IAAc;AAAA,EAAE,MAAA;AAAA,EAAM,SAAA;AAAA,EAAS,QAAA;AAAA,EAAQ,YAAA;AAAA,EAAY,OAAA;AAAM"}

package/dist/components/progress.js

@@ -0,0 +1,47 @@
+"use client";
+import { t as e } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as o } from "react/jsx-runtime";
+import { Progress as a } from "@base-ui/react/progress";
+function l({ className: r, ...t }) {
+  return /* @__PURE__ */ o(a.Root, {
+    className: e("flex w-full flex-col gap-2", r),
+    ...t
+  });
+}
+function n({ className: r, ...t }) {
+  return /* @__PURE__ */ o(a.Label, {
+    className: e("text-pho-secondary text-sm font-medium", r),
+    ...t
+  });
+}
+function s({ className: r, ...t }) {
+  return /* @__PURE__ */ o(a.Value, {
+    className: e("text-pho-tertiary text-sm tabular-nums", r),
+    ...t
+  });
+}
+function u({ className: r, ...t }) {
+  return /* @__PURE__ */ o(a.Track, {
+    className: e("bg-pho-tertiary relative h-2 w-full overflow-hidden rounded-full", r),
+    ...t
+  });
+}
+function i({ className: r, ...t }) {
+  return /* @__PURE__ */ o(a.Indicator, {
+    className: e("bg-pho-brand-solid h-full rounded-full transition-all duration-200 ease-out", r),
+    ...t
+  });
+}
+var p = {
+  Root: l,
+  Label: n,
+  Value: s,
+  Track: u,
+  Indicator: i
+};
+export {
+  p as Progress
+};
+
+//# sourceMappingURL=progress.js.map

package/dist/components/progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.js","names":[],"sources":["../../src/components/progress/progress.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { Progress as BaseProgress } from \"@base-ui/react/progress\";\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\nfunction Root({ className, ...props }: StyledProps<typeof BaseProgress.Root>) {\n  return (\n    <BaseProgress.Root\n      className={cn(\"flex w-full flex-col gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Label({\n  className,\n  ...props\n}: StyledProps<typeof BaseProgress.Label>) {\n  return (\n    <BaseProgress.Label\n      className={cn(\"text-pho-secondary text-sm font-medium\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Value({\n  className,\n  ...props\n}: StyledProps<typeof BaseProgress.Value>) {\n  return (\n    <BaseProgress.Value\n      className={cn(\"text-pho-tertiary text-sm tabular-nums\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Track({\n  className,\n  ...props\n}: StyledProps<typeof BaseProgress.Track>) {\n  return (\n    <BaseProgress.Track\n      className={cn(\n        \"bg-pho-tertiary relative h-2 w-full overflow-hidden rounded-full\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Indicator({\n  className,\n  ...props\n}: StyledProps<typeof BaseProgress.Indicator>) {\n  return (\n    <BaseProgress.Indicator\n      className={cn(\n        \"bg-pho-brand-solid h-full rounded-full transition-all duration-200 ease-out\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Determinate progress bar built on Base UI `Progress`. Set `value` (0–100, or\n * `null` for indeterminate) on `Progress.Root`; Base UI sizes the indicator.\n * Compose a header row with `Progress.Label` + `Progress.Value`.\n */\nexport const Progress = { Root, Label, Value, Track, Indicator };\n"],"mappings":";;;;;AAYA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgD;AAC5E,SACE,gBAAA,EAAC,EAAa,MAAd;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,EAAG,0CAA0C,CAAS;AAAA,IACjE,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAa,OAAd;AAAA,IACE,WAAW,EAAG,0CAA0C,CAAS;AAAA,IACjE,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAa,OAAd;AAAA,IACE,WAAW,EACT,oEACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAU,EACjB,WAAA,GACA,GAAG,EAAA,GAC0C;AAC7C,SACE,gBAAA,EAAC,EAAa,WAAd;AAAA,IACE,WAAW,EACT,+EACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAOA,IAAa,IAAW;AAAA,EAAE,MAAA;AAAA,EAAM,OAAA;AAAA,EAAO,OAAA;AAAA,EAAO,OAAA;AAAA,EAAO,WAAA;AAAU"}

package/dist/components/radio-group.js

@@ -0,0 +1,34 @@
+"use client";
+import { t as s } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as o, jsxs as n } from "react/jsx-runtime";
+import { Radio as a } from "@base-ui/react/radio";
+import { RadioGroup as d } from "@base-ui/react/radio-group";
+function l({ className: i, ...e }) {
+  return /* @__PURE__ */ o(d, {
+    className: s("flex flex-col gap-3", i),
+    ...e
+  });
+}
+l.displayName = "RadioGroup";
+function c({ className: i, label: e, ...t }) {
+  const r = /* @__PURE__ */ o(a.Root, {
+    className: s("squircle outline-pho-brand bg-pho-primary shadow-pho-xs ring-pho-primary flex size-5 shrink-0 cursor-pointer items-center justify-center rounded-full ring-1 transition duration-100 ease-linear ring-inset focus-visible:outline-2 focus-visible:outline-offset-2", "data-[checked]:bg-pho-brand-solid data-[checked]:ring-transparent", "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50", i),
+    ...t,
+    children: /* @__PURE__ */ o(a.Indicator, { className: "size-2 rounded-full bg-white" })
+  });
+  return e ? /* @__PURE__ */ n("label", {
+    className: "flex cursor-pointer items-center gap-2 select-none",
+    children: [r, /* @__PURE__ */ o("span", {
+      className: "text-pho-secondary text-sm",
+      children: e
+    })]
+  }) : r;
+}
+c.displayName = "Radio";
+export {
+  c as Radio,
+  l as RadioGroup
+};
+
+//# sourceMappingURL=radio-group.js.map

package/dist/components/radio-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.js","names":[],"sources":["../../src/components/radio-group/radio-group.tsx"],"sourcesContent":["import { type ComponentProps, type ReactNode } from \"react\";\nimport { RadioGroup as BaseRadioGroup } from \"@base-ui/react/radio-group\";\nimport { Radio as BaseRadio } from \"@base-ui/react/radio\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface RadioGroupProps extends Omit<\n  ComponentProps<typeof BaseRadioGroup>,\n  \"className\"\n> {\n  className?: string;\n}\n\n/**\n * Single-choice group built on Base UI `RadioGroup`. Holds `Radio` items;\n * exactly one may be selected. Control with `value` / `onValueChange` or leave\n * uncontrolled with `defaultValue`.\n */\nexport function RadioGroup({ className, ...props }: RadioGroupProps) {\n  return (\n    <BaseRadioGroup\n      className={cn(\"flex flex-col gap-3\", className)}\n      {...props}\n    />\n  );\n}\n\nRadioGroup.displayName = \"RadioGroup\";\n\nexport interface RadioProps extends Omit<\n  ComponentProps<typeof BaseRadio.Root>,\n  \"className\"\n> {\n  className?: string;\n  /** Text rendered beside the dot; the whole row selects this option. */\n  label?: ReactNode;\n}\n\n/**\n * A single option within a `RadioGroup`. Requires a `value`; pass `label` for a\n * clickable text row or provide an `aria-label`.\n */\nexport function Radio({ className, label, ...props }: RadioProps) {\n  const dot = (\n    <BaseRadio.Root\n      className={cn(\n        \"squircle outline-pho-brand bg-pho-primary shadow-pho-xs ring-pho-primary flex size-5 shrink-0 cursor-pointer items-center justify-center rounded-full 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-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <BaseRadio.Indicator className=\"size-2 rounded-full bg-white\" />\n    </BaseRadio.Root>\n  );\n\n  if (!label) return dot;\n  return (\n    <label className=\"flex cursor-pointer items-center gap-2 select-none\">\n      {dot}\n      <span className=\"text-pho-secondary text-sm\">{label}</span>\n    </label>\n  );\n}\n\nRadio.displayName = \"Radio\";\n"],"mappings":";;;;;;AAiBA,SAAgB,EAAW,EAAE,WAAA,GAAW,GAAG,EAAA,GAA0B;AACnE,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,WAAW,EAAG,uBAAuB,CAAS;AAAA,IAC9C,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,EAAW,cAAc;AAezB,SAAgB,EAAM,EAAE,WAAA,GAAW,OAAA,GAAO,GAAG,EAAA,GAAqB;AAChE,QAAM,IACJ,gBAAA,EAAC,EAAU,MAAX;AAAA,IACE,WAAW,EACT,sQACA,qEACA,iEACA,CACF;AAAA,IACA,GAAI;AAAA,cAEJ,gBAAA,EAAC,EAAU,WAAX,EAAqB,WAAU,+BAAgC,CAAA;AAAA,EACjD,CAAA;AAGlB,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,EAAM,cAAc"}

package/dist/components/scroll-area.js

@@ -0,0 +1,43 @@
+"use client";
+import { t as a } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as e } from "react/jsx-runtime";
+import { ScrollArea as t } from "@base-ui/react/scroll-area";
+var n = t.Content, l = t.Corner;
+function i({ className: o, ...r }) {
+  return /* @__PURE__ */ e(t.Root, {
+    className: a("relative overflow-hidden", o),
+    ...r
+  });
+}
+function c({ className: o, ...r }) {
+  return /* @__PURE__ */ e(t.Viewport, {
+    className: a("outline-pho-brand h-full w-full overscroll-contain rounded-[inherit] focus-visible:outline-2 focus-visible:-outline-offset-1", o),
+    ...r
+  });
+}
+function s({ className: o, ...r }) {
+  return /* @__PURE__ */ e(t.Scrollbar, {
+    className: a("flex touch-none p-0.5 opacity-0 transition-opacity delay-300 select-none", "data-[hovering]:opacity-100 data-[hovering]:delay-0 data-[scrolling]:opacity-100 data-[scrolling]:delay-0 data-[scrolling]:duration-0", "data-[orientation=horizontal]:h-2.5 data-[orientation=horizontal]:flex-col data-[orientation=vertical]:w-2.5", o),
+    ...r
+  });
+}
+function u({ className: o, ...r }) {
+  return /* @__PURE__ */ e(t.Thumb, {
+    className: a("flex-1 rounded-full bg-[var(--border-color-pho-primary)]", o),
+    ...r
+  });
+}
+var h = {
+  Root: i,
+  Viewport: c,
+  Content: n,
+  Scrollbar: s,
+  Thumb: u,
+  Corner: l
+};
+export {
+  h as ScrollArea
+};
+
+//# sourceMappingURL=scroll-area.js.map

package/dist/components/scroll-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.js","names":[],"sources":["../../src/components/scroll-area/scroll-area.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { ScrollArea as BaseScrollArea } from \"@base-ui/react/scroll-area\";\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 Content = BaseScrollArea.Content;\nconst Corner = BaseScrollArea.Corner;\n\nfunction Root({\n  className,\n  ...props\n}: StyledProps<typeof BaseScrollArea.Root>) {\n  return (\n    <BaseScrollArea.Root\n      className={cn(\"relative overflow-hidden\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Viewport({\n  className,\n  ...props\n}: StyledProps<typeof BaseScrollArea.Viewport>) {\n  return (\n    <BaseScrollArea.Viewport\n      className={cn(\n        \"outline-pho-brand h-full w-full overscroll-contain rounded-[inherit] focus-visible:outline-2 focus-visible:-outline-offset-1\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Scrollbar({\n  className,\n  ...props\n}: StyledProps<typeof BaseScrollArea.Scrollbar>) {\n  return (\n    <BaseScrollArea.Scrollbar\n      className={cn(\n        \"flex touch-none p-0.5 opacity-0 transition-opacity delay-300 select-none\",\n        \"data-[hovering]:opacity-100 data-[hovering]:delay-0 data-[scrolling]:opacity-100 data-[scrolling]:delay-0 data-[scrolling]:duration-0\",\n        \"data-[orientation=horizontal]:h-2.5 data-[orientation=horizontal]:flex-col data-[orientation=vertical]:w-2.5\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Thumb({\n  className,\n  ...props\n}: StyledProps<typeof BaseScrollArea.Thumb>) {\n  return (\n    <BaseScrollArea.Thumb\n      className={cn(\n        \"flex-1 rounded-full bg-[var(--border-color-pho-primary)]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Scroll area built on Base UI `ScrollArea` — a region with custom, overlay\n * scrollbars that match the design system instead of the native ones. Give\n * `ScrollArea.Root` a fixed size; put scrollable content in `Viewport` →\n * `Content` and add a `Scrollbar` → `Thumb` per axis.\n */\nexport const ScrollArea = {\n  Root,\n  Viewport,\n  Content,\n  Scrollbar,\n  Thumb,\n  Corner,\n};\n"],"mappings":";;;;;AAYA,IAAM,IAAU,EAAe,SACzB,IAAS,EAAe;AAE9B,SAAS,EAAK,EACZ,WAAA,GACA,GAAG,EAAA,GACuC;AAC1C,SACE,gBAAA,EAAC,EAAe,MAAhB;AAAA,IACE,WAAW,EAAG,4BAA4B,CAAS;AAAA,IACnD,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAS,EAChB,WAAA,GACA,GAAG,EAAA,GAC2C;AAC9C,SACE,gBAAA,EAAC,EAAe,UAAhB;AAAA,IACE,WAAW,EACT,gIACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAU,EACjB,WAAA,GACA,GAAG,EAAA,GAC4C;AAC/C,SACE,gBAAA,EAAC,EAAe,WAAhB;AAAA,IACE,WAAW,EACT,4EACA,yIACA,gHACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACwC;AAC3C,SACE,gBAAA,EAAC,EAAe,OAAhB;AAAA,IACE,WAAW,EACT,4DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAQA,IAAa,IAAa;AAAA,EACxB,MAAA;AAAA,EACA,UAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AACF"}

package/dist/components/select.js

@@ -0,0 +1,69 @@
+"use client";
+import { t as o } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as a } from "react/jsx-runtime";
+import { Select as r } from "@base-ui/react/select";
+var n = r.Root, s = r.Value, p = r.Portal, l = r.List, c = r.Group, u = r.ItemText;
+function d({ className: t, ...e }) {
+  return /* @__PURE__ */ a(r.Trigger, {
+    className: o("squircle bg-pho-primary shadow-pho-xs ring-pho-primary text-pho-primary outline-pho-brand flex min-w-44 cursor-pointer items-center justify-between gap-2 rounded-lg px-3 py-2 text-sm ring-1 transition select-none ring-inset", "data-[popup-open]:ring-pho-brand focus-visible:outline-2 focus-visible:-outline-offset-1", "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50", "[&_svg]:text-fg-pho-quaternary [&_svg]:size-4", t),
+    ...e
+  });
+}
+function m({ className: t, ...e }) {
+  return /* @__PURE__ */ a(r.Icon, {
+    className: o("flex shrink-0 items-center", t),
+    ...e
+  });
+}
+function g({ className: t, sideOffset: e = 6, ...i }) {
+  return /* @__PURE__ */ a(r.Positioner, {
+    sideOffset: e,
+    className: o("z-50 outline-none", t),
+    ...i
+  });
+}
+function h({ className: t, ...e }) {
+  return /* @__PURE__ */ a(r.Popup, {
+    className: o("squircle bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-interactive max-h-[var(--available-height)] min-w-[var(--anchor-width)] origin-[var(--transform-origin)] overflow-y-auto 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", t),
+    ...e
+  });
+}
+function f({ className: t, ...e }) {
+  return /* @__PURE__ */ a(r.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-secondary data-[highlighted]:text-pho-primary data-[disabled]:opacity-50", t),
+    ...e
+  });
+}
+function y({ className: t, ...e }) {
+  return /* @__PURE__ */ a(r.ItemIndicator, {
+    className: o("text-pho-brand col-start-1 flex items-center [&>svg]:size-4", t),
+    ...e
+  });
+}
+function x({ className: t, ...e }) {
+  return /* @__PURE__ */ a(r.GroupLabel, {
+    className: o("text-pho-quaternary px-2.5 py-1.5 text-xs font-medium", t),
+    ...e
+  });
+}
+var N = {
+  Root: n,
+  Trigger: d,
+  Value: s,
+  Icon: m,
+  Portal: p,
+  Positioner: g,
+  Popup: h,
+  List: l,
+  Item: f,
+  ItemText: u,
+  ItemIndicator: y,
+  Group: c,
+  GroupLabel: x
+};
+export {
+  N as Select
+};
+
+//# sourceMappingURL=select.js.map

package/dist/components/select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","names":[],"sources":["../../src/components/select/select.tsx"],"sourcesContent":["import { type ComponentProps, type ElementType } from \"react\";\nimport { Select as BaseSelect } from \"@base-ui/react/select\";\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 = BaseSelect.Root;\nconst Value = BaseSelect.Value;\nconst Portal = BaseSelect.Portal;\nconst List = BaseSelect.List;\nconst Group = BaseSelect.Group;\nconst ItemText = BaseSelect.ItemText;\n\nfunction Trigger({\n  className,\n  ...props\n}: StyledProps<typeof BaseSelect.Trigger>) {\n  return (\n    <BaseSelect.Trigger\n      className={cn(\n        \"squircle bg-pho-primary shadow-pho-xs ring-pho-primary text-pho-primary outline-pho-brand flex min-w-44 cursor-pointer items-center justify-between gap-2 rounded-lg px-3 py-2 text-sm ring-1 transition select-none ring-inset\",\n        \"data-[popup-open]:ring-pho-brand focus-visible:outline-2 focus-visible:-outline-offset-1\",\n        \"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n        \"[&_svg]:text-fg-pho-quaternary [&_svg]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Icon({ className, ...props }: StyledProps<typeof BaseSelect.Icon>) {\n  return (\n    <BaseSelect.Icon\n      className={cn(\"flex shrink-0 items-center\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Positioner({\n  className,\n  sideOffset = 6,\n  ...props\n}: StyledProps<typeof BaseSelect.Positioner>) {\n  return (\n    <BaseSelect.Positioner\n      sideOffset={sideOffset}\n      className={cn(\"z-50 outline-none\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Popup({ className, ...props }: StyledProps<typeof BaseSelect.Popup>) {\n  return (\n    <BaseSelect.Popup\n      className={cn(\n        \"squircle bg-pho-primary text-pho-primary shadow-pho-lg ring-pho-interactive max-h-[var(--available-height)] min-w-[var(--anchor-width)] origin-[var(--transform-origin)] overflow-y-auto 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 Item({ className, ...props }: StyledProps<typeof BaseSelect.Item>) {\n  return (\n    <BaseSelect.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-secondary data-[highlighted]:text-pho-primary data-[disabled]:opacity-50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ItemIndicator({\n  className,\n  ...props\n}: StyledProps<typeof BaseSelect.ItemIndicator>) {\n  return (\n    <BaseSelect.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 BaseSelect.GroupLabel>) {\n  return (\n    <BaseSelect.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\n/**\n * Select built on Base UI `Select` — pick one option (or several with\n * `multiple`) from a list that opens on click. Pass `items` to `Select.Root`,\n * render an `Item` per option, and show the selection with `Select.Value`. For\n * a short, always-visible set use `RadioGroup`; to filter a long list by typing\n * use `Combobox`.\n */\nexport const Select = {\n  Root,\n  Trigger,\n  Value,\n  Icon,\n  Portal,\n  Positioner,\n  Popup,\n  List,\n  Item,\n  ItemText,\n  ItemIndicator,\n  Group,\n  GroupLabel,\n};\n"],"mappings":";;;;;AAYA,IAAM,IAAO,EAAW,MAClB,IAAQ,EAAW,OACnB,IAAS,EAAW,QACpB,IAAO,EAAW,MAClB,IAAQ,EAAW,OACnB,IAAW,EAAW;AAE5B,SAAS,EAAQ,EACf,WAAA,GACA,GAAG,EAAA,GACsC;AACzC,SACE,gBAAA,EAAC,EAAW,SAAZ;AAAA,IACE,WAAW,EACT,mOACA,4FACA,iEACA,iDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAA8C;AAC1E,SACE,gBAAA,EAAC,EAAW,MAAZ;AAAA,IACE,WAAW,EAAG,8BAA8B,CAAS;AAAA,IACrD,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAW,EAClB,WAAA,GACA,YAAA,IAAa,GACb,GAAG,EAAA,GACyC;AAC5C,SACE,gBAAA,EAAC,EAAW,YAAZ;AAAA,IACc,YAAA;AAAA,IACZ,WAAW,EAAG,qBAAqB,CAAS;AAAA,IAC5C,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,+RACA,kEACA,8DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAA8C;AAC1E,SACE,gBAAA,EAAC,EAAW,MAAZ;AAAA,IACE,WAAW,EACT,iJACA,sGACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAc,EACrB,WAAA,GACA,GAAG,EAAA,GAC4C;AAC/C,SACE,gBAAA,EAAC,EAAW,eAAZ;AAAA,IACE,WAAW,EACT,+DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,SAAS,EAAW,EAClB,WAAA,GACA,GAAG,EAAA,GACyC;AAC5C,SACE,gBAAA,EAAC,EAAW,YAAZ;AAAA,IACE,WAAW,EACT,yDACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AASA,IAAa,IAAS;AAAA,EACpB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,UAAA;AAAA,EACA,eAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AACF"}

package/dist/components/separator.js

@@ -0,0 +1,17 @@
+"use client";
+import { t as o } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+import { Separator as i } from "@base-ui/react/separator";
+function e({ className: a, ...r }) {
+  return /* @__PURE__ */ t(i, {
+    className: o("shrink-0 bg-[var(--border-color-pho-secondary)]", "data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full", "data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px", a),
+    ...r
+  });
+}
+e.displayName = "Separator";
+export {
+  e as Separator
+};
+
+//# sourceMappingURL=separator.js.map

package/dist/components/separator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"separator.js","names":[],"sources":["../../src/components/separator/separator.tsx"],"sourcesContent":["import { type ComponentProps } from \"react\";\nimport { Separator as BaseSeparator } from \"@base-ui/react/separator\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface SeparatorProps extends Omit<\n  ComponentProps<typeof BaseSeparator>,\n  \"className\"\n> {\n  className?: string;\n}\n\n/**\n * A thin rule that divides content. Built on Base UI `Separator`. For a\n * vertical rule set `orientation=\"vertical\"` — the parent must give it height\n * (e.g. a flex row with `items-stretch`).\n */\nexport function Separator({ className, ...props }: SeparatorProps) {\n  return (\n    <BaseSeparator\n      className={cn(\n        \"shrink-0 bg-[var(--border-color-pho-secondary)]\",\n        \"data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full\",\n        \"data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nSeparator.displayName = \"Separator\";\n"],"mappings":";;;;;AAgBA,SAAgB,EAAU,EAAE,WAAA,GAAW,GAAG,EAAA,GAAyB;AACjE,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,WAAW,EACT,mDACA,2EACA,uEACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAEA,EAAU,cAAc"}

package/dist/components/slider.js

@@ -0,0 +1,61 @@
+"use client";
+import { t as o } from "../chunks/cn-D6jQqeRj.js";
+import "react";
+import { jsx as r } from "react/jsx-runtime";
+import { Slider as n } from "@base-ui/react/slider";
+function l({ className: e, ...t }) {
+  return /* @__PURE__ */ r(n.Root, {
+    className: o("flex w-full flex-col gap-3", e),
+    ...t
+  });
+}
+function a({ className: e, ...t }) {
+  return /* @__PURE__ */ r(n.Label, {
+    className: o("text-pho-secondary text-sm font-medium", e),
+    ...t
+  });
+}
+function i({ className: e, ...t }) {
+  return /* @__PURE__ */ r(n.Value, {
+    className: o("text-pho-tertiary text-sm tabular-nums", e),
+    ...t
+  });
+}
+function u({ className: e, ...t }) {
+  return /* @__PURE__ */ r(n.Control, {
+    className: o("relative flex w-full touch-none items-center py-2 select-none", e),
+    ...t
+  });
+}
+function s({ className: e, ...t }) {
+  return /* @__PURE__ */ r(n.Track, {
+    className: o("bg-pho-tertiary relative h-1.5 w-full rounded-full", e),
+    ...t
+  });
+}
+function c({ className: e, ...t }) {
+  return /* @__PURE__ */ r(n.Indicator, {
+    className: o("bg-pho-brand-solid rounded-full", e),
+    ...t
+  });
+}
+function f({ className: e, ...t }) {
+  return /* @__PURE__ */ r(n.Thumb, {
+    className: o("outline-pho-brand ring-pho-primary shadow-pho-sm size-4 rounded-full bg-white ring-1 transition focus-visible:outline-2 focus-visible:outline-offset-2 data-[disabled]:opacity-50", e),
+    ...t
+  });
+}
+var h = {
+  Root: l,
+  Label: a,
+  Value: i,
+  Control: u,
+  Track: s,
+  Indicator: c,
+  Thumb: f
+};
+export {
+  h as Slider
+};
+
+//# sourceMappingURL=slider.js.map