@evinvest/uikit 0.27.0 → 0.29.2

package/README.md

@@ -540,8 +540,11 @@ import { Table, TableBody, TableCard, TableCell, TableHead, TableHeader, TableRo
 ```
 ### Command
 
-By default `Command` filters its items on the client: a case-insensitive
-substring match of the typed query against each `CommandItem`'s `value`. When the
+By default `Command` filters and ranks its items on the client, as fzf does:
+each space-separated term of the query must appear in the item's `value` as a
+case-insensitive subsequence, and runs and word starts rank above scattered
+matches. Ties keep your order. Ranking is CSS `order` within `CommandList` /
+`CommandGroup`, which the arrows follow. When the
 rows are already the answer to the query — a search endpoint, a ranking of your
 own — pass `shouldFilter={false}` and own the query state:
 
@@ -605,8 +608,7 @@ element across the two ports.
 - **Tier C — overlay (13):** tooltip, popover, hover-card, dropdown-menu,
   context-menu, menubar, navigation-menu, dialog, alert-dialog, sheet, drawer,
   select, command.
-- **Tier D — engines (6):** chart, calendar, date-time-picker, sonner (toaster),
-  form, resizable.
+- **Tier D — engines (4):** calendar, date-time-picker, sonner (toaster), form.
 - **Site chrome (7):** header (marketing / compact density, plus `hideNav`),
   footer, logo, and the shared status pages — `StatusScreen` with the `NotFound`
   / `Forbidden` / `ServerError` presets (404 / 403 / 500). The kit ships no
@@ -653,8 +655,11 @@ measuring needs host-only `web-sys`). Known gaps:
   the next Escape — and a press inside a layer above is not "outside" the
   ones below. A modal (`Dialog`, `AlertDialog`, `Sheet`, `Drawer`,
   `CommandDialog`) bars the layers below from pointer-downs while it is open:
-  a click on its backdrop closes it alone. `Drawer` and `CommandDialog` close
-  on a click on their own scrim, not on any outside pointer-down. Toasts are
+  a click on its backdrop closes it alone. `Dialog`, `AlertDialog` and `Sheet`
+  close on the pointer-down outside their panel — their backdrop has no click
+  handler, so one press is one `onOpenChange(false)`. `Drawer` and
+  `CommandDialog` close on a click on their own scrim, not on any outside
+  pointer-down. Toasts are
   outside every layer: they never take Escape, and a click on one closes
   nothing. The stack is shared through `globalThis`, so a micro-frontend
   bundling its own uikit copy sees the host's layers; parent links are a
@@ -670,10 +675,6 @@ measuring needs host-only `web-sys`). Known gaps:
   `onkeydown` — and `AlertDialog`, `Sheet`, `Drawer`, `ContextMenu`, `Menubar`,
   `NavigationMenu`, `HoverCard`, `Tooltip`, `InfoTip`, `DateTimePicker`,
   `CommandDialog` and `DropdownMenuSub` are not on the stack yet.
-- **chart:** the recharts plotting engine is not bundled. `ChartContainer` is a
-  themed SVG host (emits `--color-*` from its config); `ChartTooltipContent` /
-  `ChartLegendContent` are presentational and take explicit items. Draw series
-  yourself inside the container.
 - **terminal:** no plotting engine and no state. `TerminalChart` is a sized
   `relative` host that hands its element out (`ref` in TS, `id` in Rust) for a
   consumer-chosen charting library to mount into; `OrderForm` only prevents the
@@ -719,9 +720,8 @@ measuring needs host-only `web-sys`). Known gaps:
   onto an arbitrary child (no `Slot`), so it publishes them as a
   `FormControlContext` that `Input`/`Textarea` consume; wrap a bare element and
   you wire them yourself.
-- **resizable / carousel:** pointer-drag physics are TS-only (keyboard in Rust
-  for resizable; prev/next + keyboard for carousel). Embla momentum is not
-  reproduced.
+- **carousel:** pointer-drag physics are TS-only (prev/next + keyboard in
+  Rust). Embla momentum is not reproduced.
 - **drawer:** the Vaul-style enter/exit motion is shared by both ports via
   `motion.css` (inlined into `tokens.css`), keyed on `data-slot` +
   `data-vaul-drawer-direction` + `data-state`; the panel stays mounted on close

package/dist/components/alert-dialog.js

@@ -51,13 +51,12 @@ function AlertDialogTrigger({ asChild = false, onClick, ...props }) {
   );
 }
 function AlertDialogOverlay({ className, ...props }) {
-  const { open, setOpen } = useAlertDialog();
+  const { open } = useAlertDialog();
   return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "alert-dialog-overlay",
       "data-state": open ? "open" : "closed",
-      onClick: () => setOpen(false),
       className: cn(ALERT_DIALOG_OVERLAY, className),
       ...props
     }

package/dist/components/alert-dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/alert-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { buttonVariants } from \"./button\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../primitives/dismissable-layer\";\nimport { useFocusScope } from \"../primitives/focus-scope\";\nimport { usePresence } from \"../primitives/presence\";\nimport { mergeRefs } from \"../primitives/merge-refs\";\nimport { Portal } from \"../primitives/portal\";\nimport { Slot } from \"../primitives/slot\";\nimport {\n  ALERT_DIALOG_CONTENT,\n  ALERT_DIALOG_DESCRIPTION,\n  ALERT_DIALOG_FOOTER,\n  ALERT_DIALOG_HEADER,\n  ALERT_DIALOG_OVERLAY,\n  ALERT_DIALOG_TITLE,\n} from \"../generated/alert-dialog\";\n\ninterface AlertDialogContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  triggerRef: React.RefObject<HTMLElement | null>;\n}\n\nconst AlertDialogContext = React.createContext<AlertDialogContextValue | null>(null);\n\nfunction useAlertDialog(): AlertDialogContextValue {\n  const ctx = React.useContext(AlertDialogContext);\n  if (!ctx) throw new Error(\"AlertDialog parts must be used within <AlertDialog>\");\n  return ctx;\n}\n\nexport interface AlertDialogProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function AlertDialog({ open, defaultOpen = false, onOpenChange, children }: AlertDialogProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const triggerRef = React.useRef<HTMLElement | null>(null);\n  return (\n    <AlertDialogContext.Provider value={{ open: isOpen, setOpen, triggerRef }}>\n      {children}\n    </AlertDialogContext.Provider>\n  );\n}\n\nexport interface AlertDialogTriggerProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n}\n\nexport function AlertDialogTrigger({ asChild = false, onClick, ...props }: AlertDialogTriggerProps) {\n  const { open, setOpen, triggerRef } = useAlertDialog();\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"alert-dialog-trigger\"\n      aria-expanded={open}\n      ref={triggerRef as React.Ref<HTMLButtonElement>}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(true);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface AlertDialogOverlayProps extends React.ComponentProps<\"div\"> {}\n\nexport function AlertDialogOverlay({ className, ...props }: AlertDialogOverlayProps) {\n  const { open, setOpen } = useAlertDialog();\n  return (\n    <div\n      data-slot=\"alert-dialog-overlay\"\n      data-state={open ? \"open\" : \"closed\"}\n      onClick={() => setOpen(false)}\n      className={cn(ALERT_DIALOG_OVERLAY, className)}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface AlertDialogContentProps extends React.ComponentProps<\"div\"> {}\n\nexport function AlertDialogContent({ className, children, ...props }: AlertDialogContentProps) {\n  const { open, setOpen, triggerRef } = useAlertDialog();\n  const { isPresent, ref: presRef } = usePresence(open);\n  const focusRef = useFocusScope(open, { returnFocusTo: triggerRef });\n  const dismissRef = useDismissableLayer({\n    enabled: open,\n    onDismiss: () => setOpen(false),\n    exclude: [triggerRef],\n    modal: true,\n  });\n  if (!isPresent) return null;\n  return (\n    <Portal>\n      <AlertDialogOverlay />\n      <div\n        data-slot=\"alert-dialog-content\"\n        role=\"alertdialog\"\n        aria-modal=\"true\"\n        data-state={open ? \"open\" : \"closed\"}\n        ref={mergeRefs(focusRef, dismissRef, presRef as React.Ref<HTMLDivElement>)}\n        className={cn(ALERT_DIALOG_CONTENT, className)}\n        {...(props as Record<string, unknown>)}\n      >\n        <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n      </div>\n    </Portal>\n  );\n}\n\nexport function AlertDialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(ALERT_DIALOG_HEADER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(ALERT_DIALOG_FOOTER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogTitle({ className, ...props }: React.ComponentProps<\"h2\">) {\n  return (\n    <h2\n      data-slot=\"alert-dialog-title\"\n      className={cn(ALERT_DIALOG_TITLE, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"alert-dialog-description\"\n      className={cn(ALERT_DIALOG_DESCRIPTION, className)}\n      {...props}\n    />\n  );\n}\n\nexport interface AlertDialogActionProps extends React.ComponentProps<\"button\"> {}\n\nexport function AlertDialogAction({ className, onClick, ...props }: AlertDialogActionProps) {\n  const { setOpen } = useAlertDialog();\n  return (\n    <button\n      data-slot=\"alert-dialog-action\"\n      className={cn(buttonVariants(), className)}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(false);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface AlertDialogCancelProps extends React.ComponentProps<\"button\"> {}\n\nexport function AlertDialogCancel({ className, onClick, ...props }: AlertDialogCancelProps) {\n  const { setOpen } = useAlertDialog();\n  return (\n    <button\n      data-slot=\"alert-dialog-cancel\"\n      className={cn(buttonVariants({ variant: \"outline\" }), className)}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(false);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/alert-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { buttonVariants } from \"./button\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../primitives/dismissable-layer\";\nimport { useFocusScope } from \"../primitives/focus-scope\";\nimport { usePresence } from \"../primitives/presence\";\nimport { mergeRefs } from \"../primitives/merge-refs\";\nimport { Portal } from \"../primitives/portal\";\nimport { Slot } from \"../primitives/slot\";\nimport {\n  ALERT_DIALOG_CONTENT,\n  ALERT_DIALOG_DESCRIPTION,\n  ALERT_DIALOG_FOOTER,\n  ALERT_DIALOG_HEADER,\n  ALERT_DIALOG_OVERLAY,\n  ALERT_DIALOG_TITLE,\n} from \"../generated/alert-dialog\";\n\ninterface AlertDialogContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  triggerRef: React.RefObject<HTMLElement | null>;\n}\n\nconst AlertDialogContext = React.createContext<AlertDialogContextValue | null>(null);\n\nfunction useAlertDialog(): AlertDialogContextValue {\n  const ctx = React.useContext(AlertDialogContext);\n  if (!ctx) throw new Error(\"AlertDialog parts must be used within <AlertDialog>\");\n  return ctx;\n}\n\nexport interface AlertDialogProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function AlertDialog({ open, defaultOpen = false, onOpenChange, children }: AlertDialogProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const triggerRef = React.useRef<HTMLElement | null>(null);\n  return (\n    <AlertDialogContext.Provider value={{ open: isOpen, setOpen, triggerRef }}>\n      {children}\n    </AlertDialogContext.Provider>\n  );\n}\n\nexport interface AlertDialogTriggerProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n}\n\nexport function AlertDialogTrigger({ asChild = false, onClick, ...props }: AlertDialogTriggerProps) {\n  const { open, setOpen, triggerRef } = useAlertDialog();\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"alert-dialog-trigger\"\n      aria-expanded={open}\n      ref={triggerRef as React.Ref<HTMLButtonElement>}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(true);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface AlertDialogOverlayProps extends React.ComponentProps<\"div\"> {}\n\nexport function AlertDialogOverlay({ className, ...props }: AlertDialogOverlayProps) {\n  const { open } = useAlertDialog();\n  // No onClick: the content's dismissable layer already closes on the\n  // pointer-down that lands here, and a second path called onOpenChange(false)\n  // twice for one press whenever the overlay was still hit by the click\n  // (a host that closes later, CSS without the closed-state pointer-events).\n  return (\n    <div\n      data-slot=\"alert-dialog-overlay\"\n      data-state={open ? \"open\" : \"closed\"}\n      className={cn(ALERT_DIALOG_OVERLAY, className)}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface AlertDialogContentProps extends React.ComponentProps<\"div\"> {}\n\nexport function AlertDialogContent({ className, children, ...props }: AlertDialogContentProps) {\n  const { open, setOpen, triggerRef } = useAlertDialog();\n  const { isPresent, ref: presRef } = usePresence(open);\n  const focusRef = useFocusScope(open, { returnFocusTo: triggerRef });\n  const dismissRef = useDismissableLayer({\n    enabled: open,\n    onDismiss: () => setOpen(false),\n    exclude: [triggerRef],\n    modal: true,\n  });\n  if (!isPresent) return null;\n  return (\n    <Portal>\n      <AlertDialogOverlay />\n      <div\n        data-slot=\"alert-dialog-content\"\n        role=\"alertdialog\"\n        aria-modal=\"true\"\n        data-state={open ? \"open\" : \"closed\"}\n        ref={mergeRefs(focusRef, dismissRef, presRef as React.Ref<HTMLDivElement>)}\n        className={cn(ALERT_DIALOG_CONTENT, className)}\n        {...(props as Record<string, unknown>)}\n      >\n        <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n      </div>\n    </Portal>\n  );\n}\n\nexport function AlertDialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-header\"\n      className={cn(ALERT_DIALOG_HEADER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn(ALERT_DIALOG_FOOTER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogTitle({ className, ...props }: React.ComponentProps<\"h2\">) {\n  return (\n    <h2\n      data-slot=\"alert-dialog-title\"\n      className={cn(ALERT_DIALOG_TITLE, className)}\n      {...props}\n    />\n  );\n}\n\nexport function AlertDialogDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"alert-dialog-description\"\n      className={cn(ALERT_DIALOG_DESCRIPTION, className)}\n      {...props}\n    />\n  );\n}\n\nexport interface AlertDialogActionProps extends React.ComponentProps<\"button\"> {}\n\nexport function AlertDialogAction({ className, onClick, ...props }: AlertDialogActionProps) {\n  const { setOpen } = useAlertDialog();\n  return (\n    <button\n      data-slot=\"alert-dialog-action\"\n      className={cn(buttonVariants(), className)}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(false);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport interface AlertDialogCancelProps extends React.ComponentProps<\"button\"> {}\n\nexport function AlertDialogCancel({ className, onClick, ...props }: AlertDialogCancelProps) {\n  const { setOpen } = useAlertDialog();\n  return (\n    <button\n      data-slot=\"alert-dialog-cancel\"\n      className={cn(buttonVariants({ variant: \"outline\" }), className)}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(false);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/auth-wall.js

@@ -0,0 +1,42 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import {
+  Empty,
+  EmptyContent,
+  EmptyDescription,
+  EmptyHeader,
+  EmptyMedia,
+  EmptyTitle
+} from "./empty.js";
+function AuthWall({ title, description, children, ...props }) {
+  return /* @__PURE__ */ jsxs(Empty, { ...props, children: [
+    /* @__PURE__ */ jsxs(EmptyHeader, { children: [
+      /* @__PURE__ */ jsx(EmptyMedia, { variant: "icon", children: /* @__PURE__ */ jsx(LockIcon, {}) }),
+      /* @__PURE__ */ jsx(EmptyTitle, { children: title }),
+      /* @__PURE__ */ jsx(EmptyDescription, { children: description })
+    ] }),
+    /* @__PURE__ */ jsx(EmptyContent, { children })
+  ] });
+}
+function LockIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": true,
+      children: [
+        /* @__PURE__ */ jsx("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2", ry: "2" }),
+        /* @__PURE__ */ jsx("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })
+      ]
+    }
+  );
+}
+export {
+  AuthWall
+};
+//# sourceMappingURL=auth-wall.js.map

package/dist/components/auth-wall.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/auth-wall.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n  Empty,\n  EmptyContent,\n  EmptyDescription,\n  EmptyHeader,\n  EmptyMedia,\n  EmptyTitle,\n} from \"./empty\";\n\n/**\n * What a section shows a caller it is not for: an `Empty` with a lock, a title, why,\n * and an action slot. A guest gets the sign-in button there; a signed-in caller\n * without the permission gets no action, or the host's own (request access).\n */\nexport interface AuthWallProps extends Omit<React.ComponentProps<\"div\">, \"title\"> {\n  title: React.ReactNode;\n  description: React.ReactNode;\n}\n\nexport function AuthWall({ title, description, children, ...props }: AuthWallProps) {\n  return (\n    <Empty {...props}>\n      <EmptyHeader>\n        <EmptyMedia variant=\"icon\">\n          <LockIcon />\n        </EmptyMedia>\n        <EmptyTitle>{title}</EmptyTitle>\n        <EmptyDescription>{description}</EmptyDescription>\n      </EmptyHeader>\n      <EmptyContent>{children}</EmptyContent>\n    </Empty>\n  );\n}\n\n// lucide `lock`, inlined so the kit keeps its zero-icon-dep footprint.\nfunction LockIcon() {\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    >\n      <rect x=\"3\" y=\"11\" width=\"18\" height=\"11\" rx=\"2\" ry=\"2\" />\n      <path d=\"M7 11V7a5 5 0 0 1 10 0v4\" />\n    </svg>\n  );\n}\n"],"mappings":"AAuBM,SAEI,KAFJ;AAvBN,YAAY,WAAW;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAYA,SAAS,SAAS,EAAE,OAAO,aAAa,UAAU,GAAG,MAAM,GAAkB;AAClF,SACE,qBAAC,SAAO,GAAG,OACT;AAAA,yBAAC,eACC;AAAA,0BAAC,cAAW,SAAQ,QAClB,8BAAC,YAAS,GACZ;AAAA,MACA,oBAAC,cAAY,iBAAM;AAAA,MACnB,oBAAC,oBAAkB,uBAAY;AAAA,OACjC;AAAA,IACA,oBAAC,gBAAc,UAAS;AAAA,KAC1B;AAEJ;AAGA,SAAS,WAAW;AAClB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,QAAO;AAAA,MACP,aAAa;AAAA,MACb,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,eAAW;AAAA,MAEX;AAAA,4BAAC,UAAK,GAAE,KAAI,GAAE,MAAK,OAAM,MAAK,QAAO,MAAK,IAAG,KAAI,IAAG,KAAI;AAAA,QACxD,oBAAC,UAAK,GAAE,4BAA2B;AAAA;AAAA;AAAA,EACrC;AAEJ;","names":[]}

package/dist/components/checkbox.js

@@ -4,6 +4,7 @@ import * as React from "react";
 import { cn } from "../lib/cn.js";
 import { CHECKBOX_BASE, CHECKBOX_INDICATOR } from "../generated/checkbox.js";
 import { useControllableState } from "../primitives/use-controllable-state.js";
+import { markLabelable } from "../primitives/labelable.js";
 import { useFieldControlId } from "./field-context.js";
 function Checkbox({
   className,
@@ -62,6 +63,7 @@ function Checkbox({
     }
   );
 }
+markLabelable(Checkbox);
 export {
   Checkbox
 };

package/dist/components/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/checkbox.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { CHECKBOX_BASE, CHECKBOX_INDICATOR } from \"../generated/checkbox\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { useFieldControlId } from \"./field-context\";\n\nexport interface CheckboxProps\n  extends Omit<React.ComponentProps<\"button\">, \"onChange\"> {\n  checked?: boolean;\n  defaultChecked?: boolean;\n  onCheckedChange?: (checked: boolean) => void;\n}\n\nexport function Checkbox({\n  className,\n  checked,\n  defaultChecked = false,\n  onCheckedChange,\n  onClick,\n  disabled,\n  id,\n  ...props\n}: CheckboxProps) {\n  const [on, setOn] = useControllableState<boolean>({\n    ...(checked !== undefined ? { value: checked } : {}),\n    defaultValue: defaultChecked,\n    ...(onCheckedChange ? { onChange: onCheckedChange } : {}),\n  });\n  const state = on ? \"checked\" : \"unchecked\";\n  return (\n    <button\n      type=\"button\"\n      role=\"checkbox\"\n      data-slot=\"checkbox\"\n      data-state={state}\n      aria-checked={on}\n      disabled={disabled}\n      id={useFieldControlId(id)}\n      className={cn(CHECKBOX_BASE, className)}\n      onClick={(e) => {\n        onClick?.(e);\n        setOn(!on);\n      }}\n      {...props}\n    >\n      {on && (\n        <span\n          data-slot=\"checkbox-indicator\"\n          className={CHECKBOX_INDICATOR}\n        >\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            className=\"size-3.5\"\n            aria-hidden=\"true\"\n          >\n            <path d=\"M20 6 9 17l-5-5\" />\n          </svg>\n        </span>\n      )}\n    </button>\n  );\n}\n"],"mappings":";AA+DY;AA7DZ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,eAAe,0BAA0B;AAClD,SAAS,4BAA4B;AACrC,SAAS,yBAAyB;AAS3B,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkB;AAChB,QAAM,CAAC,IAAI,KAAK,IAAI,qBAA8B;AAAA,IAChD,GAAI,YAAY,SAAY,EAAE,OAAO,QAAQ,IAAI,CAAC;AAAA,IAClD,cAAc;AAAA,IACd,GAAI,kBAAkB,EAAE,UAAU,gBAAgB,IAAI,CAAC;AAAA,EACzD,CAAC;AACD,QAAM,QAAQ,KAAK,YAAY;AAC/B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,MAAK;AAAA,MACL,aAAU;AAAA,MACV,cAAY;AAAA,MACZ,gBAAc;AAAA,MACd;AAAA,MACA,IAAI,kBAAkB,EAAE;AAAA,MACxB,WAAW,GAAG,eAAe,SAAS;AAAA,MACtC,SAAS,CAAC,MAAM;AACd,kBAAU,CAAC;AACX,cAAM,CAAC,EAAE;AAAA,MACX;AAAA,MACC,GAAG;AAAA,MAEH,gBACC;AAAA,QAAC;AAAA;AAAA,UACC,aAAU;AAAA,UACV,WAAW;AAAA,UAEX;AAAA,YAAC;AAAA;AAAA,cACC,OAAM;AAAA,cACN,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,QAAO;AAAA,cACP,aAAY;AAAA,cACZ,eAAc;AAAA,cACd,gBAAe;AAAA,cACf,WAAU;AAAA,cACV,eAAY;AAAA,cAEZ,8BAAC,UAAK,GAAE,mBAAkB;AAAA;AAAA,UAC5B;AAAA;AAAA,MACF;AAAA;AAAA,EAEJ;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/checkbox.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { CHECKBOX_BASE, CHECKBOX_INDICATOR } from \"../generated/checkbox\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { markLabelable } from \"../primitives/labelable\";\nimport { useFieldControlId } from \"./field-context\";\n\nexport interface CheckboxProps\n  extends Omit<React.ComponentProps<\"button\">, \"onChange\"> {\n  checked?: boolean;\n  defaultChecked?: boolean;\n  onCheckedChange?: (checked: boolean) => void;\n}\n\nexport function Checkbox({\n  className,\n  checked,\n  defaultChecked = false,\n  onCheckedChange,\n  onClick,\n  disabled,\n  id,\n  ...props\n}: CheckboxProps) {\n  const [on, setOn] = useControllableState<boolean>({\n    ...(checked !== undefined ? { value: checked } : {}),\n    defaultValue: defaultChecked,\n    ...(onCheckedChange ? { onChange: onCheckedChange } : {}),\n  });\n  const state = on ? \"checked\" : \"unchecked\";\n  return (\n    <button\n      type=\"button\"\n      role=\"checkbox\"\n      data-slot=\"checkbox\"\n      data-state={state}\n      aria-checked={on}\n      disabled={disabled}\n      id={useFieldControlId(id)}\n      className={cn(CHECKBOX_BASE, className)}\n      onClick={(e) => {\n        onClick?.(e);\n        setOn(!on);\n      }}\n      {...props}\n    >\n      {on && (\n        <span\n          data-slot=\"checkbox-indicator\"\n          className={CHECKBOX_INDICATOR}\n        >\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            className=\"size-3.5\"\n            aria-hidden=\"true\"\n          >\n            <path d=\"M20 6 9 17l-5-5\" />\n          </svg>\n        </span>\n      )}\n    </button>\n  );\n}\n\nmarkLabelable(Checkbox);\n"],"mappings":";AAgEY;AA9DZ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,eAAe,0BAA0B;AAClD,SAAS,4BAA4B;AACrC,SAAS,qBAAqB;AAC9B,SAAS,yBAAyB;AAS3B,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkB;AAChB,QAAM,CAAC,IAAI,KAAK,IAAI,qBAA8B;AAAA,IAChD,GAAI,YAAY,SAAY,EAAE,OAAO,QAAQ,IAAI,CAAC;AAAA,IAClD,cAAc;AAAA,IACd,GAAI,kBAAkB,EAAE,UAAU,gBAAgB,IAAI,CAAC;AAAA,EACzD,CAAC;AACD,QAAM,QAAQ,KAAK,YAAY;AAC/B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,MAAK;AAAA,MACL,aAAU;AAAA,MACV,cAAY;AAAA,MACZ,gBAAc;AAAA,MACd;AAAA,MACA,IAAI,kBAAkB,EAAE;AAAA,MACxB,WAAW,GAAG,eAAe,SAAS;AAAA,MACtC,SAAS,CAAC,MAAM;AACd,kBAAU,CAAC;AACX,cAAM,CAAC,EAAE;AAAA,MACX;AAAA,MACC,GAAG;AAAA,MAEH,gBACC;AAAA,QAAC;AAAA;AAAA,UACC,aAAU;AAAA,UACV,WAAW;AAAA,UAEX;AAAA,YAAC;AAAA;AAAA,cACC,OAAM;AAAA,cACN,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,QAAO;AAAA,cACP,aAAY;AAAA,cACZ,eAAc;AAAA,cACd,gBAAe;AAAA,cACf,WAAU;AAAA,cACV,eAAY;AAAA,cAEZ,8BAAC,UAAK,GAAE,mBAAkB;AAAA;AAAA,UAC5B;AAAA;AAAA,MACF;AAAA;AAAA,EAEJ;AAEJ;AAEA,cAAc,QAAQ;","names":[]}

package/dist/components/command.js

@@ -28,6 +28,39 @@ function useCommand() {
   return ctx;
 }
 const ITEM_SELECTOR = '[data-slot="command-item"]:not([aria-disabled="true"])';
+function fuzzyScore(value, query) {
+  const hay = [...value.toLowerCase()];
+  let total = 0;
+  for (const term of query.split(/\s+/)) {
+    const needle = [...term];
+    let k = 0;
+    let end = -1;
+    for (let i = 0; i < hay.length; i++) {
+      if (hay[i] === needle[k] && ++k === needle.length) {
+        end = i;
+        break;
+      }
+    }
+    if (end < 0) return null;
+    let start = end;
+    for (let i = end, j = needle.length - 1; j >= 0; i--) {
+      if (hay[i] === needle[j]) {
+        start = i;
+        j--;
+      }
+    }
+    let prev = -1;
+    for (let i = start, j = 0; j < needle.length; i++) {
+      if (hay[i] !== needle[j]) continue;
+      total += 16;
+      if (i === 0 || !/[\p{L}\p{N}]/u.test(hay[i - 1])) total += 8;
+      if (j > 0) total += i === prev + 1 ? 4 : -(3 + (i - prev - 2));
+      prev = i;
+      j++;
+    }
+  }
+  return total;
+}
 function useCommandNavigation(query, handlers) {
   const rootRef = React.useRef(null);
   const [activeId, setActiveId] = React.useState(null);
@@ -35,8 +68,15 @@ function useCommandNavigation(query, handlers) {
   const enabledItems = React.useCallback(() => {
     const root = rootRef.current;
     if (!root) return [];
-    return [...root.querySelectorAll(ITEM_SELECTOR)].filter(
-      (el) => el.closest('[data-slot="command"]') === root
+    const byParent = /* @__PURE__ */ new Map();
+    for (const el of root.querySelectorAll(ITEM_SELECTOR)) {
+      if (el.closest('[data-slot="command"]') !== root) continue;
+      const rows = byParent.get(el.parentElement) ?? [];
+      rows.push(el);
+      byParent.set(el.parentElement, rows);
+    }
+    return [...byParent.values()].flatMap(
+      (rows) => rows.sort((a, b) => Number(a.style.order) - Number(b.style.order))
     );
   }, []);
   React.useEffect(() => {
@@ -131,13 +171,17 @@ function Command({
     });
   }, []);
   const query = currentSearch.trim().toLowerCase();
-  const matches = React.useCallback(
-    (value) => !shouldFilter || query === "" || value.toLowerCase().includes(query),
+  const order = React.useCallback(
+    (value) => {
+      if (!shouldFilter || query === "") return 0;
+      const score = fuzzyScore(value, query);
+      return score === null ? null : -score;
+    },
     [query, shouldFilter]
   );
   const hasMatches = React.useMemo(
-    () => [...items.values()].some(matches),
-    [items, matches]
+    () => [...items.values()].some((value) => order(value) !== null),
+    [items, order]
   );
   const listId = React.useId();
   const nav = useCommandNavigation(query, handlers);
@@ -150,7 +194,7 @@ function Command({
         registerItem,
         unregisterItem,
         query,
-        matches,
+        order,
         hasMatches,
         listId,
         activeId: nav.activeId,
@@ -312,7 +356,7 @@ function CommandItem({
   children,
   ...props
 }) {
-  const { registerItem, unregisterItem, matches, activeId, activate } = useCommand();
+  const { registerItem, unregisterItem, order, activeId, activate } = useCommand();
   const reactId = React.useId();
   const id = idProp ?? reactId;
   const onSelectRef = React.useRef(onSelect);
@@ -323,7 +367,8 @@ function CommandItem({
     registerItem(id, value, () => onSelectRef.current?.(value));
     return () => unregisterItem(id);
   }, [id, value, registerItem, unregisterItem]);
-  if (!matches(value)) return null;
+  const rank = order(value);
+  if (rank === null) return null;
   const selected = activeId === id;
   return /* @__PURE__ */ jsx(
     "div",
@@ -345,6 +390,7 @@ function CommandItem({
       },
       className: cn(COMMAND_ITEM, className),
       ...props,
+      style: { ...props.style, order: rank },
       children
     }
   );

package/dist/components/command.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/command.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../primitives/dismissable-layer\";\nimport { useFocusScope } from \"../primitives/focus-scope\";\nimport { mergeRefs } from \"../primitives/merge-refs\";\nimport { Portal } from \"../primitives/portal\";\nimport {\n  COMMAND_DIALOG_COMMAND,\n  COMMAND_DIALOG_CONTENT,\n  COMMAND_DIALOG_OVERLAY,\n  COMMAND_EMPTY,\n  COMMAND_GROUP,\n  COMMAND_INPUT,\n  COMMAND_INPUT_WRAPPER,\n  COMMAND_ITEM,\n  COMMAND_LIST,\n  COMMAND_ROOT,\n  COMMAND_SEPARATOR,\n  COMMAND_SHORTCUT,\n} from \"../generated/command\";\n\ninterface CommandContextValue {\n  search: string;\n  setSearch: (next: string) => void;\n  /// Registers a `CommandItem`'s value so `CommandEmpty` can tell \"nothing\n  /// matched\" from \"nothing is here\", and its select handler so Enter can fire\n  /// it. Items register even while filtered out.\n  registerItem: (id: string, value: string, select: () => void) => void;\n  unregisterItem: (id: string) => void;\n  /// The active query: trimmed, so blank input is not a search, and lowercased.\n  /// Shared by the item filter and the empty-state gate so the two can never\n  /// disagree.\n  query: string;\n  matches: (value: string) => boolean;\n  hasMatches: boolean;\n  listId: string;\n  /// DOM id of the highlighted item. Focus stays in the input and points here\n  /// through `aria-activedescendant` (the ARIA combobox pattern), so items\n  /// never need to be tabbable.\n  activeId: string | null;\n  activate: (id: string) => void;\n}\n\nconst CommandContext = React.createContext<CommandContextValue | null>(null);\n\nfunction useCommand(): CommandContextValue {\n  const ctx = React.useContext(CommandContext);\n  if (!ctx) throw new Error(\"Command parts must be used within <Command>\");\n  return ctx;\n}\n\nexport interface CommandProps extends React.ComponentProps<\"div\"> {\n  search?: string;\n  defaultSearch?: string;\n  onSearchChange?: (search: string) => void;\n  /// `false` hands filtering to the caller (e.g. rows that are a server\n  /// response to the query): every mounted item renders, in the caller's\n  /// order, and `CommandEmpty` counts mounted items. Defaults to `true`.\n  shouldFilter?: boolean;\n}\n\nconst ITEM_SELECTOR = '[data-slot=\"command-item\"]:not([aria-disabled=\"true\"])';\n\n/// Keyboard highlight over the items currently in the DOM, in DOM order, so it\n/// follows whatever the filter (or the caller) rendered rather than the order\n/// items happened to register in.\nfunction useCommandNavigation(\n  query: string,\n  handlers: React.RefObject<Map<string, () => void>>,\n) {\n  const rootRef = React.useRef<HTMLDivElement>(null);\n  const [activeId, setActiveId] = React.useState<string | null>(null);\n  // Until the user moves the highlight it tracks the first row, so results\n  // that arrive after the keystroke (or reorder under it) put Enter on the top\n  // hit. Once moved, it sticks for as long as that row stays.\n  const userMoved = React.useRef(false);\n\n  const enabledItems = React.useCallback((): HTMLElement[] => {\n    const root = rootRef.current;\n    if (!root) return [];\n    return [...root.querySelectorAll<HTMLElement>(ITEM_SELECTOR)].filter(\n      (el) => el.closest('[data-slot=\"command\"]') === root,\n    );\n  }, []);\n\n  React.useEffect(() => {\n    userMoved.current = false;\n  }, [query]);\n\n  // No deps on purpose: the caller can change the rendered rows on any render;\n  // setting an unchanged id bails out without re-rendering.\n  React.useEffect(() => {\n    const els = enabledItems();\n    const moved = userMoved.current;\n    setActiveId((prev) =>\n      moved && prev !== null && els.some((el) => el.id === prev)\n        ? prev\n        : (els[0]?.id ?? null),\n    );\n  });\n\n  const activate = React.useCallback((id: string) => {\n    userMoved.current = true;\n    setActiveId(id);\n  }, []);\n\n  const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.nativeEvent.isComposing) return;\n    // Only the search field drives the list: Enter or an arrow on a button\n    // inside Command (an action in `CommandEmpty`, a footer) stays its own.\n    const field = event.target as HTMLElement;\n    if (field.dataset[\"slot\"] !== \"command-input\") return;\n    const els = enabledItems();\n    const current = els.findIndex((el) => el.id === activeId);\n    const last = els.length - 1;\n    let next: number;\n    switch (event.key) {\n      case \"ArrowDown\":\n        next = current < 0 ? 0 : Math.min(current + 1, last);\n        break;\n      case \"ArrowUp\":\n        next = current < 0 ? last : Math.max(current - 1, 0);\n        break;\n      // Home / End are left to the caret: the field is editable (ARIA APG\n      // editable combobox).\n      case \"Enter\": {\n        const select =\n          activeId !== null && current >= 0\n            ? handlers.current.get(activeId)\n            : undefined;\n        if (select) {\n          event.preventDefault();\n          select();\n        }\n        return;\n      }\n      default:\n        return;\n    }\n    const target = els[next];\n    if (!target) return;\n    event.preventDefault();\n    activate(target.id);\n    // Optional call: jsdom implements no `scrollIntoView`.\n    target.scrollIntoView?.({ block: \"nearest\" });\n  };\n\n  return { rootRef, activeId, activate, onKeyDown };\n}\n\nexport function Command({\n  className,\n  search,\n  defaultSearch = \"\",\n  onSearchChange,\n  shouldFilter = true,\n  children,\n  ref,\n  onKeyDown,\n  ...props\n}: CommandProps) {\n  const [currentSearch, setSearch] = useControllableState<string>({\n    ...(search !== undefined ? { value: search } : {}),\n    defaultValue: defaultSearch,\n    ...(onSearchChange ? { onChange: onSearchChange } : {}),\n  });\n\n  const [items, setItems] = React.useState<ReadonlyMap<string, string>>(\n    () => new Map(),\n  );\n  const handlers = React.useRef(new Map<string, () => void>());\n  const registerItem = React.useCallback(\n    (id: string, value: string, select: () => void) => {\n      handlers.current.set(id, select);\n      setItems((prev) => {\n        if (prev.get(id) === value) return prev;\n        const next = new Map(prev);\n        next.set(id, value);\n        return next;\n      });\n    },\n    [],\n  );\n  const unregisterItem = React.useCallback((id: string) => {\n    handlers.current.delete(id);\n    setItems((prev) => {\n      if (!prev.has(id)) return prev;\n      const next = new Map(prev);\n      next.delete(id);\n      return next;\n    });\n  }, []);\n\n  const query = currentSearch.trim().toLowerCase();\n  const matches = React.useCallback(\n    (value: string) =>\n      !shouldFilter || query === \"\" || value.toLowerCase().includes(query),\n    [query, shouldFilter],\n  );\n  const hasMatches = React.useMemo(\n    () => [...items.values()].some(matches),\n    [items, matches],\n  );\n\n  const listId = React.useId();\n  const nav = useCommandNavigation(query, handlers);\n\n  return (\n    <CommandContext.Provider\n      value={{\n        search: currentSearch,\n        setSearch,\n        registerItem,\n        unregisterItem,\n        query,\n        matches,\n        hasMatches,\n        listId,\n        activeId: nav.activeId,\n        activate: nav.activate,\n      }}\n    >\n      <div\n        data-slot=\"command\"\n        ref={mergeRefs(nav.rootRef, ref)}\n        className={cn(COMMAND_ROOT, className)}\n        onKeyDown={(e) => {\n          onKeyDown?.(e);\n          if (!e.defaultPrevented) nav.onKeyDown(e);\n        }}\n        {...props}\n      >\n        {children}\n      </div>\n    </CommandContext.Provider>\n  );\n}\n\nexport interface CommandDialogProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  /// See `CommandProps.shouldFilter`.\n  shouldFilter?: boolean;\n  className?: string;\n  children?: React.ReactNode;\n}\n\nexport function CommandDialog({\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  shouldFilter = true,\n  className,\n  children,\n}: CommandDialogProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const scopeRef = useFocusScope(isOpen);\n  // Outside clicks stay with the overlay, as in Drawer: it is what \"outside\" means.\n  const dismissRef = useDismissableLayer({\n    enabled: isOpen,\n    onDismiss: () => setOpen(false),\n    pointerOutside: false,\n    modal: true,\n  });\n  if (!isOpen) return null;\n  return (\n    <Portal>\n      <div\n        data-slot=\"command-overlay\"\n        className={COMMAND_DIALOG_OVERLAY}\n        onClick={() => setOpen(false)}\n      />\n      <div\n        role=\"dialog\"\n        aria-modal=\"true\"\n        data-slot=\"command-dialog\"\n        ref={mergeRefs(scopeRef, dismissRef)}\n        className={cn(COMMAND_DIALOG_CONTENT, className)}\n      >\n        <Command className={COMMAND_DIALOG_COMMAND} shouldFilter={shouldFilter}>\n          <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n        </Command>\n      </div>\n    </Portal>\n  );\n}\n\nexport function CommandInput({\n  className,\n  ...props\n}: React.ComponentProps<\"input\">) {\n  const { search, setSearch, listId, activeId } = useCommand();\n  return (\n    <div className={COMMAND_INPUT_WRAPPER} data-slot=\"command-input-wrapper\">\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className=\"size-4 shrink-0 opacity-50\"\n        aria-hidden=\"true\"\n      >\n        <circle cx=\"11\" cy=\"11\" r=\"8\" />\n        <path d=\"m21 21-4.3-4.3\" />\n      </svg>\n      <input\n        type=\"text\"\n        role=\"combobox\"\n        data-slot=\"command-input\"\n        aria-autocomplete=\"list\"\n        aria-expanded={true}\n        aria-controls={listId}\n        aria-activedescendant={activeId ?? undefined}\n        autoComplete=\"off\"\n        value={search}\n        onChange={(e) => setSearch(e.target.value)}\n        className={cn(COMMAND_INPUT, className)}\n        {...props}\n      />\n    </div>\n  );\n}\n\nexport function CommandList({ className, ...props }: React.ComponentProps<\"div\">) {\n  const { listId } = useCommand();\n  return (\n    <div\n      role=\"listbox\"\n      id={listId}\n      data-slot=\"command-list\"\n      className={cn(COMMAND_LIST, className)}\n      {...props}\n    />\n  );\n}\n\n/// Renders only when a search is under way and no item matched it — never next\n/// to results, and never before the user has typed. With `shouldFilter={false}`\n/// \"matched\" means \"is mounted\": the caller's rows are the results.\nexport function CommandEmpty({ className, children, ...props }: React.ComponentProps<\"div\">) {\n  const { query, hasMatches } = useCommand();\n  if (query === \"\" || hasMatches) return null;\n  return (\n    <div\n      data-slot=\"command-empty\"\n      className={cn(COMMAND_EMPTY, className)}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport interface CommandGroupProps extends React.ComponentProps<\"div\"> {\n  heading?: string;\n}\n\nexport function CommandGroup({ className, heading, children, ...props }: CommandGroupProps) {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"command-group\"\n      className={cn(COMMAND_GROUP, className)}\n      {...props}\n    >\n      {heading ? <div data-slot=\"command-group-heading\">{heading}</div> : null}\n      {children}\n    </div>\n  );\n}\n\nexport interface CommandItemProps\n  extends Omit<React.ComponentProps<\"div\">, \"onSelect\"> {\n  value: string;\n  disabled?: boolean;\n  onSelect?: (value: string) => void;\n}\n\nexport function CommandItem({\n  className,\n  value,\n  disabled = false,\n  onSelect,\n  id: idProp,\n  onPointerMove,\n  children,\n  ...props\n}: CommandItemProps) {\n  const { registerItem, unregisterItem, matches, activeId, activate } = useCommand();\n  const reactId = React.useId();\n  // The DOM id is what `aria-activedescendant` points at, so a caller's own id\n  // has to be the one registered.\n  const id = idProp ?? reactId;\n  // Read at select time, so an inline `onSelect` doesn't re-register every render.\n  const onSelectRef = React.useRef(onSelect);\n  React.useEffect(() => {\n    onSelectRef.current = onSelect;\n  });\n  // Registered whether or not this item survives the filter below, so\n  // `CommandEmpty` gates on the search, not on who happens to be mounted.\n  React.useEffect(() => {\n    registerItem(id, value, () => onSelectRef.current?.(value));\n    return () => unregisterItem(id);\n  }, [id, value, registerItem, unregisterItem]);\n\n  if (!matches(value)) return null;\n  const selected = activeId === id;\n  return (\n    <div\n      role=\"option\"\n      id={id}\n      data-slot=\"command-item\"\n      data-disabled={disabled}\n      data-selected={selected}\n      aria-selected={selected}\n      aria-disabled={disabled || undefined}\n      tabIndex={-1}\n      onClick={() => {\n        if (!disabled) onSelect?.(value);\n      }}\n      onPointerMove={(e) => {\n        onPointerMove?.(e);\n        if (!disabled && !selected) activate(id);\n      }}\n      className={cn(COMMAND_ITEM, className)}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport function CommandSeparator({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"command-separator\"\n      className={cn(COMMAND_SEPARATOR, className)}\n      {...props}\n    />\n  );\n}\n\nexport function CommandShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"command-shortcut\"\n      className={cn(COMMAND_SHORTCUT, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/command.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../primitives/dismissable-layer\";\nimport { useFocusScope } from \"../primitives/focus-scope\";\nimport { mergeRefs } from \"../primitives/merge-refs\";\nimport { Portal } from \"../primitives/portal\";\nimport {\n  COMMAND_DIALOG_COMMAND,\n  COMMAND_DIALOG_CONTENT,\n  COMMAND_DIALOG_OVERLAY,\n  COMMAND_EMPTY,\n  COMMAND_GROUP,\n  COMMAND_INPUT,\n  COMMAND_INPUT_WRAPPER,\n  COMMAND_ITEM,\n  COMMAND_LIST,\n  COMMAND_ROOT,\n  COMMAND_SEPARATOR,\n  COMMAND_SHORTCUT,\n} from \"../generated/command\";\n\ninterface CommandContextValue {\n  search: string;\n  setSearch: (next: string) => void;\n  /// Registers a `CommandItem`'s value so `CommandEmpty` can tell \"nothing\n  /// matched\" from \"nothing is here\", and its select handler so Enter can fire\n  /// it. Items register even while filtered out.\n  registerItem: (id: string, value: string, select: () => void) => void;\n  unregisterItem: (id: string) => void;\n  /// The active query: trimmed, so blank input is not a search, and lowercased.\n  /// Shared by the item filter and the empty-state gate so the two can never\n  /// disagree.\n  query: string;\n  /// `null` filters the item out; a number is its CSS `order`, `0` while\n  /// nothing is being ranked.\n  order: (value: string) => number | null;\n  hasMatches: boolean;\n  listId: string;\n  /// DOM id of the highlighted item. Focus stays in the input and points here\n  /// through `aria-activedescendant` (the ARIA combobox pattern), so items\n  /// never need to be tabbable.\n  activeId: string | null;\n  activate: (id: string) => void;\n}\n\nconst CommandContext = React.createContext<CommandContextValue | null>(null);\n\nfunction useCommand(): CommandContextValue {\n  const ctx = React.useContext(CommandContext);\n  if (!ctx) throw new Error(\"Command parts must be used within <Command>\");\n  return ctx;\n}\n\nexport interface CommandProps extends React.ComponentProps<\"div\"> {\n  search?: string;\n  defaultSearch?: string;\n  onSearchChange?: (search: string) => void;\n  /// `false` hands filtering to the caller (e.g. rows that are a server\n  /// response to the query): every mounted item renders, in the caller's\n  /// order, and `CommandEmpty` counts mounted items. Defaults to `true`.\n  shouldFilter?: boolean;\n}\n\nconst ITEM_SELECTOR = '[data-slot=\"command-item\"]:not([aria-disabled=\"true\"])';\n\n/// fzf v1: per space-separated term, the shortest window ending at the first\n/// full subsequence match, scored for word starts and runs, charged for gaps.\n/// `null` when a term does not match.\nfunction fuzzyScore(value: string, query: string): number | null {\n  const hay = [...value.toLowerCase()];\n  let total = 0;\n  for (const term of query.split(/\\s+/)) {\n    const needle = [...term];\n    let k = 0;\n    let end = -1;\n    for (let i = 0; i < hay.length; i++) {\n      if (hay[i] === needle[k] && ++k === needle.length) {\n        end = i;\n        break;\n      }\n    }\n    if (end < 0) return null;\n    let start = end;\n    for (let i = end, j = needle.length - 1; j >= 0; i--) {\n      if (hay[i] === needle[j]) {\n        start = i;\n        j--;\n      }\n    }\n    let prev = -1;\n    for (let i = start, j = 0; j < needle.length; i++) {\n      if (hay[i] !== needle[j]) continue;\n      total += 16;\n      if (i === 0 || !/[\\p{L}\\p{N}]/u.test(hay[i - 1]!)) total += 8;\n      if (j > 0) total += i === prev + 1 ? 4 : -(3 + (i - prev - 2));\n      prev = i;\n      j++;\n    }\n  }\n  return total;\n}\n\n/// Keyboard highlight over the items currently in the DOM, in the order on\n/// screen — each container's rows by their CSS `order`, then DOM order — so it\n/// follows whatever the filter (or the caller) rendered rather than the order\n/// items happened to register in.\nfunction useCommandNavigation(\n  query: string,\n  handlers: React.RefObject<Map<string, () => void>>,\n) {\n  const rootRef = React.useRef<HTMLDivElement>(null);\n  const [activeId, setActiveId] = React.useState<string | null>(null);\n  // Until the user moves the highlight it tracks the first row, so results\n  // that arrive after the keystroke (or reorder under it) put Enter on the top\n  // hit. Once moved, it sticks for as long as that row stays.\n  const userMoved = React.useRef(false);\n\n  const enabledItems = React.useCallback((): HTMLElement[] => {\n    const root = rootRef.current;\n    if (!root) return [];\n    const byParent = new Map<Element | null, HTMLElement[]>();\n    for (const el of root.querySelectorAll<HTMLElement>(ITEM_SELECTOR)) {\n      if (el.closest('[data-slot=\"command\"]') !== root) continue;\n      const rows = byParent.get(el.parentElement) ?? [];\n      rows.push(el);\n      byParent.set(el.parentElement, rows);\n    }\n    return [...byParent.values()].flatMap((rows) =>\n      rows.sort((a, b) => Number(a.style.order) - Number(b.style.order)),\n    );\n  }, []);\n\n  React.useEffect(() => {\n    userMoved.current = false;\n  }, [query]);\n\n  // No deps on purpose: the caller can change the rendered rows on any render;\n  // setting an unchanged id bails out without re-rendering.\n  React.useEffect(() => {\n    const els = enabledItems();\n    const moved = userMoved.current;\n    setActiveId((prev) =>\n      moved && prev !== null && els.some((el) => el.id === prev)\n        ? prev\n        : (els[0]?.id ?? null),\n    );\n  });\n\n  const activate = React.useCallback((id: string) => {\n    userMoved.current = true;\n    setActiveId(id);\n  }, []);\n\n  const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.nativeEvent.isComposing) return;\n    // Only the search field drives the list: Enter or an arrow on a button\n    // inside Command (an action in `CommandEmpty`, a footer) stays its own.\n    const field = event.target as HTMLElement;\n    if (field.dataset[\"slot\"] !== \"command-input\") return;\n    const els = enabledItems();\n    const current = els.findIndex((el) => el.id === activeId);\n    const last = els.length - 1;\n    let next: number;\n    switch (event.key) {\n      case \"ArrowDown\":\n        next = current < 0 ? 0 : Math.min(current + 1, last);\n        break;\n      case \"ArrowUp\":\n        next = current < 0 ? last : Math.max(current - 1, 0);\n        break;\n      // Home / End are left to the caret: the field is editable (ARIA APG\n      // editable combobox).\n      case \"Enter\": {\n        const select =\n          activeId !== null && current >= 0\n            ? handlers.current.get(activeId)\n            : undefined;\n        if (select) {\n          event.preventDefault();\n          select();\n        }\n        return;\n      }\n      default:\n        return;\n    }\n    const target = els[next];\n    if (!target) return;\n    event.preventDefault();\n    activate(target.id);\n    // Optional call: jsdom implements no `scrollIntoView`.\n    target.scrollIntoView?.({ block: \"nearest\" });\n  };\n\n  return { rootRef, activeId, activate, onKeyDown };\n}\n\nexport function Command({\n  className,\n  search,\n  defaultSearch = \"\",\n  onSearchChange,\n  shouldFilter = true,\n  children,\n  ref,\n  onKeyDown,\n  ...props\n}: CommandProps) {\n  const [currentSearch, setSearch] = useControllableState<string>({\n    ...(search !== undefined ? { value: search } : {}),\n    defaultValue: defaultSearch,\n    ...(onSearchChange ? { onChange: onSearchChange } : {}),\n  });\n\n  const [items, setItems] = React.useState<ReadonlyMap<string, string>>(\n    () => new Map(),\n  );\n  const handlers = React.useRef(new Map<string, () => void>());\n  const registerItem = React.useCallback(\n    (id: string, value: string, select: () => void) => {\n      handlers.current.set(id, select);\n      setItems((prev) => {\n        if (prev.get(id) === value) return prev;\n        const next = new Map(prev);\n        next.set(id, value);\n        return next;\n      });\n    },\n    [],\n  );\n  const unregisterItem = React.useCallback((id: string) => {\n    handlers.current.delete(id);\n    setItems((prev) => {\n      if (!prev.has(id)) return prev;\n      const next = new Map(prev);\n      next.delete(id);\n      return next;\n    });\n  }, []);\n\n  const query = currentSearch.trim().toLowerCase();\n  const order = React.useCallback(\n    (value: string) => {\n      if (!shouldFilter || query === \"\") return 0;\n      const score = fuzzyScore(value, query);\n      return score === null ? null : -score;\n    },\n    [query, shouldFilter],\n  );\n  const hasMatches = React.useMemo(\n    () => [...items.values()].some((value) => order(value) !== null),\n    [items, order],\n  );\n\n  const listId = React.useId();\n  const nav = useCommandNavigation(query, handlers);\n\n  return (\n    <CommandContext.Provider\n      value={{\n        search: currentSearch,\n        setSearch,\n        registerItem,\n        unregisterItem,\n        query,\n        order,\n        hasMatches,\n        listId,\n        activeId: nav.activeId,\n        activate: nav.activate,\n      }}\n    >\n      <div\n        data-slot=\"command\"\n        ref={mergeRefs(nav.rootRef, ref)}\n        className={cn(COMMAND_ROOT, className)}\n        onKeyDown={(e) => {\n          onKeyDown?.(e);\n          if (!e.defaultPrevented) nav.onKeyDown(e);\n        }}\n        {...props}\n      >\n        {children}\n      </div>\n    </CommandContext.Provider>\n  );\n}\n\nexport interface CommandDialogProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  /// See `CommandProps.shouldFilter`.\n  shouldFilter?: boolean;\n  className?: string;\n  children?: React.ReactNode;\n}\n\nexport function CommandDialog({\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  shouldFilter = true,\n  className,\n  children,\n}: CommandDialogProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const scopeRef = useFocusScope(isOpen);\n  // Outside clicks stay with the overlay, as in Drawer: it is what \"outside\" means.\n  const dismissRef = useDismissableLayer({\n    enabled: isOpen,\n    onDismiss: () => setOpen(false),\n    pointerOutside: false,\n    modal: true,\n  });\n  if (!isOpen) return null;\n  return (\n    <Portal>\n      <div\n        data-slot=\"command-overlay\"\n        className={COMMAND_DIALOG_OVERLAY}\n        onClick={() => setOpen(false)}\n      />\n      <div\n        role=\"dialog\"\n        aria-modal=\"true\"\n        data-slot=\"command-dialog\"\n        ref={mergeRefs(scopeRef, dismissRef)}\n        className={cn(COMMAND_DIALOG_CONTENT, className)}\n      >\n        <Command className={COMMAND_DIALOG_COMMAND} shouldFilter={shouldFilter}>\n          <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n        </Command>\n      </div>\n    </Portal>\n  );\n}\n\nexport function CommandInput({\n  className,\n  ...props\n}: React.ComponentProps<\"input\">) {\n  const { search, setSearch, listId, activeId } = useCommand();\n  return (\n    <div className={COMMAND_INPUT_WRAPPER} data-slot=\"command-input-wrapper\">\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className=\"size-4 shrink-0 opacity-50\"\n        aria-hidden=\"true\"\n      >\n        <circle cx=\"11\" cy=\"11\" r=\"8\" />\n        <path d=\"m21 21-4.3-4.3\" />\n      </svg>\n      <input\n        type=\"text\"\n        role=\"combobox\"\n        data-slot=\"command-input\"\n        aria-autocomplete=\"list\"\n        aria-expanded={true}\n        aria-controls={listId}\n        aria-activedescendant={activeId ?? undefined}\n        autoComplete=\"off\"\n        value={search}\n        onChange={(e) => setSearch(e.target.value)}\n        className={cn(COMMAND_INPUT, className)}\n        {...props}\n      />\n    </div>\n  );\n}\n\nexport function CommandList({ className, ...props }: React.ComponentProps<\"div\">) {\n  const { listId } = useCommand();\n  return (\n    <div\n      role=\"listbox\"\n      id={listId}\n      data-slot=\"command-list\"\n      className={cn(COMMAND_LIST, className)}\n      {...props}\n    />\n  );\n}\n\n/// Renders only when a search is under way and no item matched it — never next\n/// to results, and never before the user has typed. With `shouldFilter={false}`\n/// \"matched\" means \"is mounted\": the caller's rows are the results.\nexport function CommandEmpty({ className, children, ...props }: React.ComponentProps<\"div\">) {\n  const { query, hasMatches } = useCommand();\n  if (query === \"\" || hasMatches) return null;\n  return (\n    <div\n      data-slot=\"command-empty\"\n      className={cn(COMMAND_EMPTY, className)}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport interface CommandGroupProps extends React.ComponentProps<\"div\"> {\n  heading?: string;\n}\n\nexport function CommandGroup({ className, heading, children, ...props }: CommandGroupProps) {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"command-group\"\n      className={cn(COMMAND_GROUP, className)}\n      {...props}\n    >\n      {heading ? <div data-slot=\"command-group-heading\">{heading}</div> : null}\n      {children}\n    </div>\n  );\n}\n\nexport interface CommandItemProps\n  extends Omit<React.ComponentProps<\"div\">, \"onSelect\"> {\n  value: string;\n  disabled?: boolean;\n  onSelect?: (value: string) => void;\n}\n\nexport function CommandItem({\n  className,\n  value,\n  disabled = false,\n  onSelect,\n  id: idProp,\n  onPointerMove,\n  children,\n  ...props\n}: CommandItemProps) {\n  const { registerItem, unregisterItem, order, activeId, activate } = useCommand();\n  const reactId = React.useId();\n  // The DOM id is what `aria-activedescendant` points at, so a caller's own id\n  // has to be the one registered.\n  const id = idProp ?? reactId;\n  // Read at select time, so an inline `onSelect` doesn't re-register every render.\n  const onSelectRef = React.useRef(onSelect);\n  React.useEffect(() => {\n    onSelectRef.current = onSelect;\n  });\n  // Registered whether or not this item survives the filter below, so\n  // `CommandEmpty` gates on the search, not on who happens to be mounted.\n  React.useEffect(() => {\n    registerItem(id, value, () => onSelectRef.current?.(value));\n    return () => unregisterItem(id);\n  }, [id, value, registerItem, unregisterItem]);\n\n  const rank = order(value);\n  if (rank === null) return null;\n  const selected = activeId === id;\n  return (\n    <div\n      role=\"option\"\n      id={id}\n      data-slot=\"command-item\"\n      data-disabled={disabled}\n      data-selected={selected}\n      aria-selected={selected}\n      aria-disabled={disabled || undefined}\n      tabIndex={-1}\n      onClick={() => {\n        if (!disabled) onSelect?.(value);\n      }}\n      onPointerMove={(e) => {\n        onPointerMove?.(e);\n        if (!disabled && !selected) activate(id);\n      }}\n      className={cn(COMMAND_ITEM, className)}\n      {...props}\n      style={{ ...props.style, order: rank }}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport function CommandSeparator({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"command-separator\"\n      className={cn(COMMAND_SEPARATOR, className)}\n      {...props}\n    />\n  );\n}\n\nexport function CommandShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"command-shortcut\"\n      className={cn(COMMAND_SHORTCUT, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/dialog.js

@@ -31,7 +31,15 @@ function Dialog({ open, defaultOpen = false, onOpenChange, children }) {
     ...onOpenChange ? { onChange: onOpenChange } : {}
   });
   const triggerRef = React.useRef(null);
-  return /* @__PURE__ */ jsx(DialogContext.Provider, { value: { open: isOpen, setOpen, triggerRef }, children });
+  const [titleId, setTitleId] = React.useState(void 0);
+  const [descriptionId, setDescriptionId] = React.useState(void 0);
+  return /* @__PURE__ */ jsx(
+    DialogContext.Provider,
+    {
+      value: { open: isOpen, setOpen, triggerRef, titleId, descriptionId, setTitleId, setDescriptionId },
+      children
+    }
+  );
 }
 function DialogTrigger({ asChild = false, onClick, ...props }) {
   const { open, setOpen, triggerRef } = useDialog();
@@ -54,13 +62,12 @@ function DialogPortal({ children }) {
   return /* @__PURE__ */ jsx(Fragment, { children });
 }
 function DialogOverlay({ className, ...props }) {
-  const { open, setOpen } = useDialog();
+  const { open } = useDialog();
   return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "dialog-overlay",
       "data-state": open ? "open" : "closed",
-      onClick: () => setOpen(false),
       className: cn(DIALOG_OVERLAY, className),
       ...props
     }
@@ -89,7 +96,7 @@ function DialogContent({
   initialFocus = "first",
   ...props
 }) {
-  const { open, setOpen, triggerRef } = useDialog();
+  const { open, setOpen, triggerRef, titleId, descriptionId } = useDialog();
   const { isPresent, ref: presRef } = usePresence(open);
   const focusRef = useFocusScope(open, { initialFocus, returnFocusTo: triggerRef });
   const dismissRef = useDismissableLayer({
@@ -115,6 +122,8 @@ function DialogContent({
         "data-slot": "dialog-content",
         role: "dialog",
         "aria-modal": "true",
+        "aria-labelledby": titleId,
+        "aria-describedby": descriptionId,
         "data-state": open ? "open" : "closed",
         ref: mergeRefs(focusRef, dismissRef, presRef),
         className: cn(DIALOG_CONTENT, className),
@@ -174,20 +183,34 @@ function DialogFooter({ className, ...props }) {
     }
   );
 }
-function DialogTitle({ className, ...props }) {
+function useRegisteredId(own, register) {
+  const generated = React.useId();
+  const id = own ?? generated;
+  React.useLayoutEffect(() => {
+    if (!register) return;
+    register(id);
+    return () => register((current) => current === id ? void 0 : current);
+  }, [id, register]);
+  return id;
+}
+function DialogTitle({ className, id, ...props }) {
+  const titleId = useRegisteredId(id, React.useContext(DialogContext)?.setTitleId);
   return /* @__PURE__ */ jsx(
     "h2",
     {
+      id: titleId,
       "data-slot": "dialog-title",
       className: cn(DIALOG_TITLE, className),
       ...props
     }
   );
 }
-function DialogDescription({ className, ...props }) {
+function DialogDescription({ className, id, ...props }) {
+  const descriptionId = useRegisteredId(id, React.useContext(DialogContext)?.setDescriptionId);
   return /* @__PURE__ */ jsx(
     "p",
     {
+      id: descriptionId,
       "data-slot": "dialog-description",
       className: cn(DIALOG_DESCRIPTION, className),
       ...props

package/dist/components/dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../primitives/dismissable-layer\";\nimport { type InitialFocus, useFocusScope } from \"../primitives/focus-scope\";\nimport { usePresence } from \"../primitives/presence\";\nimport { mergeRefs } from \"../primitives/merge-refs\";\nimport { Portal } from \"../primitives/portal\";\nimport { Slot } from \"../primitives/slot\";\nimport {\n  DIALOG_CLOSE,\n  DIALOG_CONTENT,\n  DIALOG_DESCRIPTION,\n  DIALOG_FOOTER,\n  DIALOG_HEADER,\n  DIALOG_OVERLAY,\n  DIALOG_TITLE,\n} from \"../generated/dialog\";\n\ninterface DialogContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  triggerRef: React.RefObject<HTMLElement | null>;\n}\n\nconst DialogContext = React.createContext<DialogContextValue | null>(null);\n\nfunction useDialog(): DialogContextValue {\n  const ctx = React.useContext(DialogContext);\n  if (!ctx) throw new Error(\"Dialog parts must be used within <Dialog>\");\n  return ctx;\n}\n\nexport interface DialogProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function Dialog({ open, defaultOpen = false, onOpenChange, children }: DialogProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const triggerRef = React.useRef<HTMLElement | null>(null);\n  return (\n    <DialogContext.Provider value={{ open: isOpen, setOpen, triggerRef }}>\n      {children}\n    </DialogContext.Provider>\n  );\n}\n\nexport interface DialogTriggerProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n}\n\nexport function DialogTrigger({ asChild = false, onClick, ...props }: DialogTriggerProps) {\n  const { open, setOpen, triggerRef } = useDialog();\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"dialog-trigger\"\n      aria-expanded={open}\n      ref={triggerRef as React.Ref<HTMLButtonElement>}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(true);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport type DialogPortalProps = { children?: React.ReactNode };\n\nexport function DialogPortal({ children }: DialogPortalProps) {\n  return <>{children}</>;\n}\n\nexport interface DialogOverlayProps extends React.ComponentProps<\"div\"> {}\n\nexport function DialogOverlay({ className, ...props }: DialogOverlayProps) {\n  const { open, setOpen } = useDialog();\n  return (\n    <div\n      data-slot=\"dialog-overlay\"\n      data-state={open ? \"open\" : \"closed\"}\n      onClick={() => setOpen(false)}\n      className={cn(DIALOG_OVERLAY, className)}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nconst XIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"24\"\n    height=\"24\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    {...props}\n  >\n    <path d=\"M18 6 6 18M6 6l12 12\" />\n  </svg>\n);\n\nexport interface DialogContentProps extends React.ComponentProps<\"div\"> {\n  showCloseButton?: boolean;\n  /** Where focus lands on open. Default `first` — a dialog is usually a short form. */\n  initialFocus?: InitialFocus;\n}\n\nexport function DialogContent({\n  className,\n  children,\n  showCloseButton = true,\n  initialFocus = \"first\",\n  ...props\n}: DialogContentProps) {\n  const { open, setOpen, triggerRef } = useDialog();\n  const { isPresent, ref: presRef } = usePresence(open);\n  const focusRef = useFocusScope(open, { initialFocus, returnFocusTo: triggerRef });\n  const dismissRef = useDismissableLayer({\n    enabled: open,\n    onDismiss: () => setOpen(false),\n    exclude: [triggerRef],\n    modal: true,\n  });\n  React.useEffect(() => {\n    if (!open) return;\n    const prev = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = prev;\n    };\n  }, [open]);\n  if (!isPresent) return null;\n  return (\n    <Portal>\n      <DialogOverlay />\n      <div\n        data-slot=\"dialog-content\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        data-state={open ? \"open\" : \"closed\"}\n        ref={mergeRefs(focusRef, dismissRef, presRef as React.Ref<HTMLDivElement>)}\n        className={cn(DIALOG_CONTENT, className)}\n        {...(props as Record<string, unknown>)}\n      >\n        <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n        {showCloseButton && (\n          <button\n            type=\"button\"\n            data-slot=\"dialog-close\"\n            onClick={() => setOpen(false)}\n            className={DIALOG_CLOSE}\n          >\n            <XIcon />\n            <span className=\"sr-only\">Close</span>\n          </button>\n        )}\n      </div>\n    </Portal>\n  );\n}\n\nexport interface DialogCloseProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n}\n\nexport function DialogClose({ asChild = false, onClick, ...props }: DialogCloseProps) {\n  const { setOpen } = useDialog();\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"dialog-close\"\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(false);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport function DialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dialog-header\"\n      className={cn(DIALOG_HEADER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dialog-footer\"\n      className={cn(DIALOG_FOOTER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DialogTitle({ className, ...props }: React.ComponentProps<\"h2\">) {\n  return (\n    <h2\n      data-slot=\"dialog-title\"\n      className={cn(DIALOG_TITLE, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DialogDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"dialog-description\"\n      className={cn(DIALOG_DESCRIPTION, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { DismissableLayerScope, useDismissableLayer } from \"../primitives/dismissable-layer\";\nimport { type InitialFocus, useFocusScope } from \"../primitives/focus-scope\";\nimport { usePresence } from \"../primitives/presence\";\nimport { mergeRefs } from \"../primitives/merge-refs\";\nimport { Portal } from \"../primitives/portal\";\nimport { Slot } from \"../primitives/slot\";\nimport {\n  DIALOG_CLOSE,\n  DIALOG_CONTENT,\n  DIALOG_DESCRIPTION,\n  DIALOG_FOOTER,\n  DIALOG_HEADER,\n  DIALOG_OVERLAY,\n  DIALOG_TITLE,\n} from \"../generated/dialog\";\n\ninterface DialogContextValue {\n  open: boolean;\n  setOpen: (next: boolean) => void;\n  triggerRef: React.RefObject<HTMLElement | null>;\n  /** Ids of the mounted DialogTitle / DialogDescription; unset while none is. */\n  titleId: string | undefined;\n  descriptionId: string | undefined;\n  setTitleId: React.Dispatch<React.SetStateAction<string | undefined>>;\n  setDescriptionId: React.Dispatch<React.SetStateAction<string | undefined>>;\n}\n\nconst DialogContext = React.createContext<DialogContextValue | null>(null);\n\nfunction useDialog(): DialogContextValue {\n  const ctx = React.useContext(DialogContext);\n  if (!ctx) throw new Error(\"Dialog parts must be used within <Dialog>\");\n  return ctx;\n}\n\nexport interface DialogProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nexport function Dialog({ open, defaultOpen = false, onOpenChange, children }: DialogProps) {\n  const [isOpen, setOpen] = useControllableState<boolean>({\n    ...(open !== undefined ? { value: open } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const triggerRef = React.useRef<HTMLElement | null>(null);\n  const [titleId, setTitleId] = React.useState<string | undefined>(undefined);\n  const [descriptionId, setDescriptionId] = React.useState<string | undefined>(undefined);\n  return (\n    <DialogContext.Provider\n      value={{ open: isOpen, setOpen, triggerRef, titleId, descriptionId, setTitleId, setDescriptionId }}\n    >\n      {children}\n    </DialogContext.Provider>\n  );\n}\n\nexport interface DialogTriggerProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n}\n\nexport function DialogTrigger({ asChild = false, onClick, ...props }: DialogTriggerProps) {\n  const { open, setOpen, triggerRef } = useDialog();\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"dialog-trigger\"\n      aria-expanded={open}\n      ref={triggerRef as React.Ref<HTMLButtonElement>}\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(true);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport type DialogPortalProps = { children?: React.ReactNode };\n\nexport function DialogPortal({ children }: DialogPortalProps) {\n  return <>{children}</>;\n}\n\nexport interface DialogOverlayProps extends React.ComponentProps<\"div\"> {}\n\nexport function DialogOverlay({ className, ...props }: DialogOverlayProps) {\n  const { open } = useDialog();\n  // No onClick: the content's dismissable layer already closes on the\n  // pointer-down that lands here, and a second path called onOpenChange(false)\n  // twice for one press whenever the overlay was still hit by the click\n  // (a host that closes later, CSS without the closed-state pointer-events).\n  return (\n    <div\n      data-slot=\"dialog-overlay\"\n      data-state={open ? \"open\" : \"closed\"}\n      className={cn(DIALOG_OVERLAY, className)}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nconst XIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"24\"\n    height=\"24\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    {...props}\n  >\n    <path d=\"M18 6 6 18M6 6l12 12\" />\n  </svg>\n);\n\nexport interface DialogContentProps extends React.ComponentProps<\"div\"> {\n  showCloseButton?: boolean;\n  /** Where focus lands on open. Default `first` — a dialog is usually a short form. */\n  initialFocus?: InitialFocus;\n}\n\nexport function DialogContent({\n  className,\n  children,\n  showCloseButton = true,\n  initialFocus = \"first\",\n  ...props\n}: DialogContentProps) {\n  const { open, setOpen, triggerRef, titleId, descriptionId } = useDialog();\n  const { isPresent, ref: presRef } = usePresence(open);\n  const focusRef = useFocusScope(open, { initialFocus, returnFocusTo: triggerRef });\n  const dismissRef = useDismissableLayer({\n    enabled: open,\n    onDismiss: () => setOpen(false),\n    exclude: [triggerRef],\n    modal: true,\n  });\n  React.useEffect(() => {\n    if (!open) return;\n    const prev = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = prev;\n    };\n  }, [open]);\n  if (!isPresent) return null;\n  return (\n    <Portal>\n      <DialogOverlay />\n      <div\n        data-slot=\"dialog-content\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-labelledby={titleId}\n        aria-describedby={descriptionId}\n        data-state={open ? \"open\" : \"closed\"}\n        ref={mergeRefs(focusRef, dismissRef, presRef as React.Ref<HTMLDivElement>)}\n        className={cn(DIALOG_CONTENT, className)}\n        {...(props as Record<string, unknown>)}\n      >\n        <DismissableLayerScope layer={dismissRef}>{children}</DismissableLayerScope>\n        {showCloseButton && (\n          <button\n            type=\"button\"\n            data-slot=\"dialog-close\"\n            onClick={() => setOpen(false)}\n            className={DIALOG_CLOSE}\n          >\n            <XIcon />\n            <span className=\"sr-only\">Close</span>\n          </button>\n        )}\n      </div>\n    </Portal>\n  );\n}\n\nexport interface DialogCloseProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n}\n\nexport function DialogClose({ asChild = false, onClick, ...props }: DialogCloseProps) {\n  const { setOpen } = useDialog();\n  const Comp = asChild ? Slot : \"button\";\n  return (\n    <Comp\n      data-slot=\"dialog-close\"\n      onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n        onClick?.(e);\n        setOpen(false);\n      }}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport function DialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dialog-header\"\n      className={cn(DIALOG_HEADER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dialog-footer\"\n      className={cn(DIALOG_FOOTER, className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Announces `id` as the dialog's title or description while the part is\n * mounted. A layout effect, so the reference is in place before the first\n * paint of an opening dialog and gone with the part — DialogContent never\n * points at an id that is not in the document. Outside a Dialog there is\n * nothing to register with: the part renders as before rather than throwing,\n * since it never needed the context until now.\n */\nfunction useRegisteredId(\n  own: string | undefined,\n  register: React.Dispatch<React.SetStateAction<string | undefined>> | undefined,\n): string {\n  const generated = React.useId();\n  const id = own ?? generated;\n  React.useLayoutEffect(() => {\n    if (!register) return;\n    register(id);\n    // Clear only our own id: a title mounted after this one has already taken the slot.\n    return () => register((current) => (current === id ? undefined : current));\n  }, [id, register]);\n  return id;\n}\n\nexport function DialogTitle({ className, id, ...props }: React.ComponentProps<\"h2\">) {\n  const titleId = useRegisteredId(id, React.useContext(DialogContext)?.setTitleId);\n  return (\n    <h2\n      id={titleId}\n      data-slot=\"dialog-title\"\n      className={cn(DIALOG_TITLE, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DialogDescription({ className, id, ...props }: React.ComponentProps<\"p\">) {\n  const descriptionId = useRegisteredId(id, React.useContext(DialogContext)?.setDescriptionId);\n  return (\n    <p\n      id={descriptionId}\n      data-slot=\"dialog-description\"\n      className={cn(DIALOG_DESCRIPTION, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/field.js

@@ -4,13 +4,8 @@ import * as React from "react";
 import { cn } from "../lib/cn.js";
 import { Label } from "./label.js";
 import { walkElements } from "../primitives/walk-elements.js";
-import { Checkbox } from "./checkbox.js";
+import { isLabelable, markLabelable } from "../primitives/labelable.js";
 import { FieldControlContext, useFieldClaims } from "./field-context.js";
-import { Input } from "./input.js";
-import { NativeSelect } from "./native-select.js";
-import { SelectTrigger } from "./select.js";
-import { Switch } from "./switch.js";
-import { Textarea } from "./textarea.js";
 import {
   FIELD_BASE,
   FIELD_SET,
@@ -82,6 +77,7 @@ function Field({
     }
   ) });
 }
+markLabelable(Field);
 function FieldContent({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     "div",
@@ -107,14 +103,13 @@ function FieldLabel({ className, htmlFor, children, ...props }) {
   );
 }
 const LABELABLE_TAGS = /* @__PURE__ */ new Set(["input", "select", "textarea", "button"]);
-const LABELABLE_KIT = /* @__PURE__ */ new Set([Input, Textarea, NativeSelect, Checkbox, Switch, SelectTrigger, Field]);
 function wrapsControl(children) {
   let found = false;
   walkElements(children, (element) => {
     if (found) return false;
     const { type } = element;
     const props = element.props;
-    if (typeof type === "string" ? LABELABLE_TAGS.has(type) && props.type !== "hidden" : LABELABLE_KIT.has(type)) {
+    if (typeof type === "string" ? LABELABLE_TAGS.has(type) && props.type !== "hidden" : isLabelable(type)) {
       found = true;
     }
     return !found;