@photon-ai/pho-ui 4.0.0 → 4.3.0

package/dist/chunks/card-N-tvFsuV.js

@@ -0,0 +1,64 @@
+"use client";
+import { t as r } from "./cn-ChIgwEl3.js";
+import "react";
+import { jsx as e } from "react/jsx-runtime";
+var i = "border-pho-secondary bg-pho-primary overflow-hidden rounded-lg border";
+function n({ className: t, ...a }) {
+  return /* @__PURE__ */ e("div", {
+    className: r(i, "flex flex-col gap-4 pt-5 pb-4", "has-[>[data-stat-group]:first-child]:pt-0 has-[>[data-stat]:first-child]:pt-0", "has-[>[data-stat-group]:last-child]:pb-0 has-[>[data-stat]:last-child]:pb-0", "has-[>:first-child:has([data-chart])]:pt-0", t),
+    ...a
+  });
+}
+function o({ className: t, ...a }) {
+  return /* @__PURE__ */ e("div", {
+    className: r("grid grid-cols-[minmax(0,1fr)_minmax(0,auto)] items-baseline gap-x-4 gap-y-0 px-5", t),
+    ...a
+  });
+}
+function d({ className: t, children: a, ...s }) {
+  return /* @__PURE__ */ e("h3", {
+    className: r("text-display-xs text-pho-primary min-w-0 font-medium", t),
+    ...s,
+    children: a
+  });
+}
+function p({ className: t, ...a }) {
+  return /* @__PURE__ */ e("div", {
+    "data-card-value": "",
+    className: r("text-display-sm text-pho-primary min-w-0 justify-self-end truncate font-medium tabular-nums", t),
+    ...a
+  });
+}
+function l({ className: t, ...a }) {
+  return /* @__PURE__ */ e("p", {
+    className: r("text-pho-description text-display-xs col-span-2 font-normal", t),
+    ...a
+  });
+}
+function c({ className: t, ...a }) {
+  return /* @__PURE__ */ e("div", {
+    className: r("px-5", t),
+    ...a
+  });
+}
+function m({ className: t, ...a }) {
+  return /* @__PURE__ */ e("div", {
+    className: r("flex items-center gap-2 px-5", t),
+    ...a
+  });
+}
+var x = {
+  Root: n,
+  Header: o,
+  Title: d,
+  Value: p,
+  Description: l,
+  Content: c,
+  Footer: m
+};
+export {
+  x as n,
+  i as t
+};
+
+//# sourceMappingURL=card-N-tvFsuV.js.map

package/dist/chunks/card-N-tvFsuV.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-N-tvFsuV.js","names":[],"sources":["../../src/components/card/card.tsx"],"sourcesContent":["import { type ComponentProps, type Ref } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Design notes:\n * - A card is a flat bordered panel on the page surface — hairline border,\n *   primary background, no shadow. Elevation shadows stay on floating layers\n *   (menus, dialogs); see the same rule on Input and Select.\n * - Radius sits at the `lg` stop (16px) like Dialog — a standalone content\n *   panel reads bigger than a control, so it takes the panel radius rather\n *   than the control default (`base`). `overflow-hidden` clips with it:\n *   a flush `Stat.Group` (opaque tiles, `pt-0`) would otherwise paint\n *   square over the curve. The same clip is what makes an edge-to-edge\n *   image or table follow the panel, the way `BasicPage.Card` already does.\n * - Vertical rhythm: `pt-5` / `pb-4`, `gap-4` between parts. Parts carry\n *   `px-5`, so a child without padding (an image, a table, a `Separator`)\n *   runs edge-to-edge on its own. A `Stat` / `Stat.Group` already pads\n *   its tiles — when it is the first or last child the matching inset\n *   drops so the row sits flush on the card edge. A chart as the first\n *   child drops the top inset the same way; the plot keeps its own\n *   bottom band.\n * - No size or color axes. A card is chrome, not a signal — content sets the\n *   tone. Sizing belongs to the layout that places the card.\n */\n\n/** Surface chrome — exported for hosts that need the look on another element. */\nexport const CARD_SURFACE =\n  \"border-pho-secondary bg-pho-primary overflow-hidden rounded-lg border\";\n\n/** The panel: bordered surface, vertical rhythm between parts. */\nfunction Root({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div\n      className={cn(\n        CARD_SURFACE,\n        \"flex flex-col gap-4 pt-5 pb-4\",\n        // Stat tiles pad themselves; a chart's plot already insets.\n        \"has-[>[data-stat-group]:first-child]:pt-0 has-[>[data-stat]:first-child]:pt-0\",\n        \"has-[>[data-stat-group]:last-child]:pb-0 has-[>[data-stat]:last-child]:pb-0\",\n        \"has-[>:first-child:has([data-chart])]:pt-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Title row + optional description. The title and a trailing `Value`\n * share the first line; the description sits on the next with no row\n * gap — title and subtitle read as one block.\n */\nfunction Header({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div\n      className={cn(\n        \"grid grid-cols-[minmax(0,1fr)_minmax(0,auto)] items-baseline gap-x-4 gap-y-0 px-5\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Card heading — an `<h3>` so it nests under page (`h1`) and section (`h2`)\n * headings without skipping levels.\n */\nfunction Title({\n  className,\n  children,\n  ...props\n}: ComponentProps<\"h3\"> & { ref?: Ref<HTMLHeadingElement> }) {\n  return (\n    <h3\n      className={cn(\n        \"text-display-xs text-pho-primary min-w-0 font-medium\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </h3>\n  );\n}\n\n/**\n * A count or figure at the end of the title row. One display step above\n * the title, primary ink — the number is the loud thing on the line.\n */\nfunction Value({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div\n      data-card-value=\"\"\n      className={cn(\n        \"text-display-sm text-pho-primary min-w-0 justify-self-end truncate font-medium tabular-nums\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Supporting copy under the title — Dialog's description: same step, description ink. */\nfunction Description({\n  className,\n  ...props\n}: ComponentProps<\"p\"> & { ref?: Ref<HTMLParagraphElement> }) {\n  return (\n    <p\n      className={cn(\n        \"text-pho-description text-display-xs col-span-2 font-normal\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** The card body. Carries the horizontal padding; bring your own layout. */\nfunction Content({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return <div className={cn(\"px-5\", className)} {...props} />;\n}\n\n/**\n * Trailing row — actions, a status line. Unopinionated about justification;\n * add `justify-end` for a dialog-style action bar.\n */\nfunction Footer({\n  className,\n  ...props\n}: ComponentProps<\"div\"> & { ref?: Ref<HTMLDivElement> }) {\n  return (\n    <div className={cn(\"flex items-center gap-2 px-5\", className)} {...props} />\n  );\n}\n\n/**\n * Card — a bordered content panel: header (title + description), body,\n * optional footer. It's static chrome with no interactivity of its own.\n * For a label/control list use `BasicPage.Card`; for a featured\n * block on the page surface use `BasicPage.Callout`.\n *\n * ```tsx\n * <Card.Root>\n *   <Card.Header>\n *     <Card.Title>Usage</Card.Title>\n *     <Card.Value>1.2k</Card.Value>\n *     <Card.Description>Since Aug 1.</Card.Description>\n *   </Card.Header>\n *   <Card.Content>…</Card.Content>\n *   <Card.Footer className=\"justify-end\">\n *     <Button size=\"sm\">Upgrade</Button>\n *   </Card.Footer>\n * </Card.Root>\n * ```\n */\nexport const Card = {\n  Root,\n  Header,\n  Title,\n  Value,\n  Description,\n  Content,\n  Footer,\n};\n"],"mappings":";;;;AA0BA,IAAa,IACX;AAGF,SAAS,EAAK,EACZ,WAAA,GACA,GAAG,EAAA,GACqD;AACxD,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,WAAW,EACT,GACA,iCAEA,iFACA,+EACA,8CACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAOA,SAAS,EAAO,EACd,WAAA,GACA,GAAG,EAAA,GACqD;AACxD,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,WAAW,EACT,qFACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAMA,SAAS,EAAM,EACb,WAAA,GACA,UAAA,GACA,GAAG,EAAA,GACwD;AAC3D,SACE,gBAAA,EAAC,MAAD;AAAA,IACE,WAAW,EACT,wDACA,CACF;AAAA,IACA,GAAI;AAAA,IAEH,UAAA;AAAA,EACC,CAAA;AAER;AAMA,SAAS,EAAM,EACb,WAAA,GACA,GAAG,EAAA,GACqD;AACxD,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,mBAAgB;AAAA,IAChB,WAAW,EACT,+FACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAGA,SAAS,EAAY,EACnB,WAAA,GACA,GAAG,EAAA,GACyD;AAC5D,SACE,gBAAA,EAAC,KAAD;AAAA,IACE,WAAW,EACT,+DACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAGA,SAAS,EAAQ,EACf,WAAA,GACA,GAAG,EAAA,GACqD;AACxD,SAAO,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAW,EAAG,QAAQ,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAC5D;AAMA,SAAS,EAAO,EACd,WAAA,GACA,GAAG,EAAA,GACqD;AACxD,SACE,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAW,EAAG,gCAAgC,CAAS;AAAA,IAAG,GAAI;AAAA,EAAQ,CAAA;AAE/E;AAsBA,IAAa,IAAO;AAAA,EAClB,MAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AACF"}

package/dist/chunks/{command-CTYrSz9a.js → command-ZagVyDx7.js}

@@ -4,7 +4,7 @@ import { SPRING_SETTLE as z } from "../motion.js";
 import { t as C } from "./IconArrowUpRight-DGgKzQwV.js";
 import { t as M } from "./IconChevronLeft-CSWMKQ4C.js";
 import { t as O } from "./animated-height-CCO-Ocoz.js";
-import { t as d } from "./dialog-BwfUFn6B.js";
+import { t as d } from "./dialog-BYiAFetB.js";
 import { useEffect as T, useId as D, useLayoutEffect as V, useRef as $ } from "react";
 import { Fragment as w, jsx as t, jsxs as u } from "react/jsx-runtime";
 import { LayoutGroup as A, motion as x, useReducedMotion as F } from "motion/react";
@@ -189,4 +189,4 @@ export {
   ue as t
 };
 
-//# sourceMappingURL=command-CTYrSz9a.js.map
+//# sourceMappingURL=command-ZagVyDx7.js.map

package/dist/chunks/{command-CTYrSz9a.js.map → command-ZagVyDx7.js.map}

@@ -1 +1 @@
-{"version":3,"file":"command-CTYrSz9a.js","names":[],"sources":["../../src/components/command/command.tsx"],"sourcesContent":["import {\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useRef,\n  type ComponentProps,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { IconArrowUpRight, IconChevronLeft } from \"@tabler/icons-react\";\nimport { SPRING_SETTLE } from \"../../motion\";\nimport { Command as CommandPrimitive, useCommandState } from \"cmdk\";\nimport { LayoutGroup, motion, useReducedMotion } from \"motion/react\";\nimport { AnimatedHeight } from \"../../utils/animated-height\";\nimport { cn } from \"../../utils/cn\";\nimport { Dialog as PhoDialog } from \"../dialog\";\n\n/**\n * Spring for row moves (FLIP / shared-layout) — same feel as\n * `AnimatedHeight`: quick and critically damped, so rows glide to their new\n * slot without overshooting into neighbours.\n */\nconst ROW_MOVE_SPRING = SPRING_SETTLE;\n\nfunction Root({\n  // Filtering is yours by default: filter in render (state above the\n  // palette) so the rows' FLIP diff can glide survivors to their slots.\n  // cmdk's built-in matcher reorders DOM imperatively — invisible to the\n  // layout pass — so it is opt-in: pass `shouldFilter` to hand matching\n  // and ranking back to cmdk at the cost of the animation.\n  shouldFilter = false,\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof CommandPrimitive>) {\n  // Namespace row layoutIds per palette instance — the docs page mounts the\n  // inline demo and the dialog demo at once, with identical item values.\n  const layoutNamespace = useId();\n  return (\n    <CommandPrimitive\n      className={cn(\n        \"bg-pho-primary text-pho-primary flex w-full flex-col overflow-hidden outline-none\",\n        className,\n      )}\n      shouldFilter={shouldFilter}\n      {...props}\n    >\n      <LayoutGroup id={layoutNamespace}>{children}</LayoutGroup>\n    </CommandPrimitive>\n  );\n}\n\n/**\n * The input row — a bottom hairline separates it from the list. Position\n * leading icons absolutely and pad the input (`pl-9`), mirroring\n * `Autocomplete.InputGroup`.\n */\nfunction InputGroup({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\n        \"border-pho-secondary relative flex items-center border-b\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** SSR-safe layout effect (same pattern cmdk uses internally). */\nconst useIsomorphicLayoutEffect =\n  typeof window === \"undefined\" ? useEffect : useLayoutEffect;\n\nfunction assignRef<T>(ref: Ref<T> | undefined, value: T | null) {\n  if (typeof ref === \"function\") ref(value);\n  else if (ref) ref.current = value;\n}\n\nfunction Input({\n  className,\n  value,\n  ref: consumerRef,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Input>) {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const search = useCommandState((state) => state.search);\n\n  // cmdk stays uncontrolled here on purpose. Its controlled path syncs the\n  // `value` prop into the search store through a passive effect — one painted\n  // frame late — so on that stale frame the old row is still \"selected\" while\n  // the list has already reflowed, and the selection pill visibly rides it\n  // before snapping to the re-selected first row. Uncontrolled keystrokes\n  // update search + first-row selection synchronously (pre-paint), killing\n  // that frame in both directions (typing and clearing).\n  //\n  // The consumer-facing API is still controlled: external `value` changes\n  // (programmatic reset, initial query) are replayed through the native input\n  // path below so store, display, and selection take the same sync route.\n  useIsomorphicLayoutEffect(() => {\n    const input = inputRef.current;\n    if (value == null || input == null || value === search) return;\n    const setNativeValue = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      \"value\",\n    )?.set;\n    setNativeValue?.call(input, value);\n    input.dispatchEvent(new Event(\"input\", { bubbles: true }));\n  }, [value, search]);\n\n  return (\n    <CommandPrimitive.Input\n      className={cn(\n        // Borderless inside the palette surface — the InputGroup hairline\n        // carries the edge. display-xs (18px) keeps iOS from zooming in.\n        \"text-pho-primary placeholder:text-pho-placeholder text-display-xs w-full bg-transparent px-3 py-3 outline-none disabled:cursor-not-allowed disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n      ref={(node) => {\n        inputRef.current = node;\n        assignRef(consumerRef, node);\n      }}\n    />\n  );\n}\n\nfunction List({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.List>) {\n  return (\n    // Same spring as the onboarding / invite Card shell — list height glides\n    // when idle ↔ search (or filter) changes instead of jumping.\n    <AnimatedHeight>\n      {/* The scroller is a motion element with layoutScroll so the rows'\n          FLIP projections account for its scroll offset — without it,\n          scrolling reads as a layout change and every row glides to\n          compensate. scroll-py keeps a breath above and below the row\n          being scrolled into view. */}\n      <motion.div\n        layoutScroll\n        className=\"max-h-[min(24rem,60vh)] scroll-py-1 overflow-y-auto overscroll-contain\"\n      >\n        <CommandPrimitive.List\n          className={cn(\"relative isolate p-1\", className)}\n          {...props}\n        >\n          {children}\n        </CommandPrimitive.List>\n      </motion.div>\n    </AnimatedHeight>\n  );\n}\n\nfunction Empty({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Empty>) {\n  return (\n    <CommandPrimitive.Empty\n      className={cn(\n        \"text-pho-description px-2.5 py-6 text-center text-base\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Group({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Group>) {\n  return (\n    <CommandPrimitive.Group\n      className={cn(\n        // cmdk renders the `heading` prop in a [cmdk-group-heading] wrapper —\n        // typography mirrors `Autocomplete.GroupLabel`.\n        \"[&_[cmdk-group-heading]]:text-pho-secondary [&_[cmdk-group-heading]]:px-2.5 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Row layout mode:\n * - `item` / `subitem` / `subsubitem` — idle hierarchy (icon column + indent)\n * - `result` — flat search hit (breadcrumb + trailing scope)\n */\nexport type CommandItemLevel = \"item\" | \"subitem\" | \"subsubitem\" | \"result\";\n\ntype ItemPrimitiveProps = ComponentProps<typeof CommandPrimitive.Item>;\n\nexport interface CommandItemProps extends Omit<\n  ItemPrimitiveProps,\n  \"children\" | \"title\"\n> {\n  /**\n   * Row depth / mode in the palette:\n   * - `item` — page / top destination (icon + title)\n   * - `subitem` — section under an item (label aligns with the item title)\n   * - `subsubitem` — row under a section (one step deeper)\n   * - `result` — flat search hit (`title` + `path` crumbs + `scope`)\n   */\n  level?: CommandItemLevel;\n  /**\n   * Leading glyph. On idle `item` rows (and reserved for sub-levels). On\n   * `result` rows, pass the resolved icon (self → parent → grandparent).\n   */\n  icon?: ReactNode;\n  /**\n   * When `level=\"result\"`, force the icon column so labels align across the\n   * list even if this row's `icon` is empty. Set true when any sibling result\n   * has an icon; omit when the whole result set is icon-less.\n   */\n  iconSlot?: boolean;\n  /** Primary label. Prefer this over free-form children for the shared layout. */\n  title?: ReactNode;\n  /**\n   * Ancestors after `title` for `level=\"result\"` — parent → page\n   * (e.g. `[\"Agent profile\", \"Settings\"]` → `Name < Agent profile < Settings`).\n   */\n  path?: ReactNode[];\n  /**\n   * Trailing scope for `level=\"result\"` — `Project` vs `Personal`, not a nav group.\n   */\n  scope?: ReactNode;\n  /** Shows a trailing external-link glyph (opens outside the app). */\n  external?: boolean;\n  /**\n   * Free-form content. When `title` is set, rendered after the label stack.\n   * When `title` is omitted, becomes the row body (legacy / simple items).\n   */\n  children?: ReactNode;\n}\n\n/** Leading icon column — `size-4`, secondary ink. */\nfunction ItemIcon({ className, ...props }: ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\n        \"text-pho-secondary flex size-4 shrink-0 items-center justify-center [&>svg]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Primary label — medium + primary ink on `item` rows. */\nfunction ItemTitle({\n  className,\n  level = \"item\",\n  ...props\n}: ComponentProps<\"span\"> & { level?: CommandItemLevel }) {\n  return (\n    <span\n      className={cn(\n        \"text-md block truncate\",\n        level === \"item\" && \"text-pho-primary\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * One selectable row. Idle palettes use `level` + `icon` / `title`\n * (item → subitem → subsubitem). Searching uses `level=\"result\"` with `path`\n * crumbs and a trailing `scope` (Project / Personal). No description line —\n * match via `keywords` / aliases instead.\n */\nfunction ExternalGlyph() {\n  return (\n    <IconArrowUpRight\n      aria-hidden\n      className=\"text-pho-description size-4 shrink-0\"\n    />\n  );\n}\n\nfunction Item({\n  className,\n  level = \"item\",\n  icon,\n  iconSlot,\n  title,\n  path,\n  scope,\n  external,\n  children,\n  value,\n  ...props\n}: CommandItemProps) {\n  const reduceMotion = useReducedMotion();\n  // cmdk registers `value.trim()` and exposes the selected one as\n  // `state.value` — mirrors cmdk's own `data-selected` computation.\n  const trimmedValue = typeof value === \"string\" ? value.trim() : \"\";\n  const selectedValue = useCommandState((state) => state.value);\n  const isSelected = trimmedValue !== \"\" && selectedValue === trimmedValue;\n  const structured = title != null;\n  const isResult = level === \"result\";\n  // Reserve the icon column when the row has an icon, or when the list asks\n  // for alignment (`iconSlot`) even if this row's glyph is empty.\n  const showResultIcon = isResult && (icon != null || iconSlot);\n\n  const row = (\n    <CommandPrimitive.Item\n      data-level={level}\n      value={value}\n      className={cn(\n        \"text-pho-secondary flex cursor-pointer items-center gap-2 rounded-[calc(var(--radius-base)-4px)] py-2 pr-2.5 text-base outline-none select-none\",\n        // subsubitem steps in; item/subitem share the base gutter.\n        level === \"subsubitem\" ? \"pl-6\" : \"pl-2\",\n        // Secondary at rest; selection lifts to primary ink (Menu idiom).\n        // The wash lands with it instantly — stepping through rows is a\n        // snap, not a flight.\n        \"data-[selected=true]:text-pho-primary data-[selected=true]:bg-pho-ghost-hover\",\n        \"data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      {structured && isResult ? (\n        <>\n          {showResultIcon ? (\n            <ItemIcon aria-hidden={icon == null ? true : undefined}>\n              {icon ?? null}\n            </ItemIcon>\n          ) : null}\n          {/* Same text-md line box as idle ItemTitle so row height matches (36px). */}\n          <span className=\"text-md flex min-w-0 flex-1 items-center gap-1 overflow-hidden\">\n            <span className=\"text-pho-primary truncate\">{title}</span>\n            {(path ?? []).map((segment, index) => (\n              <span\n                key={index}\n                className=\"text-pho-description flex shrink-0 items-center gap-0.5\"\n              >\n                <IconChevronLeft aria-hidden className=\"size-4 shrink-0\" />\n                {segment}\n              </span>\n            ))}\n          </span>\n          {scope != null && scope !== \"\" ? (\n            <span className=\"text-pho-description shrink-0 text-xs\">\n              {scope}\n            </span>\n          ) : null}\n          {external ? <ExternalGlyph /> : null}\n          {children}\n        </>\n      ) : structured ? (\n        <>\n          {/* Icon column always reserved so subitem labels share the item title edge. */}\n          <ItemIcon aria-hidden={icon == null ? true : undefined}>\n            {icon ?? null}\n          </ItemIcon>\n          <span className=\"min-w-0 flex-1\">\n            <ItemTitle level={level}>{title}</ItemTitle>\n          </span>\n          {external ? <ExternalGlyph /> : null}\n          {children}\n        </>\n      ) : (\n        children\n      )}\n    </CommandPrimitive.Item>\n  );\n\n  if (reduceMotion) return row;\n\n  return (\n    // FLIP wrapper: rows that stay mounted glide when neighbours enter or\n    // leave, and a row remounting elsewhere with the same `value` (idle group\n    // ↔ flat search result) inherits the old bounds via its layoutId and\n    // slides to the new slot — the iOS list-diff feel. Rows without a match\n    // simply appear / disappear so the whole list never swarms.\n    //\n    // The selected row is the exception: it skips the travel and appears at\n    // its final slot immediately, so the selection wash is never sitting on\n    // empty space waiting for its row to fly in.\n    <motion.div\n      layout=\"position\"\n      layoutId={typeof value === \"string\" ? value : undefined}\n      initial={false}\n      transition={isSelected ? { duration: 0 } : ROW_MOVE_SPRING}\n    >\n      {row}\n    </motion.div>\n  );\n}\n\nfunction Separator({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Separator>) {\n  return (\n    <CommandPrimitive.Separator\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 Loading({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Loading>) {\n  return (\n    <CommandPrimitive.Loading\n      className={cn(\"text-pho-description px-2.5 py-1.5 text-base\", className)}\n      {...props}\n    />\n  );\n}\n\ntype DialogRootProps = ComponentProps<typeof PhoDialog.Root>;\n\ninterface CommandDialogProps extends ComponentProps<typeof CommandPrimitive> {\n  /** Controlled dialog state — pass straight through to `Dialog.Root`. */\n  open?: DialogRootProps[\"open\"];\n  onOpenChange?: DialogRootProps[\"onOpenChange\"];\n  /** Accessible name for the palette (dialog and command menu). */\n  label?: string;\n  /** Extra classes for the dialog panel (not the command root). */\n  className?: string;\n}\n\n/**\n * A command palette in a modal — Pho's `Dialog` overlay (Base UI) around a\n * `Command.Root`, raised above center. We deliberately skip cmdk's own\n * `Command.Dialog` (Radix) so overlays stay on one primitive stack.\n *\n * List height springs via `AnimatedHeight` (same feel as the Card shell on\n * onboarding / invite) — the input row stays put while results resize.\n */\nfunction Dialog({\n  open,\n  onOpenChange,\n  label,\n  className,\n  children,\n  ...props\n}: CommandDialogProps) {\n  return (\n    <PhoDialog.Root open={open} onOpenChange={onOpenChange}>\n      <PhoDialog.Portal>\n        <PhoDialog.Backdrop />\n        <PhoDialog.Popup\n          aria-label={label}\n          // Palette sits above center so the list grows downward from a\n          // stable top edge instead of jumping around it.\n          className={cn(\n            \"top-[max(4rem,18vh)] max-w-xl translate-y-0 overflow-hidden p-0\",\n            className,\n          )}\n        >\n          {/* The popup is position: fixed; layout animations inside a fixed\n              element need a layoutRoot to project against, or their\n              measurements drift with the page scroll. */}\n          <motion.div layoutRoot>\n            <Root label={label} {...props}>\n              {children}\n            </Root>\n          </motion.div>\n        </PhoDialog.Popup>\n      </PhoDialog.Portal>\n    </PhoDialog.Root>\n  );\n}\n\n/**\n * Command menu built on `cmdk` — a filterable list of actions driven from a\n * single input, keyboard-first. Compose inline (`Command.Root`) or as a\n * ⌘K-style modal palette (`Command.Dialog`, which owns the overlay).\n * Filtering is yours by default — filter in render so the rows' diff can\n * glide; pass `shouldFilter` to hand matching and ranking to cmdk (its\n * imperative reorder skips the animation).\n *\n * Rows share one layout via `Command.Item` `level` — idle\n * `item` → `subitem` → `subsubitem`, or flat `result` while searching.\n */\nexport const Command = {\n  Root,\n  InputGroup,\n  Input,\n  List,\n  Empty,\n  Group,\n  Item,\n  ItemIcon,\n  ItemTitle,\n  Separator,\n  Loading,\n  Dialog,\n};\n\n/** Re-export of cmdk's state selector hook (search, value, filtered counts). */\nexport { useCommandState };\n"],"mappings":"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"}
+{"version":3,"file":"command-ZagVyDx7.js","names":[],"sources":["../../src/components/command/command.tsx"],"sourcesContent":["import {\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useRef,\n  type ComponentProps,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { IconArrowUpRight, IconChevronLeft } from \"@tabler/icons-react\";\nimport { SPRING_SETTLE } from \"../../motion\";\nimport { Command as CommandPrimitive, useCommandState } from \"cmdk\";\nimport { LayoutGroup, motion, useReducedMotion } from \"motion/react\";\nimport { AnimatedHeight } from \"../../utils/animated-height\";\nimport { cn } from \"../../utils/cn\";\nimport { Dialog as PhoDialog } from \"../dialog\";\n\n/**\n * Spring for row moves (FLIP / shared-layout) — same feel as\n * `AnimatedHeight`: quick and critically damped, so rows glide to their new\n * slot without overshooting into neighbours.\n */\nconst ROW_MOVE_SPRING = SPRING_SETTLE;\n\nfunction Root({\n  // Filtering is yours by default: filter in render (state above the\n  // palette) so the rows' FLIP diff can glide survivors to their slots.\n  // cmdk's built-in matcher reorders DOM imperatively — invisible to the\n  // layout pass — so it is opt-in: pass `shouldFilter` to hand matching\n  // and ranking back to cmdk at the cost of the animation.\n  shouldFilter = false,\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof CommandPrimitive>) {\n  // Namespace row layoutIds per palette instance — the docs page mounts the\n  // inline demo and the dialog demo at once, with identical item values.\n  const layoutNamespace = useId();\n  return (\n    <CommandPrimitive\n      className={cn(\n        \"bg-pho-primary text-pho-primary flex w-full flex-col overflow-hidden outline-none\",\n        className,\n      )}\n      shouldFilter={shouldFilter}\n      {...props}\n    >\n      <LayoutGroup id={layoutNamespace}>{children}</LayoutGroup>\n    </CommandPrimitive>\n  );\n}\n\n/**\n * The input row — a bottom hairline separates it from the list. Position\n * leading icons absolutely and pad the input (`pl-9`), mirroring\n * `Autocomplete.InputGroup`.\n */\nfunction InputGroup({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\n        \"border-pho-secondary relative flex items-center border-b\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** SSR-safe layout effect (same pattern cmdk uses internally). */\nconst useIsomorphicLayoutEffect =\n  typeof window === \"undefined\" ? useEffect : useLayoutEffect;\n\nfunction assignRef<T>(ref: Ref<T> | undefined, value: T | null) {\n  if (typeof ref === \"function\") ref(value);\n  else if (ref) ref.current = value;\n}\n\nfunction Input({\n  className,\n  value,\n  ref: consumerRef,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Input>) {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const search = useCommandState((state) => state.search);\n\n  // cmdk stays uncontrolled here on purpose. Its controlled path syncs the\n  // `value` prop into the search store through a passive effect — one painted\n  // frame late — so on that stale frame the old row is still \"selected\" while\n  // the list has already reflowed, and the selection pill visibly rides it\n  // before snapping to the re-selected first row. Uncontrolled keystrokes\n  // update search + first-row selection synchronously (pre-paint), killing\n  // that frame in both directions (typing and clearing).\n  //\n  // The consumer-facing API is still controlled: external `value` changes\n  // (programmatic reset, initial query) are replayed through the native input\n  // path below so store, display, and selection take the same sync route.\n  useIsomorphicLayoutEffect(() => {\n    const input = inputRef.current;\n    if (value == null || input == null || value === search) return;\n    const setNativeValue = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      \"value\",\n    )?.set;\n    setNativeValue?.call(input, value);\n    input.dispatchEvent(new Event(\"input\", { bubbles: true }));\n  }, [value, search]);\n\n  return (\n    <CommandPrimitive.Input\n      className={cn(\n        // Borderless inside the palette surface — the InputGroup hairline\n        // carries the edge. display-xs (18px) keeps iOS from zooming in.\n        \"text-pho-primary placeholder:text-pho-placeholder text-display-xs w-full bg-transparent px-3 py-3 outline-none disabled:cursor-not-allowed disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n      ref={(node) => {\n        inputRef.current = node;\n        assignRef(consumerRef, node);\n      }}\n    />\n  );\n}\n\nfunction List({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.List>) {\n  return (\n    // Same spring as the onboarding / invite Card shell — list height glides\n    // when idle ↔ search (or filter) changes instead of jumping.\n    <AnimatedHeight>\n      {/* The scroller is a motion element with layoutScroll so the rows'\n          FLIP projections account for its scroll offset — without it,\n          scrolling reads as a layout change and every row glides to\n          compensate. scroll-py keeps a breath above and below the row\n          being scrolled into view. */}\n      <motion.div\n        layoutScroll\n        className=\"max-h-[min(24rem,60vh)] scroll-py-1 overflow-y-auto overscroll-contain\"\n      >\n        <CommandPrimitive.List\n          className={cn(\"relative isolate p-1\", className)}\n          {...props}\n        >\n          {children}\n        </CommandPrimitive.List>\n      </motion.div>\n    </AnimatedHeight>\n  );\n}\n\nfunction Empty({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Empty>) {\n  return (\n    <CommandPrimitive.Empty\n      className={cn(\n        \"text-pho-description px-2.5 py-6 text-center text-base\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Group({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Group>) {\n  return (\n    <CommandPrimitive.Group\n      className={cn(\n        // cmdk renders the `heading` prop in a [cmdk-group-heading] wrapper —\n        // typography mirrors `Autocomplete.GroupLabel`.\n        \"[&_[cmdk-group-heading]]:text-pho-secondary [&_[cmdk-group-heading]]:px-2.5 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Row layout mode:\n * - `item` / `subitem` / `subsubitem` — idle hierarchy (icon column + indent)\n * - `result` — flat search hit (breadcrumb + trailing scope)\n */\nexport type CommandItemLevel = \"item\" | \"subitem\" | \"subsubitem\" | \"result\";\n\ntype ItemPrimitiveProps = ComponentProps<typeof CommandPrimitive.Item>;\n\nexport interface CommandItemProps extends Omit<\n  ItemPrimitiveProps,\n  \"children\" | \"title\"\n> {\n  /**\n   * Row depth / mode in the palette:\n   * - `item` — page / top destination (icon + title)\n   * - `subitem` — section under an item (label aligns with the item title)\n   * - `subsubitem` — row under a section (one step deeper)\n   * - `result` — flat search hit (`title` + `path` crumbs + `scope`)\n   */\n  level?: CommandItemLevel;\n  /**\n   * Leading glyph. On idle `item` rows (and reserved for sub-levels). On\n   * `result` rows, pass the resolved icon (self → parent → grandparent).\n   */\n  icon?: ReactNode;\n  /**\n   * When `level=\"result\"`, force the icon column so labels align across the\n   * list even if this row's `icon` is empty. Set true when any sibling result\n   * has an icon; omit when the whole result set is icon-less.\n   */\n  iconSlot?: boolean;\n  /** Primary label. Prefer this over free-form children for the shared layout. */\n  title?: ReactNode;\n  /**\n   * Ancestors after `title` for `level=\"result\"` — parent → page\n   * (e.g. `[\"Agent profile\", \"Settings\"]` → `Name < Agent profile < Settings`).\n   */\n  path?: ReactNode[];\n  /**\n   * Trailing scope for `level=\"result\"` — `Project` vs `Personal`, not a nav group.\n   */\n  scope?: ReactNode;\n  /** Shows a trailing external-link glyph (opens outside the app). */\n  external?: boolean;\n  /**\n   * Free-form content. When `title` is set, rendered after the label stack.\n   * When `title` is omitted, becomes the row body (legacy / simple items).\n   */\n  children?: ReactNode;\n}\n\n/** Leading icon column — `size-4`, secondary ink. */\nfunction ItemIcon({ className, ...props }: ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\n        \"text-pho-secondary flex size-4 shrink-0 items-center justify-center [&>svg]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Primary label — medium + primary ink on `item` rows. */\nfunction ItemTitle({\n  className,\n  level = \"item\",\n  ...props\n}: ComponentProps<\"span\"> & { level?: CommandItemLevel }) {\n  return (\n    <span\n      className={cn(\n        \"text-md block truncate\",\n        level === \"item\" && \"text-pho-primary\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * One selectable row. Idle palettes use `level` + `icon` / `title`\n * (item → subitem → subsubitem). Searching uses `level=\"result\"` with `path`\n * crumbs and a trailing `scope` (Project / Personal). No description line —\n * match via `keywords` / aliases instead.\n */\nfunction ExternalGlyph() {\n  return (\n    <IconArrowUpRight\n      aria-hidden\n      className=\"text-pho-description size-4 shrink-0\"\n    />\n  );\n}\n\nfunction Item({\n  className,\n  level = \"item\",\n  icon,\n  iconSlot,\n  title,\n  path,\n  scope,\n  external,\n  children,\n  value,\n  ...props\n}: CommandItemProps) {\n  const reduceMotion = useReducedMotion();\n  // cmdk registers `value.trim()` and exposes the selected one as\n  // `state.value` — mirrors cmdk's own `data-selected` computation.\n  const trimmedValue = typeof value === \"string\" ? value.trim() : \"\";\n  const selectedValue = useCommandState((state) => state.value);\n  const isSelected = trimmedValue !== \"\" && selectedValue === trimmedValue;\n  const structured = title != null;\n  const isResult = level === \"result\";\n  // Reserve the icon column when the row has an icon, or when the list asks\n  // for alignment (`iconSlot`) even if this row's glyph is empty.\n  const showResultIcon = isResult && (icon != null || iconSlot);\n\n  const row = (\n    <CommandPrimitive.Item\n      data-level={level}\n      value={value}\n      className={cn(\n        \"text-pho-secondary flex cursor-pointer items-center gap-2 rounded-[calc(var(--radius-base)-4px)] py-2 pr-2.5 text-base outline-none select-none\",\n        // subsubitem steps in; item/subitem share the base gutter.\n        level === \"subsubitem\" ? \"pl-6\" : \"pl-2\",\n        // Secondary at rest; selection lifts to primary ink (Menu idiom).\n        // The wash lands with it instantly — stepping through rows is a\n        // snap, not a flight.\n        \"data-[selected=true]:text-pho-primary data-[selected=true]:bg-pho-ghost-hover\",\n        \"data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      {structured && isResult ? (\n        <>\n          {showResultIcon ? (\n            <ItemIcon aria-hidden={icon == null ? true : undefined}>\n              {icon ?? null}\n            </ItemIcon>\n          ) : null}\n          {/* Same text-md line box as idle ItemTitle so row height matches (36px). */}\n          <span className=\"text-md flex min-w-0 flex-1 items-center gap-1 overflow-hidden\">\n            <span className=\"text-pho-primary truncate\">{title}</span>\n            {(path ?? []).map((segment, index) => (\n              <span\n                key={index}\n                className=\"text-pho-description flex shrink-0 items-center gap-0.5\"\n              >\n                <IconChevronLeft aria-hidden className=\"size-4 shrink-0\" />\n                {segment}\n              </span>\n            ))}\n          </span>\n          {scope != null && scope !== \"\" ? (\n            <span className=\"text-pho-description shrink-0 text-xs\">\n              {scope}\n            </span>\n          ) : null}\n          {external ? <ExternalGlyph /> : null}\n          {children}\n        </>\n      ) : structured ? (\n        <>\n          {/* Icon column always reserved so subitem labels share the item title edge. */}\n          <ItemIcon aria-hidden={icon == null ? true : undefined}>\n            {icon ?? null}\n          </ItemIcon>\n          <span className=\"min-w-0 flex-1\">\n            <ItemTitle level={level}>{title}</ItemTitle>\n          </span>\n          {external ? <ExternalGlyph /> : null}\n          {children}\n        </>\n      ) : (\n        children\n      )}\n    </CommandPrimitive.Item>\n  );\n\n  if (reduceMotion) return row;\n\n  return (\n    // FLIP wrapper: rows that stay mounted glide when neighbours enter or\n    // leave, and a row remounting elsewhere with the same `value` (idle group\n    // ↔ flat search result) inherits the old bounds via its layoutId and\n    // slides to the new slot — the iOS list-diff feel. Rows without a match\n    // simply appear / disappear so the whole list never swarms.\n    //\n    // The selected row is the exception: it skips the travel and appears at\n    // its final slot immediately, so the selection wash is never sitting on\n    // empty space waiting for its row to fly in.\n    <motion.div\n      layout=\"position\"\n      layoutId={typeof value === \"string\" ? value : undefined}\n      initial={false}\n      transition={isSelected ? { duration: 0 } : ROW_MOVE_SPRING}\n    >\n      {row}\n    </motion.div>\n  );\n}\n\nfunction Separator({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Separator>) {\n  return (\n    <CommandPrimitive.Separator\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 Loading({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Loading>) {\n  return (\n    <CommandPrimitive.Loading\n      className={cn(\"text-pho-description px-2.5 py-1.5 text-base\", className)}\n      {...props}\n    />\n  );\n}\n\ntype DialogRootProps = ComponentProps<typeof PhoDialog.Root>;\n\ninterface CommandDialogProps extends ComponentProps<typeof CommandPrimitive> {\n  /** Controlled dialog state — pass straight through to `Dialog.Root`. */\n  open?: DialogRootProps[\"open\"];\n  onOpenChange?: DialogRootProps[\"onOpenChange\"];\n  /** Accessible name for the palette (dialog and command menu). */\n  label?: string;\n  /** Extra classes for the dialog panel (not the command root). */\n  className?: string;\n}\n\n/**\n * A command palette in a modal — Pho's `Dialog` overlay (Base UI) around a\n * `Command.Root`, raised above center. We deliberately skip cmdk's own\n * `Command.Dialog` (Radix) so overlays stay on one primitive stack.\n *\n * List height springs via `AnimatedHeight` (same feel as the Card shell on\n * onboarding / invite) — the input row stays put while results resize.\n */\nfunction Dialog({\n  open,\n  onOpenChange,\n  label,\n  className,\n  children,\n  ...props\n}: CommandDialogProps) {\n  return (\n    <PhoDialog.Root open={open} onOpenChange={onOpenChange}>\n      <PhoDialog.Portal>\n        <PhoDialog.Backdrop />\n        <PhoDialog.Popup\n          aria-label={label}\n          // Palette sits above center so the list grows downward from a\n          // stable top edge instead of jumping around it.\n          className={cn(\n            \"top-[max(4rem,18vh)] max-w-xl translate-y-0 overflow-hidden p-0\",\n            className,\n          )}\n        >\n          {/* The popup is position: fixed; layout animations inside a fixed\n              element need a layoutRoot to project against, or their\n              measurements drift with the page scroll. */}\n          <motion.div layoutRoot>\n            <Root label={label} {...props}>\n              {children}\n            </Root>\n          </motion.div>\n        </PhoDialog.Popup>\n      </PhoDialog.Portal>\n    </PhoDialog.Root>\n  );\n}\n\n/**\n * Command menu built on `cmdk` — a filterable list of actions driven from a\n * single input, keyboard-first. Compose inline (`Command.Root`) or as a\n * ⌘K-style modal palette (`Command.Dialog`, which owns the overlay).\n * Filtering is yours by default — filter in render so the rows' diff can\n * glide; pass `shouldFilter` to hand matching and ranking to cmdk (its\n * imperative reorder skips the animation).\n *\n * Rows share one layout via `Command.Item` `level` — idle\n * `item` → `subitem` → `subsubitem`, or flat `result` while searching.\n */\nexport const Command = {\n  Root,\n  InputGroup,\n  Input,\n  List,\n  Empty,\n  Group,\n  Item,\n  ItemIcon,\n  ItemTitle,\n  Separator,\n  Loading,\n  Dialog,\n};\n\n/** Re-export of cmdk's state selector hook (search, value, filtered counts). */\nexport { useCommandState };\n"],"mappings":"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"}

package/dist/chunks/date-picker-CZbcNIe-.js

@@ -0,0 +1,428 @@
+"use client";
+import { t as p } from "./cn-ChIgwEl3.js";
+import { t as Ue } from "./createReactComponent-BqCmnqfX.js";
+import { t as me } from "./calendar-4OFiCLAv.js";
+import { t as V } from "./popover-BhBJO346.js";
+import { useCallback as Ze, useEffect as We, useId as Je, useRef as Q, useState as x, useSyncExternalStore as Qe } from "react";
+import { Fragment as te, jsx as f, jsxs as y } from "react/jsx-runtime";
+var Xe = [
+  ["path", {
+    d: "M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12",
+    key: "svg-0"
+  }],
+  ["path", {
+    d: "M16 3v4",
+    key: "svg-1"
+  }],
+  ["path", {
+    d: "M8 3v4",
+    key: "svg-2"
+  }],
+  ["path", {
+    d: "M4 11h16",
+    key: "svg-3"
+  }],
+  ["path", {
+    d: "M11 15h1",
+    key: "svg-4"
+  }],
+  ["path", {
+    d: "M12 15v3",
+    key: "svg-5"
+  }]
+], pe = Ue("outline", "calendar", "Calendar", Xe), $e = {
+  hour: 3600,
+  minute: 60,
+  second: 1
+}, ge = {
+  sm: "px-3 py-2 text-md md:text-base",
+  md: "px-3 py-2 text-md",
+  lg: "px-3.5 py-2.5 text-md"
+}, ve = {
+  sm: "rounded-base",
+  md: "rounded-base",
+  lg: "squircle rounded-base"
+}, be = p("bg-pho-primary ring-pho-primary text-pho-primary relative flex cursor-pointer items-center gap-2 text-left ring-1 ring-inset", "transition-shadow duration-100 ease-linear focus-visible:outline-none", "data-[invalid]:ring-pho-error-subtle data-[invalid]:ring-[1.5px]"), et = p("has-[input:focus-visible]:ring-pho-brand data-[popup-open]:ring-pho-brand has-[input:focus-visible]:ring-2 data-[popup-open]:ring-2", "data-[invalid]:has-[input:focus-visible]:ring-pho-error data-[invalid]:data-[popup-open]:ring-pho-error", "has-[input:disabled]:cursor-not-allowed has-[input:disabled]:opacity-50"), tt = p("has-[input:focus-visible]:ring-pho-brand has-[input:focus-visible]:ring-2", "data-[invalid]:has-[input:focus-visible]:ring-pho-error", "has-[input:disabled]:cursor-not-allowed has-[input:disabled]:opacity-50"), nt = p("flex shrink-0 cursor-pointer items-center rounded-sm px-2.5 py-1.5 text-left text-base whitespace-nowrap select-none", "text-pho-secondary transition-[color,background-color] duration-150 ease-out", "hover:bg-pho-ghost-hover hover:text-pho-primary", "outline-pho-brand focus-visible:outline-2 focus-visible:-outline-offset-1", "sm:w-full"), rt = "bg-pho-ghost-hover text-pho-primary font-medium", ot = /[\u00a0\u2000-\u200a\u202f\u205f\u3000]/g, A = (e) => e.replace(ot, " "), Ce = {
+  year: "numeric",
+  month: "2-digit",
+  day: "2-digit"
+}, at = {
+  hour: {
+    hour: "2-digit",
+    minute: "2-digit",
+    hourCycle: "h23"
+  },
+  minute: {
+    hour: "2-digit",
+    minute: "2-digit",
+    hourCycle: "h23"
+  },
+  second: {
+    hour: "2-digit",
+    minute: "2-digit",
+    second: "2-digit",
+    hourCycle: "h23"
+  }
+}, R = "–", ke = new Date(2026, 8, 12, 15, 4, 5);
+function Se(e, t) {
+  return new Intl.DateTimeFormat(e, {
+    ...Ce,
+    ...t ? at[t] : {}
+  });
+}
+var Te = (e) => e === "year" || e === "month" || e === "day";
+function it(e) {
+  return new Intl.DateTimeFormat(e, Ce).formatToParts(ke).map((t) => t.type).filter(Te);
+}
+var st = {
+  year: "yyyy",
+  month: "mm",
+  day: "dd"
+};
+function lt(e, t) {
+  return A(Se(e, t).formatToParts(ke).map((n) => Te(n.type) ? st[n.type] : n.type === "hour" ? "hh" : n.type === "minute" ? "mm" : n.type === "second" ? "ss" : n.value).join(""));
+}
+function ut(e, t, n) {
+  if (e == null) return "";
+  const c = Se(t, n);
+  return e instanceof Date ? A(c.format(e)) : e.from == null ? "" : e.to == null || n == null && e.from.getFullYear() === e.to.getFullYear() && e.from.getMonth() === e.to.getMonth() && e.from.getDate() === e.to.getDate() ? A(c.format(e.from)) : A(ct(c, e.from, e.to, n != null));
+}
+function ct(e, t, n, c) {
+  const o = e.formatToParts(t), s = e.formatToParts(n), l = (d) => d.map((N) => N.value).join("");
+  if (c || o.length !== s.length) return `${l(o)}${R}${l(s)}`;
+  const h = (d) => o[d].type === s[d].type && o[d].value === s[d].value;
+  if (o[0]?.type === "year") {
+    let d = 0;
+    for (; d < o.length && h(d); ) d += 1;
+    for (; d > 0 && s[d - 1].type !== "literal"; ) d -= 1;
+    return d > 0 && d < o.length ? `${l(o)}${R}${l(s.slice(d))}` : `${l(o)}${R}${l(s)}`;
+  }
+  let u = o.length;
+  for (; u > 0 && h(u - 1); ) u -= 1;
+  for (; u < o.length && o[u].type !== "literal"; ) u += 1;
+  return u > 0 && u < o.length ? `${l(o.slice(0, u))}${R}${l(s)}` : `${l(o)}${R}${l(s)}`;
+}
+var O = (e) => String(e).padStart(2, "0");
+function M(e) {
+  return `${e.getFullYear()}-${O(e.getMonth() + 1)}-${O(e.getDate())}`;
+}
+function Ee(e, t) {
+  const n = `${O(e.getHours())}:${O(e.getMinutes())}`;
+  return t === "second" ? `${n}:${O(e.getSeconds())}` : n;
+}
+function X(e, t) {
+  return `${M(e)}T${Ee(e, t)}`;
+}
+function j(e) {
+  const t = /^(\d{4})-(\d{2})-(\d{2})(?:T(\d{2}):(\d{2})(?::(\d{2}))?)?$/.exec(e);
+  if (!t) return;
+  const [, n, c, o, s, l, h] = t, u = new Date(Number(n), Number(c) - 1, Number(o), Number(s ?? 0), Number(l ?? 0), Number(h ?? 0), 0);
+  return Number.isNaN(u.getTime()) ? void 0 : u;
+}
+function ye(e, t, n, c) {
+  const o = e < 100 ? 2e3 + e : e;
+  if (t < 1 || t > 12 || n < 1 || n > 31) return;
+  const [s = 0, l = 0, h = 0] = c;
+  if (s > 23 || l > 59 || h > 59) return;
+  const u = new Date(o, t - 1, n, s, l, h, 0);
+  return u.getMonth() === t - 1 && u.getDate() === n ? u : void 0;
+}
+function dt(e, t) {
+  const n = e.trim();
+  if (n === "") return;
+  const c = (n.match(/\d+/g) ?? []).map(Number);
+  if (c.length >= 3) {
+    const s = c.slice(3);
+    if (/\bpm\b/i.test(n) && s[0] !== void 0 && s[0] < 12 ? s[0] += 12 : /\bam\b/i.test(n) && s[0] === 12 && (s[0] = 0), /^\d{4}\D/.test(n)) {
+      const [h, u, d] = c;
+      return ye(h, u, d, s);
+    }
+    const l = {};
+    if (it(t).forEach((h, u) => {
+      l[h] = c[u];
+    }), l.year != null && l.month != null && l.day != null) {
+      const h = ye(l.year, l.month, l.day, s);
+      if (h) return h;
+    }
+  }
+  if (!/[a-z]/i.test(n) || c.length < 2 || !/\b\d{4}\b/.test(n)) return;
+  const o = new Date(n);
+  return Number.isNaN(o.getTime()) ? void 0 : o;
+}
+function g(e, t) {
+  const n = new Date(e);
+  return n.setMilliseconds(0), t === "second" || (n.setSeconds(0), t === "minute") || (n.setMinutes(0), t === "hour") || n.setHours(0), n;
+}
+function we(e) {
+  return e == null ? "" : e instanceof Date ? String(e.getTime()) : `${e.from?.getTime() ?? ""}-${e.to?.getTime() ?? ""}`;
+}
+function z(e, t) {
+  const n = new Date(e);
+  return t && n.setHours(t.getHours(), t.getMinutes(), t.getSeconds(), 0), n;
+}
+var ft = (e) => new Date(e.getFullYear(), e.getMonth(), 1), ht = (e) => new Date(e.getFullYear(), e.getMonth() + 1, 0), mt = (e) => new Date(e.getFullYear(), e.getMonth(), e.getDate()), xe = (e) => new Date(e.getFullYear(), e.getMonth(), e.getDate(), 23, 59, 59, 999), De = (e, t) => e && e > t ? e : t, Me = (e, t) => e && e < t ? e : t;
+function pt(e) {
+  if (e?.hidden != null) return null;
+  let t, n;
+  const c = e?.disabled == null ? [] : Array.isArray(e.disabled) ? e.disabled : [e.disabled];
+  for (const o of c) {
+    if (o == null || typeof o != "object" || o instanceof Date || Object.keys(o).length !== 1) return null;
+    if ("before" in o && o.before instanceof Date) t = De(t, mt(o.before));
+    else if ("after" in o && o.after instanceof Date) n = Me(n, xe(o.after));
+    else return null;
+  }
+  return e?.startMonth && (t = De(t, ft(e.startMonth))), e?.endMonth && (n = Me(n, xe(ht(e.endMonth)))), {
+    min: t,
+    max: n
+  };
+}
+var Ne = "(pointer: coarse)";
+function gt() {
+  const e = Ze((t) => {
+    if (typeof window > "u" || !window.matchMedia) return () => {
+    };
+    const n = window.matchMedia(Ne);
+    return n.addEventListener("change", t), () => n.removeEventListener("change", t);
+  }, []);
+  return Qe(e, () => typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia(Ne).matches, () => !1);
+}
+function ee({ label: e, value: t, time: n, disabled: c, onChange: o }) {
+  return /* @__PURE__ */ y(te, { children: [/* @__PURE__ */ f("span", {
+    className: "text-pho-description text-xs",
+    children: e
+  }), /* @__PURE__ */ f("label", {
+    className: p("bg-pho-primary ring-pho-primary rounded-sm px-2 py-1 ring-1 ring-inset", "focus-within:ring-pho-brand transition-shadow duration-100 ease-linear focus-within:ring-2"),
+    children: /* @__PURE__ */ f("input", {
+      type: "time",
+      step: $e[n],
+      disabled: c,
+      "aria-label": e,
+      value: t ? Ee(t, n) : "",
+      onChange: (s) => o(s.target.value),
+      className: p("text-pho-primary w-full bg-transparent text-base tabular-nums outline-none", "[&::-webkit-calendar-picker-indicator]:hidden")
+    })
+  })] });
+}
+function vt(e) {
+  const { mode: t = "single", defaultValue: n, onValueChange: c, label: o, hint: s, placeholder: l, invalid: h, disabled: u, required: d, size: N = "md", width: $ = "fill", time: a, locales: G, calendarProps: S, id: Ie, className: ne, selectedPreset: H, align: Fe = "start", "aria-label": re } = e, Y = e.presets, { minDays: Pe, maxDays: Re } = e, oe = "value" in e, [Ae, Oe] = x(n), _ = oe ? e.value : Ae, [C, k] = x(!1), T = Q(0), q = l ?? (t === "range" ? "Pick a date range" : lt(G, a)), _e = Je(), E = Ie ?? _e, K = s ? `${E}-hint` : void 0, ae = `${E}-calendar`, [ie, se] = x(!1), B = (r = !1) => {
+    C || (T.current = 0, F(void 0), se(r), k(!0));
+  }, le = c, v = (r, i) => {
+    i ? Z(!1) : (Z(!0), ue(null)), oe || Oe(r), i ? le?.(r, i) : le?.(r);
+  }, b = t === "single" ? _ : void 0, m = t === "range" ? _ : void 0, Le = b ?? m?.from, [Ve, w] = x(null), [U, ue] = x(null), [je, Z] = x(!1);
+  We(() => {
+    Z(!1);
+  }, [H]);
+  const W = H && !je ? H : U && U.key === we(_) ? U.label : null, I = Ve ?? W ?? ut(_, G, a), ze = Math.max(I.length, t === "range" ? 0 : q.length, 1), ce = $ === "hug" && t === "range", Ge = (r) => {
+    const i = typeof r.value == "function" ? r.value() : r.value;
+    ue({
+      label: r.label,
+      key: we(i)
+    }), w(null), v(i, { preset: r }), k(!1);
+  }, [He, F] = x(void 0), [Ye] = x(() => S?.today ?? /* @__PURE__ */ new Date()), de = He ?? S?.defaultMonth ?? Le ?? Ye, J = Q(null), fe = Q(null), qe = gt(), D = pt(S), Ke = qe && t === "single" && D != null && !Y?.length, Be = /* @__PURE__ */ y(te, { children: [/* @__PURE__ */ f(pe, { className: "text-pho-secondary size-4 shrink-0" }), /* @__PURE__ */ f("span", {
+    className: p("min-w-0 flex-1 truncate", I === "" && "text-pho-placeholder"),
+    children: I === "" ? q : I
+  })] });
+  return /* @__PURE__ */ y("div", {
+    className: p("flex flex-col gap-1.5", $ === "hug" ? "w-fit" : "w-full"),
+    children: [
+      o ? /* @__PURE__ */ y("label", {
+        htmlFor: E,
+        className: "text-pho-secondary flex w-fit cursor-default items-center gap-0.5 text-base font-medium",
+        children: [o, d ? /* @__PURE__ */ f("span", {
+          className: "text-pho-brand",
+          children: "*"
+        }) : null]
+      }) : null,
+      Ke ? /* @__PURE__ */ y("div", {
+        "data-invalid": h || void 0,
+        className: p(be, tt, $ === "hug" ? "w-fit" : "w-full", ge[N], ve[N], ne),
+        children: [Be, /* @__PURE__ */ f("input", {
+          id: E,
+          type: a ? "datetime-local" : "date",
+          step: a ? $e[a] : void 0,
+          min: D?.min ? a ? X(g(D.min, a), a) : M(D.min) : void 0,
+          max: D?.max ? a ? X(g(D.max, a), a) : M(D.max) : void 0,
+          required: d,
+          disabled: u,
+          "aria-label": re,
+          "aria-describedby": K,
+          value: b ? a ? X(b, a) : M(b) : "",
+          onChange: (r) => {
+            const i = j(r.target.value);
+            v(i ? g(i, a) : void 0);
+          },
+          className: "absolute inset-0 size-full cursor-pointer opacity-0"
+        })]
+      }) : /* @__PURE__ */ y(V.Root, {
+        open: C,
+        onOpenChange: (r, i) => {
+          !r && i.reason === "outside-press" && i.event.target instanceof Node && J.current?.contains(i.event.target) || (r ? (T.current = 0, F(void 0)) : (w(null), se(!1)), k(r));
+        },
+        children: [/* @__PURE__ */ y("div", {
+          ref: J,
+          "data-invalid": h || void 0,
+          "data-popup-open": C || void 0,
+          className: p(be, et, $ === "hug" ? "w-fit" : "w-full", ge[N], ve[N], ne),
+          children: [/* @__PURE__ */ f(pe, { className: "text-pho-secondary size-4 shrink-0" }), /* @__PURE__ */ f("input", {
+            id: E,
+            type: "text",
+            readOnly: t === "range",
+            disabled: u,
+            required: d,
+            placeholder: q,
+            "aria-label": re,
+            "aria-describedby": K,
+            role: "combobox",
+            "aria-haspopup": "dialog",
+            "aria-expanded": C,
+            "aria-controls": C ? ae : void 0,
+            autoComplete: "off",
+            spellCheck: !1,
+            value: I,
+            onFocus: () => B(),
+            onMouseDown: () => B(),
+            onChange: (r) => {
+              const i = r.target.value;
+              if (w(i), i.trim() === "") {
+                v(void 0);
+                return;
+              }
+              const P = dt(i, G);
+              P && (v(g(P, a)), F(P));
+            },
+            onBlur: () => w(null),
+            onKeyDown: (r) => {
+              if (r.key === "Escape" && C) {
+                r.preventDefault(), w(null), k(!1);
+                return;
+              }
+              if (r.key === "ArrowDown") {
+                r.preventDefault();
+                const i = fe.current?.querySelector("td[data-day] button[tabindex='0']");
+                if (i) {
+                  i.focus();
+                  return;
+                }
+                B(!0);
+              }
+            },
+            size: $ === "hug" && !ce ? ze : void 0,
+            className: p("text-pho-primary placeholder:text-pho-placeholder bg-transparent outline-none", ce ? "field-sizing-content w-auto min-w-min" : $ === "hug" ? "min-w-0" : "min-w-0 flex-1", t === "range" && "cursor-pointer")
+          })]
+        }), /* @__PURE__ */ f(V.Portal, { children: /* @__PURE__ */ f(V.Positioner, {
+          anchor: J,
+          align: Fe,
+          sideOffset: 6,
+          children: /* @__PURE__ */ f(V.Popup, {
+            ref: fe,
+            id: ae,
+            initialFocus: !1,
+            finalFocus: !1,
+            className: "max-h-[var(--available-height)] overflow-y-auto p-3",
+            children: /* @__PURE__ */ y("div", {
+              className: "flex flex-col gap-3 sm:flex-row",
+              children: [Y?.length ? /* @__PURE__ */ f("div", {
+                role: "group",
+                "aria-label": "Presets",
+                className: p("flex shrink-0 gap-1 overflow-x-auto", "sm:border-pho-secondary sm:w-36 sm:flex-col sm:gap-0.5 sm:overflow-visible sm:border-r sm:pr-3"),
+                children: Y.map((r) => /* @__PURE__ */ f("button", {
+                  type: "button",
+                  "aria-pressed": r.label === W,
+                  onClick: () => Ge(r),
+                  className: p(nt, r.label === W && rt),
+                  children: r.label
+                }, r.label))
+              }) : null, /* @__PURE__ */ y("div", { children: [t === "range" ? /* @__PURE__ */ f(me, {
+                ...S,
+                mode: "range",
+                min: Pe,
+                max: Re,
+                month: de,
+                onMonthChange: F,
+                autoFocus: ie,
+                selected: m,
+                onSelect: (r, i) => {
+                  const P = T.current === 0;
+                  if (T.current += 1, P && m?.to) {
+                    const he = g(z(i, a ? m.from : void 0), a);
+                    v({
+                      from: he,
+                      to: new Date(he)
+                    }), w(null);
+                    return;
+                  }
+                  const L = r && {
+                    from: r.from && g(z(r.from, a ? m?.from : void 0), a),
+                    to: r.to && g(z(r.to, a ? m?.to : void 0), a)
+                  };
+                  v(L), w(null), !a && T.current >= 2 && (!L || L.from && L.to) && k(!1);
+                }
+              }) : /* @__PURE__ */ f(me, {
+                ...S,
+                mode: "single",
+                month: de,
+                onMonthChange: F,
+                autoFocus: ie,
+                selected: b,
+                onSelect: (r) => {
+                  v(r && g(z(r, a ? b : void 0), a)), w(null), a || k(!1);
+                }
+              }), a ? /* @__PURE__ */ f("div", {
+                className: "border-pho-secondary mt-3 grid grid-cols-[auto_1fr] items-center gap-x-3 gap-y-2 border-t pt-3",
+                children: t === "range" ? /* @__PURE__ */ y(te, { children: [/* @__PURE__ */ f(ee, {
+                  label: "From",
+                  value: m?.from,
+                  time: a,
+                  onChange: (r) => {
+                    if (!m?.from) return;
+                    const i = j(`${M(m.from)}T${r}`);
+                    i && v({
+                      ...m,
+                      from: g(i, a)
+                    });
+                  },
+                  disabled: !m?.from
+                }), /* @__PURE__ */ f(ee, {
+                  label: "To",
+                  value: m?.to,
+                  time: a,
+                  onChange: (r) => {
+                    if (!m?.to) return;
+                    const i = j(`${M(m.to)}T${r}`);
+                    i && v({
+                      ...m,
+                      to: g(i, a)
+                    });
+                  },
+                  disabled: !m?.to
+                })] }) : /* @__PURE__ */ f(ee, {
+                  label: "Time",
+                  value: b,
+                  time: a,
+                  onChange: (r) => {
+                    if (!b) return;
+                    const i = j(`${M(b)}T${r}`);
+                    i && v(g(i, a));
+                  },
+                  disabled: !b
+                })
+              }) : null] })]
+            })
+          })
+        }) })]
+      }),
+      s ? /* @__PURE__ */ f("p", {
+        id: K,
+        className: p("text-pho-description text-base", h && "text-pho-error"),
+        children: s
+      }) : null
+    ]
+  });
+}
+vt.displayName = "DatePicker";
+export {
+  ut as n,
+  vt as t
+};
+
+//# sourceMappingURL=date-picker-CZbcNIe-.js.map