@adea-ai/ui 0.82.1 → 0.83.0

package/dist/components/layout/virtual-window/virtual-window.d.ts

@@ -0,0 +1,22 @@
+import type { ComponentProps, JSX } from 'solid-js';
+/**
+ * VirtualWindow.
+ *
+ * Supplies the two geometry wrappers a virtualized viewport needs: a full-height
+ * scroll space and a translated window containing the mounted rows. The caller
+ * owns the scroll region, its semantics, keyboard model, and range calculation;
+ * this component only keeps those rows at their measured position.
+ */
+export type VirtualWindowProps = Omit<ComponentProps<'div'>, 'children' | 'style'> & {
+    /** JSX style props are owned by this geometry primitive. */
+    style?: never;
+    /** The full scrollable height, in pixels. */
+    totalSize: number;
+    /** The mounted window's top offset from the start of the full list, in pixels. */
+    offset?: number;
+    /** Optional layout classes for the translated row container. */
+    contentClass?: string;
+    children?: JSX.Element;
+};
+export declare function VirtualWindow(props: VirtualWindowProps): JSX.Element;
+//# sourceMappingURL=virtual-window.d.ts.map

package/dist/components/layout/virtual-window/virtual-window.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"virtual-window.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/virtual-window/virtual-window.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAInD;;;;;;;GAOG;AACH,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACnF,4DAA4D;IAC5D,KAAK,CAAC,EAAE,KAAK,CAAA;IACb,6CAA6C;IAC7C,SAAS,EAAE,MAAM,CAAA;IACjB,kFAAkF;IAClF,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gEAAgE;IAChE,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;CACvB,CAAA;AAMD,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,eA0BtD"}

package/dist/components/layout/virtual-window/virtual-window.js

@@ -0,0 +1,45 @@
+import { cn } from "../../../lib/utils.js";
+import { className, effect, insert, mergeProps, setStyleProperty, spread, template } from "solid-js/web";
+import { splitProps } from "solid-js";
+//#region src/components/layout/virtual-window/virtual-window.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div><div data-slot=virtual-window-content>`);
+function finitePixels(value) {
+	return `${Number.isFinite(value) ? value : 0}px`;
+}
+function VirtualWindow(props) {
+	const [local, rest] = splitProps(props, [
+		"class",
+		"children",
+		"totalSize",
+		"offset",
+		"contentClass",
+		"style"
+	]);
+	return (() => {
+		var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+		spread(_el$, mergeProps(rest, {
+			"data-slot": "virtual-window-space",
+			get ["class"]() {
+				return cn("relative", local.class);
+			},
+			get style() {
+				return { height: finitePixels(Math.max(0, local.totalSize)) };
+			}
+		}), false, true);
+		insert(_el$2, () => local.children);
+		effect((_p$) => {
+			var _v$ = local.contentClass, _v$2 = `translateY(${finitePixels(local.offset ?? 0)})`;
+			_v$ !== _p$.e && className(_el$2, _p$.e = _v$);
+			_v$2 !== _p$.t && setStyleProperty(_el$2, "transform", _p$.t = _v$2);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0
+		});
+		return _el$;
+	})();
+}
+//#endregion
+export { VirtualWindow };
+
+//# sourceMappingURL=virtual-window.js.map

package/dist/components/layout/virtual-window/virtual-window.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"virtual-window.js","names":["ComponentProps","JSX","splitProps","cn","VirtualWindowProps","Omit","style","totalSize","offset","contentClass","children","Element","finitePixels","value","Number","isFinite","VirtualWindow","props","local","rest","_el$","_tmpl$","_el$2","firstChild","_$spread","_$mergeProps","class","height","Math","max","_$insert","_$effect","_p$","_v$","_v$2","e","_$className","t","_$setStyleProperty","undefined","_$mergeProps","_$className","_$setStyleProperty"],"sources":["../../../../src/components/layout/virtual-window/virtual-window.tsx"],"sourcesContent":["import type { ComponentProps, JSX } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport { cn } from '#lib/utils'\n\n/**\n * VirtualWindow.\n *\n * Supplies the two geometry wrappers a virtualized viewport needs: a full-height\n * scroll space and a translated window containing the mounted rows. The caller\n * owns the scroll region, its semantics, keyboard model, and range calculation;\n * this component only keeps those rows at their measured position.\n */\nexport type VirtualWindowProps = Omit<ComponentProps<'div'>, 'children' | 'style'> & {\n  /** JSX style props are owned by this geometry primitive. */\n  style?: never\n  /** The full scrollable height, in pixels. */\n  totalSize: number\n  /** The mounted window's top offset from the start of the full list, in pixels. */\n  offset?: number\n  /** Optional layout classes for the translated row container. */\n  contentClass?: string\n  children?: JSX.Element\n}\n\nfunction finitePixels(value: number): string {\n  return `${Number.isFinite(value) ? value : 0}px`\n}\n\nexport function VirtualWindow(props: VirtualWindowProps) {\n  const [local, rest] = splitProps(props, [\n    'class',\n    'children',\n    'totalSize',\n    'offset',\n    'contentClass',\n    'style',\n  ])\n\n  return (\n    <div\n      {...rest}\n      data-slot=\"virtual-window-space\"\n      class={cn('relative', local.class)}\n      style={{ height: finitePixels(Math.max(0, local.totalSize)) }}\n    >\n      <div\n        data-slot=\"virtual-window-content\"\n        class={local.contentClass}\n        style={{ transform: `translateY(${finitePixels(local.offset ?? 0)})` }}\n      >\n        {local.children}\n      </div>\n    </div>\n  )\n}\n"],"mappings":";;;;;AAwBA,SAASY,aAAaC,OAAuB;CAC3C,OAAO,GAAGC,OAAOC,SAASF,KAAK,IAAIA,QAAQ,EAAC;AAC9C;AAEA,SAAgBG,cAAcC,OAA2B;CACvD,MAAM,CAACC,OAAOC,QAAQjB,WAAWe,OAAO;EACtC;EACA;EACA;EACA;EACA;EACA;CAAO,CACR;CAED,cAAA;EAAA,IAAAG,OAAAC,OAAA,GAAAC,QAAAF,KAAAG;EAAAC,OAAAJ,MAAAK,WAEQN,MAAI;GAAA,aACE;GAAsB,KAAA,WAAA;IAAA,OACzBhB,GAAG,YAAYe,MAAMQ,KAAK;GAAC;GAAA,IAClCpB,QAAK;IAAA,OAAE,EAAEqB,QAAQf,aAAagB,KAAKC,IAAI,GAAGX,MAAMX,SAAS,CAAC,EAAE;GAAC;EAAA,CAAA,GAAA,OAAA,IAAA;EAAAuB,OAAAR,aAO1DJ,MAAMR,QAAQ;EAAAqB,QAAAC,QAAA;GAAA,IAAAC,MAHRf,MAAMT,cAAYyB,OACL,cAActB,aAAaM,MAAMV,UAAU,CAAC,EAAC;GAAGyB,QAAAD,IAAAG,KAAAC,UAAAd,OAAAU,IAAAG,IAAAF,GAAA;GAAAC,SAAAF,IAAAK,KAAAC,iBAAAhB,OAAA,aAAAU,IAAAK,IAAAH,IAAA;GAAA,OAAAF;EAAA,GAAA;GAAAG,GAAAI,KAAAA;GAAAF,GAAAE,KAAAA;EAAA,CAAA;EAAA,OAAAnB;CAAA,EAAA,CAAA;AAM5E"}

package/dist/components/ui/command/command.d.ts

@@ -1,4 +1,5 @@
 import { CommandDialog as CmdkDialog, CommandEmpty as CmdkEmpty, CommandGroup as CmdkGroup, CommandInput as CmdkInput, CommandItem as CmdkItem, CommandList as CmdkList, CommandLoading as CmdkLoading, CommandRoot as CmdkRoot, CommandSeparator as CmdkSeparator } from 'cmdk-solid';
+import { Dialog as KobalteDialog } from '@kobalte/core/dialog';
 import type { ComponentProps } from 'solid-js';
 /**
  * Command.
@@ -17,7 +18,8 @@ import type { ComponentProps } from 'solid-js';
  * wiring and the arrow-key navigation.
  */
 export declare function Command(props: ComponentProps<typeof CmdkRoot>): import("solid-js").JSX.Element;
-export declare function CommandDialog(props: ComponentProps<typeof CmdkDialog>): import("solid-js").JSX.Element;
+type CommandDialogProps = ComponentProps<typeof CmdkDialog> & Pick<ComponentProps<typeof KobalteDialog.Content>, 'onCloseAutoFocus' | 'onOpenAutoFocus'>;
+export declare function CommandDialog(props: CommandDialogProps): import("solid-js").JSX.Element;
 export declare function CommandInput(props: ComponentProps<typeof CmdkInput>): import("solid-js").JSX.Element;
 /**
  * The scrolling list.
@@ -45,13 +47,10 @@ export declare function CommandGroup(props: ComponentProps<typeof CmdkGroup>): i
 export declare function CommandItem(props: ComponentProps<typeof CmdkItem>): import("solid-js").JSX.Element;
 export declare function CommandSeparator(props: ComponentProps<typeof CmdkSeparator>): import("solid-js").JSX.Element;
 export declare function CommandLoading(props: ComponentProps<typeof CmdkLoading>): import("solid-js").JSX.Element;
-/**
- * The keyboard hint a palette item usually carries.
- * Muted canvas text can fail contrast on a raised or selected command row;
- * hierarchy comes from its size and monospace face, with the row's readable ink.
- */
+/** The keyboard hint a palette item usually carries. */
 export declare function CommandShortcut(props: {
     class?: string;
     children?: ComponentProps<'span'>['children'];
 }): import("solid-js").JSX.Element;
+export {};
 //# sourceMappingURL=command.d.ts.map

package/dist/components/ui/command/command.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"command.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/command/command.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,IAAI,UAAU,EAC3B,YAAY,IAAI,SAAS,EACzB,YAAY,IAAI,SAAS,EACzB,YAAY,IAAI,SAAS,EACzB,WAAW,IAAI,QAAQ,EACvB,WAAW,IAAI,QAAQ,EACvB,cAAc,IAAI,WAAW,EAC7B,WAAW,IAAI,QAAQ,EACvB,gBAAgB,IAAI,aAAa,EAElC,MAAM,YAAY,CAAA;AAEnB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAW9C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,kCAY7D;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,UAAU,CAAC,kCAqBrE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,SAAS,CAAC,kCAmBnE;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,kCAgCjE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,SAAS,CAAC,kCAcnE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,SAAS,CAAC,kCAanE;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,kCAcjE;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,kCAG3E;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,kCAQvE;AAED;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,UAAU,CAAC,CAAA;CAC9C,kCAQA"}
+{"version":3,"file":"command.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/command/command.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,IAAI,UAAU,EAC3B,YAAY,IAAI,SAAS,EACzB,YAAY,IAAI,SAAS,EACzB,YAAY,IAAI,SAAS,EACzB,WAAW,IAAI,QAAQ,EACvB,WAAW,IAAI,QAAQ,EACvB,cAAc,IAAI,WAAW,EAC7B,WAAW,IAAI,QAAQ,EACvB,gBAAgB,IAAI,aAAa,EAElC,MAAM,YAAY,CAAA;AACnB,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,sBAAsB,CAAA;AAE9D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAa9C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,kCAY7D;AAED,KAAK,kBAAkB,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,GACzD,IAAI,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,EAAE,kBAAkB,GAAG,iBAAiB,CAAC,CAAA;AAE5F,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,kCAoEtD;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,SAAS,CAAC,kCAmBnE;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,kCAgCjE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,SAAS,CAAC,kCAcnE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,SAAS,CAAC,kCAanE;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,kCAcjE;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,kCAG3E;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,kCAQvE;AAED,wDAAwD;AACxD,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,UAAU,CAAC,CAAA;CAC9C,kCAWA"}

package/dist/components/ui/command/command.js

@@ -1,14 +1,16 @@
 import { cn } from "../../../lib/utils.js";
 import { menuItem } from "../../../lib/overlay.js";
+import { createDialogFocusRestoration } from "../dialog/dialog.js";
 import { className, createComponent, effect, insert, mergeProps, template, use } from "solid-js/web";
 import { Search } from "lucide-solid";
 import { createEffect, createSignal, splitProps } from "solid-js";
-import { CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, CommandRoot, CommandSeparator, useCommandState } from "cmdk-solid";
+import { CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, CommandRoot, CommandSeparator, useCommandState } from "cmdk-solid";
+import { Dialog } from "@kobalte/core/dialog";
 //#region src/components/ui/command/command.tsx
 var _tmpl$ = /*#__PURE__*/ template(`<div data-slot=command-input-wrapper class="flex h-11 items-center gap-2 border-b border-border px-3">`);
 var _tmpl$2 = /*#__PURE__*/ template(`<div class=contents>`);
 var _tmpl$3 = /*#__PURE__*/ template(`<span>`);
-var commandItem = menuItem.replace("data-[disabled]:pointer-events-none", "").replace("data-[disabled]:opacity-50", "");
+var commandItem = menuItem.replace("data-[disabled]:pointer-events-none", "").replace("data-[disabled]:text-muted-foreground", "");
 /**
 * Command.
 *
@@ -31,11 +33,71 @@ function Command(props) {
 		return cn("bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-xl", local.class);
 	} }, rest));
 }
-function CommandDialog$1(props) {
-	const [local, rest] = splitProps(props, ["class"]);
-	return createComponent(CommandDialog, mergeProps({ get contentClassName() {
-		return cn("bg-popover text-popover-foreground fixed top-1/3 left-1/2 z-(--z-dialog) w-full max-w-lg -translate-x-1/2 -translate-y-1/2", "overflow-hidden rounded-xl border border-border shadow-xl", "data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95", "data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", local.class);
-	} }, rest));
+function CommandDialog(props) {
+	const [local, dialogProps, commandProps] = splitProps(props, [
+		"class",
+		"contentClassName",
+		"overlayClassName",
+		"container",
+		"onCloseAutoFocus",
+		"onOpenAutoFocus"
+	], [
+		"open",
+		"defaultOpen",
+		"onOpenChange",
+		"id",
+		"modal",
+		"preventScroll",
+		"forceMount",
+		"translations"
+	]);
+	const [isOpen, setIsOpen] = createSignal(dialogProps.open ?? dialogProps.defaultOpen ?? false);
+	createEffect(() => {
+		if (dialogProps.open !== void 0) setIsOpen(dialogProps.open);
+	});
+	const focus = createDialogFocusRestoration({
+		open: isOpen,
+		onCloseAutoFocus: local.onCloseAutoFocus,
+		onOpenAutoFocus: local.onOpenAutoFocus
+	});
+	return createComponent(Dialog, mergeProps(dialogProps, {
+		onOpenChange: (open) => {
+			setIsOpen(open);
+			dialogProps.onOpenChange?.(open);
+		},
+		get children() {
+			return createComponent(Dialog.Portal, {
+				get mount() {
+					return local.container;
+				},
+				get children() {
+					return [createComponent(Dialog.Overlay, {
+						"cmdk-overlay": "",
+						get ["class"]() {
+							return local.overlayClassName;
+						}
+					}), createComponent(Dialog.Content, {
+						get ["aria-label"]() {
+							return commandProps.label;
+						},
+						"cmdk-dialog": "",
+						get ["class"]() {
+							return cn("bg-popover text-popover-foreground fixed top-1/3 left-1/2 z-(--z-dialog) w-full max-w-lg -translate-x-1/2 -translate-y-1/2", "overflow-hidden rounded-xl border border-border shadow-xl", "data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95", "data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", local.class, local.contentClassName);
+						},
+						get onOpenAutoFocus() {
+							return focus.onOpenAutoFocus;
+						},
+						get onCloseAutoFocus() {
+							return focus.onCloseAutoFocus;
+						},
+						get children() {
+							return createComponent(Command, commandProps);
+						}
+					})];
+				}
+			});
+		}
+	}));
 }
 function CommandInput$1(props) {
 	const [local, rest] = splitProps(props, ["class"]);
@@ -108,7 +170,7 @@ function CommandGroup$1(props) {
 function CommandItem$1(props) {
 	const [local, rest] = splitProps(props, ["class"]);
 	return createComponent(CommandItem, mergeProps({ get ["class"]() {
-		return cn(commandItem, "data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50", "text-popover-foreground data-[selected=true]:bg-surface-hover data-[selected=true]:text-popover-foreground", local.class);
+		return cn(commandItem, "data-[disabled=true]:pointer-events-none data-[disabled=true]:text-muted-foreground", "group/command-item text-popover-foreground data-[selected=true]:bg-card data-[selected=true]:text-popover-foreground", local.class);
 	} }, rest));
 }
 function CommandSeparator$1(props) {
@@ -123,20 +185,16 @@ function CommandLoading$1(props) {
 		return cn("text-muted-foreground py-6 text-center text-sm", local.class);
 	} }, rest));
 }
-/**
-* The keyboard hint a palette item usually carries.
-* Muted canvas text can fail contrast on a raised or selected command row;
-* hierarchy comes from its size and monospace face, with the row's readable ink.
-*/
+/** The keyboard hint a palette item usually carries. */
 function CommandShortcut(props) {
 	return (() => {
 		var _el$3 = _tmpl$3();
 		insert(_el$3, () => props.children);
-		effect(() => className(_el$3, cn("text-popover-foreground ms-auto font-mono text-2xs tracking-widest", props.class)));
+		effect(() => className(_el$3, cn("text-muted-foreground ms-auto font-mono text-2xs tracking-widest group-data-[selected=true]/command-item:text-foreground", props.class)));
 		return _el$3;
 	})();
 }
 //#endregion
-export { Command, CommandDialog$1 as CommandDialog, CommandEmpty$1 as CommandEmpty, CommandGroup$1 as CommandGroup, CommandInput$1 as CommandInput, CommandItem$1 as CommandItem, CommandList$1 as CommandList, CommandLoading$1 as CommandLoading, CommandSeparator$1 as CommandSeparator, CommandShortcut };
+export { Command, CommandDialog, CommandEmpty$1 as CommandEmpty, CommandGroup$1 as CommandGroup, CommandInput$1 as CommandInput, CommandItem$1 as CommandItem, CommandList$1 as CommandList, CommandLoading$1 as CommandLoading, CommandSeparator$1 as CommandSeparator, CommandShortcut };
 
 //# sourceMappingURL=command.js.map

package/dist/components/ui/command/command.js.map

@@ -1 +1 @@
-{"version":3,"file":"command.js","names":["CommandDialog","CmdkDialog","CommandEmpty","CmdkEmpty","CommandGroup","CmdkGroup","CommandInput","CmdkInput","CommandItem","CmdkItem","CommandList","CmdkList","CommandLoading","CmdkLoading","CommandRoot","CmdkRoot","CommandSeparator","CmdkSeparator","useCommandState","Search","ComponentProps","createEffect","createSignal","splitProps","menuItem","cn","commandItem","replace","Command","props","local","rest","_$createComponent","_$mergeProps","class","contentClassName","_el$","_tmpl$","_$insert","wrapper","setWrapper","HTMLDivElement","resultCount","state","filtered","count","root","selector","querySelector","setAttribute","_el$2","_tmpl$2","_$use","role","CommandShortcut","children","_el$3","_tmpl$3","_$effect","_$className","_$createComponent","CmdkRoot","_$mergeProps","CommandDialog","CmdkDialog","CommandInput","CmdkInput","CommandList","CmdkList","CommandEmpty","CmdkEmpty","CommandGroup","CmdkGroup","CommandItem","CmdkItem","CommandSeparator","CmdkSeparator","CommandLoading","CmdkLoading","_$className"],"sources":["../../../../src/components/ui/command/command.tsx"],"sourcesContent":["import {\n  CommandDialog as CmdkDialog,\n  CommandEmpty as CmdkEmpty,\n  CommandGroup as CmdkGroup,\n  CommandInput as CmdkInput,\n  CommandItem as CmdkItem,\n  CommandList as CmdkList,\n  CommandLoading as CmdkLoading,\n  CommandRoot as CmdkRoot,\n  CommandSeparator as CmdkSeparator,\n  useCommandState,\n} from 'cmdk-solid'\nimport { Search } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { createEffect, createSignal, splitProps } from 'solid-js'\nimport { menuItem } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n// cmdk emits data-disabled=\"false\" on enabled items; Kobalte omits it.\n// Presence selectors would dim and disable every command in an app palette.\nconst commandItem = menuItem\n  .replace('data-[disabled]:pointer-events-none', '')\n  .replace('data-[disabled]:opacity-50', '')\n\n/**\n * Command.\n *\n * The command palette: a filtered list of everything the user can do, ranked\n * by fuzzy match. It is the one place in an app where a keyboard-first surface\n * is the *primary* one, so it carries rules the rest of the system does not:\n *\n *   - Every item must be reachable by typing its name. If a user has to\n *     remember which group it lives in, the palette has failed at its job.\n *   - Groups exist for reading, not for navigation. The ranking crosses them.\n *   - The empty state is not an apology — it should offer the closest thing\n *     the app could guess, or say plainly that nothing matched.\n *\n * cmdk-solid supplies the filter, the scoring, the `aria-activedescendant`\n * wiring and the arrow-key navigation.\n */\nexport function Command(props: ComponentProps<typeof CmdkRoot>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <CmdkRoot\n      class={cn(\n        'bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-xl',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function CommandDialog(props: ComponentProps<typeof CmdkDialog>) {\n  // cmdk's Dialog splits `contentClassName` onto the role=\"dialog\" content\n  // element and routes every other prop (including `class`) to the inner\n  // Command. The surface must live on the content: a `class` here styles the\n  // Command (fixed, so visible) while the dialog element itself renders as an\n  // unstyled zero-height wrapper at the end of body — invisible to role\n  // queries and axe.\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <CmdkDialog\n      contentClassName={cn(\n        'bg-popover text-popover-foreground fixed top-1/3 left-1/2 z-(--z-dialog) w-full max-w-lg -translate-x-1/2 -translate-y-1/2',\n        'overflow-hidden rounded-xl border border-border shadow-xl',\n        'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95',\n        'data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function CommandInput(props: ComponentProps<typeof CmdkInput>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <div\n      data-slot=\"command-input-wrapper\"\n      class=\"flex h-11 items-center gap-2 border-b border-border px-3\"\n    >\n      <Search class=\"size-4 shrink-0 text-muted-foreground\" aria-hidden=\"true\" />\n      <CmdkInput\n        class={cn(\n          'h-full w-full bg-transparent text-sm outline-none placeholder:text-muted-foreground',\n          'disabled:cursor-not-allowed disabled:opacity-50',\n          local.class\n        )}\n        {...rest}\n      />\n    </div>\n  )\n}\n\n/**\n * The scrolling list.\n *\n * Two DOM corrections, and both are deliberate. cmdk builds a `role=\"listbox\"`\n * whose children include two elements ARIA does not allow there:\n *\n *   - a bare `<div cmdk-list-sizer>` with no role, wrapped around every group;\n *   - a `<div cmdk-separator role=\"separator\">`, and `separator` is a menu and\n *     toolbar role — inside a listbox the only owned elements may be `option`\n *     and `group`.\n *\n * Both are pure presentation: the sizer is layout, and the separator is a\n * hairline between groups that the groups already structure. `role=\"presentation\"`\n * is their accurate role rather than a workaround — each is flattened out of the\n * accessibility tree, and the options inside are reached exactly as before.\n *\n * Written onto the mounted nodes rather than through props, because cmdk owns\n * this markup and does not forward a `ref`; in an effect rather than `onMount`,\n * because cmdk renders the sizer with the first item, after the list itself.\n */\nexport function CommandList(props: ComponentProps<typeof CmdkList>) {\n  const [local, rest] = splitProps(props, ['class'])\n  const [wrapper, setWrapper] = createSignal<HTMLDivElement>()\n  const resultCount = useCommandState((state) => state.filtered.count)\n\n  createEffect(() => {\n    const root = wrapper()\n    if (!root) return\n    for (const selector of ['[cmdk-list-sizer]', '[cmdk-separator]']) {\n      root.querySelector(selector)?.setAttribute('role', 'presentation')\n    }\n\n    /*\n     * A `listbox` must own at least one `option`, so a listbox with nothing in it\n     * is invalid ARIA — which is what a search with no matches produces. When\n     * there are no results the list is inert, so it becomes presentational and\n     * the empty message carries the information instead. It keeps its `id`, so\n     * the input's `aria-controls` still resolves.\n     */\n    root\n      .querySelector('[cmdk-list]')\n      ?.setAttribute('role', resultCount() > 0 ? 'listbox' : 'presentation')\n  })\n\n  return (\n    <div ref={setWrapper} class=\"contents\">\n      <CmdkList\n        class={cn('max-h-80 scroll-py-1 overflow-y-auto overflow-x-hidden p-1', local.class)}\n        {...rest}\n      />\n    </div>\n  )\n}\n\nexport function CommandEmpty(props: ComponentProps<typeof CmdkEmpty>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <CmdkEmpty\n      /*\n       * A status rather than plain text: when the list is presentational, this is\n       * the only thing that tells a screen reader the search matched nothing.\n       */\n      role=\"status\"\n      class={cn('text-muted-foreground py-8 text-center text-sm', local.class)}\n      {...rest}\n    />\n  )\n}\n\nexport function CommandGroup(props: ComponentProps<typeof CmdkGroup>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <CmdkGroup\n      class={cn(\n        'text-foreground overflow-hidden p-1',\n        '[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-2xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:tracking-wide [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group-heading]]:uppercase',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function CommandItem(props: ComponentProps<typeof CmdkItem>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <CmdkItem\n      class={cn(\n        commandItem,\n        'data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',\n        'text-popover-foreground data-[selected=true]:bg-surface-hover data-[selected=true]:text-popover-foreground',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function CommandSeparator(props: ComponentProps<typeof CmdkSeparator>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <CmdkSeparator class={cn('bg-border -mx-1 my-1 h-px', local.class)} {...rest} />\n}\n\nexport function CommandLoading(props: ComponentProps<typeof CmdkLoading>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <CmdkLoading\n      class={cn('text-muted-foreground py-6 text-center text-sm', local.class)}\n      {...rest}\n    />\n  )\n}\n\n/**\n * The keyboard hint a palette item usually carries.\n * Muted canvas text can fail contrast on a raised or selected command row;\n * hierarchy comes from its size and monospace face, with the row's readable ink.\n */\nexport function CommandShortcut(props: {\n  class?: string\n  children?: ComponentProps<'span'>['children']\n}) {\n  return (\n    <span\n      class={cn('text-popover-foreground ms-auto font-mono text-2xs tracking-widest', props.class)}\n    >\n      {props.children}\n    </span>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"command.js","names":["CommandDialog","CmdkDialog","CommandEmpty","CmdkEmpty","CommandGroup","CmdkGroup","CommandInput","CmdkInput","CommandItem","CmdkItem","CommandList","CmdkList","CommandLoading","CmdkLoading","CommandRoot","CmdkRoot","CommandSeparator","CmdkSeparator","useCommandState","Dialog","KobalteDialog","Search","ComponentProps","createEffect","createSignal","splitProps","createDialogFocusRestoration","menuItem","cn","commandItem","replace","Command","props","local","rest","_$createComponent","_$mergeProps","class","CommandDialogProps","Pick","Content","dialogProps","commandProps","isOpen","setIsOpen","open","defaultOpen","undefined","focus","onCloseAutoFocus","onOpenAutoFocus","onOpenChange","children","Portal","mount","container","Overlay","overlayClassName","aria-label","label","contentClassName","_el$","_tmpl$","_$insert","wrapper","setWrapper","HTMLDivElement","resultCount","state","filtered","count","root","selector","querySelector","setAttribute","_el$2","_tmpl$2","_$use","role","CommandShortcut","_el$3","_tmpl$3","_$effect","_$className","_$createComponent","CmdkRoot","_$mergeProps","KobalteDialog","CommandInput","CmdkInput","CommandList","CmdkList","CommandEmpty","CmdkEmpty","CommandGroup","CmdkGroup","CommandItem","CmdkItem","CommandSeparator","CmdkSeparator","CommandLoading","CmdkLoading","_$className"],"sources":["../../../../src/components/ui/command/command.tsx"],"sourcesContent":["import {\n  CommandDialog as CmdkDialog,\n  CommandEmpty as CmdkEmpty,\n  CommandGroup as CmdkGroup,\n  CommandInput as CmdkInput,\n  CommandItem as CmdkItem,\n  CommandList as CmdkList,\n  CommandLoading as CmdkLoading,\n  CommandRoot as CmdkRoot,\n  CommandSeparator as CmdkSeparator,\n  useCommandState,\n} from 'cmdk-solid'\nimport { Dialog as KobalteDialog } from '@kobalte/core/dialog'\nimport { Search } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { createEffect, createSignal, splitProps } from 'solid-js'\nimport { createDialogFocusRestoration } from '../dialog/dialog'\nimport { menuItem } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n// cmdk emits data-disabled=\"false\" on enabled items, unlike the presence-only\n// attributes Kobalte menu rows use. Apply those shared disabled styles only when\n// cmdk's value is true.\nconst commandItem = menuItem\n  .replace('data-[disabled]:pointer-events-none', '')\n  .replace('data-[disabled]:text-muted-foreground', '')\n\n/**\n * Command.\n *\n * The command palette: a filtered list of everything the user can do, ranked\n * by fuzzy match. It is the one place in an app where a keyboard-first surface\n * is the *primary* one, so it carries rules the rest of the system does not:\n *\n *   - Every item must be reachable by typing its name. If a user has to\n *     remember which group it lives in, the palette has failed at its job.\n *   - Groups exist for reading, not for navigation. The ranking crosses them.\n *   - The empty state is not an apology — it should offer the closest thing\n *     the app could guess, or say plainly that nothing matched.\n *\n * cmdk-solid supplies the filter, the scoring, the `aria-activedescendant`\n * wiring and the arrow-key navigation.\n */\nexport function Command(props: ComponentProps<typeof CmdkRoot>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <CmdkRoot\n      class={cn(\n        'bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-xl',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\ntype CommandDialogProps = ComponentProps<typeof CmdkDialog> &\n  Pick<ComponentProps<typeof KobalteDialog.Content>, 'onCloseAutoFocus' | 'onOpenAutoFocus'>\n\nexport function CommandDialog(props: CommandDialogProps) {\n  // cmdk-solid's Dialog does not forward Content autofocus props: unknown\n  // props fall through to its Command root. Compose Kobalte's dialog surface\n  // here so Escape and other close paths can restore focus to the real opener.\n  // Preserve the shared wrapper's `class` contract on the dialog surface;\n  // `contentClassName` adds to it, while the nested Command keeps its own API.\n  const [local, dialogProps, commandProps] = splitProps(\n    props,\n    [\n      'class',\n      'contentClassName',\n      'overlayClassName',\n      'container',\n      'onCloseAutoFocus',\n      'onOpenAutoFocus',\n    ],\n    [\n      'open',\n      'defaultOpen',\n      'onOpenChange',\n      'id',\n      'modal',\n      'preventScroll',\n      'forceMount',\n      'translations',\n    ]\n  )\n  const [isOpen, setIsOpen] = createSignal(dialogProps.open ?? dialogProps.defaultOpen ?? false)\n\n  createEffect(() => {\n    if (dialogProps.open !== undefined) setIsOpen(dialogProps.open)\n  })\n\n  const focus = createDialogFocusRestoration({\n    open: isOpen,\n    onCloseAutoFocus: local.onCloseAutoFocus,\n    onOpenAutoFocus: local.onOpenAutoFocus,\n  })\n\n  return (\n    <KobalteDialog\n      {...dialogProps}\n      onOpenChange={(open) => {\n        setIsOpen(open)\n        dialogProps.onOpenChange?.(open)\n      }}\n    >\n      <KobalteDialog.Portal mount={local.container}>\n        <KobalteDialog.Overlay cmdk-overlay=\"\" class={local.overlayClassName} />\n        <KobalteDialog.Content\n          aria-label={commandProps.label}\n          cmdk-dialog=\"\"\n          class={cn(\n            'bg-popover text-popover-foreground fixed top-1/3 left-1/2 z-(--z-dialog) w-full max-w-lg -translate-x-1/2 -translate-y-1/2',\n            'overflow-hidden rounded-xl border border-border shadow-xl',\n            'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95',\n            'data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n            local.class,\n            local.contentClassName\n          )}\n          onOpenAutoFocus={focus.onOpenAutoFocus}\n          onCloseAutoFocus={focus.onCloseAutoFocus}\n        >\n          <Command {...commandProps} />\n        </KobalteDialog.Content>\n      </KobalteDialog.Portal>\n    </KobalteDialog>\n  )\n}\n\nexport function CommandInput(props: ComponentProps<typeof CmdkInput>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <div\n      data-slot=\"command-input-wrapper\"\n      class=\"flex h-11 items-center gap-2 border-b border-border px-3\"\n    >\n      <Search class=\"size-4 shrink-0 text-muted-foreground\" aria-hidden=\"true\" />\n      <CmdkInput\n        class={cn(\n          'h-full w-full bg-transparent text-sm outline-none placeholder:text-muted-foreground',\n          'disabled:cursor-not-allowed disabled:opacity-50',\n          local.class\n        )}\n        {...rest}\n      />\n    </div>\n  )\n}\n\n/**\n * The scrolling list.\n *\n * Two DOM corrections, and both are deliberate. cmdk builds a `role=\"listbox\"`\n * whose children include two elements ARIA does not allow there:\n *\n *   - a bare `<div cmdk-list-sizer>` with no role, wrapped around every group;\n *   - a `<div cmdk-separator role=\"separator\">`, and `separator` is a menu and\n *     toolbar role — inside a listbox the only owned elements may be `option`\n *     and `group`.\n *\n * Both are pure presentation: the sizer is layout, and the separator is a\n * hairline between groups that the groups already structure. `role=\"presentation\"`\n * is their accurate role rather than a workaround — each is flattened out of the\n * accessibility tree, and the options inside are reached exactly as before.\n *\n * Written onto the mounted nodes rather than through props, because cmdk owns\n * this markup and does not forward a `ref`; in an effect rather than `onMount`,\n * because cmdk renders the sizer with the first item, after the list itself.\n */\nexport function CommandList(props: ComponentProps<typeof CmdkList>) {\n  const [local, rest] = splitProps(props, ['class'])\n  const [wrapper, setWrapper] = createSignal<HTMLDivElement>()\n  const resultCount = useCommandState((state) => state.filtered.count)\n\n  createEffect(() => {\n    const root = wrapper()\n    if (!root) return\n    for (const selector of ['[cmdk-list-sizer]', '[cmdk-separator]']) {\n      root.querySelector(selector)?.setAttribute('role', 'presentation')\n    }\n\n    /*\n     * A `listbox` must own at least one `option`, so a listbox with nothing in it\n     * is invalid ARIA — which is what a search with no matches produces. When\n     * there are no results the list is inert, so it becomes presentational and\n     * the empty message carries the information instead. It keeps its `id`, so\n     * the input's `aria-controls` still resolves.\n     */\n    root\n      .querySelector('[cmdk-list]')\n      ?.setAttribute('role', resultCount() > 0 ? 'listbox' : 'presentation')\n  })\n\n  return (\n    <div ref={setWrapper} class=\"contents\">\n      <CmdkList\n        class={cn('max-h-80 scroll-py-1 overflow-y-auto overflow-x-hidden p-1', local.class)}\n        {...rest}\n      />\n    </div>\n  )\n}\n\nexport function CommandEmpty(props: ComponentProps<typeof CmdkEmpty>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <CmdkEmpty\n      /*\n       * A status rather than plain text: when the list is presentational, this is\n       * the only thing that tells a screen reader the search matched nothing.\n       */\n      role=\"status\"\n      class={cn('text-muted-foreground py-8 text-center text-sm', local.class)}\n      {...rest}\n    />\n  )\n}\n\nexport function CommandGroup(props: ComponentProps<typeof CmdkGroup>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <CmdkGroup\n      class={cn(\n        'text-foreground overflow-hidden p-1',\n        '[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-2xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:tracking-wide [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group-heading]]:uppercase',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function CommandItem(props: ComponentProps<typeof CmdkItem>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <CmdkItem\n      class={cn(\n        commandItem,\n        'data-[disabled=true]:pointer-events-none data-[disabled=true]:text-muted-foreground',\n        'group/command-item text-popover-foreground data-[selected=true]:bg-card data-[selected=true]:text-popover-foreground',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function CommandSeparator(props: ComponentProps<typeof CmdkSeparator>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <CmdkSeparator class={cn('bg-border -mx-1 my-1 h-px', local.class)} {...rest} />\n}\n\nexport function CommandLoading(props: ComponentProps<typeof CmdkLoading>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <CmdkLoading\n      class={cn('text-muted-foreground py-6 text-center text-sm', local.class)}\n      {...rest}\n    />\n  )\n}\n\n/** The keyboard hint a palette item usually carries. */\nexport function CommandShortcut(props: {\n  class?: string\n  children?: ComponentProps<'span'>['children']\n}) {\n  return (\n    <span\n      class={cn(\n        'text-muted-foreground ms-auto font-mono text-2xs tracking-widest group-data-[selected=true]/command-item:text-foreground',\n        props.class\n      )}\n    >\n      {props.children}\n    </span>\n  )\n}\n"],"mappings":"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"}

package/dist/components/ui/dropdown-menu/dropdown-menu.d.ts

@@ -11,6 +11,9 @@ import type { ComponentProps } from 'solid-js';
  * Kobalte supplies the full menu contract — arrow keys, typeahead, the roving
  * highlight, Escape to close and return focus — which is exactly what a
  * hand-rolled `div` with click handlers gets wrong.
+ * Menus are nonmodal by default so their generated focus guards do not become
+ * invalid direct children of the ARIA menu. Set `modal` explicitly when the
+ * surrounding interaction needs modal containment.
  *
  * The `destructive` variant marks the row with a status-coloured edge and
  * highlighted tint while keeping its label on the body foreground. Pairing it

package/dist/components/ui/dropdown-menu/dropdown-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dropdown-menu/dropdown-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,IAAI,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEjF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAc9C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,kCAE7E;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,OAAO,CAAC,kCAE5F;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,MAAM,CAAC,kCAE1F;AAED,MAAM,MAAM,wBAAwB,GAAG,cAAc,CAAC,OAAO,mBAAmB,CAAC,OAAO,CAAC,GAAG;IAC1F,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,gGAAgG;IAChG,WAAW,CAAC,EAAE,WAAW,CAAA;CAC1B,CAAA;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,kCAoBlE;AAED,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,GAAG;IACvD,qEAAqE;IACrE,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAA;IACnC,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,kCAuBF;AAED;;;;;;GAMG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,kCASjE;AAED,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,YAAY,CAAC,kCAY/D;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,UAAU,CAAC,kCAG7D;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,SAAS,CAAC,kCAWhG;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,UAAU,CAAC,kCAG7F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,KAAK,CAAC,kCAExF;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,SAAS,CAAC,kCAGhG;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,GAAG,CAAC,kCAEpF;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,UAAU,CAAC,kCAU7D;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,UAAU,CAAC,kCAkB7D"}
+{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dropdown-menu/dropdown-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,IAAI,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEjF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAc9C;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,kCAG7E;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,OAAO,CAAC,kCAE5F;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,MAAM,CAAC,kCAE1F;AAED,MAAM,MAAM,wBAAwB,GAAG,cAAc,CAAC,OAAO,mBAAmB,CAAC,OAAO,CAAC,GAAG;IAC1F,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,gGAAgG;IAChG,WAAW,CAAC,EAAE,WAAW,CAAA;CAC1B,CAAA;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,kCAoBlE;AAED,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,GAAG;IACvD,qEAAqE;IACrE,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAA;IACnC,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,kCAuBF;AAED;;;;;;GAMG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,kCASjE;AAED,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,YAAY,CAAC,kCAY/D;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,UAAU,CAAC,kCAG7D;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,SAAS,CAAC,kCAWhG;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,UAAU,CAAC,kCAG7F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,KAAK,CAAC,kCAExF;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,SAAS,CAAC,kCAGhG;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,GAAG,CAAC,kCAEpF;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,UAAU,CAAC,kCAU7D;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,UAAU,CAAC,kCAkB7D"}

package/dist/components/ui/dropdown-menu/dropdown-menu.js

@@ -18,13 +18,19 @@ var _tmpl$2 = /*#__PURE__*/ template(`<span data-slot=dropdown-menu-shortcut>`);
 * Kobalte supplies the full menu contract — arrow keys, typeahead, the roving
 * highlight, Escape to close and return focus — which is exactly what a
 * hand-rolled `div` with click handlers gets wrong.
+* Menus are nonmodal by default so their generated focus guards do not become
+* invalid direct children of the ARIA menu. Set `modal` explicitly when the
+* surrounding interaction needs modal containment.
 *
 * The `destructive` variant marks the row with a status-coloured edge and
 * highlighted tint while keeping its label on the body foreground. Pairing it
 * with an AlertDialog is the caller's job.
 */
 function DropdownMenu$1(props) {
-	return createComponent(DropdownMenu, props);
+	const [local, rest] = splitProps(props, ["modal"]);
+	return createComponent(DropdownMenu, mergeProps({ get modal() {
+		return local.modal ?? false;
+	} }, rest));
 }
 function DropdownMenuTrigger(props) {
 	return createComponent(DropdownMenu.Trigger, props);

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

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu.js","names":["DropdownMenu","KobalteDropdownMenu","Check","ChevronRight","Circle","ComponentProps","splitProps","menuContentPadding","destructiveMenuItem","menuItem","menuLabel","menuSeparator","overlayMotion","overlaySurface","popoverArrow","cn","props","_$createComponent","DropdownMenuTrigger","Trigger","DropdownMenuPortal","Portal","DropdownMenuContentProps","Content","hideArrow","portalMount","HTMLElement","DropdownMenuContent","local","rest","mount","children","_$mergeProps","class","_$memo","Arrow","DropdownMenuItem","Item","variant","shortcut","_el$","_tmpl$","_$insert","DropdownMenuShortcut","_el$2","_tmpl$2","_$spread","DropdownMenuCheckboxItem","CheckboxItem","ItemIndicator","DropdownMenuRadioGroup","RadioGroup","DropdownMenuRadioItem","RadioItem","DropdownMenuLabel","GroupLabel","DropdownMenuGroup","Group","DropdownMenuSeparator","Separator","DropdownMenuSub","Sub","DropdownMenuSubTrigger","SubTrigger","DropdownMenuSubContent","SubContent","DropdownMenu","_$createComponent","KobalteDropdownMenu","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { DropdownMenu as KobalteDropdownMenu } from '@kobalte/core/dropdown-menu'\nimport { Check, ChevronRight, Circle } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport {\n  menuContentPadding,\n  destructiveMenuItem,\n  menuItem,\n  menuLabel,\n  menuSeparator,\n  overlayMotion,\n  overlaySurface,\n  popoverArrow,\n} from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/**\n * DropdownMenu.\n *\n * A list of actions on a trigger, with radio groups for persistent choices\n * that fit naturally in a compact menu. Use Select for form inputs whose\n * selected value needs the field-style control, and Popover for arbitrary\n * content.\n *\n * Kobalte supplies the full menu contract — arrow keys, typeahead, the roving\n * highlight, Escape to close and return focus — which is exactly what a\n * hand-rolled `div` with click handlers gets wrong.\n *\n * The `destructive` variant marks the row with a status-coloured edge and\n * highlighted tint while keeping its label on the body foreground. Pairing it\n * with an AlertDialog is the caller's job.\n */\nexport function DropdownMenu(props: ComponentProps<typeof KobalteDropdownMenu>) {\n  return <KobalteDropdownMenu {...props} />\n}\n\nexport function DropdownMenuTrigger(props: ComponentProps<typeof KobalteDropdownMenu.Trigger>) {\n  return <KobalteDropdownMenu.Trigger {...props} />\n}\n\nexport function DropdownMenuPortal(props: ComponentProps<typeof KobalteDropdownMenu.Portal>) {\n  return <KobalteDropdownMenu.Portal {...props} />\n}\n\nexport type DropdownMenuContentProps = ComponentProps<typeof KobalteDropdownMenu.Content> & {\n  hideArrow?: boolean\n  /** Mount under an owner element such as a modal, keeping the menu in its accessible subtree. */\n  portalMount?: HTMLElement\n}\n\nexport function DropdownMenuContent(props: DropdownMenuContentProps) {\n  const [local, rest] = splitProps(props, ['class', 'hideArrow', 'children', 'portalMount'])\n\n  return (\n    <KobalteDropdownMenu.Portal mount={local.portalMount}>\n      <KobalteDropdownMenu.Content\n        class={cn(\n          overlaySurface,\n          overlayMotion,\n          'z-(--z-menu) min-w-[10rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n          menuContentPadding,\n          local.class\n        )}\n        {...rest}\n      >\n        {!local.hideArrow && <KobalteDropdownMenu.Arrow aria-hidden=\"true\" class={popoverArrow} />}\n        {local.children}\n      </KobalteDropdownMenu.Content>\n    </KobalteDropdownMenu.Portal>\n  )\n}\n\nexport function DropdownMenuItem(\n  props: ComponentProps<typeof KobalteDropdownMenu.Item> & {\n    /** Colour the row as a destructive action. Confirm it separately. */\n    variant?: 'default' | 'destructive'\n    /** Draw a shortcut hint at the trailing edge of the row. */\n    shortcut?: string\n  }\n) {\n  const [local, rest] = splitProps(props, ['class', 'variant', 'shortcut', 'children'])\n\n  return (\n    <KobalteDropdownMenu.Item\n      class={cn(\n        menuItem,\n        {\n          [destructiveMenuItem]: local.variant === 'destructive',\n        },\n        local.class\n      )}\n      {...rest}\n    >\n      {local.children}\n      {local.shortcut ? (\n        <span class=\"text-muted-foreground ms-auto font-mono text-2xs tracking-widest\">\n          {local.shortcut}\n        </span>\n      ) : null}\n    </KobalteDropdownMenu.Item>\n  )\n}\n\n/**\n * The chord drawn at a row's trailing edge.\n *\n * A component as well as the `shortcut` prop on an item, because a caller composing\n * a row by hand needs the same treatment — and because the alternative is every\n * caller inventing the same mono-and-dimmed span.\n */\nexport function DropdownMenuShortcut(props: ComponentProps<'span'>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <span\n      data-slot=\"dropdown-menu-shortcut\"\n      class={cn('text-muted-foreground ms-auto font-mono text-2xs tracking-widest', local.class)}\n      {...rest}\n    />\n  )\n}\n\nexport function DropdownMenuCheckboxItem(\n  props: ComponentProps<typeof KobalteDropdownMenu.CheckboxItem>\n) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <KobalteDropdownMenu.CheckboxItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n      {local.children}\n      <KobalteDropdownMenu.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n        <Check class=\"size-4\" />\n      </KobalteDropdownMenu.ItemIndicator>\n    </KobalteDropdownMenu.CheckboxItem>\n  )\n}\n\nexport function DropdownMenuRadioGroup(\n  props: ComponentProps<typeof KobalteDropdownMenu.RadioGroup>\n) {\n  return <KobalteDropdownMenu.RadioGroup {...props} />\n}\n\nexport function DropdownMenuRadioItem(props: ComponentProps<typeof KobalteDropdownMenu.RadioItem>) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <KobalteDropdownMenu.RadioItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n      {local.children}\n      <KobalteDropdownMenu.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n        <Circle class=\"size-2 fill-current\" />\n      </KobalteDropdownMenu.ItemIndicator>\n    </KobalteDropdownMenu.RadioItem>\n  )\n}\n\nexport function DropdownMenuLabel(props: ComponentProps<typeof KobalteDropdownMenu.GroupLabel>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <KobalteDropdownMenu.GroupLabel class={cn(menuLabel, local.class)} {...rest} />\n}\n\nexport function DropdownMenuGroup(props: ComponentProps<typeof KobalteDropdownMenu.Group>) {\n  return <KobalteDropdownMenu.Group {...props} />\n}\n\nexport function DropdownMenuSeparator(props: ComponentProps<typeof KobalteDropdownMenu.Separator>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <KobalteDropdownMenu.Separator class={cn(menuSeparator, local.class)} {...rest} />\n}\n\nexport function DropdownMenuSub(props: ComponentProps<typeof KobalteDropdownMenu.Sub>) {\n  return <KobalteDropdownMenu.Sub {...props} />\n}\n\nexport function DropdownMenuSubTrigger(\n  props: ComponentProps<typeof KobalteDropdownMenu.SubTrigger>\n) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <KobalteDropdownMenu.SubTrigger class={cn(menuItem, local.class)} {...rest}>\n      {local.children}\n      <ChevronRight class=\"ms-auto size-4\" />\n    </KobalteDropdownMenu.SubTrigger>\n  )\n}\n\nexport function DropdownMenuSubContent(\n  props: ComponentProps<typeof KobalteDropdownMenu.SubContent>\n) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <KobalteDropdownMenu.Portal>\n      <KobalteDropdownMenu.SubContent\n        class={cn(\n          overlaySurface,\n          overlayMotion,\n          'z-(--z-menu) min-w-[8rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n          menuContentPadding,\n          local.class\n        )}\n        {...rest}\n      />\n    </KobalteDropdownMenu.Portal>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"dropdown-menu.js","names":["DropdownMenu","KobalteDropdownMenu","Check","ChevronRight","Circle","ComponentProps","splitProps","menuContentPadding","destructiveMenuItem","menuItem","menuLabel","menuSeparator","overlayMotion","overlaySurface","popoverArrow","cn","props","local","rest","_$createComponent","_$mergeProps","modal","DropdownMenuTrigger","Trigger","DropdownMenuPortal","Portal","DropdownMenuContentProps","Content","hideArrow","portalMount","HTMLElement","DropdownMenuContent","mount","children","class","_$memo","Arrow","DropdownMenuItem","Item","variant","shortcut","_el$","_tmpl$","_$insert","DropdownMenuShortcut","_el$2","_tmpl$2","_$spread","DropdownMenuCheckboxItem","CheckboxItem","ItemIndicator","DropdownMenuRadioGroup","RadioGroup","DropdownMenuRadioItem","RadioItem","DropdownMenuLabel","GroupLabel","DropdownMenuGroup","Group","DropdownMenuSeparator","Separator","DropdownMenuSub","Sub","DropdownMenuSubTrigger","SubTrigger","DropdownMenuSubContent","SubContent","DropdownMenu","_$createComponent","KobalteDropdownMenu","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { DropdownMenu as KobalteDropdownMenu } from '@kobalte/core/dropdown-menu'\nimport { Check, ChevronRight, Circle } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport {\n  menuContentPadding,\n  destructiveMenuItem,\n  menuItem,\n  menuLabel,\n  menuSeparator,\n  overlayMotion,\n  overlaySurface,\n  popoverArrow,\n} from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/**\n * DropdownMenu.\n *\n * A list of actions on a trigger, with radio groups for persistent choices\n * that fit naturally in a compact menu. Use Select for form inputs whose\n * selected value needs the field-style control, and Popover for arbitrary\n * content.\n *\n * Kobalte supplies the full menu contract — arrow keys, typeahead, the roving\n * highlight, Escape to close and return focus — which is exactly what a\n * hand-rolled `div` with click handlers gets wrong.\n * Menus are nonmodal by default so their generated focus guards do not become\n * invalid direct children of the ARIA menu. Set `modal` explicitly when the\n * surrounding interaction needs modal containment.\n *\n * The `destructive` variant marks the row with a status-coloured edge and\n * highlighted tint while keeping its label on the body foreground. Pairing it\n * with an AlertDialog is the caller's job.\n */\nexport function DropdownMenu(props: ComponentProps<typeof KobalteDropdownMenu>) {\n  const [local, rest] = splitProps(props, ['modal'])\n  return <KobalteDropdownMenu modal={local.modal ?? false} {...rest} />\n}\n\nexport function DropdownMenuTrigger(props: ComponentProps<typeof KobalteDropdownMenu.Trigger>) {\n  return <KobalteDropdownMenu.Trigger {...props} />\n}\n\nexport function DropdownMenuPortal(props: ComponentProps<typeof KobalteDropdownMenu.Portal>) {\n  return <KobalteDropdownMenu.Portal {...props} />\n}\n\nexport type DropdownMenuContentProps = ComponentProps<typeof KobalteDropdownMenu.Content> & {\n  hideArrow?: boolean\n  /** Mount under an owner element such as a modal, keeping the menu in its accessible subtree. */\n  portalMount?: HTMLElement\n}\n\nexport function DropdownMenuContent(props: DropdownMenuContentProps) {\n  const [local, rest] = splitProps(props, ['class', 'hideArrow', 'children', 'portalMount'])\n\n  return (\n    <KobalteDropdownMenu.Portal mount={local.portalMount}>\n      <KobalteDropdownMenu.Content\n        class={cn(\n          overlaySurface,\n          overlayMotion,\n          'z-(--z-menu) min-w-[10rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n          menuContentPadding,\n          local.class\n        )}\n        {...rest}\n      >\n        {!local.hideArrow && <KobalteDropdownMenu.Arrow aria-hidden=\"true\" class={popoverArrow} />}\n        {local.children}\n      </KobalteDropdownMenu.Content>\n    </KobalteDropdownMenu.Portal>\n  )\n}\n\nexport function DropdownMenuItem(\n  props: ComponentProps<typeof KobalteDropdownMenu.Item> & {\n    /** Colour the row as a destructive action. Confirm it separately. */\n    variant?: 'default' | 'destructive'\n    /** Draw a shortcut hint at the trailing edge of the row. */\n    shortcut?: string\n  }\n) {\n  const [local, rest] = splitProps(props, ['class', 'variant', 'shortcut', 'children'])\n\n  return (\n    <KobalteDropdownMenu.Item\n      class={cn(\n        menuItem,\n        {\n          [destructiveMenuItem]: local.variant === 'destructive',\n        },\n        local.class\n      )}\n      {...rest}\n    >\n      {local.children}\n      {local.shortcut ? (\n        <span class=\"text-muted-foreground ms-auto font-mono text-2xs tracking-widest\">\n          {local.shortcut}\n        </span>\n      ) : null}\n    </KobalteDropdownMenu.Item>\n  )\n}\n\n/**\n * The chord drawn at a row's trailing edge.\n *\n * A component as well as the `shortcut` prop on an item, because a caller composing\n * a row by hand needs the same treatment — and because the alternative is every\n * caller inventing the same mono-and-dimmed span.\n */\nexport function DropdownMenuShortcut(props: ComponentProps<'span'>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <span\n      data-slot=\"dropdown-menu-shortcut\"\n      class={cn('text-muted-foreground ms-auto font-mono text-2xs tracking-widest', local.class)}\n      {...rest}\n    />\n  )\n}\n\nexport function DropdownMenuCheckboxItem(\n  props: ComponentProps<typeof KobalteDropdownMenu.CheckboxItem>\n) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <KobalteDropdownMenu.CheckboxItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n      {local.children}\n      <KobalteDropdownMenu.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n        <Check class=\"size-4\" />\n      </KobalteDropdownMenu.ItemIndicator>\n    </KobalteDropdownMenu.CheckboxItem>\n  )\n}\n\nexport function DropdownMenuRadioGroup(\n  props: ComponentProps<typeof KobalteDropdownMenu.RadioGroup>\n) {\n  return <KobalteDropdownMenu.RadioGroup {...props} />\n}\n\nexport function DropdownMenuRadioItem(props: ComponentProps<typeof KobalteDropdownMenu.RadioItem>) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <KobalteDropdownMenu.RadioItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n      {local.children}\n      <KobalteDropdownMenu.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n        <Circle class=\"size-2 fill-current\" />\n      </KobalteDropdownMenu.ItemIndicator>\n    </KobalteDropdownMenu.RadioItem>\n  )\n}\n\nexport function DropdownMenuLabel(props: ComponentProps<typeof KobalteDropdownMenu.GroupLabel>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <KobalteDropdownMenu.GroupLabel class={cn(menuLabel, local.class)} {...rest} />\n}\n\nexport function DropdownMenuGroup(props: ComponentProps<typeof KobalteDropdownMenu.Group>) {\n  return <KobalteDropdownMenu.Group {...props} />\n}\n\nexport function DropdownMenuSeparator(props: ComponentProps<typeof KobalteDropdownMenu.Separator>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <KobalteDropdownMenu.Separator class={cn(menuSeparator, local.class)} {...rest} />\n}\n\nexport function DropdownMenuSub(props: ComponentProps<typeof KobalteDropdownMenu.Sub>) {\n  return <KobalteDropdownMenu.Sub {...props} />\n}\n\nexport function DropdownMenuSubTrigger(\n  props: ComponentProps<typeof KobalteDropdownMenu.SubTrigger>\n) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <KobalteDropdownMenu.SubTrigger class={cn(menuItem, local.class)} {...rest}>\n      {local.children}\n      <ChevronRight class=\"ms-auto size-4\" />\n    </KobalteDropdownMenu.SubTrigger>\n  )\n}\n\nexport function DropdownMenuSubContent(\n  props: ComponentProps<typeof KobalteDropdownMenu.SubContent>\n) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <KobalteDropdownMenu.Portal>\n      <KobalteDropdownMenu.SubContent\n        class={cn(\n          overlaySurface,\n          overlayMotion,\n          'z-(--z-menu) min-w-[8rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n          menuContentPadding,\n          local.class\n        )}\n        {...rest}\n      />\n    </KobalteDropdownMenu.Portal>\n  )\n}\n"],"mappings":"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"}

package/dist/components/ui/status-chip/status-chip.d.ts

@@ -34,6 +34,8 @@ export type StatusTone = 'neutral' | 'success' | 'warning' | 'danger' | 'info' |
 export type StatusChipProps = Omit<ComponentProps<'span'>, 'children'> & {
     tone?: StatusTone;
     label: string;
+    /** Visually hide the text while preserving it for assistive technology. */
+    compact?: boolean;
     /** Why the status is what it is. Shown in a tooltip; omit for a self-evident label. */
     detail?: string;
     /** A trailing slot: a timestamp, a retry affordance, a count. */

package/dist/components/ui/status-chip/status-chip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"status-chip.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/status-chip/status-chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,cAAc,EAAE,KAAK,GAAG,EAAE,MAAM,UAAU,CAAA;AAK1E;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,iBAAiB;;8EAY5B,CAAA;AAWF,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAAA;AAE1F,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IACvE,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,uFAAuF;IACvF,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,iEAAiE;IACjE,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;CACvB,CAAA;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,eAgChD;AAED,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC;IACjC,gCAAgC;IAChC,EAAE,EAAE,MAAM,CAAA;IACV,mEAAmE;IACnE,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,UAAU,CAAA;IAChB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAC,CAAA;AAEF;;;;;;;;;;;GAWG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAChC,OAAO,EAAE,SAAS,WAAW,EAAE,CAAA;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,gFAAgF;IAChF,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,eAeA"}
+{"version":3,"file":"status-chip.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/status-chip/status-chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,cAAc,EAAE,KAAK,GAAG,EAAE,MAAM,UAAU,CAAA;AAK1E;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,iBAAiB;;8EAY5B,CAAA;AAWF,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAAA;AAE1F,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IACvE,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,2EAA2E;IAC3E,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,uFAAuF;IACvF,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,iEAAiE;IACjE,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;CACvB,CAAA;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,eAuChD;AAED,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC;IACjC,gCAAgC;IAChC,EAAE,EAAE,MAAM,CAAA;IACV,mEAAmE;IACnE,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,UAAU,CAAA;IAChB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAC,CAAA;AAEF;;;;;;;;;;;GAWG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAChC,OAAO,EAAE,SAAS,WAAW,EAAE,CAAA;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,gFAAgF;IAChF,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,eAeA"}

package/dist/components/ui/status-chip/status-chip.js

@@ -4,7 +4,7 @@ import { Tooltip, TooltipContent, TooltipTrigger } from "../tooltip/tooltip.js";
 import { className, createComponent, effect, insert, mergeProps, spread, template } from "solid-js/web";
 import { Show, splitProps } from "solid-js";
 //#region src/components/ui/status-chip/status-chip.tsx
-var _tmpl$ = /*#__PURE__*/ template(`<span><span aria-hidden=true>`);
+var _tmpl$ = /*#__PURE__*/ template(`<span><span aria-hidden=true></span><span>`);
 var _tmpl$2 = /*#__PURE__*/ template(`<dl>`);
 var _tmpl$3 = /*#__PURE__*/ template(`<dt class=text-muted-foreground>`);
 var _tmpl$4 = /*#__PURE__*/ template(`<div class="flex items-baseline justify-between gap-4"><dd>`);
@@ -59,18 +59,27 @@ function StatusChip(props) {
 	const [local, rest] = splitProps(props, [
 		"tone",
 		"label",
+		"compact",
 		"detail",
 		"trailing",
 		"class"
 	]);
 	const chip = (() => {
-		var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+		var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling;
 		spread(_el$, mergeProps({ get ["class"]() {
 			return cn("inline-flex w-fit items-center gap-1.5 text-xs font-medium whitespace-nowrap", labelTone[local.tone ?? "neutral"], local.class);
 		} }, rest), false, true);
-		insert(_el$, () => local.label, null);
+		insert(_el$3, () => local.label);
 		insert(_el$, () => local.trailing, null);
-		effect(() => className(_el$2, statusDotVariants({ tone: local.tone })));
+		effect((_p$) => {
+			var _v$ = statusDotVariants({ tone: local.tone }), _v$2 = cn(local.compact && "sr-only");
+			_v$ !== _p$.e && className(_el$2, _p$.e = _v$);
+			_v$2 !== _p$.t && className(_el$3, _p$.t = _v$2);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0
+		});
 		return _el$;
 	})();
 	return createComponent(Show, {
@@ -107,20 +116,20 @@ function StatusChip(props) {
 */
 function StatusList(props) {
 	return (() => {
-		var _el$3 = _tmpl$2();
-		insert(_el$3, () => props.entries.map((entry) => (() => {
-			var _el$4 = _tmpl$4(), _el$6 = _el$4.firstChild;
-			insert(_el$4, createComponent(Show, {
+		var _el$4 = _tmpl$2();
+		insert(_el$4, () => props.entries.map((entry) => (() => {
+			var _el$5 = _tmpl$4(), _el$7 = _el$5.firstChild;
+			insert(_el$5, createComponent(Show, {
 				get when() {
 					return !props.compact;
 				},
 				get children() {
-					var _el$5 = _tmpl$3();
-					insert(_el$5, () => entry.name);
-					return _el$5;
+					var _el$6 = _tmpl$3();
+					insert(_el$6, () => entry.name);
+					return _el$6;
 				}
-			}), _el$6);
-			insert(_el$6, createComponent(StatusChip, {
+			}), _el$7);
+			insert(_el$7, createComponent(StatusChip, {
 				get tone() {
 					return entry.tone;
 				},
@@ -131,11 +140,11 @@ function StatusList(props) {
 					return entry.detail;
 				}
 			}));
-			effect(() => className(_el$6, cn(!props.compact && "shrink-0")));
-			return _el$4;
+			effect(() => className(_el$7, cn(!props.compact && "shrink-0")));
+			return _el$5;
 		})()));
-		effect(() => className(_el$3, cn("grid gap-2 text-sm", props.class)));
-		return _el$3;
+		effect(() => className(_el$4, cn("grid gap-2 text-sm", props.class)));
+		return _el$4;
 	})();
 }
 //#endregion

package/dist/components/ui/status-chip/status-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"status-chip.js","names":["Show","splitProps","ComponentProps","JSX","cva","cn","Tooltip","TooltipContent","TooltipTrigger","statusDotVariants","variants","tone","neutral","success","warning","danger","info","unknown","defaultVariants","labelTone","Record","StatusTone","StatusChipProps","Omit","label","detail","trailing","Element","StatusChip","props","local","rest","chip","_el$","_tmpl$","_el$2","firstChild","_$spread","_$mergeProps","class","_$insert","_$effect","_$className","_$createComponent","when","fallback","children","as","hideArrow","StatusEntry","Readonly","id","name","StatusList","entries","compact","_el$3","_tmpl$2","map","entry","_el$4","_tmpl$4","_el$6","_el$5","_tmpl$3","_$mergeProps","_$className","_$createComponent"],"sources":["../../../../src/components/ui/status-chip/status-chip.tsx"],"sourcesContent":["import { Show, splitProps, type ComponentProps, type JSX } from 'solid-js'\nimport { cva } from '#lib/variants'\nimport { cn } from '#lib/utils'\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../tooltip'\n\n/**\n * StatusChip.\n *\n * A state, said in one word, with the reason available on hover. It exists\n * because a status readout has three parts that are always the same three parts —\n * a tone, a label, and the detail that justifies the label — and rendering them\n * ad hoc produces the two failures this component is here to prevent: a colour\n * with no text (unreadable to anyone who cannot see it) and a bare word with no\n * explanation (\"Needs configuration\" — of what?).\n *\n * The tones are deliberately not a rainbow. Six cover what a status can actually\n * mean:\n *\n * - `neutral` — fine, and there is nothing to say about it.\n * - `success` — a check passed, a capability is ready, a job finished.\n * - `warning` — degraded, or needs a decision from the user.\n * - `danger` — blocked, failed, unrecoverable without intervention.\n * - `info` — in flight or scheduled; work is happening, nothing is wrong.\n * - `unknown` — the honest absence of information.\n *\n * `unknown` is not the same as `neutral`, and collapsing them is the mistake\n * worth avoiding: \"this is idle\" and \"we have not been told yet\" are different\n * facts, and a product that shows the second as the first is lying quietly. The\n * ring is hollow so it also reads as different in greyscale.\n *\n * The dot is `aria-hidden` and the label carries the meaning, so a tone is never\n * the only signal.\n */\nexport const statusDotVariants = cva('size-2 shrink-0 rounded-full', {\n  variants: {\n    tone: {\n      neutral: 'bg-muted-foreground',\n      success: 'bg-success',\n      warning: 'bg-warning',\n      danger: 'bg-destructive',\n      info: 'bg-info',\n      unknown: 'border border-muted-foreground bg-transparent',\n    },\n  },\n  defaultVariants: { tone: 'neutral' },\n})\n\nconst labelTone: Record<StatusTone, string> = {\n  neutral: 'text-foreground',\n  success: 'text-foreground',\n  warning: 'text-foreground',\n  danger: 'text-foreground',\n  info: 'text-foreground',\n  unknown: 'text-muted-foreground',\n}\n\nexport type StatusTone = 'neutral' | 'success' | 'warning' | 'danger' | 'info' | 'unknown'\n\nexport type StatusChipProps = Omit<ComponentProps<'span'>, 'children'> & {\n  tone?: StatusTone\n  label: string\n  /** Why the status is what it is. Shown in a tooltip; omit for a self-evident label. */\n  detail?: string\n  /** A trailing slot: a timestamp, a retry affordance, a count. */\n  trailing?: JSX.Element\n}\n\nexport function StatusChip(props: StatusChipProps) {\n  const [local, rest] = splitProps(props, ['tone', 'label', 'detail', 'trailing', 'class'])\n\n  const chip = (\n    <span\n      class={cn(\n        'inline-flex w-fit items-center gap-1.5 text-xs font-medium whitespace-nowrap',\n        labelTone[local.tone ?? 'neutral'],\n        local.class\n      )}\n      {...rest}\n    >\n      <span class={statusDotVariants({ tone: local.tone })} aria-hidden=\"true\" />\n      {local.label}\n      {local.trailing}\n    </span>\n  )\n\n  return (\n    <Show when={local.detail} fallback={chip}>\n      {(detail) => (\n        <Tooltip>\n          <TooltipTrigger as=\"span\" class=\"inline-flex\">\n            {chip}\n          </TooltipTrigger>\n          <TooltipContent data-slot=\"tooltip-content\" hideArrow>\n            {detail()}\n          </TooltipContent>\n        </Tooltip>\n      )}\n    </Show>\n  )\n}\n\nexport type StatusEntry = Readonly<{\n  /** A stable key for the row. */\n  id: string\n  /** What is being reported — \"Configuration\", \"Runtime\", \"Sync\". */\n  name: string\n  tone: StatusTone\n  label: string\n  detail?: string\n}>\n\n/**\n * StatusList.\n *\n * The several-facts-about-one-thing shape: an agent with a configuration state, a\n * runtime state and an activity state; a service with a build, a deploy and a\n * health check. It is a definition list rather than a table because there is no\n * column to sort or compare — the rows are facets of a single subject, and a\n * screen reader should hear them as such.\n *\n * Fixed width on the name column is what makes a column of these scannable; the\n * rows line up without a table's semantics.\n */\nexport function StatusList(props: {\n  entries: readonly StatusEntry[]\n  class?: string\n  /** Hide the name column and show only the chips — for a compact badge strip. */\n  compact?: boolean\n}) {\n  return (\n    <dl class={cn('grid gap-2 text-sm', props.class)}>\n      {props.entries.map((entry) => (\n        <div class=\"flex items-baseline justify-between gap-4\">\n          <Show when={!props.compact}>\n            <dt class=\"text-muted-foreground\">{entry.name}</dt>\n          </Show>\n          <dd class={cn(!props.compact && 'shrink-0')}>\n            <StatusChip tone={entry.tone} label={entry.label} detail={entry.detail} />\n          </dd>\n        </div>\n      ))}\n    </dl>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,IAAaS,oBAAoBL,IAAI,gCAAgC;CACnEM,UAAU,EACRC,MAAM;EACJC,SAAS;EACTC,SAAS;EACTC,SAAS;EACTC,QAAQ;EACRC,MAAM;EACNC,SAAS;CACX,EACF;CACAC,iBAAiB,EAAEP,MAAM,UAAU;AACrC,CAAC;AAED,IAAMQ,YAAwC;CAC5CP,SAAS;CACTC,SAAS;CACTC,SAAS;CACTC,QAAQ;CACRC,MAAM;CACNC,SAAS;AACX;AAaA,SAAgBW,WAAWC,OAAwB;CACjD,MAAM,CAACC,OAAOC,QAAQ9B,WAAW4B,OAAO;EAAC;EAAQ;EAAS;EAAU;EAAY;CAAO,CAAC;CAExF,MAAMG,cAAI;EAAA,IAAAC,OAAAC,OAAA,GAAAC,QAAAF,KAAAG;EAAAC,OAAAJ,MAAAK,WAAA,EAAA,KAAA,WAAA;GAAA,OAECjC,GACL,gFACAc,UAAUW,MAAMnB,QAAQ,YACxBmB,MAAMS,KACR;EAAC,EAAA,GACGR,IAAI,GAAA,OAAA,IAAA;EAAAS,OAAAP,YAGPH,MAAMN,OAAK,IAAA;EAAAgB,OAAAP,YACXH,MAAMJ,UAAQ,IAAA;EAAAe,aAAAC,UAAAP,OAFF1B,kBAAkB,EAAEE,MAAMmB,MAAMnB,KAAK,CAAC,CAAC,CAAA;EAAA,OAAAsB;CAAA,EAAA,CAAA;CAMxD,OAAAU,gBACG3C,MAAI;EAAA,IAAC4C,OAAI;GAAA,OAAEd,MAAML;EAAM;EAAEoB,UAAUb;EAAIc,WACpCrB,WAAMkB,gBACLrC,SAAO,EAAA,IAAAwC,WAAA;GAAA,OAAA,CAAAH,gBACLnC,gBAAc;IAACuC,IAAE;IAAA,SAAA;IAAAD,UACfd;GAAI,CAAA,GAAAW,gBAENpC,gBAAc;IAAA,aAAA;IAA6ByC,WAAS;IAAA,IAAAF,WAAA;KAAA,OAClDrB,OAAO;IAAC;GAAA,CAAA,CAAA;EAAA,EAAA,CAAA;CAGd,CAAA;AAGP;;;;;;;;;;;;;AAwBA,SAAgB4B,WAAWxB,OAKxB;CACD,cAAA;EAAA,IAAA2B,QAAAC,QAAA;EAAAjB,OAAAgB,aAEK3B,MAAMyB,QAAQI,KAAKC,iBAAK;GAAA,IAAAC,QAAAC,QAAA,GAAAC,QAAAF,MAAAxB;GAAAI,OAAAoB,OAAAjB,gBAEpB3C,MAAI;IAAA,IAAC4C,OAAI;KAAA,OAAE,CAACf,MAAM0B;IAAO;IAAA,IAAAT,WAAA;KAAA,IAAAiB,QAAAC,QAAA;KAAAxB,OAAAuB,aACWJ,MAAMP,IAAI;KAAA,OAAAW;IAAA;GAAA,CAAA,GAAAD,KAAA;GAAAtB,OAAAsB,OAAAnB,gBAG5Cf,YAAU;IAAA,IAACjB,OAAI;KAAA,OAAEgD,MAAMhD;IAAI;IAAA,IAAEa,QAAK;KAAA,OAAEmC,MAAMnC;IAAK;IAAA,IAAEC,SAAM;KAAA,OAAEkC,MAAMlC;IAAM;GAAA,CAAA,CAAA;GAAAgB,aAAAC,UAAAoB,OAD7DzD,GAAG,CAACwB,MAAM0B,WAAW,UAAU,CAAC,CAAA;GAAA,OAAAK;EAAA,EAAA,CAAA,CAI9C,CAAC;EAAAnB,aAAAC,UAAAc,OAVOnD,GAAG,sBAAsBwB,MAAMU,KAAK,CAAC,CAAA;EAAA,OAAAiB;CAAA,EAAA,CAAA;AAapD"}
+{"version":3,"file":"status-chip.js","names":["Show","splitProps","ComponentProps","JSX","cva","cn","Tooltip","TooltipContent","TooltipTrigger","statusDotVariants","variants","tone","neutral","success","warning","danger","info","unknown","defaultVariants","labelTone","Record","StatusTone","StatusChipProps","Omit","label","compact","detail","trailing","Element","StatusChip","props","local","rest","chip","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_$spread","_$mergeProps","class","_$insert","_$effect","_p$","_v$","_v$2","e","_$className","t","undefined","_$createComponent","when","fallback","children","as","hideArrow","StatusEntry","Readonly","id","name","StatusList","entries","_el$4","_tmpl$2","map","entry","_el$5","_tmpl$4","_el$7","_el$6","_tmpl$3","_$mergeProps","_$className","_$createComponent"],"sources":["../../../../src/components/ui/status-chip/status-chip.tsx"],"sourcesContent":["import { Show, splitProps, type ComponentProps, type JSX } from 'solid-js'\nimport { cva } from '#lib/variants'\nimport { cn } from '#lib/utils'\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../tooltip'\n\n/**\n * StatusChip.\n *\n * A state, said in one word, with the reason available on hover. It exists\n * because a status readout has three parts that are always the same three parts —\n * a tone, a label, and the detail that justifies the label — and rendering them\n * ad hoc produces the two failures this component is here to prevent: a colour\n * with no text (unreadable to anyone who cannot see it) and a bare word with no\n * explanation (\"Needs configuration\" — of what?).\n *\n * The tones are deliberately not a rainbow. Six cover what a status can actually\n * mean:\n *\n * - `neutral` — fine, and there is nothing to say about it.\n * - `success` — a check passed, a capability is ready, a job finished.\n * - `warning` — degraded, or needs a decision from the user.\n * - `danger` — blocked, failed, unrecoverable without intervention.\n * - `info` — in flight or scheduled; work is happening, nothing is wrong.\n * - `unknown` — the honest absence of information.\n *\n * `unknown` is not the same as `neutral`, and collapsing them is the mistake\n * worth avoiding: \"this is idle\" and \"we have not been told yet\" are different\n * facts, and a product that shows the second as the first is lying quietly. The\n * ring is hollow so it also reads as different in greyscale.\n *\n * The dot is `aria-hidden` and the label carries the meaning, so a tone is never\n * the only signal.\n */\nexport const statusDotVariants = cva('size-2 shrink-0 rounded-full', {\n  variants: {\n    tone: {\n      neutral: 'bg-muted-foreground',\n      success: 'bg-success',\n      warning: 'bg-warning',\n      danger: 'bg-destructive',\n      info: 'bg-info',\n      unknown: 'border border-muted-foreground bg-transparent',\n    },\n  },\n  defaultVariants: { tone: 'neutral' },\n})\n\nconst labelTone: Record<StatusTone, string> = {\n  neutral: 'text-foreground',\n  success: 'text-foreground',\n  warning: 'text-foreground',\n  danger: 'text-foreground',\n  info: 'text-foreground',\n  unknown: 'text-muted-foreground',\n}\n\nexport type StatusTone = 'neutral' | 'success' | 'warning' | 'danger' | 'info' | 'unknown'\n\nexport type StatusChipProps = Omit<ComponentProps<'span'>, 'children'> & {\n  tone?: StatusTone\n  label: string\n  /** Visually hide the text while preserving it for assistive technology. */\n  compact?: boolean\n  /** Why the status is what it is. Shown in a tooltip; omit for a self-evident label. */\n  detail?: string\n  /** A trailing slot: a timestamp, a retry affordance, a count. */\n  trailing?: JSX.Element\n}\n\nexport function StatusChip(props: StatusChipProps) {\n  const [local, rest] = splitProps(props, [\n    'tone',\n    'label',\n    'compact',\n    'detail',\n    'trailing',\n    'class',\n  ])\n\n  const chip = (\n    <span\n      class={cn(\n        'inline-flex w-fit items-center gap-1.5 text-xs font-medium whitespace-nowrap',\n        labelTone[local.tone ?? 'neutral'],\n        local.class\n      )}\n      {...rest}\n    >\n      <span class={statusDotVariants({ tone: local.tone })} aria-hidden=\"true\" />\n      <span class={cn(local.compact && 'sr-only')}>{local.label}</span>\n      {local.trailing}\n    </span>\n  )\n\n  return (\n    <Show when={local.detail} fallback={chip}>\n      {(detail) => (\n        <Tooltip>\n          <TooltipTrigger as=\"span\" class=\"inline-flex\">\n            {chip}\n          </TooltipTrigger>\n          <TooltipContent data-slot=\"tooltip-content\" hideArrow>\n            {detail()}\n          </TooltipContent>\n        </Tooltip>\n      )}\n    </Show>\n  )\n}\n\nexport type StatusEntry = Readonly<{\n  /** A stable key for the row. */\n  id: string\n  /** What is being reported — \"Configuration\", \"Runtime\", \"Sync\". */\n  name: string\n  tone: StatusTone\n  label: string\n  detail?: string\n}>\n\n/**\n * StatusList.\n *\n * The several-facts-about-one-thing shape: an agent with a configuration state, a\n * runtime state and an activity state; a service with a build, a deploy and a\n * health check. It is a definition list rather than a table because there is no\n * column to sort or compare — the rows are facets of a single subject, and a\n * screen reader should hear them as such.\n *\n * Fixed width on the name column is what makes a column of these scannable; the\n * rows line up without a table's semantics.\n */\nexport function StatusList(props: {\n  entries: readonly StatusEntry[]\n  class?: string\n  /** Hide the name column and show only the chips — for a compact badge strip. */\n  compact?: boolean\n}) {\n  return (\n    <dl class={cn('grid gap-2 text-sm', props.class)}>\n      {props.entries.map((entry) => (\n        <div class=\"flex items-baseline justify-between gap-4\">\n          <Show when={!props.compact}>\n            <dt class=\"text-muted-foreground\">{entry.name}</dt>\n          </Show>\n          <dd class={cn(!props.compact && 'shrink-0')}>\n            <StatusChip tone={entry.tone} label={entry.label} detail={entry.detail} />\n          </dd>\n        </div>\n      ))}\n    </dl>\n  )\n}\n"],"mappings":"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"}

package/dist/index.d.ts

@@ -73,6 +73,8 @@ export * from './components/ui/toggle-group';
 export * from './components/ui/tooltip';
 export * from './components/motion';
 export * from './components/layout/split-layout';
+export * from './components/layout/orbit-layout';
+export * from './components/layout/virtual-window';
 export * from './components/layout/app-shell';
 export * from './components/layout/page';
 export * from './components/layout/panel';