@evinvest/uikit 0.31.0 → 0.33.0

package/dist/components/{dropdown-menu.js → atomic/dropdown-menu.js}

@@ -1,27 +1,19 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
-import { useControllableState } from "../primitives/use-controllable-state.js";
-import { useFloating } from "../primitives/use-floating.js";
-import { DismissableLayerScope, useDismissableLayer } from "../primitives/dismissable-layer.js";
-import { usePresence } from "../primitives/presence.js";
-import { useRovingFocus } from "../primitives/use-roving-focus.js";
-import { useHoverIntent } from "../primitives/use-hover-intent.js";
-import { mergeRefs } from "../primitives/merge-refs.js";
-import { Portal } from "../primitives/portal.js";
-import { Slot } from "../primitives/slot.js";
-import {
-  DROPDOWN_MENU_CHECK_ITEM,
-  DROPDOWN_MENU_CONTENT,
-  DROPDOWN_MENU_ITEM,
-  DROPDOWN_MENU_ITEM_INDICATOR,
-  DROPDOWN_MENU_LABEL,
-  DROPDOWN_MENU_SEPARATOR,
-  DROPDOWN_MENU_SHORTCUT,
-  DROPDOWN_MENU_SUB_CONTENT,
-  DROPDOWN_MENU_SUB_TRIGGER
-} from "../generated/dropdown-menu.js";
+import { cn } from "../../lib/cn.js";
+import { useControllableState } from "../../primitives/use-controllable-state.js";
+import { useFloating } from "../../primitives/use-floating.js";
+import { DismissableLayerScope, useDismissableLayer } from "../../primitives/dismissable-layer.js";
+import { usePresence } from "../../primitives/presence.js";
+import { useRovingFocus } from "../../primitives/use-roving-focus.js";
+import { useHoverIntent } from "../../primitives/use-hover-intent.js";
+import { mergeRefs } from "../../primitives/merge-refs.js";
+import { Portal } from "../../primitives/portal.js";
+import { Slot } from "../../primitives/slot.js";
+import { DROPDOWN_MENU_CHECK_ITEM, DROPDOWN_MENU_CONTENT, DROPDOWN_MENU_ITEM, DROPDOWN_MENU_ITEM_INDICATOR, DROPDOWN_MENU_LABEL, DROPDOWN_MENU_SEPARATOR, DROPDOWN_MENU_SHORTCUT, DROPDOWN_MENU_SUB_CHEVRON, DROPDOWN_MENU_SUB_CONTENT, DROPDOWN_MENU_SUB_TRIGGER } from "../../generated/dropdown-menu.js";
+import { MENU_RADIO_DOT } from "../../generated/menu.js";
+import { iconShapes } from "../../icons/icon-shapes.js";
 const DropdownMenuContext = React.createContext(
   null
 );
@@ -212,7 +204,7 @@ function DropdownMenuCheckboxItem({
       },
       ...props,
       children: [
-        /* @__PURE__ */ jsx("span", { className: DROPDOWN_MENU_ITEM_INDICATOR, children: checked ? /* @__PURE__ */ jsx("svg", { className: "size-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M20 6 9 17l-5-5" }) }) : null }),
+        /* @__PURE__ */ jsx("span", { className: DROPDOWN_MENU_ITEM_INDICATOR, children: checked ? /* @__PURE__ */ jsx("svg", { className: "size-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: iconShapes("check") }) : null }),
         children
       ]
     }
@@ -264,7 +256,7 @@ function DropdownMenuRadioItem({
       },
       ...props,
       children: [
-        /* @__PURE__ */ jsx("span", { className: DROPDOWN_MENU_ITEM_INDICATOR, children: checked ? /* @__PURE__ */ jsx("svg", { className: "size-2 fill-current", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }) }) : null }),
+        /* @__PURE__ */ jsx("span", { className: DROPDOWN_MENU_ITEM_INDICATOR, children: checked ? /* @__PURE__ */ jsx("svg", { className: MENU_RADIO_DOT, viewBox: "0 0 24 24", "aria-hidden": "true", children: iconShapes("dot") }) : null }),
         children
       ]
     }
@@ -358,7 +350,7 @@ function DropdownMenuSubTrigger({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx("svg", { className: "ml-auto size-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" }) })
+        /* @__PURE__ */ jsx("svg", { className: DROPDOWN_MENU_SUB_CHEVRON, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: iconShapes("chevron-right") })
       ]
     }
   );

package/dist/components/atomic/dropdown-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/dropdown-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { useControllableState } from \"../../primitives/use-controllable-state\";\nimport { useFloating } from \"../../primitives/use-floating\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../../primitives/dismissable-layer\";\nimport { usePresence } from \"../../primitives/presence\";\nimport { useRovingFocus } from \"../../primitives/use-roving-focus\";\nimport { useHoverIntent } from \"../../primitives/use-hover-intent\";\nimport { mergeRefs } from \"../../primitives/merge-refs\";\nimport { Portal } from \"../../primitives/portal\";\nimport { Slot } from \"../../primitives/slot\";\nimport { DROPDOWN_MENU_CHECK_ITEM, DROPDOWN_MENU_CONTENT, DROPDOWN_MENU_ITEM, DROPDOWN_MENU_ITEM_INDICATOR, DROPDOWN_MENU_LABEL, DROPDOWN_MENU_SEPARATOR, DROPDOWN_MENU_SHORTCUT, DROPDOWN_MENU_SUB_CHEVRON, DROPDOWN_MENU_SUB_CONTENT, DROPDOWN_MENU_SUB_TRIGGER } from \"../../generated/dropdown-menu\";\nimport type { MenuItemVariant } from \"../../generated/menu\";\nimport { MENU_RADIO_DOT } from \"../../generated/menu\";\nimport { iconShapes } from \"../../icons/icon-shapes\";\n\ninterface DropdownMenuContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  anchorRef: React.RefObject<HTMLElement | null>;\n}\n\nconst DropdownMenuContext = React.createContext<DropdownMenuContextValue | null>(\n  null,\n);\n\nfunction useDropdownMenu(): DropdownMenuContextValue {\n  const ctx = React.useContext(DropdownMenuContext);\n  if (!ctx) throw new Error(\"DropdownMenu parts must be used within <DropdownMenu>\");\n  return ctx;\n}\n\nexport interface DropdownMenuProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function DropdownMenu({ open, defaultOpen = false, onOpenChange, children }: DropdownMenuProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const anchorRef = React.useRef<HTMLElement | null>(null);\n  return (\n    <DropdownMenuContext.Provider value={{ open: isOpen, setOpen, anchorRef }}>\n      <div data-slot=\"dropdown-menu\">{children}</div>\n    </DropdownMenuContext.Provider>\n  );\n}\n\nexport function DropdownMenuPortal({ children }: { children?: React.ReactNode }) {\n  return <Portal>{children}</Portal>;\n}\n\nexport interface DropdownMenuTriggerProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n}\n\nexport function DropdownMenuTrigger({ asChild = false, onClick, ...props }: DropdownMenuTriggerProps) {\n  const { open, setOpen, anchorRef } = useDropdownMenu();\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"dropdown-menu-trigger\"\n      aria-haspopup=\"menu\"\n      aria-expanded={open}\n      data-state={open ? \"open\" : \"closed\"}\n      ref={anchorRef as React.Ref<HTMLButtonElement>}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(!open);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface DropdownMenuContentProps extends React.ComponentProps<\"div\"> {\n  sideOffset?: number;\n  align?: \"start\" | \"center\" | \"end\";\n}\n\nexport function DropdownMenuContent({\n  className,\n  sideOffset = 4,\n  align = \"start\",\n  children,\n  ...props\n}: DropdownMenuContentProps) {\n  const { open, setOpen, anchorRef } = useDropdownMenu();\n  const { isPresent, ref: presRef } = usePresence(open);\n  const { floatingRef, style, side } = useFloating({\n    anchorRef,\n    open,\n    side: \"bottom\",\n    align,\n    offset: sideOffset,\n  });\n  const dismissRef = useDismissableLayer({\n    enabled: open,\n    onDismiss: () => setOpen(false),\n    exclude: [anchorRef],\n  });\n  const contentRef = React.useRef<HTMLDivElement | null>(null);\n  // Roving focus across rendered menu items: ArrowUp/Down move the active item.\n  const items = () =>\n    Array.from(\n      contentRef.current?.querySelectorAll<HTMLElement>(\"[role^='menuitem']\") ?? [],\n    ).filter((el) => el.getAttribute(\"data-disabled\") === null);\n  const { activeIndex, setActiveIndex, onKeyDown: rovingKeyDown } = useRovingFocus({\n    count: () => items().length,\n    orientation: \"vertical\",\n    loop: true,\n  });\n  // Reset on close: a menu reopens on its first item, and an index left past\n  // the end (items gone while closed) would focus nothing.\n  React.useEffect(() => {\n    if (!open) setActiveIndex(0);\n  }, [open, setActiveIndex]);\n  React.useEffect(() => {\n    if (!open) return;\n    items()[activeIndex]?.focus();\n  }, [open, activeIndex]);\n  // Give focus back to the trigger on close, as Popover and Dialog do. Skipped when focus already\n  // went somewhere real (an item opened a dialog, an outside click landed on an input).\n  const wasOpen = React.useRef(false);\n  React.useEffect(() => {\n    if (open) {\n      wasOpen.current = true;\n      return;\n    }\n    if (!wasOpen.current) return;\n    wasOpen.current = false;\n    const active = document.activeElement;\n    if (!active || active === document.body || contentRef.current?.contains(active)) anchorRef.current?.focus();\n  }, [open, anchorRef]);\n  // Selecting an item closes the menu: items call this through context.\n  const close = React.useCallback(() => setOpen(false), [setOpen]);\n  if (!isPresent) return null;\n  return (\n    <Portal>\n      <DropdownMenuCloseContext.Provider value={close}>\n        <div\n          data-slot=\"dropdown-menu-content\"\n          data-state={open ? \"open\" : \"closed\"}\n          data-side={side}\n          role=\"menu\"\n          tabIndex={-1}\n          // Escape is the stack's (useDismissableLayer): it closes this menu\n          // only while it is the top layer.\n          onKeyDown={rovingKeyDown}\n          ref={mergeRefs(floatingRef, dismissRef, presRef, contentRef)}\n          style={style}\n          className={cn(\n            DROPDOWN_MENU_CONTENT,\n            className,\n          )}\n          {...(props as Record<string, unknown>)}\n        >\n          <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n        </div>\n      </DropdownMenuCloseContext.Provider>\n    </Portal>\n  );\n}\n\nconst DropdownMenuCloseContext = React.createContext<() => void>(() => {});\n\nexport function DropdownMenuGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return <div data-slot=\"dropdown-menu-group\" role=\"group\" className={className} {...props} />;\n}\n\nexport interface DropdownMenuItemProps extends React.ComponentProps<\"div\"> {\n  /** Render the child (a link) as the item. */\n  asChild?: boolean;\n  inset?: boolean;\n  variant?: MenuItemVariant;\n  disabled?: boolean;\n}\n\nexport function DropdownMenuItem({\n  asChild = false,\n  className,\n  inset,\n  variant = \"neutral\",\n  disabled,\n  onClick,\n  onKeyDown,\n  ...props\n}: DropdownMenuItemProps) {\n  const close = React.useContext(DropdownMenuCloseContext);\n  const Comp = asChild ? Slot : \"div\";\n  return (\n    <Comp\n      data-slot=\"dropdown-menu-item\"\n      data-inset={inset ? \"\" : undefined}\n      data-variant={variant}\n      data-disabled={disabled ? \"\" : undefined}\n      role=\"menuitem\"\n      tabIndex={disabled ? undefined : -1}\n      className={cn(\n        DROPDOWN_MENU_ITEM,\n        className,\n      )}\n      onClick={(e) => {\n        if (disabled) return;\n        onClick?.(e);\n        close();\n      }}\n      onKeyDown={(e) => {\n        onKeyDown?.(e);\n        if (e.key === \"Enter\" || e.key === \" \") {\n          e.preventDefault();\n          (e.currentTarget as HTMLElement).click();\n        }\n      }}\n      {...props}\n    />\n  );\n}\n\nexport interface DropdownMenuCheckboxItemProps extends React.ComponentProps<\"div\"> {\n  checked?: boolean;\n  disabled?: boolean;\n}\n\nexport function DropdownMenuCheckboxItem({\n  className,\n  children,\n  checked,\n  disabled,\n  onClick,\n  onKeyDown,\n  ...props\n}: DropdownMenuCheckboxItemProps) {\n  // No close: several boxes can be toggled in one visit. Escape or an outside click ends it.\n  return (\n    <div\n      data-slot=\"dropdown-menu-checkbox-item\"\n      role=\"menuitemcheckbox\"\n      aria-checked={checked}\n      data-state={checked ? \"checked\" : \"unchecked\"}\n      data-disabled={disabled ? \"\" : undefined}\n      tabIndex={disabled ? undefined : -1}\n      className={cn(\n        DROPDOWN_MENU_CHECK_ITEM,\n        className,\n      )}\n      onClick={(e) => {\n        if (disabled) return;\n        onClick?.(e);\n      }}\n      onKeyDown={(e) => {\n        onKeyDown?.(e);\n        if (e.key === \"Enter\" || e.key === \" \") {\n          e.preventDefault();\n          (e.currentTarget as HTMLElement).click();\n        }\n      }}\n      {...props}\n    >\n      <span className={DROPDOWN_MENU_ITEM_INDICATOR}>\n        {checked ? (\n          <svg className=\"size-4\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n            {iconShapes(\"check\")}\n          </svg>\n        ) : null}\n      </span>\n      {children}\n    </div>\n  );\n}\n\ninterface DropdownMenuRadioGroupContextValue {\n  value: string | undefined;\n  setValue: (next: string) => void;\n}\n\nconst DropdownMenuRadioGroupContext =\n  React.createContext<DropdownMenuRadioGroupContextValue | null>(null);\n\nexport interface DropdownMenuRadioGroupProps extends Omit<React.ComponentProps<\"div\">, \"onChange\"> {\n  value?: string;\n  onValueChange?: (value: string) => void;\n}\n\nexport function DropdownMenuRadioGroup({\n  className,\n  value,\n  onValueChange,\n  children,\n  ...props\n}: DropdownMenuRadioGroupProps) {\n  const ctx = React.useMemo<DropdownMenuRadioGroupContextValue>(\n    () => ({ value, setValue: (next) => onValueChange?.(next) }),\n    [value, onValueChange],\n  );\n  return (\n    <DropdownMenuRadioGroupContext.Provider value={ctx}>\n      <div data-slot=\"dropdown-menu-radio-group\" role=\"group\" className={className} {...props}>\n        {children}\n      </div>\n    </DropdownMenuRadioGroupContext.Provider>\n  );\n}\n\nexport interface DropdownMenuRadioItemProps extends React.ComponentProps<\"div\"> {\n  value: string;\n  disabled?: boolean;\n}\n\nexport function DropdownMenuRadioItem({\n  className,\n  children,\n  value,\n  disabled,\n  onClick,\n  ...props\n}: DropdownMenuRadioItemProps) {\n  const close = React.useContext(DropdownMenuCloseContext);\n  const group = React.useContext(DropdownMenuRadioGroupContext);\n  const checked = group?.value === value;\n  return (\n    <div\n      data-slot=\"dropdown-menu-radio-item\"\n      role=\"menuitemradio\"\n      aria-checked={checked}\n      data-state={checked ? \"checked\" : \"unchecked\"}\n      data-disabled={disabled ? \"\" : undefined}\n      tabIndex={disabled ? undefined : -1}\n      className={cn(\n        DROPDOWN_MENU_CHECK_ITEM,\n        className,\n      )}\n      onClick={(e) => {\n        if (disabled) return;\n        onClick?.(e);\n        group?.setValue(value);\n        close();\n      }}\n      {...props}\n    >\n      <span className={DROPDOWN_MENU_ITEM_INDICATOR}>\n        {checked ? (\n          <svg className={MENU_RADIO_DOT} viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n            {iconShapes(\"dot\")}\n          </svg>\n        ) : null}\n      </span>\n      {children}\n    </div>\n  );\n}\n\nexport interface DropdownMenuLabelProps extends React.ComponentProps<\"div\"> {\n  inset?: boolean;\n}\n\nexport function DropdownMenuLabel({ className, inset, ...props }: DropdownMenuLabelProps) {\n  return (\n    <div\n      data-slot=\"dropdown-menu-label\"\n      data-inset={inset ? \"\" : undefined}\n      className={cn(DROPDOWN_MENU_LABEL, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DropdownMenuSeparator({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dropdown-menu-separator\"\n      role=\"separator\"\n      className={cn(DROPDOWN_MENU_SEPARATOR, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DropdownMenuShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"dropdown-menu-shortcut\"\n      className={cn(DROPDOWN_MENU_SHORTCUT, className)}\n      {...props}\n    />\n  );\n}\n\n// Sub-menus render inline (nested) rather than in a separate floating layer: the\n// sub-content is revealed in place when its trigger toggles, simplifying the\n// nesting Radix portals each level. data-state still reflects open/closed.\ninterface DropdownMenuSubContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  triggerRef: React.RefObject<HTMLDivElement | null>;\n  /** Set by a keyboard open, so the first item takes focus; a pointer open leaves focus alone. */\n  focusFirst: React.RefObject<boolean>;\n}\n\nconst DropdownMenuSubContext = React.createContext<DropdownMenuSubContextValue | null>(null);\n\nexport interface DropdownMenuSubProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function DropdownMenuSub({ open, defaultOpen = false, onOpenChange, children }: DropdownMenuSubProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const triggerRef = React.useRef<HTMLDivElement | null>(null);\n  const focusFirst = React.useRef(false);\n  // On the wrapper, which holds the trigger and the flyout, so crossing from one to the other is not \"leaving\".\n  const hover = useHoverIntent({\n    onOpen: () => setOpen(true),\n    onClose: () => setOpen(false),\n    openDelay: 100,\n    closeDelay: 150,\n  });\n  return (\n    <DropdownMenuSubContext.Provider value={{ open: isOpen, setOpen, triggerRef, focusFirst }}>\n      <div data-slot=\"dropdown-menu-sub\" {...hover}>\n        {children}\n      </div>\n    </DropdownMenuSubContext.Provider>\n  );\n}\n\nexport interface DropdownMenuSubTriggerProps extends React.ComponentProps<\"div\"> {\n  inset?: boolean;\n}\n\nexport function DropdownMenuSubTrigger({\n  className,\n  inset,\n  children,\n  onClick,\n  onKeyDown,\n  ...props\n}: DropdownMenuSubTriggerProps) {\n  const ctx = React.useContext(DropdownMenuSubContext);\n  return (\n    <div\n      ref={ctx?.triggerRef}\n      data-slot=\"dropdown-menu-sub-trigger\"\n      data-inset={inset ? \"\" : undefined}\n      data-state={ctx?.open ? \"open\" : \"closed\"}\n      role=\"menuitem\"\n      aria-haspopup=\"menu\"\n      aria-expanded={ctx?.open}\n      tabIndex={-1}\n      className={cn(\n        DROPDOWN_MENU_SUB_TRIGGER,\n        className,\n      )}\n      onClick={(e) => {\n        onClick?.(e);\n        ctx?.setOpen(!ctx.open);\n      }}\n      onKeyDown={(e) => {\n        onKeyDown?.(e);\n        if (!ctx || (e.key !== \"ArrowRight\" && e.key !== \"Enter\" && e.key !== \" \")) return;\n        e.preventDefault();\n        // Stops the menu's own handler, which would read Enter as \"select this item\".\n        e.stopPropagation();\n        ctx.focusFirst.current = true;\n        ctx.setOpen(true);\n      }}\n      {...props}\n    >\n      {children}\n      <svg className={DROPDOWN_MENU_SUB_CHEVRON} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n        {iconShapes(\"chevron-right\")}\n      </svg>\n    </div>\n  );\n}\n\nexport function DropdownMenuSubContent({ className, children, onKeyDown, ...props }: React.ComponentProps<\"div\">) {\n  const ctx = React.useContext(DropdownMenuSubContext);\n  const ref = React.useRef<HTMLDivElement | null>(null);\n  const open = ctx?.open ?? false;\n  React.useEffect(() => {\n    if (!open || !ctx?.focusFirst.current) return;\n    ctx.focusFirst.current = false;\n    ref.current?.querySelector<HTMLElement>(\"[role^='menuitem']\")?.focus();\n  }, [open, ctx]);\n  if (!ctx?.open) return null;\n  return (\n    <div\n      ref={ref}\n      onKeyDown={(e) => {\n        onKeyDown?.(e);\n        if (e.key === \"ArrowLeft\" || e.key === \"Escape\") {\n          // Closes this flyout only; Escape would otherwise reach the whole menu's dismissal.\n          e.preventDefault();\n          e.stopPropagation();\n          ctx.setOpen(false);\n          ctx.triggerRef.current?.focus();\n        }\n      }}\n      data-slot=\"dropdown-menu-sub-content\"\n      data-state=\"open\"\n      role=\"menu\"\n      className={cn(\n        DROPDOWN_MENU_SUB_CONTENT,\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/{empty.js → atomic/empty.js}

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
+import { cn } from "../../lib/cn.js";
 import {
   EMPTY,
   EMPTY_CONTENT,
@@ -9,7 +9,7 @@ import {
   EMPTY_MEDIA_BASE,
   EMPTY_TITLE,
   emptyMediaVariants
-} from "../generated/empty.js";
+} from "../../generated/empty.js";
 function Empty({ className, ...props }) {
   return /* @__PURE__ */ jsx("div", { "data-slot": "empty", className: cn(EMPTY, className), ...props });
 }

package/dist/components/atomic/empty.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/empty.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport {\n  EMPTY,\n  EMPTY_CONTENT,\n  EMPTY_DESCRIPTION,\n  EMPTY_HEADER,\n  EMPTY_MEDIA_BASE,\n  EMPTY_TITLE,\n  emptyMediaVariants,\n  type EmptyMediaVariant,\n} from \"../../generated/empty\";\n\nexport type { EmptyMediaVariant };\n\nexport function Empty({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div data-slot=\"empty\" className={cn(EMPTY, className)} {...props} />\n  );\n}\n\nexport function EmptyHeader({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-header\"\n      className={cn(EMPTY_HEADER, className)}\n      {...props}\n    />\n  );\n}\n\nexport interface EmptyMediaProps extends React.ComponentProps<\"div\"> {\n  variant?: EmptyMediaVariant;\n}\n\nexport function EmptyMedia({\n  className,\n  variant = \"bare\",\n  ...props\n}: EmptyMediaProps) {\n  return (\n    <div\n      data-slot=\"empty-icon\"\n      data-variant={variant}\n      className={cn(EMPTY_MEDIA_BASE, emptyMediaVariants[variant], className)}\n      {...props}\n    />\n  );\n}\n\nexport function EmptyTitle({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-title\"\n      className={cn(EMPTY_TITLE, className)}\n      {...props}\n    />\n  );\n}\n\nexport function EmptyDescription({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-description\"\n      className={cn(EMPTY_DESCRIPTION, className)}\n      {...props}\n    />\n  );\n}\n\nexport function EmptyContent({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"empty-content\"\n      className={cn(EMPTY_CONTENT, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"AAiBI;AAjBJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAIA,SAAS,MAAM,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC1E,SACE,oBAAC,SAAI,aAAU,SAAQ,WAAW,GAAG,OAAO,SAAS,GAAI,GAAG,OAAO;AAEvE;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,cAAc,SAAS;AAAA,MACpC,GAAG;AAAA;AAAA,EACN;AAEJ;AAMO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,GAAoB;AAClB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,WAAW,GAAG,kBAAkB,mBAAmB,OAAO,GAAG,SAAS;AAAA,MACrE,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,aAAa,SAAS;AAAA,MACnC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,mBAAmB,SAAS;AAAA,MACzC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,eAAe,SAAS;AAAA,MACrC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/atomic/field-context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/field-context.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\n/**\n * The id a `<Field>` hands to the one control it labels. `React.useId` is\n * derived from the position in the tree, so the server render and the hydrating\n * client agree on it — a module counter would not, and the label's `for` would\n * point at nothing after hydration.\n */\nexport interface FieldControl {\n  id: string;\n  /** Records a control taking the id; returns the release. */\n  claim: () => () => void;\n}\n\nexport const FieldControlContext = React.createContext<FieldControl | null>(null);\n\nconst DEV = typeof process !== \"undefined\" && process.env.NODE_ENV !== \"production\";\n\n/** The `claim` of a `Field`: warns in development when a second control takes the id. */\nexport function useFieldClaims(): () => () => void {\n  const claims = React.useRef(0);\n  return React.useCallback(() => {\n    claims.current += 1;\n    if (DEV && claims.current === 2) {\n      console.warn(\n        \"@evinvest/uikit: two controls took the same <Field> id. A Field labels one control; \" +\n          \"give the others an `id` of their own.\",\n      );\n    }\n    return () => {\n      claims.current -= 1;\n    };\n  }, []);\n}\n\n/** The caller's `id` when given, else the enclosing `<Field>`'s, else none. */\nexport function useFieldControlId(id: string | undefined): string | undefined {\n  const field = React.useContext(FieldControlContext);\n  const fromField = id === undefined ? field : null;\n  React.useEffect(() => fromField?.claim(), [fromField]);\n  return id ?? fromField?.id;\n}\n"],"mappings":";AAEA,YAAY,WAAW;AAchB,MAAM,sBAAsB,MAAM,cAAmC,IAAI;AAEhF,MAAM,MAAM,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa;AAGhE,SAAS,iBAAmC;AACjD,QAAM,SAAS,MAAM,OAAO,CAAC;AAC7B,SAAO,MAAM,YAAY,MAAM;AAC7B,WAAO,WAAW;AAClB,QAAI,OAAO,OAAO,YAAY,GAAG;AAC/B,cAAQ;AAAA,QACN;AAAA,MAEF;AAAA,IACF;AACA,WAAO,MAAM;AACX,aAAO,WAAW;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,CAAC;AACP;AAGO,SAAS,kBAAkB,IAA4C;AAC5E,QAAM,QAAQ,MAAM,WAAW,mBAAmB;AAClD,QAAM,YAAY,OAAO,SAAY,QAAQ;AAC7C,QAAM,UAAU,MAAM,WAAW,MAAM,GAAG,CAAC,SAAS,CAAC;AACrD,SAAO,MAAM,WAAW;AAC1B;","names":[]}

package/dist/components/{form-row.js → atomic/form-row.js}

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
+import { cn } from "../../lib/cn.js";
 import {
   FORM_ROW_BASE,
   FORM_ROW_CONTROL,
@@ -9,7 +9,7 @@ import {
   FORM_ROW_HINT,
   FORM_ROW_LABEL,
   FORM_ROW_LABEL_COLUMN
-} from "../generated/form-row.js";
+} from "../../generated/form-row.js";
 function FormRow({
   label,
   htmlFor,

package/dist/components/atomic/form-row.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/form-row.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport {\n  FORM_ROW_BASE,\n  FORM_ROW_CONTROL,\n  FORM_ROW_DESCRIPTION,\n  FORM_ROW_DIVIDER,\n  FORM_ROW_HINT,\n  FORM_ROW_LABEL,\n  FORM_ROW_LABEL_COLUMN,\n} from \"../../generated/form-row\";\n\nexport interface FormRowProps extends Omit<React.ComponentProps<\"div\">, \"title\"> {\n  label: React.ReactNode;\n  /** The id of the control in `children`; renders the label as a `<label for>`. */\n  htmlFor?: string;\n  /** A line under the label. */\n  description?: React.ReactNode;\n  /** A caption under the control, e.g. a format hint. */\n  hint?: React.ReactNode;\n  /** Hairline under the row. Default true; the last row of a group turns it off. */\n  divider?: boolean;\n}\n\n/**\n * Label on the left, the value or its control on the right; they stack on a\n * phone. A plain `div`, not `ListRow`: it is a form field row, not a list item,\n * and its label column has a fixed width so controls line up down the page.\n */\nexport function FormRow({\n  label,\n  htmlFor,\n  description,\n  hint,\n  divider = true,\n  className,\n  children,\n  ...props\n}: FormRowProps) {\n  const Label = htmlFor !== undefined ? \"label\" : \"span\";\n  return (\n    <div\n      data-slot=\"form-row\"\n      data-divider={divider}\n      className={cn(\n        FORM_ROW_BASE,\n        divider && FORM_ROW_DIVIDER,\n        className,\n      )}\n      {...props}\n    >\n      <div data-slot=\"form-row-label\" className={FORM_ROW_LABEL_COLUMN}>\n        <Label {...(htmlFor !== undefined ? { htmlFor } : {})} className={FORM_ROW_LABEL}>\n          {label}\n        </Label>\n        {description != null && <span className={FORM_ROW_DESCRIPTION}>{description}</span>}\n      </div>\n      <div data-slot=\"form-row-control\" className={FORM_ROW_CONTROL}>\n        {children}\n        {hint != null && <span className={FORM_ROW_HINT}>{hint}</span>}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"AAmDM,SACE,KADF;AAnDN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAmBA,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiB;AACf,QAAM,QAAQ,YAAY,SAAY,UAAU;AAChD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,WAAW;AAAA,QACT;AAAA,QACA,WAAW;AAAA,QACX;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,6BAAC,SAAI,aAAU,kBAAiB,WAAW,uBACzC;AAAA,8BAAC,SAAO,GAAI,YAAY,SAAY,EAAE,QAAQ,IAAI,CAAC,GAAI,WAAW,gBAC/D,iBACH;AAAA,UACC,eAAe,QAAQ,oBAAC,UAAK,WAAW,sBAAuB,uBAAY;AAAA,WAC9E;AAAA,QACA,qBAAC,SAAI,aAAU,oBAAmB,WAAW,kBAC1C;AAAA;AAAA,UACA,QAAQ,QAAQ,oBAAC,UAAK,WAAW,eAAgB,gBAAK;AAAA,WACzD;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/components/{hover-card.js → atomic/hover-card.js}

@@ -1,14 +1,14 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
-import { useControllableState } from "../primitives/use-controllable-state.js";
-import { useFloating } from "../primitives/use-floating.js";
-import { usePresence } from "../primitives/presence.js";
-import { mergeRefs } from "../primitives/merge-refs.js";
-import { Portal } from "../primitives/portal.js";
-import { Slot } from "../primitives/slot.js";
-import { HOVER_CARD_CONTENT } from "../generated/hover-card.js";
+import { cn } from "../../lib/cn.js";
+import { useControllableState } from "../../primitives/use-controllable-state.js";
+import { useFloating } from "../../primitives/use-floating.js";
+import { usePresence } from "../../primitives/presence.js";
+import { mergeRefs } from "../../primitives/merge-refs.js";
+import { Portal } from "../../primitives/portal.js";
+import { Slot } from "../../primitives/slot.js";
+import { HOVER_CARD_CONTENT } from "../../generated/hover-card.js";
 const HoverCardContext = React.createContext(null);
 function useHoverCard() {
   const ctx = React.useContext(HoverCardContext);

package/dist/components/atomic/hover-card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/hover-card.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { useControllableState } from \"../../primitives/use-controllable-state\";\nimport { useFloating } from \"../../primitives/use-floating\";\nimport { usePresence } from \"../../primitives/presence\";\nimport { mergeRefs } from \"../../primitives/merge-refs\";\nimport { Portal } from \"../../primitives/portal\";\nimport { Slot } from \"../../primitives/slot\";\nimport { HOVER_CARD_CONTENT } from \"../../generated/hover-card\";\nimport type { Side } from \"../../generated/primitives\";\n\ninterface HoverCardContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  anchorRef: React.RefObject<HTMLElement | null>;\n}\n\nconst HoverCardContext = React.createContext<HoverCardContextValue | null>(null);\n\nfunction useHoverCard(): HoverCardContextValue {\n  const ctx = React.useContext(HoverCardContext);\n  if (!ctx) throw new Error(\"HoverCard parts must be used within <HoverCard>\");\n  return ctx;\n}\n\nexport interface HoverCardProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function HoverCard({ open, defaultOpen = false, onOpenChange, children }: HoverCardProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const anchorRef = React.useRef<HTMLElement | null>(null);\n  return (\n    <HoverCardContext.Provider value={{ open: isOpen, setOpen, anchorRef }}>\n      {children}\n    </HoverCardContext.Provider>\n  );\n}\n\nexport interface HoverCardTriggerProps extends React.ComponentProps<\"a\"> {\n  asChild?: boolean;\n}\n\nexport function HoverCardTrigger({\n  asChild = false,\n  onPointerEnter,\n  onPointerLeave,\n  ...props\n}: HoverCardTriggerProps) {\n  const { setOpen, anchorRef } = useHoverCard();\n  const Comp = asChild ? Slot : \"a\";\n  return (\n    <Comp\n      data-slot=\"hover-card-trigger\"\n      ref={anchorRef as React.Ref<never>}\n      onPointerEnter={(e: React.PointerEvent<HTMLAnchorElement>) => {\n        onPointerEnter?.(e);\n        setOpen(true);\n      }}\n      onPointerLeave={(e: React.PointerEvent<HTMLAnchorElement>) => {\n        onPointerLeave?.(e);\n        setOpen(false);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface HoverCardContentProps extends React.ComponentProps<\"div\"> {\n  side?: Side;\n  align?: \"start\" | \"center\" | \"end\";\n  sideOffset?: number;\n}\n\nexport function HoverCardContent({\n  className,\n  side: sideProp = \"bottom\",\n  align = \"center\",\n  sideOffset = 4,\n  children,\n  ...props\n}: HoverCardContentProps) {\n  const { open, anchorRef } = useHoverCard();\n  const { isPresent, ref: presRef } = usePresence(open);\n  const { floatingRef, style, side } = useFloating({\n    anchorRef,\n    open,\n    side: sideProp,\n    align,\n    offset: sideOffset,\n  });\n  if (!isPresent) return null;\n  return (\n    <Portal>\n      <div\n        data-slot=\"hover-card-content\"\n        data-state={open ? \"open\" : \"closed\"}\n        data-side={side}\n        data-align={align}\n        ref={mergeRefs(floatingRef, presRef)}\n        style={style}\n        className={cn(HOVER_CARD_CONTENT, className)}\n        {...(props as Record<string, unknown>)}\n      >\n        {children}\n      </div>\n    </Portal>\n  );\n}\n"],"mappings":";AA0CI;AAxCJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,4BAA4B;AACrC,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB;AAC1B,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,0BAA0B;AASnC,MAAM,mBAAmB,MAAM,cAA4C,IAAI;AAE/E,SAAS,eAAsC;AAC7C,QAAM,MAAM,MAAM,WAAW,gBAAgB;AAC7C,MAAI,CAAC,IAAK,OAAM,IAAI,MAAM,iDAAiD;AAC3E,SAAO;AACT;AASO,SAAS,UAAU,EAAE,MAAM,cAAc,OAAO,cAAc,SAAS,GAAmB;AAC/F,QAAM,CAAC,QAAQ,OAAO,IAAI,qBAA8B;AAAA,IACtD,GAAI,SAAS,SAAY,EAAE,OAAO,KAAK,IAAI,CAAC;AAAA,IAC5C,cAAc;AAAA,IACd,GAAI,eAAe,EAAE,UAAU,aAAa,IAAI,CAAC;AAAA,EACnD,CAAC;AACD,QAAM,YAAY,MAAM,OAA2B,IAAI;AACvD,SACE,oBAAC,iBAAiB,UAAjB,EAA0B,OAAO,EAAE,MAAM,QAAQ,SAAS,UAAU,GAClE,UACH;AAEJ;AAMO,SAAS,iBAAiB;AAAA,EAC/B,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA0B;AACxB,QAAM,EAAE,SAAS,UAAU,IAAI,aAAa;AAC5C,QAAM,OAAO,UAAU,OAAO;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,KAAK;AAAA,MACL,gBAAgB,CAAC,MAA6C;AAC5D,yBAAiB,CAAC;AAClB,gBAAQ,IAAI;AAAA,MACd;AAAA,MACA,gBAAgB,CAAC,MAA6C;AAC5D,yBAAiB,CAAC;AAClB,gBAAQ,KAAK;AAAA,MACf;AAAA,MACC,GAAI;AAAA;AAAA,EACP;AAEJ;AAQO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA,MAAM,WAAW;AAAA,EACjB,QAAQ;AAAA,EACR,aAAa;AAAA,EACb;AAAA,EACA,GAAG;AACL,GAA0B;AACxB,QAAM,EAAE,MAAM,UAAU,IAAI,aAAa;AACzC,QAAM,EAAE,WAAW,KAAK,QAAQ,IAAI,YAAY,IAAI;AACpD,QAAM,EAAE,aAAa,OAAO,KAAK,IAAI,YAAY;AAAA,IAC/C;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA,QAAQ;AAAA,EACV,CAAC;AACD,MAAI,CAAC,UAAW,QAAO;AACvB,SACE,oBAAC,UACC;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,cAAY,OAAO,SAAS;AAAA,MAC5B,aAAW;AAAA,MACX,cAAY;AAAA,MACZ,KAAK,UAAU,aAAa,OAAO;AAAA,MACnC;AAAA,MACA,WAAW,GAAG,oBAAoB,SAAS;AAAA,MAC1C,GAAI;AAAA,MAEJ;AAAA;AAAA,EACH,GACF;AAEJ;","names":[]}

package/dist/components/{info-tip.js → atomic/info-tip.js}

@@ -1,16 +1,19 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
-import { useControllableState } from "../primitives/use-controllable-state.js";
-import { useFloating } from "../primitives/use-floating.js";
-import { DismissableLayerScope, useDismissableLayer } from "../primitives/dismissable-layer.js";
-import { usePresence } from "../primitives/presence.js";
-import { useHoverIntent } from "../primitives/use-hover-intent.js";
-import { mergeRefs } from "../primitives/merge-refs.js";
-import { Portal } from "../primitives/portal.js";
-import { Slot } from "../primitives/slot.js";
-import { POPOVER_CONTENT } from "../generated/popover.js";
+import { cn } from "../../lib/cn.js";
+import { useControllableState } from "../../primitives/use-controllable-state.js";
+import { useFloating } from "../../primitives/use-floating.js";
+import { DismissableLayerScope, useDismissableLayer } from "../../primitives/dismissable-layer.js";
+import { usePresence } from "../../primitives/presence.js";
+import { useHoverIntent } from "../../primitives/use-hover-intent.js";
+import { mergeRefs } from "../../primitives/merge-refs.js";
+import { Portal } from "../../primitives/portal.js";
+import { Slot } from "../../primitives/slot.js";
+import { POPOVER_CONTENT } from "../../generated/popover.js";
+import * as copy from "../../generated/copy.js";
+import { INFO_TIP_TRIGGER } from "../../generated/info-tip.js";
+import { iconShapes } from "../../icons/icon-shapes.js";
 const InfoTipContext = React.createContext(null);
 function useInfoTip() {
   const ctx = React.useContext(InfoTipContext);
@@ -39,7 +42,7 @@ function InfoTip({
   );
 }
 function InfoGlyph({ className }) {
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
     "svg",
     {
       viewBox: "0 0 24 24",
@@ -50,17 +53,13 @@ function InfoGlyph({ className }) {
       strokeLinejoin: "round",
       "aria-hidden": true,
       className: cn("size-4", className),
-      children: [
-        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
-        /* @__PURE__ */ jsx("path", { d: "M12 16v-4" }),
-        /* @__PURE__ */ jsx("path", { d: "M12 8h.01" })
-      ]
+      children: iconShapes("info")
     }
   );
 }
 function InfoTipTrigger({
   asChild = false,
-  label = "More information",
+  label = copy.MORE_INFORMATION,
   hoverDelay = 500,
   className,
   onClick,
@@ -88,7 +87,7 @@ function InfoTipTrigger({
       "aria-controls": contentId,
       ref: anchorRef,
       className: cn(
-        "inline-flex size-4 shrink-0 cursor-help items-center justify-center rounded-full align-middle text-ink-soft outline-none transition-colors hover:text-ink focus-visible:ring-2 focus-visible:ring-ring data-[state=open]:text-accent-debug",
+        INFO_TIP_TRIGGER,
         className
       ),
       onClick: (e) => {

package/dist/components/atomic/info-tip.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/info-tip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { useControllableState } from \"../../primitives/use-controllable-state\";\nimport { useFloating } from \"../../primitives/use-floating\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../../primitives/dismissable-layer\";\nimport { usePresence } from \"../../primitives/presence\";\nimport { useHoverIntent } from \"../../primitives/use-hover-intent\";\nimport { mergeRefs } from \"../../primitives/merge-refs\";\nimport { Portal } from \"../../primitives/portal\";\nimport { Slot } from \"../../primitives/slot\";\nimport { POPOVER_CONTENT } from \"../../generated/popover\";\nimport type { Side } from \"../../generated/primitives\";\nimport * as copy from \"../../generated/copy\";\nimport { INFO_TIP_TRIGGER } from \"../../generated/info-tip\";\nimport { iconShapes } from \"../../icons/icon-shapes\";\n\n/**\n * `InfoTip` — the ⓘ-beside-a-label *toggletip*. It reuses the popover machinery\n * (controllable state + floating + dismissable layer + portal) but deliberately\n * NOT the tooltip ARIA: the trigger is a real `<button aria-expanded aria-controls>`\n * and the bubble is a `role=\"status\"` live region, never `role=\"tooltip\"`. That is\n * the pattern that stays correct across mouse, keyboard and touch (a `role=tooltip`\n * is hover/focus-only and never opens on tap). Hover-with-intent (~0.5s) is layered\n * on as a mouse-only enhancement; click/tap/Enter/Space toggle instantly.\n *\n * The bubble holds plain, non-interactive help text — it does not trap focus and\n * nothing inside it is focusable, so there is no focus to manage or return.\n */\ninterface InfoTipContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  anchorRef: React.RefObject<HTMLElement | null>;\n  contentId: string;\n}\n\nconst InfoTipContext = React.createContext<InfoTipContextValue | null>(null);\n\nfunction useInfoTip(): InfoTipContextValue {\n  const ctx = React.useContext(InfoTipContext);\n  if (!ctx) throw new Error(\"InfoTip parts must be used within <InfoTip>\");\n  return ctx;\n}\n\nexport interface InfoTipProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function InfoTip({\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  children,\n}: InfoTipProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const anchorRef = React.useRef<HTMLElement | null>(null);\n  const contentId = React.useId();\n  return (\n    <InfoTipContext.Provider\n      value={{ open: isOpen, setOpen, anchorRef, contentId }}\n    >\n      {children}\n    </InfoTipContext.Provider>\n  );\n}\n\nfunction InfoGlyph({ className }: { className?: string }) {\n  return (\n    <svg\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth={2}\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden\n      className={cn(\"size-4\", className)}\n    >\n      {iconShapes(\"info\")}\n    </svg>\n  );\n}\n\nexport interface InfoTipTriggerProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n  /** Accessible name for the icon-only button. */\n  label?: string;\n  /** Milliseconds the mouse must dwell before the tip opens on hover. */\n  hoverDelay?: number;\n}\n\nexport function InfoTipTrigger({\n  asChild = false,\n  label = copy.MORE_INFORMATION,\n  hoverDelay = 500,\n  className,\n  onClick,\n  onBlur,\n  onPointerEnter,\n  onPointerLeave,\n  children,\n  ...props\n}: InfoTipTriggerProps) {\n  const { open, setOpen, anchorRef, contentId } = useInfoTip();\n  const hover = useHoverIntent({\n    onOpen: () => setOpen(true),\n    onClose: () => setOpen(false),\n    openDelay: hoverDelay,\n  });\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"info-tip-trigger\"\n      data-state={open ? \"open\" : \"closed\"}\n      type={asChild ? undefined : \"button\"}\n      aria-label={label}\n      aria-expanded={open}\n      aria-controls={contentId}\n      ref={anchorRef as React.Ref<never>}\n      className={cn(\n        INFO_TIP_TRIGGER,\n        className,\n      )}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(!open);\n      }}\n      onBlur={(e: React.FocusEvent<HTMLButtonElement>) => {\n        onBlur?.(e);\n        setOpen(false);\n      }}\n      onPointerEnter={(e: React.PointerEvent<HTMLButtonElement>) => {\n        onPointerEnter?.(e);\n        hover.onPointerEnter(e);\n      }}\n      onPointerLeave={(e: React.PointerEvent<HTMLButtonElement>) => {\n        onPointerLeave?.(e);\n        hover.onPointerLeave(e);\n      }}\n      {...(props as Record<string, unknown>)}\n    >\n      {children ?? <InfoGlyph />}\n    </Comp>\n  );\n}\n\nexport interface InfoTipContentProps extends React.ComponentProps<\"div\"> {\n  side?: Side;\n  align?: \"start\" | \"center\" | \"end\";\n  sideOffset?: number;\n}\n\nexport function InfoTipContent({\n  className,\n  side: sideProp = \"bottom\",\n  align = \"center\",\n  sideOffset = 6,\n  children,\n  ...props\n}: InfoTipContentProps) {\n  const { open, setOpen, anchorRef, contentId } = useInfoTip();\n  const { isPresent, ref: presRef } = usePresence(open);\n  const { floatingRef, style, side } = useFloating({\n    anchorRef,\n    open,\n    side: sideProp,\n    align,\n    offset: sideOffset,\n  });\n  const dismissRef = useDismissableLayer({\n    enabled: open,\n    onDismiss: () => setOpen(false),\n    exclude: [anchorRef],\n  });\n  if (!isPresent) return null;\n  return (\n    <Portal>\n      <div\n        id={contentId}\n        role=\"status\"\n        aria-live=\"polite\"\n        data-slot=\"info-tip-content\"\n        data-state={open ? \"open\" : \"closed\"}\n        data-side={side}\n        data-align={align}\n        ref={mergeRefs(floatingRef, dismissRef, presRef)}\n        style={style}\n        className={cn(POPOVER_CONTENT, \"w-64 p-3 text-sm\", className)}\n        {...(props as Record<string, unknown>)}\n      >\n        <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n      </div>\n    </Portal>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/{input-otp.js → atomic/input-otp.js}

@@ -1,8 +1,8 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
-import { useControllableState } from "../primitives/use-controllable-state.js";
+import { cn } from "../../lib/cn.js";
+import { useControllableState } from "../../primitives/use-controllable-state.js";
 import {
   INPUT_OTP_CONTAINER,
   INPUT_OTP_GROUP,
@@ -10,7 +10,8 @@ import {
   INPUT_OTP_SLOT,
   INPUT_OTP_SLOT_CARET,
   INPUT_OTP_SLOT_CARET_WRAPPER
-} from "../generated/input-otp.js";
+} from "../../generated/input-otp.js";
+import { iconShapes } from "../../icons/icon-shapes.js";
 const InputOTPContext = React.createContext(null);
 function useInputOTP() {
   const context = React.useContext(InputOTPContext);
@@ -107,7 +108,7 @@ function InputOTPSeparator({ ...props }) {
       strokeLinecap: "round",
       strokeLinejoin: "round",
       "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx("path", { d: "M5 12h14" })
+      children: iconShapes("minus")
     }
   ) });
 }

package/dist/components/atomic/input-otp.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/input-otp.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { useControllableState } from \"../../primitives/use-controllable-state\";\nimport {\n  INPUT_OTP_CONTAINER,\n  INPUT_OTP_GROUP,\n  INPUT_OTP_INPUT,\n  INPUT_OTP_SLOT,\n  INPUT_OTP_SLOT_CARET,\n  INPUT_OTP_SLOT_CARET_WRAPPER,\n} from \"../../generated/input-otp\";\nimport { iconShapes } from \"../../icons/icon-shapes\";\n\ntype InputOTPContextValue = {\n  value: string;\n  maxLength: number;\n  activeIndex: number;\n};\n\nconst InputOTPContext = React.createContext<InputOTPContextValue | null>(null);\n\nfunction useInputOTP() {\n  const context = React.useContext(InputOTPContext);\n  if (!context) {\n    throw new Error(\"InputOTP slots must be used within an <InputOTP />\");\n  }\n  return context;\n}\n\nexport interface InputOTPProps\n  extends Omit<React.ComponentProps<\"input\">, \"value\" | \"defaultValue\" | \"onChange\"> {\n  maxLength: number;\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  containerClassName?: string;\n  children?: React.ReactNode;\n}\n\nexport function InputOTP({\n  maxLength,\n  value: valueProp,\n  defaultValue = \"\",\n  onChange,\n  className,\n  containerClassName,\n  children,\n  disabled,\n  ...props\n}: InputOTPProps) {\n  const [value, setValue] = useControllableState<string>({\n    value: valueProp,\n    defaultValue,\n    onChange,\n  });\n  const [focused, setFocused] = React.useState(false);\n\n  const activeIndex = focused ? Math.min(value.length, maxLength - 1) : -1;\n\n  return (\n    <InputOTPContext.Provider value={{ value, maxLength, activeIndex }}>\n      <div\n        data-slot=\"input-otp\"\n        className={cn(INPUT_OTP_CONTAINER, containerClassName)}\n      >\n        {children}\n        <input\n          // drag/momentum: n/a — single visually-hidden input tracks the string\n          inputMode=\"numeric\"\n          autoComplete=\"one-time-code\"\n          maxLength={maxLength}\n          value={value}\n          disabled={disabled}\n          onChange={(e) => setValue(e.target.value.slice(0, maxLength))}\n          onFocus={() => setFocused(true)}\n          onBlur={() => setFocused(false)}\n          className={cn(INPUT_OTP_INPUT, className)}\n          {...props}\n        />\n      </div>\n    </InputOTPContext.Provider>\n  );\n}\n\nexport function InputOTPGroup({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"input-otp-group\"\n      className={cn(INPUT_OTP_GROUP, className)}\n      {...props}\n    />\n  );\n}\n\nexport interface InputOTPSlotProps extends React.ComponentProps<\"div\"> {\n  index: number;\n}\n\nexport function InputOTPSlot({ index, className, ...props }: InputOTPSlotProps) {\n  const { value, activeIndex } = useInputOTP();\n  const char = value[index];\n  const isActive = activeIndex === index;\n  const hasFakeCaret = isActive && char === undefined;\n\n  return (\n    <div\n      data-slot=\"input-otp-slot\"\n      data-active={isActive}\n      className={cn(INPUT_OTP_SLOT, className)}\n      {...props}\n    >\n      {char}\n      {hasFakeCaret && (\n        <div className={INPUT_OTP_SLOT_CARET_WRAPPER}>\n          <div className={INPUT_OTP_SLOT_CARET} />\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport function InputOTPSeparator({ ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div data-slot=\"input-otp-separator\" role=\"separator\" {...props}>\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        {iconShapes(\"minus\")}\n      </svg>\n    </div>\n  );\n}\n"],"mappings":";AA+DM,SAKE,KALF;AA7DN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,4BAA4B;AACrC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAkB;AAQ3B,MAAM,kBAAkB,MAAM,cAA2C,IAAI;AAE7E,SAAS,cAAc;AACrB,QAAM,UAAU,MAAM,WAAW,eAAe;AAChD,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,oDAAoD;AAAA,EACtE;AACA,SAAO;AACT;AAYO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkB;AAChB,QAAM,CAAC,OAAO,QAAQ,IAAI,qBAA6B;AAAA,IACrD,OAAO;AAAA,IACP;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,CAAC,SAAS,UAAU,IAAI,MAAM,SAAS,KAAK;AAElD,QAAM,cAAc,UAAU,KAAK,IAAI,MAAM,QAAQ,YAAY,CAAC,IAAI;AAEtE,SACE,oBAAC,gBAAgB,UAAhB,EAAyB,OAAO,EAAE,OAAO,WAAW,YAAY,GAC/D;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,qBAAqB,kBAAkB;AAAA,MAEpD;AAAA;AAAA,QACD;AAAA,UAAC;AAAA;AAAA,YAEC,WAAU;AAAA,YACV,cAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,MAAM,MAAM,GAAG,SAAS,CAAC;AAAA,YAC5D,SAAS,MAAM,WAAW,IAAI;AAAA,YAC9B,QAAQ,MAAM,WAAW,KAAK;AAAA,YAC9B,WAAW,GAAG,iBAAiB,SAAS;AAAA,YACvC,GAAG;AAAA;AAAA,QACN;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;AAEO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,iBAAiB,SAAS;AAAA,MACvC,GAAG;AAAA;AAAA,EACN;AAEJ;AAMO,SAAS,aAAa,EAAE,OAAO,WAAW,GAAG,MAAM,GAAsB;AAC9E,QAAM,EAAE,OAAO,YAAY,IAAI,YAAY;AAC3C,QAAM,OAAO,MAAM,KAAK;AACxB,QAAM,WAAW,gBAAgB;AACjC,QAAM,eAAe,YAAY,SAAS;AAE1C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,eAAa;AAAA,MACb,WAAW,GAAG,gBAAgB,SAAS;AAAA,MACtC,GAAG;AAAA,MAEH;AAAA;AAAA,QACA,gBACC,oBAAC,SAAI,WAAW,8BACd,8BAAC,SAAI,WAAW,sBAAsB,GACxC;AAAA;AAAA;AAAA,EAEJ;AAEJ;AAEO,SAAS,kBAAkB,EAAE,GAAG,MAAM,GAAgC;AAC3E,SACE,oBAAC,SAAI,aAAU,uBAAsB,MAAK,aAAa,GAAG,OACxD;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,QAAO;AAAA,MACP,aAAY;AAAA,MACZ,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,eAAY;AAAA,MAEX,qBAAW,OAAO;AAAA;AAAA,EACrB,GACF;AAEJ;","names":[]}

package/dist/components/{input.js → atomic/input.js}

@@ -1,9 +1,9 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
-import { INPUT_BASE, inputSizeClasses } from "../generated/input.js";
-import { markLabelable } from "../primitives/labelable.js";
+import { cn } from "../../lib/cn.js";
+import { INPUT_BASE, inputSizeClasses } from "../../generated/input.js";
+import { markLabelable } from "../../primitives/labelable.js";
 import { useFieldControlId } from "./field-context.js";
 const Input = React.forwardRef(
   function Input2({ className, type, id, size = "md", ...props }, ref) {

package/dist/components/atomic/input.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/input.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { INPUT_BASE, inputSizeClasses, type InputSize } from \"../../generated/input\";\nimport { markLabelable } from \"../../primitives/labelable\";\nimport { useFieldControlId } from \"./field-context\";\n\nexport type { InputSize };\n\n// The native `size` attribute (a width in characters) gives way to the kit's\n// scale, as it does on `NativeSelect`; a width belongs in `className`.\nexport interface InputProps extends Omit<React.ComponentPropsWithoutRef<\"input\">, \"size\"> {\n  size?: InputSize;\n}\n\n// `forwardRef` rather than a `ref` prop so the handle also reaches the element\n// under React 18, where function components drop `ref`.\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  function Input({ className, type, id, size = \"md\", ...props }, ref) {\n    return (\n      <input\n        ref={ref}\n        type={type}\n        id={useFieldControlId(id)}\n        data-slot=\"input\"\n        data-size={size}\n        className={cn(INPUT_BASE, inputSizeClasses[size], className)}\n        {...props}\n      />\n    );\n  },\n);\n\nmarkLabelable(Input);\n"],"mappings":";AAqBM;AAnBN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,YAAY,wBAAwC;AAC7D,SAAS,qBAAqB;AAC9B,SAAS,yBAAyB;AAY3B,MAAM,QAAQ,MAAM;AAAA,EACzB,SAASA,OAAM,EAAE,WAAW,MAAM,IAAI,OAAO,MAAM,GAAG,MAAM,GAAG,KAAK;AAClE,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,IAAI,kBAAkB,EAAE;AAAA,QACxB,aAAU;AAAA,QACV,aAAW;AAAA,QACX,WAAW,GAAG,YAAY,iBAAiB,IAAI,GAAG,SAAS;AAAA,QAC1D,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,cAAc,KAAK;","names":["Input"]}

package/dist/components/{kbd.js → atomic/kbd.js}

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
-import { KBD_BASE, KBD_GROUP_BASE } from "../generated/kbd.js";
+import { cn } from "../../lib/cn.js";
+import { KBD_BASE, KBD_GROUP_BASE } from "../../generated/kbd.js";
 function Kbd({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     "kbd",

package/dist/components/atomic/kbd.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/kbd.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { KBD_BASE, KBD_GROUP_BASE } from \"../../generated/kbd\";\n\nexport function Kbd({ className, ...props }: React.ComponentProps<\"kbd\">) {\n  return (\n    <kbd\n      data-slot=\"kbd\"\n      className={cn(KBD_BASE, className)}\n      {...props}\n    />\n  );\n}\n\nexport function KbdGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <kbd\n      data-slot=\"kbd-group\"\n      className={cn(KBD_GROUP_BASE, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"AAMI;AANJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,UAAU,sBAAsB;AAElC,SAAS,IAAI,EAAE,WAAW,GAAG,MAAM,GAAgC;AACxE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,UAAU,SAAS;AAAA,MAChC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEO,SAAS,SAAS,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC7E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,gBAAgB,SAAS;AAAA,MACtC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/{key-value.js → atomic/key-value.js}

@@ -1,17 +1,18 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
+import { cn } from "../../lib/cn.js";
 import {
   KEY_VALUE_BASE,
   KEY_VALUE_COPY,
   KEY_VALUE_LABEL,
   KEY_VALUE_ROW,
   KEY_VALUE_STATUS,
-  KEY_VALUE_VALUE
-} from "../generated/key-value.js";
-import { UiIcon } from "./ui-icons.js";
-const COPIED_MS = 2e3;
+  KEY_VALUE_VALUE,
+  KEY_VALUE_LABELS,
+  KEY_VALUE_COPIED_MS
+} from "../../generated/key-value.js";
+import { UiIcon } from "../../icons/ui-icons.js";
 async function writeClipboard(text) {
   try {
     if (navigator.clipboard?.writeText) {
@@ -42,7 +43,7 @@ function KeyValue({ label, value, copyText, labels = {}, className, ...props })
     if (copyText === void 0 || !await writeClipboard(copyText)) return;
     setCopied(true);
     clearTimeout(timer.current);
-    timer.current = setTimeout(() => setCopied(false), COPIED_MS);
+    timer.current = setTimeout(() => setCopied(false), KEY_VALUE_COPIED_MS);
   };
   return /* @__PURE__ */ jsxs("div", { "data-slot": "key-value", className: cn(KEY_VALUE_BASE, className), ...props, children: [
     /* @__PURE__ */ jsx("span", { className: KEY_VALUE_LABEL, children: label }),
@@ -59,7 +60,7 @@ function KeyValue({ label, value, copyText, labels = {}, className, ...props })
         }
       )
     ] }),
-    /* @__PURE__ */ jsx("span", { role: "status", "aria-live": "polite", className: KEY_VALUE_STATUS, children: copied ? labels.copied ?? "Copied" : "" })
+    /* @__PURE__ */ jsx("span", { role: "status", "aria-live": "polite", className: KEY_VALUE_STATUS, children: copied ? labels.copied ?? KEY_VALUE_LABELS.copied : "" })
   ] });
 }
 export {

package/dist/components/atomic/key-value.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/key-value.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport {\n  KEY_VALUE_BASE,\n  KEY_VALUE_COPY,\n  KEY_VALUE_LABEL,\n  KEY_VALUE_ROW,\n  KEY_VALUE_STATUS,\n  KEY_VALUE_VALUE,\n  KEY_VALUE_LABELS,\n  KEY_VALUE_COPIED_MS,\n} from \"../../generated/key-value\";\nimport { UiIcon } from \"../../icons/ui-icons\";\n\nexport interface KeyValueLabels {\n  /** The copy button. Default `\"Copy {label}\"` (just `\"Copy\"` when the label is not text). */\n  copy?: string;\n  /** The polite announcement after a copy. Default `\"Copied\"`. */\n  copied?: string;\n}\n\nexport interface KeyValueProps extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n  label: React.ReactNode;\n  value: React.ReactNode;\n  /** Adds a copy button for this text. */\n  copyText?: string;\n  labels?: KeyValueLabels;\n}\n\n\n// The async clipboard API needs a secure context and a user gesture; an\n// insecure origin or an old webview falls back to a selection + execCommand.\nasync function writeClipboard(text: string): Promise<boolean> {\n  try {\n    if (navigator.clipboard?.writeText) {\n      await navigator.clipboard.writeText(text);\n      return true;\n    }\n  } catch {\n    // Denied permission: try the selection route below.\n  }\n  // Inside a modal the focus scope pulls focus back to the dialog, which would drop a selection\n  // made in <body>; the helper has to live inside the dialog the user is in.\n  const host = document.activeElement?.closest('[role=\"dialog\"]') ?? document.body;\n  const area = document.createElement(\"textarea\");\n  area.value = text;\n  area.setAttribute(\"readonly\", \"\");\n  area.style.position = \"fixed\";\n  area.style.opacity = \"0\";\n  host.append(area);\n  area.select();\n  try {\n    return document.execCommand(\"copy\");\n  } finally {\n    area.remove();\n  }\n}\n\n/** A small label over its value, with an optional copy button. */\nexport function KeyValue({ label, value, copyText, labels = {}, className, ...props }: KeyValueProps) {\n  const [copied, setCopied] = React.useState(false);\n  const timer = React.useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n  React.useEffect(() => () => clearTimeout(timer.current), []);\n\n  const copy = async () => {\n    if (copyText === undefined || !(await writeClipboard(copyText))) return;\n    setCopied(true);\n    clearTimeout(timer.current);\n    timer.current = setTimeout(() => setCopied(false), KEY_VALUE_COPIED_MS);\n  };\n\n  return (\n    <div data-slot=\"key-value\" className={cn(KEY_VALUE_BASE, className)} {...props}>\n      <span className={KEY_VALUE_LABEL}>{label}</span>\n      <div className={KEY_VALUE_ROW}>\n        <span className={KEY_VALUE_VALUE}>{value}</span>\n        {copyText !== undefined && (\n          <button\n            type=\"button\"\n            aria-label={labels.copy ?? (typeof label === \"string\" ? `Copy ${label}` : \"Copy\")}\n            onClick={copy}\n            className={KEY_VALUE_COPY}\n          >\n            <UiIcon name={copied ? \"check\" : \"copy\"} />\n          </button>\n        )}\n      </div>\n      <span role=\"status\" aria-live=\"polite\" className={KEY_VALUE_STATUS}>\n        {copied ? (labels.copied ?? KEY_VALUE_LABELS.copied) : \"\"}\n      </span>\n    </div>\n  );\n}\n"],"mappings":";AA2EM,cACA,YADA;AAzEN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,cAAc;AAoBvB,eAAe,eAAe,MAAgC;AAC5D,MAAI;AACF,QAAI,UAAU,WAAW,WAAW;AAClC,YAAM,UAAU,UAAU,UAAU,IAAI;AACxC,aAAO;AAAA,IACT;AAAA,EACF,QAAQ;AAAA,EAER;AAGA,QAAM,OAAO,SAAS,eAAe,QAAQ,iBAAiB,KAAK,SAAS;AAC5E,QAAM,OAAO,SAAS,cAAc,UAAU;AAC9C,OAAK,QAAQ;AACb,OAAK,aAAa,YAAY,EAAE;AAChC,OAAK,MAAM,WAAW;AACtB,OAAK,MAAM,UAAU;AACrB,OAAK,OAAO,IAAI;AAChB,OAAK,OAAO;AACZ,MAAI;AACF,WAAO,SAAS,YAAY,MAAM;AAAA,EACpC,UAAE;AACA,SAAK,OAAO;AAAA,EACd;AACF;AAGO,SAAS,SAAS,EAAE,OAAO,OAAO,UAAU,SAAS,CAAC,GAAG,WAAW,GAAG,MAAM,GAAkB;AACpG,QAAM,CAAC,QAAQ,SAAS,IAAI,MAAM,SAAS,KAAK;AAChD,QAAM,QAAQ,MAAM,OAAkD,MAAS;AAC/E,QAAM,UAAU,MAAM,MAAM,aAAa,MAAM,OAAO,GAAG,CAAC,CAAC;AAE3D,QAAM,OAAO,YAAY;AACvB,QAAI,aAAa,UAAa,CAAE,MAAM,eAAe,QAAQ,EAAI;AACjE,cAAU,IAAI;AACd,iBAAa,MAAM,OAAO;AAC1B,UAAM,UAAU,WAAW,MAAM,UAAU,KAAK,GAAG,mBAAmB;AAAA,EACxE;AAEA,SACE,qBAAC,SAAI,aAAU,aAAY,WAAW,GAAG,gBAAgB,SAAS,GAAI,GAAG,OACvE;AAAA,wBAAC,UAAK,WAAW,iBAAkB,iBAAM;AAAA,IACzC,qBAAC,SAAI,WAAW,eACd;AAAA,0BAAC,UAAK,WAAW,iBAAkB,iBAAM;AAAA,MACxC,aAAa,UACZ;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,cAAY,OAAO,SAAS,OAAO,UAAU,WAAW,QAAQ,KAAK,KAAK;AAAA,UAC1E,SAAS;AAAA,UACT,WAAW;AAAA,UAEX,8BAAC,UAAO,MAAM,SAAS,UAAU,QAAQ;AAAA;AAAA,MAC3C;AAAA,OAEJ;AAAA,IACA,oBAAC,UAAK,MAAK,UAAS,aAAU,UAAS,WAAW,kBAC/C,mBAAU,OAAO,UAAU,iBAAiB,SAAU,IACzD;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/{label.js → atomic/label.js}

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
-import { LABEL_BASE } from "../generated/label.js";
+import { cn } from "../../lib/cn.js";
+import { LABEL_BASE } from "../../generated/label.js";
 function Label({ className, ...props }) {
   return /* @__PURE__ */ jsx("label", { "data-slot": "label", className: cn(LABEL_BASE, className), ...props });
 }

package/dist/components/atomic/label.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atomic/label.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { LABEL_BASE } from \"../../generated/label\";\n\nexport function Label({ className, ...props }: React.ComponentProps<\"label\">) {\n  return <label data-slot=\"label\" className={cn(LABEL_BASE, className)} {...props} />;\n}\n"],"mappings":"AAKS;AALT,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,kBAAkB;AAEpB,SAAS,MAAM,EAAE,WAAW,GAAG,MAAM,GAAkC;AAC5E,SAAO,oBAAC,WAAM,aAAU,SAAQ,WAAW,GAAG,YAAY,SAAS,GAAI,GAAG,OAAO;AACnF;","names":[]}

package/dist/components/{menubar.js → atomic/menubar.js}

@@ -1,29 +1,18 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { cn } from "../lib/cn.js";
-import { useControllableState } from "../primitives/use-controllable-state.js";
-import { Portal } from "../primitives/portal.js";
-import { useFloating } from "../primitives/use-floating.js";
-import { DismissableLayerScope, useDismissableLayer } from "../primitives/dismissable-layer.js";
-import { usePresence } from "../primitives/presence.js";
-import { useRovingFocus } from "../primitives/use-roving-focus.js";
-import { useHoverIntent } from "../primitives/use-hover-intent.js";
-import { mergeRefs } from "../primitives/merge-refs.js";
-import {
-  MENUBAR_CHECKBOX_ITEM,
-  MENUBAR_CONTENT,
-  MENUBAR_ITEM,
-  MENUBAR_ITEM_INDICATOR,
-  MENUBAR_LABEL,
-  MENUBAR_RADIO_ITEM,
-  MENUBAR_ROOT,
-  MENUBAR_SEPARATOR,
-  MENUBAR_SHORTCUT,
-  MENUBAR_SUB_CONTENT,
-  MENUBAR_SUB_TRIGGER,
-  MENUBAR_TRIGGER
-} from "../generated/menubar.js";
+import { cn } from "../../lib/cn.js";
+import { useControllableState } from "../../primitives/use-controllable-state.js";
+import { Portal } from "../../primitives/portal.js";
+import { useFloating } from "../../primitives/use-floating.js";
+import { DismissableLayerScope, useDismissableLayer } from "../../primitives/dismissable-layer.js";
+import { usePresence } from "../../primitives/presence.js";
+import { useRovingFocus } from "../../primitives/use-roving-focus.js";
+import { useHoverIntent } from "../../primitives/use-hover-intent.js";
+import { mergeRefs } from "../../primitives/merge-refs.js";
+import { MENUBAR_CHECKBOX_ITEM, MENUBAR_CONTENT, MENUBAR_ITEM, MENUBAR_ITEM_INDICATOR, MENUBAR_LABEL, MENUBAR_RADIO_ITEM, MENUBAR_ROOT, MENUBAR_SEPARATOR, MENUBAR_SHORTCUT, MENUBAR_SUB_CHEVRON, MENUBAR_SUB_CONTENT, MENUBAR_SUB_TRIGGER, MENUBAR_TRIGGER } from "../../generated/menubar.js";
+import { MENU_RADIO_DOT } from "../../generated/menu.js";
+import { iconShapes } from "../../icons/icon-shapes.js";
 const MenubarMenuContext = React.createContext(null);
 function useMenu() {
   const ctx = React.useContext(MenubarMenuContext);
@@ -169,7 +158,7 @@ function MenubarCheckboxItem({
             strokeWidth: "2",
             strokeLinecap: "round",
             strokeLinejoin: "round",
-            children: /* @__PURE__ */ jsx("path", { d: "M20 6 9 17l-5-5" })
+            children: iconShapes("check")
           }
         ) }),
         children
@@ -210,7 +199,7 @@ function MenubarRadioItem({
       onClick: () => ctx?.onValueChange(value),
       ...props,
       children: [
-        /* @__PURE__ */ jsx("span", { className: MENUBAR_ITEM_INDICATOR, children: checked && /* @__PURE__ */ jsx("svg", { className: "size-2 fill-current", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }) }) }),
+        /* @__PURE__ */ jsx("span", { className: MENUBAR_ITEM_INDICATOR, children: checked && /* @__PURE__ */ jsx("svg", { className: MENU_RADIO_DOT, viewBox: "0 0 24 24", children: iconShapes("dot") }) }),
         children
       ]
     }
@@ -311,14 +300,14 @@ function MenubarSubTrigger({
         /* @__PURE__ */ jsx(
           "svg",
           {
-            className: "ml-auto h-4 w-4",
+            className: MENUBAR_SUB_CHEVRON,
             viewBox: "0 0 24 24",
             fill: "none",
             stroke: "currentColor",
             strokeWidth: "2",
             strokeLinecap: "round",
             strokeLinejoin: "round",
-            children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" })
+            children: iconShapes("chevron-right")
           }
         )
       ]