npm - @adea-ai/ui - Versions diffs - 0.72.1 → 0.72.3 - Mend

@adea-ai/ui 0.72.1 → 0.72.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (30) hide show

package/dist/components/ui/alert-dialog/alert-dialog.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { AlertDialog as KobalteAlertDialog } from '@kobalte/core/alert-dialog';
+import { AlertDialog as KobalteAlertDialog, Content as KobalteAlertDialogContent } from '@kobalte/core/alert-dialog';
 import type { ComponentProps } from 'solid-js';
 /**
  * AlertDialog.
@@ -19,7 +19,7 @@ export declare function AlertDialog(props: ComponentProps<typeof KobalteAlertDia
 export declare function AlertDialogTrigger(props: ComponentProps<typeof KobalteAlertDialog.Trigger>): import("solid-js").JSX.Element;
 export declare function AlertDialogPortal(props: ComponentProps<typeof KobalteAlertDialog.Portal>): import("solid-js").JSX.Element;
 export declare function AlertDialogOverlay(props: ComponentProps<typeof KobalteAlertDialog.Overlay>): import("solid-js").JSX.Element;
-export declare function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialog.Content>): import("solid-js").JSX.Element;
+export declare function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialogContent>): import("solid-js").JSX.Element;
 export declare function AlertDialogHeader(props: ComponentProps<'div'>): import("solid-js").JSX.Element;
 export declare function AlertDialogFooter(props: ComponentProps<'div'>): import("solid-js").JSX.Element;
 export declare function AlertDialogTitle(props: ComponentProps<typeof KobalteAlertDialog.Title>): import("solid-js").JSX.Element;

package/dist/components/ui/alert-dialog/alert-dialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog/alert-dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,~~EAAE~~,WAAW,IAAI,kBAAkB,~~EAAE~~,MAAM,4BAA4B,CAAA;~~AAC9E~~,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAK9C;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,kCAE3E;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAE1F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,MAAM,CAAC,kCAExF;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAY1F;AA2BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,~~kBAAkB~~,CAAC,~~OAAO,CAAC,kCAe1F~~;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,kCAS7D;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,kCAS7D;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,KAAK,CAAC,kCAQtF;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAS7D;AAsCD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAE7F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAE7F"}
1	+ {"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert-dialog/alert-dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,IAAI,kBAAkB,EACjC,OAAO,IAAI,yBAAyB,EACrC,MAAM,4BAA4B,CAAA;AAEnC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAK9C;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,kCAE3E;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAE1F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,MAAM,CAAC,kCAExF;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAY1F;AA2BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,yBAAyB,CAAC,kCAezF;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,kCAS7D;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,kCAS7D;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,KAAK,CAAC,kCAQtF;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAS7D;AAsCD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAE7F;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,WAAW,CAAC,kCAE7F"}

package/dist/components/ui/alert-dialog/alert-dialog.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { cn } from "../../../lib/utils.js";
 import { overlayMotion, overlayPositioner, overlayScrim, overlaySurface } from "../../../lib/overlay.js";
 import { className, createComponent, insert, mergeProps, spread, template, use } from "solid-js/web";
 import { createEffect, createSignal, splitProps } from "solid-js";
-import { AlertDialog } from "@kobalte/core/alert-dialog";
+import { AlertDialog, Content } from "@kobalte/core/alert-dialog";
 //#region src/components/ui/alert-dialog/alert-dialog.tsx
 var _tmpl$ = /*#__PURE__*/ template(`<div>`);
 var _tmpl$2 = /*#__PURE__*/ template(`<div data-slot=alert-dialog-header>`);
@@ -68,7 +68,7 @@ function AlertDialogContent(props) {
 		return [createComponent(AlertDialogOverlay, {}), (() => {
 			var _el$ = _tmpl$();
 			className(_el$, overlayPositioner);
-			insert(_el$, createComponent(AlertDialog.Content, mergeProps(blockDismissal, { get ["class"]() {
+			insert(_el$, createComponent(Content, mergeProps(blockDismissal, { get ["class"]() {
 				return cn(overlaySurface, overlayMotion, "grid w-full max-w-md gap-4 p-5", local.class);
 			} }, rest)));
 			return _el$;

package/dist/components/ui/alert-dialog/alert-dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"alert-dialog.js","names":["AlertDialog","KobalteAlertDialog","ComponentProps","createEffect","createSignal","splitProps","overlayMotion","overlayPositioner","overlayScrim","overlaySurface","cn","props","_$createComponent","AlertDialogTrigger","Trigger","AlertDialogPortal","Portal","AlertDialogOverlay","Overlay","local","rest","_$mergeProps","class","blockDismissal","onEscapeKeyDown","event","KeyboardEvent","preventDefault","onPointerDownOutside","Event","onFocusOutside","onInteractOutside","const","AlertDialogContent","Content","children","_el$","_tmpl$","_$className","_$insert","AlertDialogHeader","_el$2","_tmpl$2","_$spread","AlertDialogFooter","_el$3","_tmpl$3","AlertDialogTitle","Title","AlertDialogDescription","Description","AlertDialogChoice","CloseButton","wrapper","setWrapper","HTMLSpanElement","root","undefined","querySelector","removeAttribute","_el$4","_tmpl$4","_$use","AlertDialogAction","AlertDialogCancel","AlertDialog","_$createComponent","KobalteAlertDialog","_$mergeProps"],"sources":["../../../../src/components/ui/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import { AlertDialog as KobalteAlertDialog } from '@kobalte/core/alert-dialog'\nimport type { ComponentProps } from 'solid-js'\nimport { createEffect, createSignal, splitProps } from 'solid-js'\nimport { overlayMotion, overlayPositioner, overlayScrim, overlaySurface } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/*\n AlertDialog.\n \n A dialog that cannot be dismissed by accident: Escape and a click on the scrim\n * do nothing, and the user must choose one of the actions. That is the whole\n * difference from Dialog, and it is why this exists as its own component rather\n * than a prop — a caller has to reach for it deliberately.\n \n The consequence is a rule of use: this is for confirming a destructive or\n * irreversible step. Wrapping an ordinary form in an AlertDialog traps someone who\n * wants to back out.\n \n There is deliberately no close button in the corner. An X has no label, and the\n * point of this surface is that every exit is a named choice.\n /\nexport function AlertDialog(props: ComponentProps<typeof KobalteAlertDialog>) {\n return <KobalteAlertDialog {...props} />\n}\n\nexport function AlertDialogTrigger(props: ComponentProps<typeof KobalteAlertDialog.Trigger>) {\n return <KobalteAlertDialog.Trigger {...props} />\n}\n\nexport function AlertDialogPortal(props: ComponentProps<typeof KobalteAlertDialog.Portal>) {\n return <KobalteAlertDialog.Portal {...props} />\n}\n\nexport function AlertDialogOverlay(props: ComponentProps<typeof KobalteAlertDialog.Overlay>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteAlertDialog.Overlay\n class={cn(\n overlayScrim,\n 'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n local.class\n )}\n {...rest}\n />\n )\n}\n\n/\n The panel.\n \n Kobalte's `AlertDialog.Content` is `Dialog.Content` with `role=\"alertdialog\"`\n * and nothing else — Escape and an outside click dismiss it exactly as they\n * dismiss a Dialog. That is a real gap in the primitive, so the blocking is\n * implemented here, and it is the whole difference between this component and a\n * Dialog:\n \n - Escape is prevented, because a key that closes a confirmation is a key that\n * makes \"confirm\" meaningless.\n * - Pointer and focus interactions outside are prevented, including the scrim\n * click, for the same reason.\n \n There is deliberately no prop to turn this off. A surface that can be escaped\n * accidentally does not need to be an AlertDialog; it is a Dialog, and using this\n * one would be a claim about the flow that is not true.\n /\nconst blockDismissal = {\n onEscapeKeyDown: (event: KeyboardEvent) => event.preventDefault(),\n onPointerDownOutside: (event: Event) => event.preventDefault(),\n onFocusOutside: (event: Event) => event.preventDefault(),\n onInteractOutside: (event: Event) => event.preventDefault(),\n} as const\n\nexport function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialog.Content>) {\n const [local, rest] = splitProps(props, ['class'])\n\n return (\n <KobalteAlertDialog.Portal>\n <AlertDialogOverlay />\n <div class={overlayPositioner}>\n <KobalteAlertDialog.Content\n {...blockDismissal}\n class={cn(overlaySurface, overlayMotion, 'grid w-full max-w-md gap-4 p-5', local.class)}\n {...rest}\n />\n </div>\n </KobalteAlertDialog.Portal>\n )\n}\n\nexport function AlertDialogHeader(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"alert-dialog-header\"\n class={cn('flex flex-col gap-1.5 text-start', local.class)}\n {...rest}\n />\n )\n}\n\nexport function AlertDialogFooter(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"alert-dialog-footer\"\n class={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', local.class)}\n {...rest}\n />\n )\n}\n\nexport function AlertDialogTitle(props: ComponentProps<typeof KobalteAlertDialog.Title>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteAlertDialog.Title\n class={cn('text-base leading-none font-semibold tracking-tight', local.class)}\n {...rest}\n />\n )\n}\n\nexport function AlertDialogDescription(\n props: ComponentProps<typeof KobalteAlertDialog.Description>\n) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteAlertDialog.Description\n class={cn('text-muted-foreground text-sm', local.class)}\n {...rest}\n />\n )\n}\n\n/\n One of the dialog's two named choices.\n \n Kobalte labels its close button \"Dismiss\" by default, because a generic close\n * button is usually an icon with no text of its own. In an AlertDialog it is\n * something else: the named choices. An `aria-label` there replaces the visible\n * text, so a screen reader hears \"Dismiss\" twice and the user cannot tell the\n * destructive action from the safe one.\n \n The injected label is removed rather than overridden with an empty one. An empty\n * `aria-label` is not reliably ignored — some name computations treat its presence\n * as an explicit empty name, which leaves the button unnamed — so the attribute\n * has to go, and the visible text becomes the name. A caller whose button is an\n * icon passes its own `aria-label`, and that one is left alone.\n \n Applied through a layout-neutral wrapper because Kobalte keeps the `ref` for its\n * own dismissable layer and does not forward it. The wrapper is `display: contents`\n * so the button remains the flex item its parent lays out.\n */\nfunction AlertDialogChoice(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n const [local, rest] = splitProps(props, ['class', 'aria-label'])\n const [wrapper, setWrapper] = createSignal<HTMLSpanElement>()\n\n createEffect(() => {\n const root = wrapper()\n if (!root \|\| local['aria-label'] !== undefined) return\n root.querySelector('button')?.removeAttribute('aria-label')\n })\n\n return (\n <span ref={setWrapper} class=\"contents\">\n <KobalteAlertDialog.CloseButton class={cn(local.class)} {...rest} />\n </span>\n )\n}\n\nexport function AlertDialogAction(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n return <AlertDialogChoice {...props} />\n}\n\nexport function AlertDialogCancel(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n return <AlertDialogChoice {...props} />\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"alert-dialog.js","names":["AlertDialog","KobalteAlertDialog","Content","KobalteAlertDialogContent","ComponentProps","createEffect","createSignal","splitProps","overlayMotion","overlayPositioner","overlayScrim","overlaySurface","cn","props","_$createComponent","AlertDialogTrigger","Trigger","AlertDialogPortal","Portal","AlertDialogOverlay","Overlay","local","rest","_$mergeProps","class","blockDismissal","onEscapeKeyDown","event","KeyboardEvent","preventDefault","onPointerDownOutside","Event","onFocusOutside","onInteractOutside","const","AlertDialogContent","children","_el$","_tmpl$","_$className","_$insert","AlertDialogHeader","_el$2","_tmpl$2","_$spread","AlertDialogFooter","_el$3","_tmpl$3","AlertDialogTitle","Title","AlertDialogDescription","Description","AlertDialogChoice","CloseButton","wrapper","setWrapper","HTMLSpanElement","root","undefined","querySelector","removeAttribute","_el$4","_tmpl$4","_$use","AlertDialogAction","AlertDialogCancel","AlertDialog","_$createComponent","KobalteAlertDialog","_$mergeProps","KobalteAlertDialogContent"],"sources":["../../../../src/components/ui/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import {\n AlertDialog as KobalteAlertDialog,\n Content as KobalteAlertDialogContent,\n} from '@kobalte/core/alert-dialog'\n// Use the alert-specific export rather than DialogRoot.Content, which other imports can replace.\nimport type { ComponentProps } from 'solid-js'\nimport { createEffect, createSignal, splitProps } from 'solid-js'\nimport { overlayMotion, overlayPositioner, overlayScrim, overlaySurface } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/*\n AlertDialog.\n \n A dialog that cannot be dismissed by accident: Escape and a click on the scrim\n * do nothing, and the user must choose one of the actions. That is the whole\n * difference from Dialog, and it is why this exists as its own component rather\n * than a prop — a caller has to reach for it deliberately.\n \n The consequence is a rule of use: this is for confirming a destructive or\n * irreversible step. Wrapping an ordinary form in an AlertDialog traps someone who\n * wants to back out.\n \n There is deliberately no close button in the corner. An X has no label, and the\n * point of this surface is that every exit is a named choice.\n /\nexport function AlertDialog(props: ComponentProps<typeof KobalteAlertDialog>) {\n return <KobalteAlertDialog {...props} />\n}\n\nexport function AlertDialogTrigger(props: ComponentProps<typeof KobalteAlertDialog.Trigger>) {\n return <KobalteAlertDialog.Trigger {...props} />\n}\n\nexport function AlertDialogPortal(props: ComponentProps<typeof KobalteAlertDialog.Portal>) {\n return <KobalteAlertDialog.Portal {...props} />\n}\n\nexport function AlertDialogOverlay(props: ComponentProps<typeof KobalteAlertDialog.Overlay>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteAlertDialog.Overlay\n class={cn(\n overlayScrim,\n 'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n local.class\n )}\n {...rest}\n />\n )\n}\n\n/\n The panel.\n \n Kobalte's `AlertDialog.Content` is `Dialog.Content` with `role=\"alertdialog\"`\n * and nothing else — Escape and an outside click dismiss it exactly as they\n * dismiss a Dialog. That is a real gap in the primitive, so the blocking is\n * implemented here, and it is the whole difference between this component and a\n * Dialog:\n \n - Escape is prevented, because a key that closes a confirmation is a key that\n * makes \"confirm\" meaningless.\n * - Pointer and focus interactions outside are prevented, including the scrim\n * click, for the same reason.\n \n There is deliberately no prop to turn this off. A surface that can be escaped\n * accidentally does not need to be an AlertDialog; it is a Dialog, and using this\n * one would be a claim about the flow that is not true.\n /\nconst blockDismissal = {\n onEscapeKeyDown: (event: KeyboardEvent) => event.preventDefault(),\n onPointerDownOutside: (event: Event) => event.preventDefault(),\n onFocusOutside: (event: Event) => event.preventDefault(),\n onInteractOutside: (event: Event) => event.preventDefault(),\n} as const\n\nexport function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialogContent>) {\n const [local, rest] = splitProps(props, ['class'])\n\n return (\n <KobalteAlertDialog.Portal>\n <AlertDialogOverlay />\n <div class={overlayPositioner}>\n <KobalteAlertDialogContent\n {...blockDismissal}\n class={cn(overlaySurface, overlayMotion, 'grid w-full max-w-md gap-4 p-5', local.class)}\n {...rest}\n />\n </div>\n </KobalteAlertDialog.Portal>\n )\n}\n\nexport function AlertDialogHeader(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"alert-dialog-header\"\n class={cn('flex flex-col gap-1.5 text-start', local.class)}\n {...rest}\n />\n )\n}\n\nexport function AlertDialogFooter(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"alert-dialog-footer\"\n class={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', local.class)}\n {...rest}\n />\n )\n}\n\nexport function AlertDialogTitle(props: ComponentProps<typeof KobalteAlertDialog.Title>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteAlertDialog.Title\n class={cn('text-base leading-none font-semibold tracking-tight', local.class)}\n {...rest}\n />\n )\n}\n\nexport function AlertDialogDescription(\n props: ComponentProps<typeof KobalteAlertDialog.Description>\n) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteAlertDialog.Description\n class={cn('text-muted-foreground text-sm', local.class)}\n {...rest}\n />\n )\n}\n\n/\n One of the dialog's two named choices.\n \n Kobalte labels its close button \"Dismiss\" by default, because a generic close\n * button is usually an icon with no text of its own. In an AlertDialog it is\n * something else: the named choices. An `aria-label` there replaces the visible\n * text, so a screen reader hears \"Dismiss\" twice and the user cannot tell the\n * destructive action from the safe one.\n \n The injected label is removed rather than overridden with an empty one. An empty\n * `aria-label` is not reliably ignored — some name computations treat its presence\n * as an explicit empty name, which leaves the button unnamed — so the attribute\n * has to go, and the visible text becomes the name. A caller whose button is an\n * icon passes its own `aria-label`, and that one is left alone.\n \n Applied through a layout-neutral wrapper because Kobalte keeps the `ref` for its\n * own dismissable layer and does not forward it. The wrapper is `display: contents`\n * so the button remains the flex item its parent lays out.\n */\nfunction AlertDialogChoice(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n const [local, rest] = splitProps(props, ['class', 'aria-label'])\n const [wrapper, setWrapper] = createSignal<HTMLSpanElement>()\n\n createEffect(() => {\n const root = wrapper()\n if (!root \|\| local['aria-label'] !== undefined) return\n root.querySelector('button')?.removeAttribute('aria-label')\n })\n\n return (\n <span ref={setWrapper} class=\"contents\">\n <KobalteAlertDialog.CloseButton class={cn(local.class)} {...rest} />\n </span>\n )\n}\n\nexport function AlertDialogAction(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n return <AlertDialogChoice {...props} />\n}\n\nexport function AlertDialogCancel(props: ComponentProps<typeof KobalteAlertDialog.CloseButton>) {\n return <AlertDialogChoice {...props} />\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,SAAgBA,cAAYa,OAAkD;CAC5E,OAAAC,gBAAQb,aAAuBY,KAAK;AACtC;AAEA,SAAgBE,mBAAmBF,OAA0D;CAC3F,OAAAC,gBAAQb,YAAmBe,SAAYH,KAAK;AAC9C;AAEA,SAAgBI,kBAAkBJ,OAAyD;CACzF,OAAAC,gBAAQb,YAAmBiB,QAAWL,KAAK;AAC7C;AAEA,SAAgBM,mBAAmBN,OAA0D;CAC3F,MAAM,CAACQ,OAAOC,QAAQf,WAAWM,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAC,gBACGb,YAAmBmB,SAAOG,WAAA,EAAA,KAAA,WAAA;EAAA,OAClBX,GACLF,cACA,mGACAW,MAAMG,KACR;CAAC,EAAA,GACGF,IAAI,CAAA;AAGd;;;;;;;;;;;;;;;;;;;AAoBA,IAAMG,iBAAiB;CACrBC,kBAAkBC,UAAyBA,MAAME,eAAe;CAChEC,uBAAuBH,UAAiBA,MAAME,eAAe;CAC7DG,iBAAiBL,UAAiBA,MAAME,eAAe;CACvDI,oBAAoBN,UAAiBA,MAAME,eAAe;AAC5D;AAEA,SAAgBM,mBAAmBtB,OAAyD;CAC1F,MAAM,CAACQ,OAAOC,QAAQf,WAAWM,OAAO,CAAC,OAAO,CAAC;CAEjD,OAAAC,gBACGb,YAAmBiB,QAAM,EAAA,IAAAkB,WAAA;EAAA,OAAA,CAAAtB,gBACvBK,oBAAkB,CAAA,CAAA,UAAA;GAAA,IAAAkB,OAAAC,OAAA;GAAAC,UAAAF,MACP5B,iBAAiB;GAAA+B,OAAAH,MAAAvB,gBAC1BX,SAAyBoB,WACpBE,gBAAc,EAAA,KAAA,WAAA;IAAA,OACXb,GAAGD,gBAAgBH,eAAe,kCAAkCa,MAAMG,KAAK;GAAC,EAAA,GACnFF,IAAI,CAAA,CAAA;GAAA,OAAAe;EAAA,EAAA,CAAA,CAAA;CAAA,EAAA,CAAA;AAKlB;AAEA,SAAgBI,kBAAkB5B,OAA8B;CAC9D,MAAM,CAACQ,OAAOC,QAAQf,WAAWM,OAAO,CAAC,OAAO,CAAC;CACjD,cAAA;EAAA,IAAA6B,QAAAC,QAAA;EAAAC,OAAAF,OAAAnB,WAAA,EAAA,KAAA,WAAA;GAAA,OAGWX,GAAG,oCAAoCS,MAAMG,KAAK;EAAC,EAAA,GACtDF,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAoB;CAAA,EAAA,CAAA;AAGd;AAEA,SAAgBG,kBAAkBhC,OAA8B;CAC9D,MAAM,CAACQ,OAAOC,QAAQf,WAAWM,OAAO,CAAC,OAAO,CAAC;CACjD,cAAA;EAAA,IAAAiC,QAAAC,QAAA;EAAAH,OAAAE,OAAAvB,WAAA,EAAA,KAAA,WAAA;GAAA,OAGWX,GAAG,0DAA0DS,MAAMG,KAAK;EAAC,EAAA,GAC5EF,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAwB;CAAA,EAAA,CAAA;AAGd;AAEA,SAAgBE,iBAAiBnC,OAAwD;CACvF,MAAM,CAACQ,OAAOC,QAAQf,WAAWM,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAC,gBACGb,YAAmBgD,OAAK1B,WAAA,EAAA,KAAA,WAAA;EAAA,OAChBX,GAAG,uDAAuDS,MAAMG,KAAK;CAAC,EAAA,GACzEF,IAAI,CAAA;AAGd;AAEA,SAAgB4B,uBACdrC,OACA;CACA,MAAM,CAACQ,OAAOC,QAAQf,WAAWM,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAC,gBACGb,YAAmBkD,aAAW5B,WAAA,EAAA,KAAA,WAAA;EAAA,OACtBX,GAAG,iCAAiCS,MAAMG,KAAK;CAAC,EAAA,GACnDF,IAAI,CAAA;AAGd;;;;;;;;;;;;;;;;;;;;AAqBA,SAAS8B,kBAAkBvC,OAA8D;CACvF,MAAM,CAACQ,OAAOC,QAAQf,WAAWM,OAAO,CAAC,SAAS,YAAY,CAAC;CAC/D,MAAM,CAACyC,SAASC,cAAcjD,aAA8B;CAE5DD,mBAAmB;EACjB,MAAMoD,OAAOH,QAAQ;EACrB,IAAI,CAACG,QAAQpC,MAAM,kBAAkBqC,KAAAA,GAAW;EAChDD,KAAKE,cAAc,QAAQ,CAAC,EAAEC,gBAAgB,YAAY;CAC5D,CAAC;CAED,cAAA;EAAA,IAAAC,QAAAC,QAAA;EAAAC,IACaR,YAAUM,KAAA;EAAArB,OAAAqB,OAAA/C,gBAClBb,YAAmBoD,aAAW9B,WAAA,EAAA,KAAA,WAAA;GAAA,OAAQX,GAAGS,MAAMG,KAAK;EAAC,EAAA,GAAMF,IAAI,CAAA,CAAA;EAAA,OAAAuC;CAAA,EAAA,CAAA;AAGtE;AAEA,SAAgBG,kBAAkBnD,OAA8D;CAC9F,OAAAC,gBAAQsC,mBAAsBvC,KAAK;AACrC;AAEA,SAAgBoD,kBAAkBpD,OAA8D;CAC9F,OAAAC,gBAAQsC,mBAAsBvC,KAAK;AACrC"}

package/dist/components/ui/combobox/combobox.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/combobox/combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,IAAI,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAEpE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAK9C;;;;;;;;;;;;GAYG;AACH,wBAAgB,QAAQ,CAAC,MAAM,EAAE,QAAQ,GAAG,KAAK,EAC/C,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC,kCAGhE;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAgBpF;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,kCAahF;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAoBpF;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,~~kCAqBpF~~;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,kCAW9E;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAGpF;AAED,sEAAsE;AACtE,wBAAgB,aAAa,CAAC,KAAK,EAAE;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,kCAkB3E"}
1	+ {"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/combobox/combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,IAAI,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAEpE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAK9C;;;;;;;;;;;;GAYG;AACH,wBAAgB,QAAQ,CAAC,MAAM,EAAE,QAAQ,GAAG,KAAK,EAC/C,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC,kCAGhE;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAgBpF;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,kCAahF;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAoBpF;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAsBpF;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,kCAW9E;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAGpF;AAED,sEAAsE;AACtE,wBAAgB,aAAa,CAAC,KAAK,EAAE;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,kCAkB3E"}

package/dist/components/ui/combobox/combobox.js CHANGED Viewed

@@ -50,12 +50,16 @@ function ComboboxContent(props) {
 		return createComponent(Combobox.Content, mergeProps({ get ["class"]() {
 			return cn("bg-popover text-popover-foreground rounded-xl border border-border shadow-lg", "z-(--z-menu) max-h-72 min-w-(--kb-popper-anchor-width) origin-(--kb-combobox-content-transform-origin) overflow-hidden", "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", "data-expanded:duration-150 data-closed:duration-100", local.class);
 		} }, rest, { get children() {
-			return [createComponent(Combobox.Listbox, { get ["class"]() {
-				return cn("max-h-72 overflow-y-auto", "p-1");
-			} }), createComponent(Combobox.Arrow, {
-				"aria-hidden": "true",
-				"class": popoverArrow
-			})];
+			return [
+				createComponent(Combobox.Listbox, { get ["class"]() {
+					return cn("max-h-72 overflow-y-auto", "p-1");
+				} }),
+				memo(() => local.children),
+				createComponent(Combobox.Arrow, {
+					"aria-hidden": "true",
+					"class": popoverArrow
+				})
+			];
 		} }));
 	} });
 }

package/dist/components/ui/combobox/combobox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"combobox.js","names":["Combobox","KobalteCombobox","Check","ChevronDown","X","ComponentProps","Show","splitProps","menuContentPadding","menuItem","popoverArrow","cn","props","Option","OptGroup","_$createComponent","ComboboxControl","Control","local","rest","_$mergeProps","class","ComboboxInput","Input","ComboboxTrigger","Trigger","children","_$memo","Icon","ComboboxContent","Content","Portal","Listbox","Arrow","ComboboxItem","Item","ItemLabel","ItemIndicator","ComboboxSection","Section","ComboboxClear","onClear","when","_el$","_tmpl$","$$click","_$insert","_$effect","_$className","_$delegateEvents","Combobox","_$createComponent","KobalteCombobox","_$mergeProps","_$memo","_$className","_$delegateEvents"],"sources":["../../../../src/components/ui/combobox/combobox.tsx"],"sourcesContent":["import { Combobox as KobalteCombobox } from '@kobalte/core/combobox'\nimport { Check, ChevronDown, X } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { Show, splitProps } from 'solid-js'\nimport { menuContentPadding, menuItem, popoverArrow } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/*\n Combobox.\n \n A Select whose list is filterable by typing. The difference from Select is\n * not cosmetic: a Combobox has a text input, so the user can narrow forty\n * options to one without reading the list. Above roughly ten options the\n * search is the feature; below it, a Select is quieter and a RadioGroup is\n * better still.\n \n Kobalte supplies the filtering, the `aria-activedescendant` wiring, the\n * keyboard selection and the multiple-selection mode, which is the part a\n * hand-rolled version reliably gets wrong.\n /\nexport function Combobox<Option, OptGroup = never>(\n props: ComponentProps<typeof KobalteCombobox<Option, OptGroup>>\n) {\n return <KobalteCombobox {...props} />\n}\n\nexport function ComboboxControl(props: ComponentProps<typeof KobalteCombobox.Control>) {\n const [local, rest] = splitProps(props, ['class'])\n\n return (\n <KobalteCombobox.Control\n class={cn(\n 'border-input bg-transparent flex h-control-md w-full items-center gap-1.5 rounded-md border px-control-sm',\n 'transition-[color,box-shadow,border-color] ease-out',\n 'focus-within:border-ring focus-within:ring-3 focus-within:ring-primary-subtle',\n 'data-[invalid]:border-destructive data-[invalid]:ring-3 data-[invalid]:ring-destructive-subtle',\n 'data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50',\n local.class\n )}\n {...rest}\n />\n )\n}\n\nexport function ComboboxInput(props: ComponentProps<typeof KobalteCombobox.Input>) {\n const [local, rest] = splitProps(props, ['class'])\n\n return (\n <KobalteCombobox.Input\n class={cn(\n 'h-full flex-1 bg-transparent text-sm outline-none placeholder:text-muted-foreground',\n 'disabled:cursor-not-allowed',\n local.class\n )}\n {...rest}\n />\n )\n}\n\nexport function ComboboxTrigger(props: ComponentProps<typeof KobalteCombobox.Trigger>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteCombobox.Trigger\n class={cn(\n 'text-muted-foreground flex shrink-0 items-center justify-center rounded-sm outline-none',\n 'transition-colors ease-out hover:text-foreground',\n 'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n 'disabled:pointer-events-none disabled:opacity-50',\n local.class\n )}\n {...rest}\n >\n {local.children}\n <KobalteCombobox.Icon>\n <ChevronDown class=\"size-4\" />\n </KobalteCombobox.Icon>\n </KobalteCombobox.Trigger>\n )\n}\n\nexport function ComboboxContent(props: ComponentProps<typeof KobalteCombobox.Content>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteCombobox.Portal>\n <KobalteCombobox.Content\n class={cn(\n 'bg-popover text-popover-foreground rounded-xl border border-border shadow-lg',\n 'z-(--z-menu) max-h-72 min-w-(--kb-popper-anchor-width) origin-(--kb-combobox-content-transform-origin) overflow-hidden',\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 'data-expanded:duration-150 data-closed:duration-100',\n local.class\n )}\n {...rest}\n >\n <KobalteCombobox.Listbox class={cn('max-h-72 overflow-y-auto', menuContentPadding)} />\n <KobalteCombobox.Arrow aria-hidden=\"true\" class={popoverArrow} />\n </KobalteCombobox.Content>\n </KobalteCombobox.Portal>\n )\n}\n\nexport function ComboboxItem(props: ComponentProps<typeof KobalteCombobox.Item>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteCombobox.Item class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n <KobalteCombobox.ItemLabel>{local.children}</KobalteCombobox.ItemLabel>\n <KobalteCombobox.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n <Check class=\"size-4\" />\n </KobalteCombobox.ItemIndicator>\n </KobalteCombobox.Item>\n )\n}\n\nexport function ComboboxSection(props: ComponentProps<typeof KobalteCombobox.Section>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteCombobox.Section class={cn('flex flex-col', local.class)} {...rest} />\n}\n\n/* The clear affordance for a single-select Combobox with a value. */\nexport function ComboboxClear(props: { class?: string; onClear: () => void }) {\n return (\n <Show when={props.onClear}>\n <button\n type=\"button\"\n aria-label=\"Clear selection\"\n onClick={() => props.onClear()}\n class={cn(\n 'text-muted-foreground flex size-4 shrink-0 items-center justify-center rounded-sm',\n 'transition-colors ease-out outline-none hover:text-foreground',\n 'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n props.class\n )}\n >\n <X class=\"size-3.5\" />\n </button>\n </Show>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAoBA,SAAgBA,WACdY,OACA;CACA,OAAAG,gBAAQd,UAAoBW,KAAK;AACnC;AAEA,SAAgBI,gBAAgBJ,OAAuD;CACrF,MAAM,CAACM,OAAOC,QAAQZ,WAAWK,OAAO,CAAC,OAAO,CAAC;CAEjD,OAAAG,gBACGd,SAAgBgB,SAAOG,WAAA,EAAA,KAAA,WAAA;EAAA,OACfT,GACL,6GACA,uDACA,iFACA,kGACA,iEACAO,MAAMG,KACR;CAAC,EAAA,GACGF,IAAI,CAAA;AAGd;AAEA,SAAgBG,cAAcV,OAAqD;CACjF,MAAM,CAACM,OAAOC,QAAQZ,WAAWK,OAAO,CAAC,OAAO,CAAC;CAEjD,OAAAG,gBACGd,SAAgBsB,OAAKH,WAAA,EAAA,KAAA,WAAA;EAAA,OACbT,GACL,uFACA,+BACAO,MAAMG,KACR;CAAC,EAAA,GACGF,IAAI,CAAA;AAGd;AAEA,SAAgBK,gBAAgBZ,OAAuD;CACrF,MAAM,CAACM,OAAOC,QAAQZ,WAAWK,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAG,gBACGd,SAAgBwB,SAAOL,WAAA,EAAA,KAAA,WAAA;EAAA,OACfT,GACL,2FACA,oDACA,oFACA,oDACAO,MAAMG,KACR;CAAC,EAAA,GACGF,MAAI,EAAA,IAAAO,WAAA;EAAA,OAAA,CAAAC,WAEPT,MAAMQ,QAAQ,GAAAX,gBACdd,SAAgB2B,MAAI,EAAA,IAAAF,WAAA;GAAA,OAAAX,gBAClBZ,aAAW,EAAA,SAAA,SAAA,CAAA;EAAA,EAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAIpB;AAEA,SAAgB0B,gBAAgBjB,OAAuD;CACrF,MAAM,CAACM,OAAOC,QAAQZ,WAAWK,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAG,gBACGd,SAAgB8B,QAAM,EAAA,IAAAL,WAAA;EAAA,OAAAX,gBACpBd,SAAgB6B,SAAOV,WAAA,EAAA,KAAA,WAAA;GAAA,OACfT,GACL,gFACA,0HACA,6EACA,0EACA,uDACAO,MAAMG,KACR;EAAC,EAAA,GACGF,MAAI,EAAA,IAAAO,WAAA;GAAA,OAAA,~~CAAAX,~~gBAEPd,SAAgB+B,SAAO,EAAA,KAAA,WAAA;~~IAAA~~,OAAQrB,GAAG,4BAAA,KAA8C;~~GAAC~~,EAAA,CAAA,~~GAAAI~~,~~gBACjFd~~,SAAgBgC,OAAK;~~IAAA~~,eAAA;~~IAAA~~,SAA2BvB;~~GAAY~~,CAAA~~,CAAA~~;EAAA,EAAA,CAAA,CAAA;CAAA,EAAA,CAAA;AAIrE;AAEA,SAAgBwB,aAAatB,OAAoD;CAC/E,MAAM,CAACM,OAAOC,QAAQZ,WAAWK,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAG,gBACGd,SAAgBkC,MAAIf,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQT,GAAGF,UAAU,QAAQS,MAAMG,KAAK;CAAC,EAAA,GAAMF,MAAI,EAAA,IAAAO,WAAA;EAAA,OAAA,CAAAX,gBACrEd,SAAgBmC,WAAS,EAAA,IAAAV,WAAA;GAAA,OAAER,MAAMQ;EAAQ,EAAA,CAAA,GAAAX,gBACzCd,SAAgBoC,eAAa;GAAA,SAAA;GAAA,IAAAX,WAAA;IAAA,OAAAX,gBAC3Bb,OAAK,EAAA,SAAA,SAAA,CAAA;GAAA;EAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAId;AAEA,SAAgBoC,gBAAgB1B,OAAuD;CACrF,MAAM,CAACM,OAAOC,QAAQZ,WAAWK,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,gBAAQd,SAAgBsC,SAAOnB,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQT,GAAG,iBAAiBO,MAAMG,KAAK;CAAC,EAAA,GAAMF,IAAI,CAAA;AACnF;;AAGA,SAAgBqB,cAAc5B,OAAgD;CAC5E,OAAAG,gBACGT,MAAI;EAAA,IAACoC,OAAI;GAAA,OAAE9B,MAAM6B;EAAO;EAAA,IAAAf,WAAA;GAAA,IAAAiB,OAAAC,OAAA;GAAAD,KAAAE,gBAINjC,MAAM6B,QAAQ;GAACK,OAAAH,MAAA5B,gBAQ7BX,GAAC,EAAA,SAAA,WAAA,CAAA,CAAA;GAAA2C,aAAAC,UAAAL,MAPKhC,GACL,qFACA,iEACA,oFACAC,MAAMS,KACR,CAAC,CAAA;GAAA,OAAAsB;EAAA;CAAA,CAAA;AAMT;AAACM,eAAA,CAAA,OAAA,CAAA"}
1	+ {"version":3,"file":"combobox.js","names":["Combobox","KobalteCombobox","Check","ChevronDown","X","ComponentProps","Show","splitProps","menuContentPadding","menuItem","popoverArrow","cn","props","Option","OptGroup","_$createComponent","ComboboxControl","Control","local","rest","_$mergeProps","class","ComboboxInput","Input","ComboboxTrigger","Trigger","children","_$memo","Icon","ComboboxContent","Content","Portal","Listbox","Arrow","ComboboxItem","Item","ItemLabel","ItemIndicator","ComboboxSection","Section","ComboboxClear","onClear","when","_el$","_tmpl$","$$click","_$insert","_$effect","_$className","_$delegateEvents","Combobox","_$createComponent","KobalteCombobox","_$mergeProps","_$memo","_$className","_$delegateEvents"],"sources":["../../../../src/components/ui/combobox/combobox.tsx"],"sourcesContent":["import { Combobox as KobalteCombobox } from '@kobalte/core/combobox'\nimport { Check, ChevronDown, X } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { Show, splitProps } from 'solid-js'\nimport { menuContentPadding, menuItem, popoverArrow } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/*\n Combobox.\n \n A Select whose list is filterable by typing. The difference from Select is\n * not cosmetic: a Combobox has a text input, so the user can narrow forty\n * options to one without reading the list. Above roughly ten options the\n * search is the feature; below it, a Select is quieter and a RadioGroup is\n * better still.\n \n Kobalte supplies the filtering, the `aria-activedescendant` wiring, the\n * keyboard selection and the multiple-selection mode, which is the part a\n * hand-rolled version reliably gets wrong.\n /\nexport function Combobox<Option, OptGroup = never>(\n props: ComponentProps<typeof KobalteCombobox<Option, OptGroup>>\n) {\n return <KobalteCombobox {...props} />\n}\n\nexport function ComboboxControl(props: ComponentProps<typeof KobalteCombobox.Control>) {\n const [local, rest] = splitProps(props, ['class'])\n\n return (\n <KobalteCombobox.Control\n class={cn(\n 'border-input bg-transparent flex h-control-md w-full items-center gap-1.5 rounded-md border px-control-sm',\n 'transition-[color,box-shadow,border-color] ease-out',\n 'focus-within:border-ring focus-within:ring-3 focus-within:ring-primary-subtle',\n 'data-[invalid]:border-destructive data-[invalid]:ring-3 data-[invalid]:ring-destructive-subtle',\n 'data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50',\n local.class\n )}\n {...rest}\n />\n )\n}\n\nexport function ComboboxInput(props: ComponentProps<typeof KobalteCombobox.Input>) {\n const [local, rest] = splitProps(props, ['class'])\n\n return (\n <KobalteCombobox.Input\n class={cn(\n 'h-full flex-1 bg-transparent text-sm outline-none placeholder:text-muted-foreground',\n 'disabled:cursor-not-allowed',\n local.class\n )}\n {...rest}\n />\n )\n}\n\nexport function ComboboxTrigger(props: ComponentProps<typeof KobalteCombobox.Trigger>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteCombobox.Trigger\n class={cn(\n 'text-muted-foreground flex shrink-0 items-center justify-center rounded-sm outline-none',\n 'transition-colors ease-out hover:text-foreground',\n 'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n 'disabled:pointer-events-none disabled:opacity-50',\n local.class\n )}\n {...rest}\n >\n {local.children}\n <KobalteCombobox.Icon>\n <ChevronDown class=\"size-4\" />\n </KobalteCombobox.Icon>\n </KobalteCombobox.Trigger>\n )\n}\n\nexport function ComboboxContent(props: ComponentProps<typeof KobalteCombobox.Content>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteCombobox.Portal>\n <KobalteCombobox.Content\n class={cn(\n 'bg-popover text-popover-foreground rounded-xl border border-border shadow-lg',\n 'z-(--z-menu) max-h-72 min-w-(--kb-popper-anchor-width) origin-(--kb-combobox-content-transform-origin) overflow-hidden',\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 'data-expanded:duration-150 data-closed:duration-100',\n local.class\n )}\n {...rest}\n >\n <KobalteCombobox.Listbox class={cn('max-h-72 overflow-y-auto', menuContentPadding)} />\n {local.children}\n <KobalteCombobox.Arrow aria-hidden=\"true\" class={popoverArrow} />\n </KobalteCombobox.Content>\n </KobalteCombobox.Portal>\n )\n}\n\nexport function ComboboxItem(props: ComponentProps<typeof KobalteCombobox.Item>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteCombobox.Item class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n <KobalteCombobox.ItemLabel>{local.children}</KobalteCombobox.ItemLabel>\n <KobalteCombobox.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n <Check class=\"size-4\" />\n </KobalteCombobox.ItemIndicator>\n </KobalteCombobox.Item>\n )\n}\n\nexport function ComboboxSection(props: ComponentProps<typeof KobalteCombobox.Section>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteCombobox.Section class={cn('flex flex-col', local.class)} {...rest} />\n}\n\n/* The clear affordance for a single-select Combobox with a value. */\nexport function ComboboxClear(props: { class?: string; onClear: () => void }) {\n return (\n <Show when={props.onClear}>\n <button\n type=\"button\"\n aria-label=\"Clear selection\"\n onClick={() => props.onClear()}\n class={cn(\n 'text-muted-foreground flex size-4 shrink-0 items-center justify-center rounded-sm',\n 'transition-colors ease-out outline-none hover:text-foreground',\n 'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n props.class\n )}\n >\n <X class=\"size-3.5\" />\n </button>\n </Show>\n )\n}\n"],"mappings":"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"}

package/dist/components/ui/dialog/dialog.d.ts CHANGED Viewed

@@ -1,10 +1,10 @@
-import { Dialog as KobalteDialog } from '@kobalte/core/dialog';
+import { Dialog as KobalteDialog, Content as KobalteDialogContent, Overlay as KobalteDialogOverlay } from '@kobalte/core/dialog';
 import type { Accessor, ComponentProps, JSX } from 'solid-js';
 type DialogFocusRestorationOptions = {
     open: Accessor<boolean>;
     restoreFocusRef?: Accessor<HTMLElement | undefined>;
-    onOpenAutoFocus?: ComponentProps<typeof KobalteDialog.Content>['onOpenAutoFocus'];
-    onCloseAutoFocus?: ComponentProps<typeof KobalteDialog.Content>['onCloseAutoFocus'];
+    onOpenAutoFocus?: ComponentProps<typeof KobalteDialogContent>['onOpenAutoFocus'];
+    onCloseAutoFocus?: ComponentProps<typeof KobalteDialogContent>['onCloseAutoFocus'];
 };
 /**
  * Adds guarded opener capture and restoration to a Kobalte dialog content.
@@ -30,8 +30,8 @@ export declare function createDialogFocusRestoration({ open, restoreFocusRef, on
 export declare function Dialog(props: ComponentProps<typeof KobalteDialog>): JSX.Element;
 export declare function DialogTrigger(props: ComponentProps<typeof KobalteDialog.Trigger>): JSX.Element;
 export declare function DialogPortal(props: ComponentProps<typeof KobalteDialog.Portal>): JSX.Element;
-export declare function DialogOverlay(props: ComponentProps<typeof KobalteDialog.Overlay>): JSX.Element;
-export type DialogContentProps = ComponentProps<typeof KobalteDialog.Content> & {
+export declare function DialogOverlay(props: ComponentProps<typeof KobalteDialogOverlay>): JSX.Element;
+export type DialogContentProps = ComponentProps<typeof KobalteDialogContent> & {
     /**
      * Replaces the default close button. Pass `false` to remove it — only for a
      * dialog that cannot be dismissed (an update that must finish); anything the

package/dist/components/ui/dialog/dialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,~~EAAE~~,MAAM,IAAI,aAAa,~~EAAE~~,MAAM,sBAAsB,CAAA;~~AAE9D~~,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAwC7D,KAAK,6BAA6B,GAAG;IACnC,IAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAA;IACvB,eAAe,CAAC,EAAE,QAAQ,CAAC,WAAW,GAAG,SAAS,CAAC,CAAA;IACnD,eAAe,CAAC,EAAE,cAAc,CAAC,OAAO,~~aAAa~~,CAAC,~~OAAO,~~CAAC,~~CAAC,~~iBAAiB,CAAC,CAAA;~~IACjF~~,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,~~aAAa~~,CAAC,~~OAAO,~~CAAC,~~CAAC,~~kBAAkB,CAAC,CAAA;~~CACpF~~,CAAA;AAED;;;;GAIG;AACH,wBAAgB,4BAA4B,CAAC,EAC3C,IAAI,EACJ,eAAe,EACf,eAAe,EAAE,qBAAqB,EACtC,gBAAgB,EAAE,sBAAsB,GACzC,EAAE,6BAA6B;6BA6DE,KAAK;8BAyCJ,KAAK;EA8CvC;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,eAEjE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,eAEhF;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,MAAM,CAAC,eAE9E;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,~~aAAa~~,CAAC,~~OAAO,CAAC,eAYhF~~;AAED,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC,OAAO,~~aAAa~~,CAAC,~~OAAO,CAAC,~~GAAG;~~IAC9E~~;;;;OAIG;IACH,WAAW,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,KAAK,CAAA;CAClC,CAAA;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,eAiCtD;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASxD;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASxD;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,KAAK,CAAC,eAQ5E;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAKxF;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAGxF;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAGlF"}
1	+ {"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,IAAI,aAAa,EACvB,OAAO,IAAI,oBAAoB,EAC/B,OAAO,IAAI,oBAAoB,EAChC,MAAM,sBAAsB,CAAA;AAG7B,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAwC7D,KAAK,6BAA6B,GAAG;IACnC,IAAI,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAA;IACvB,eAAe,CAAC,EAAE,QAAQ,CAAC,WAAW,GAAG,SAAS,CAAC,CAAA;IACnD,eAAe,CAAC,EAAE,cAAc,CAAC,OAAO,oBAAoB,CAAC,CAAC,iBAAiB,CAAC,CAAA;IAChF,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,oBAAoB,CAAC,CAAC,kBAAkB,CAAC,CAAA;CACnF,CAAA;AAED;;;;GAIG;AACH,wBAAgB,4BAA4B,CAAC,EAC3C,IAAI,EACJ,eAAe,EACf,eAAe,EAAE,qBAAqB,EACtC,gBAAgB,EAAE,sBAAsB,GACzC,EAAE,6BAA6B;6BA6DE,KAAK;8BAyCJ,KAAK;EA8CvC;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,eAEjE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,eAEhF;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,MAAM,CAAC,eAE9E;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,oBAAoB,CAAC,eAY/E;AAED,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC,OAAO,oBAAoB,CAAC,GAAG;IAC7E;;;;OAIG;IACH,WAAW,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,KAAK,CAAA;CAClC,CAAA;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,eAiCtD;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASxD;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASxD;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,KAAK,CAAC,eAQ5E;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAKxF;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAGxF;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAGlF"}

package/dist/components/ui/dialog/dialog.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { overlayMotion, overlayPositioner, overlayScrim, overlaySurface } from "
 import { className, createComponent, insert, memo, mergeProps, spread, template } from "solid-js/web";
 import { X } from "lucide-solid";
 import { Show, createRenderEffect, onCleanup, splitProps } from "solid-js";
-import { Dialog } from "@kobalte/core/dialog";
+import { Content, Dialog, Overlay } from "@kobalte/core/dialog";
 //#region src/components/ui/dialog/dialog.tsx
 var _tmpl$ = /*#__PURE__*/ template(`<div>`);
 var _tmpl$2 = /*#__PURE__*/ template(`<div data-slot=dialog-header>`);
@@ -149,7 +149,7 @@ function DialogPortal(props) {
 }
 function DialogOverlay(props) {
 	const [local, rest] = splitProps(props, ["class"]);
-	return createComponent(Dialog.Overlay, mergeProps({ get ["class"]() {
+	return createComponent(Overlay, mergeProps({ get ["class"]() {
 		return cn(overlayScrim, "data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0", local.class);
 	} }, rest));
 }
@@ -163,7 +163,7 @@ function DialogContent(props) {
 		return [createComponent(DialogOverlay, {}), (() => {
 			var _el$ = _tmpl$();
 			className(_el$, overlayPositioner);
-			insert(_el$, createComponent(Dialog.Content, mergeProps({ get ["class"]() {
+			insert(_el$, createComponent(Content, mergeProps({ get ["class"]() {
 				return cn(overlaySurface, overlayMotion, "relative grid w-full max-w-lg gap-4 p-5", local.class);
 			} }, rest, { get children() {
 				return [memo(() => local.children), createComponent(Show, {

package/dist/components/ui/dialog/dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dialog.js","names":["Dialog","KobalteDialog","X","Accessor","ComponentProps","JSX","createRenderEffect","onCleanup","Show","splitProps","overlayMotion","overlayPositioner","overlayScrim","overlaySurface","cn","FocusCycle","content","HTMLElement","opener","openerEligible","closed","focusMovedOutside","closeAutoFocusScheduled","frame","fallbackTimer","observer","MutationObserver","onFocusIn","event","FocusEvent","canRestoreFocus","target","isConnected","document","body","documentElement","closest","matches","getClientRects","length","hasOtherOverlay","querySelectorAll","some","overlay","contains","DialogFocusRestorationOptions","open","restoreFocusRef","onOpenAutoFocus","Content","onCloseAutoFocus","createDialogFocusRestoration","callerOnOpenAutoFocus","callerOnCloseAutoFocus","focusCycles","WeakMap","activeFocusCycle","pendingOpener","pendingOpenerEligible","active","activeElement","finishFocusCycle","cycle","undefined","window","cancelAnimationFrame","clearTimeout","disconnect","removeEventListener","scheduleFocusRestore","requestAnimationFrame","focusIsAvailable","Node","focus","preventScroll","Event","element","currentTarget","openerWasCaptured","focusEvent","set","addEventListener","get","defaultPrevented","observe","attributes","attributeFilter","childList","subtree","queueMicrotask","setTimeout","props","_$createComponent","DialogTrigger","Trigger","DialogPortal","Portal","DialogOverlay","Overlay","local","rest","_$mergeProps","class","DialogContentProps","closeButton","Element","DialogContent","children","_el$","_tmpl$","_$className","_$insert","_$memo","when","CloseButton","DialogHeader","_el$2","_tmpl$2","_$spread","DialogFooter","_el$3","_tmpl$3","DialogTitle","Title","DialogDescription","Description","DialogCloseButton","DialogClose","Dialog","_$createComponent","KobalteDialog","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/dialog/dialog.tsx"],"sourcesContent":["import { Dialog as KobalteDialog } from '@kobalte/core/dialog'\nimport { X } from 'lucide-solid'\nimport type { Accessor, ComponentProps, JSX } from 'solid-js'\nimport { createRenderEffect, onCleanup, Show, splitProps } from 'solid-js'\nimport { overlayMotion, overlayPositioner, overlayScrim, overlaySurface } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\ntype FocusCycle = {\n content: HTMLElement\n opener: HTMLElement \| null\n openerEligible: boolean\n closed: boolean\n focusMovedOutside: boolean\n closeAutoFocusScheduled: boolean\n frame?: number\n fallbackTimer?: number\n observer?: MutationObserver\n onFocusIn: (event: FocusEvent) => void\n}\n\nfunction canRestoreFocus(target: HTMLElement): boolean {\n return (\n target.isConnected &&\n target !== document.body &&\n target !== document.documentElement &&\n !target.closest('[inert], [aria-hidden=\"true\"]') &&\n !target.matches(':disabled') &&\n target.getClientRects().length > 0\n )\n}\n\nfunction hasOtherOverlay(content: HTMLElement, opener: HTMLElement): boolean {\n return [...document.querySelectorAll<HTMLElement>('[role=\"dialog\"], [role=\"alertdialog\"]')].some(\n (overlay) =>\n overlay !== content &&\n !content.contains(overlay) &&\n !overlay.contains(opener) &&\n !overlay.closest('[aria-hidden=\"true\"], [inert]') &&\n overlay.getClientRects().length > 0\n )\n}\n\ntype DialogFocusRestorationOptions = {\n open: Accessor<boolean>\n restoreFocusRef?: Accessor<HTMLElement \| undefined>\n onOpenAutoFocus?: ComponentProps<typeof KobalteDialog.Content>['onOpenAutoFocus']\n onCloseAutoFocus?: ComponentProps<typeof KobalteDialog.Content>['onCloseAutoFocus']\n}\n\n/*\n Adds guarded opener capture and restoration to a Kobalte dialog content.\n * Composed surfaces use this internal helper; it is omitted from the public\n * dialog barrel so the restoration policy stays with the dialog components.\n /\nexport function createDialogFocusRestoration({\n open,\n restoreFocusRef,\n onOpenAutoFocus: callerOnOpenAutoFocus,\n onCloseAutoFocus: callerOnCloseAutoFocus,\n}: DialogFocusRestorationOptions) {\n const focusCycles = new WeakMap<HTMLElement, FocusCycle>()\n let activeFocusCycle: FocusCycle \| undefined\n let pendingOpener: HTMLElement \| null = null\n let pendingOpenerEligible = false\n\n createRenderEffect(() => {\n if (!open() \|\| typeof document === 'undefined') {\n pendingOpener = null\n pendingOpenerEligible = false\n return\n }\n const active = restoreFocusRef?.() ?? document.activeElement\n pendingOpener = active instanceof HTMLElement ? active : null\n pendingOpenerEligible = active instanceof HTMLElement && canRestoreFocus(active)\n })\n\n const finishFocusCycle = (cycle: FocusCycle) => {\n if (cycle.frame !== undefined) window.cancelAnimationFrame(cycle.frame)\n if (cycle.fallbackTimer !== undefined) window.clearTimeout(cycle.fallbackTimer)\n cycle.observer?.disconnect()\n document.removeEventListener('focusin', cycle.onFocusIn)\n if (activeFocusCycle === cycle) activeFocusCycle = undefined\n }\n\n const scheduleFocusRestore = (cycle: FocusCycle) => {\n if (cycle.frame !== undefined) return\n cycle.frame = window.requestAnimationFrame(() => {\n cycle.frame = undefined\n const opener = cycle.opener\n const active = document.activeElement\n const focusIsAvailable =\n active === document.body \|\|\n active === document.documentElement \|\|\n active === cycle.content \|\|\n (active instanceof Node && cycle.content.contains(active))\n if (\n activeFocusCycle !== cycle \|\|\n !cycle.closed \|\|\n cycle.focusMovedOutside \|\|\n !opener \|\|\n !opener.isConnected \|\|\n opener.matches(':disabled') \|\|\n opener.getClientRects().length === 0 \|\|\n !focusIsAvailable \|\|\n hasOtherOverlay(cycle.content, opener)\n ) {\n finishFocusCycle(cycle)\n return\n }\n\n // Inert and aria-hidden are removed by the dialog's containment cleanup.\n // Wait for that cleanup before returning focus to the original control.\n if (opener.closest('[inert], [aria-hidden=\"true\"]')) return\n if (cycle.openerEligible && canRestoreFocus(opener)) {\n opener.focus({ preventScroll: true })\n }\n finishFocusCycle(cycle)\n })\n }\n\n const onOpenAutoFocus = (event: Event) => {\n const element = event.currentTarget\n if (element instanceof HTMLElement) {\n if (activeFocusCycle) finishFocusCycle(activeFocusCycle)\n\n const openerWasCaptured = pendingOpener !== null\n const opener = pendingOpener ?? document.activeElement\n const openerEligible = openerWasCaptured\n ? pendingOpenerEligible\n : opener instanceof HTMLElement && canRestoreFocus(opener)\n pendingOpener = null\n pendingOpenerEligible = false\n const cycle: FocusCycle = {\n content: element,\n opener: opener instanceof HTMLElement ? opener : null,\n openerEligible,\n closed: false,\n focusMovedOutside: false,\n closeAutoFocusScheduled: false,\n onFocusIn: (focusEvent) => {\n const target = focusEvent.target\n if (\n !(target instanceof HTMLElement) \|\|\n target === document.body \|\|\n target === document.documentElement \|\|\n target === element \|\|\n element.contains(target) \|\|\n target === (opener instanceof HTMLElement ? opener : null)\n ) {\n return\n }\n cycle.focusMovedOutside = true\n },\n }\n focusCycles.set(element, cycle)\n activeFocusCycle = cycle\n document.addEventListener('focusin', cycle.onFocusIn)\n }\n callerOnOpenAutoFocus?.(event)\n }\n\n const onCloseAutoFocus = (event: Event) => {\n const element = event.currentTarget\n const cycle = element instanceof HTMLElement ? focusCycles.get(element) : undefined\n callerOnCloseAutoFocus?.(event)\n\n if (!cycle) return\n cycle.closed = true\n\n // A caller that prevents Kobalte's close autofocus owns the focus decision.\n if (event.defaultPrevented) {\n finishFocusCycle(cycle)\n return\n }\n\n if (cycle.fallbackTimer !== undefined) {\n window.clearTimeout(cycle.fallbackTimer)\n cycle.fallbackTimer = undefined\n }\n cycle.closeAutoFocusScheduled = true\n cycle.observer = new MutationObserver(() => scheduleFocusRestore(cycle))\n cycle.observer.observe(document.body, {\n attributes: true,\n attributeFilter: ['aria-hidden', 'inert'],\n childList: true,\n subtree: true,\n })\n scheduleFocusRestore(cycle)\n }\n\n onCleanup(() => {\n const cycle = activeFocusCycle\n if (!cycle) return\n cycle.closed = true\n\n // Kobalte dispatches unmount autofocus from a timer. This fallback only\n // releases the scoped focus listener if the content did not dispatch it.\n queueMicrotask(() => {\n if (cycle.closeAutoFocusScheduled) return\n cycle.fallbackTimer = window.setTimeout(() => {\n cycle.fallbackTimer = undefined\n if (!cycle.closeAutoFocusScheduled) finishFocusCycle(cycle)\n }, 0)\n })\n })\n\n return { onOpenAutoFocus, onCloseAutoFocus }\n}\n\n/\n Dialog.\n \n A modal surface for a decision or a short task. `Dialog.Portal` keeps the\n * panel out of the app's stacking and overflow contexts, `Dialog.Overlay`\n * dims what is behind it, and Kobalte handles the focus trap, the escape key,\n * scroll locking and returning focus to the trigger on close.\n \n The close button is part of the content rather than optional, because every\n * modal needs a way out that is not the keyboard. A dialog whose only exit is\n * Escape is a trap for anyone using a pointer.\n /\nexport function Dialog(props: ComponentProps<typeof KobalteDialog>) {\n return <KobalteDialog {...props} />\n}\n\nexport function DialogTrigger(props: ComponentProps<typeof KobalteDialog.Trigger>) {\n return <KobalteDialog.Trigger {...props} />\n}\n\nexport function DialogPortal(props: ComponentProps<typeof KobalteDialog.Portal>) {\n return <KobalteDialog.Portal {...props} />\n}\n\nexport function DialogOverlay(props: ComponentProps<typeof KobalteDialog.Overlay>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialog.Overlay\n class={cn(\n overlayScrim,\n 'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n local.class\n )}\n {...rest}\n />\n )\n}\n\nexport type DialogContentProps = ComponentProps<typeof KobalteDialog.Content> & {\n /\n Replaces the default close button. Pass `false` to remove it — only for a\n * dialog that cannot be dismissed (an update that must finish); anything the\n * user can escape from needs the button.\n /\n closeButton?: JSX.Element \| false\n}\n\nexport function DialogContent(props: DialogContentProps) {\n const [local, rest] = splitProps(props, ['class', 'children', 'closeButton'])\n\n return (\n <KobalteDialog.Portal>\n <DialogOverlay />\n <div class={overlayPositioner}>\n <KobalteDialog.Content\n class={cn(\n overlaySurface,\n overlayMotion,\n 'relative grid w-full max-w-lg gap-4 p-5',\n local.class\n )}\n {...rest}\n >\n {local.children}\n <Show when={local.closeButton !== false}>\n <KobalteDialog.CloseButton\n aria-label=\"Close\"\n class={cn(\n 'absolute top-3.5 end-3.5 rounded-md p-1 text-muted-foreground',\n 'transition-colors ease-out hover:bg-surface-hover hover:text-foreground',\n 'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle outline-none'\n )}\n >\n {local.closeButton ?? <X class=\"size-4\" />}\n </KobalteDialog.CloseButton>\n </Show>\n </KobalteDialog.Content>\n </div>\n </KobalteDialog.Portal>\n )\n}\n\nexport function DialogHeader(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"dialog-header\"\n class={cn('flex flex-col gap-1.5 pe-6 text-start', local.class)}\n {...rest}\n />\n )\n}\n\nexport function DialogFooter(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"dialog-footer\"\n class={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', local.class)}\n {...rest}\n />\n )\n}\n\nexport function DialogTitle(props: ComponentProps<typeof KobalteDialog.Title>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialog.Title\n class={cn('text-base leading-none font-semibold tracking-tight', local.class)}\n {...rest}\n />\n )\n}\n\nexport function DialogDescription(props: ComponentProps<typeof KobalteDialog.Description>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialog.Description class={cn('text-muted-foreground text-sm', local.class)} {...rest} />\n )\n}\n\nexport function DialogCloseButton(props: ComponentProps<typeof KobalteDialog.CloseButton>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDialog.CloseButton class={cn('focus-ring', local.class)} {...rest} />\n}\n\n/\n The close control, unstyled and polymorphic — for a footer's text \"Cancel\" or\n * \"Close\", which is a different control from the corner icon `DialogCloseButton`\n * draws. Take it as `as={Button}` so it carries the button's variants rather than\n * a copied class string.\n */\nexport function DialogClose(props: ComponentProps<typeof KobalteDialog.CloseButton>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDialog.CloseButton class={cn('focus-ring', local.class)} {...rest} />\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"dialog.js","names":["Dialog","KobalteDialog","Content","KobalteDialogContent","Overlay","KobalteDialogOverlay","X","Accessor","ComponentProps","JSX","createRenderEffect","onCleanup","Show","splitProps","overlayMotion","overlayPositioner","overlayScrim","overlaySurface","cn","FocusCycle","content","HTMLElement","opener","openerEligible","closed","focusMovedOutside","closeAutoFocusScheduled","frame","fallbackTimer","observer","MutationObserver","onFocusIn","event","FocusEvent","canRestoreFocus","target","isConnected","document","body","documentElement","closest","matches","getClientRects","length","hasOtherOverlay","querySelectorAll","some","overlay","contains","DialogFocusRestorationOptions","open","restoreFocusRef","onOpenAutoFocus","onCloseAutoFocus","createDialogFocusRestoration","callerOnOpenAutoFocus","callerOnCloseAutoFocus","focusCycles","WeakMap","activeFocusCycle","pendingOpener","pendingOpenerEligible","active","activeElement","finishFocusCycle","cycle","undefined","window","cancelAnimationFrame","clearTimeout","disconnect","removeEventListener","scheduleFocusRestore","requestAnimationFrame","focusIsAvailable","Node","focus","preventScroll","Event","element","currentTarget","openerWasCaptured","focusEvent","set","addEventListener","get","defaultPrevented","observe","attributes","attributeFilter","childList","subtree","queueMicrotask","setTimeout","props","_$createComponent","DialogTrigger","Trigger","DialogPortal","Portal","DialogOverlay","local","rest","_$mergeProps","class","DialogContentProps","closeButton","Element","DialogContent","children","_el$","_tmpl$","_$className","_$insert","_$memo","when","CloseButton","DialogHeader","_el$2","_tmpl$2","_$spread","DialogFooter","_el$3","_tmpl$3","DialogTitle","Title","DialogDescription","Description","DialogCloseButton","DialogClose","Dialog","_$createComponent","KobalteDialog","KobalteDialogOverlay","_$mergeProps","KobalteDialogContent","_$memo"],"sources":["../../../../src/components/ui/dialog/dialog.tsx"],"sourcesContent":["import {\n Dialog as KobalteDialog,\n Content as KobalteDialogContent,\n Overlay as KobalteDialogOverlay,\n} from '@kobalte/core/dialog'\n// AlertDialog assigns to the shared DialogRoot.Content object, so these named exports stay role-stable.\nimport { X } from 'lucide-solid'\nimport type { Accessor, ComponentProps, JSX } from 'solid-js'\nimport { createRenderEffect, onCleanup, Show, splitProps } from 'solid-js'\nimport { overlayMotion, overlayPositioner, overlayScrim, overlaySurface } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\ntype FocusCycle = {\n content: HTMLElement\n opener: HTMLElement \| null\n openerEligible: boolean\n closed: boolean\n focusMovedOutside: boolean\n closeAutoFocusScheduled: boolean\n frame?: number\n fallbackTimer?: number\n observer?: MutationObserver\n onFocusIn: (event: FocusEvent) => void\n}\n\nfunction canRestoreFocus(target: HTMLElement): boolean {\n return (\n target.isConnected &&\n target !== document.body &&\n target !== document.documentElement &&\n !target.closest('[inert], [aria-hidden=\"true\"]') &&\n !target.matches(':disabled') &&\n target.getClientRects().length > 0\n )\n}\n\nfunction hasOtherOverlay(content: HTMLElement, opener: HTMLElement): boolean {\n return [...document.querySelectorAll<HTMLElement>('[role=\"dialog\"], [role=\"alertdialog\"]')].some(\n (overlay) =>\n overlay !== content &&\n !content.contains(overlay) &&\n !overlay.contains(opener) &&\n !overlay.closest('[aria-hidden=\"true\"], [inert]') &&\n overlay.getClientRects().length > 0\n )\n}\n\ntype DialogFocusRestorationOptions = {\n open: Accessor<boolean>\n restoreFocusRef?: Accessor<HTMLElement \| undefined>\n onOpenAutoFocus?: ComponentProps<typeof KobalteDialogContent>['onOpenAutoFocus']\n onCloseAutoFocus?: ComponentProps<typeof KobalteDialogContent>['onCloseAutoFocus']\n}\n\n/*\n Adds guarded opener capture and restoration to a Kobalte dialog content.\n * Composed surfaces use this internal helper; it is omitted from the public\n * dialog barrel so the restoration policy stays with the dialog components.\n /\nexport function createDialogFocusRestoration({\n open,\n restoreFocusRef,\n onOpenAutoFocus: callerOnOpenAutoFocus,\n onCloseAutoFocus: callerOnCloseAutoFocus,\n}: DialogFocusRestorationOptions) {\n const focusCycles = new WeakMap<HTMLElement, FocusCycle>()\n let activeFocusCycle: FocusCycle \| undefined\n let pendingOpener: HTMLElement \| null = null\n let pendingOpenerEligible = false\n\n createRenderEffect(() => {\n if (!open() \|\| typeof document === 'undefined') {\n pendingOpener = null\n pendingOpenerEligible = false\n return\n }\n const active = restoreFocusRef?.() ?? document.activeElement\n pendingOpener = active instanceof HTMLElement ? active : null\n pendingOpenerEligible = active instanceof HTMLElement && canRestoreFocus(active)\n })\n\n const finishFocusCycle = (cycle: FocusCycle) => {\n if (cycle.frame !== undefined) window.cancelAnimationFrame(cycle.frame)\n if (cycle.fallbackTimer !== undefined) window.clearTimeout(cycle.fallbackTimer)\n cycle.observer?.disconnect()\n document.removeEventListener('focusin', cycle.onFocusIn)\n if (activeFocusCycle === cycle) activeFocusCycle = undefined\n }\n\n const scheduleFocusRestore = (cycle: FocusCycle) => {\n if (cycle.frame !== undefined) return\n cycle.frame = window.requestAnimationFrame(() => {\n cycle.frame = undefined\n const opener = cycle.opener\n const active = document.activeElement\n const focusIsAvailable =\n active === document.body \|\|\n active === document.documentElement \|\|\n active === cycle.content \|\|\n (active instanceof Node && cycle.content.contains(active))\n if (\n activeFocusCycle !== cycle \|\|\n !cycle.closed \|\|\n cycle.focusMovedOutside \|\|\n !opener \|\|\n !opener.isConnected \|\|\n opener.matches(':disabled') \|\|\n opener.getClientRects().length === 0 \|\|\n !focusIsAvailable \|\|\n hasOtherOverlay(cycle.content, opener)\n ) {\n finishFocusCycle(cycle)\n return\n }\n\n // Inert and aria-hidden are removed by the dialog's containment cleanup.\n // Wait for that cleanup before returning focus to the original control.\n if (opener.closest('[inert], [aria-hidden=\"true\"]')) return\n if (cycle.openerEligible && canRestoreFocus(opener)) {\n opener.focus({ preventScroll: true })\n }\n finishFocusCycle(cycle)\n })\n }\n\n const onOpenAutoFocus = (event: Event) => {\n const element = event.currentTarget\n if (element instanceof HTMLElement) {\n if (activeFocusCycle) finishFocusCycle(activeFocusCycle)\n\n const openerWasCaptured = pendingOpener !== null\n const opener = pendingOpener ?? document.activeElement\n const openerEligible = openerWasCaptured\n ? pendingOpenerEligible\n : opener instanceof HTMLElement && canRestoreFocus(opener)\n pendingOpener = null\n pendingOpenerEligible = false\n const cycle: FocusCycle = {\n content: element,\n opener: opener instanceof HTMLElement ? opener : null,\n openerEligible,\n closed: false,\n focusMovedOutside: false,\n closeAutoFocusScheduled: false,\n onFocusIn: (focusEvent) => {\n const target = focusEvent.target\n if (\n !(target instanceof HTMLElement) \|\|\n target === document.body \|\|\n target === document.documentElement \|\|\n target === element \|\|\n element.contains(target) \|\|\n target === (opener instanceof HTMLElement ? opener : null)\n ) {\n return\n }\n cycle.focusMovedOutside = true\n },\n }\n focusCycles.set(element, cycle)\n activeFocusCycle = cycle\n document.addEventListener('focusin', cycle.onFocusIn)\n }\n callerOnOpenAutoFocus?.(event)\n }\n\n const onCloseAutoFocus = (event: Event) => {\n const element = event.currentTarget\n const cycle = element instanceof HTMLElement ? focusCycles.get(element) : undefined\n callerOnCloseAutoFocus?.(event)\n\n if (!cycle) return\n cycle.closed = true\n\n // A caller that prevents Kobalte's close autofocus owns the focus decision.\n if (event.defaultPrevented) {\n finishFocusCycle(cycle)\n return\n }\n\n if (cycle.fallbackTimer !== undefined) {\n window.clearTimeout(cycle.fallbackTimer)\n cycle.fallbackTimer = undefined\n }\n cycle.closeAutoFocusScheduled = true\n cycle.observer = new MutationObserver(() => scheduleFocusRestore(cycle))\n cycle.observer.observe(document.body, {\n attributes: true,\n attributeFilter: ['aria-hidden', 'inert'],\n childList: true,\n subtree: true,\n })\n scheduleFocusRestore(cycle)\n }\n\n onCleanup(() => {\n const cycle = activeFocusCycle\n if (!cycle) return\n cycle.closed = true\n\n // Kobalte dispatches unmount autofocus from a timer. This fallback only\n // releases the scoped focus listener if the content did not dispatch it.\n queueMicrotask(() => {\n if (cycle.closeAutoFocusScheduled) return\n cycle.fallbackTimer = window.setTimeout(() => {\n cycle.fallbackTimer = undefined\n if (!cycle.closeAutoFocusScheduled) finishFocusCycle(cycle)\n }, 0)\n })\n })\n\n return { onOpenAutoFocus, onCloseAutoFocus }\n}\n\n/\n Dialog.\n \n A modal surface for a decision or a short task. `Dialog.Portal` keeps the\n * panel out of the app's stacking and overflow contexts, `Dialog.Overlay`\n * dims what is behind it, and Kobalte handles the focus trap, the escape key,\n * scroll locking and returning focus to the trigger on close.\n \n The close button is part of the content rather than optional, because every\n * modal needs a way out that is not the keyboard. A dialog whose only exit is\n * Escape is a trap for anyone using a pointer.\n /\nexport function Dialog(props: ComponentProps<typeof KobalteDialog>) {\n return <KobalteDialog {...props} />\n}\n\nexport function DialogTrigger(props: ComponentProps<typeof KobalteDialog.Trigger>) {\n return <KobalteDialog.Trigger {...props} />\n}\n\nexport function DialogPortal(props: ComponentProps<typeof KobalteDialog.Portal>) {\n return <KobalteDialog.Portal {...props} />\n}\n\nexport function DialogOverlay(props: ComponentProps<typeof KobalteDialogOverlay>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialogOverlay\n class={cn(\n overlayScrim,\n 'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n local.class\n )}\n {...rest}\n />\n )\n}\n\nexport type DialogContentProps = ComponentProps<typeof KobalteDialogContent> & {\n /\n Replaces the default close button. Pass `false` to remove it — only for a\n * dialog that cannot be dismissed (an update that must finish); anything the\n * user can escape from needs the button.\n /\n closeButton?: JSX.Element \| false\n}\n\nexport function DialogContent(props: DialogContentProps) {\n const [local, rest] = splitProps(props, ['class', 'children', 'closeButton'])\n\n return (\n <KobalteDialog.Portal>\n <DialogOverlay />\n <div class={overlayPositioner}>\n <KobalteDialogContent\n class={cn(\n overlaySurface,\n overlayMotion,\n 'relative grid w-full max-w-lg gap-4 p-5',\n local.class\n )}\n {...rest}\n >\n {local.children}\n <Show when={local.closeButton !== false}>\n <KobalteDialog.CloseButton\n aria-label=\"Close\"\n class={cn(\n 'absolute top-3.5 end-3.5 rounded-md p-1 text-muted-foreground',\n 'transition-colors ease-out hover:bg-surface-hover hover:text-foreground',\n 'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle outline-none'\n )}\n >\n {local.closeButton ?? <X class=\"size-4\" />}\n </KobalteDialog.CloseButton>\n </Show>\n </KobalteDialogContent>\n </div>\n </KobalteDialog.Portal>\n )\n}\n\nexport function DialogHeader(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"dialog-header\"\n class={cn('flex flex-col gap-1.5 pe-6 text-start', local.class)}\n {...rest}\n />\n )\n}\n\nexport function DialogFooter(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"dialog-footer\"\n class={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', local.class)}\n {...rest}\n />\n )\n}\n\nexport function DialogTitle(props: ComponentProps<typeof KobalteDialog.Title>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialog.Title\n class={cn('text-base leading-none font-semibold tracking-tight', local.class)}\n {...rest}\n />\n )\n}\n\nexport function DialogDescription(props: ComponentProps<typeof KobalteDialog.Description>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialog.Description class={cn('text-muted-foreground text-sm', local.class)} {...rest} />\n )\n}\n\nexport function DialogCloseButton(props: ComponentProps<typeof KobalteDialog.CloseButton>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDialog.CloseButton class={cn('focus-ring', local.class)} {...rest} />\n}\n\n/\n The close control, unstyled and polymorphic — for a footer's text \"Cancel\" or\n * \"Close\", which is a different control from the corner icon `DialogCloseButton`\n * draws. Take it as `as={Button}` so it carries the button's variants rather than\n * a copied class string.\n */\nexport function DialogClose(props: ComponentProps<typeof KobalteDialog.CloseButton>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDialog.CloseButton class={cn('focus-ring', local.class)} {...rest} />\n}\n"],"mappings":"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"}

package/dist/components/ui/sheet/sheet.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { Dialog as KobalteDialog } from '@kobalte/core/dialog';
+import { Dialog as KobalteDialog, Content as KobalteDialogContent } from '@kobalte/core/dialog';
 import type { ComponentProps, JSX } from 'solid-js';
 import { type VariantProps } from '#lib/variants';
 /**
@@ -16,7 +16,7 @@ import { type VariantProps } from '#lib/variants';
 declare const sheetVariants: (props?: ({
     side?: "bottom" | "end" | "start" | "top" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-export type SheetContentProps = ComponentProps<typeof KobalteDialog.Content> & VariantProps<typeof sheetVariants> & {
+export type SheetContentProps = ComponentProps<typeof KobalteDialogContent> & VariantProps<typeof sheetVariants> & {
     closeButton?: JSX.Element | false;
 };
 export declare function SheetContent(props: SheetContentProps): JSX.Element;

package/dist/components/ui/sheet/sheet.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sheet.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/sheet/sheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,sBAAsB,CAAA;~~AAE9D~~,OAAO,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAEnD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAA;AAItD;;;;;;;;;;;GAWG;AACH,QAAA,MAAM,aAAa;;8EAelB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,~~aAAa~~,CAAC,~~OAAO~~,~~CAAC,GAC1E,~~YAAY,CAAC,OAAO,aAAa,CAAC,GAAG;IACnC,WAAW,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,KAAK,CAAA;CAClC,CAAA;AAEH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,eA2BpD;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,eAEhE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,eAE/E;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAGvF;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASvD;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASrD;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASvD;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,KAAK,CAAC,eAK3E;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAKvF;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}
1	+ {"version":3,"file":"sheet.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/sheet/sheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,sBAAsB,CAAA;AAG/F,OAAO,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAEnD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAA;AAItD;;;;;;;;;;;GAWG;AACH,QAAA,MAAM,aAAa;;8EAelB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,oBAAoB,CAAC,GACzE,YAAY,CAAC,OAAO,aAAa,CAAC,GAAG;IACnC,WAAW,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,KAAK,CAAA;CAClC,CAAA;AAEH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,eA2BpD;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,eAEhE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,eAE/E;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAGvF;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASvD;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASrD;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,eASvD;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,KAAK,CAAC,eAK3E;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,eAKvF;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}

package/dist/components/ui/sheet/sheet.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { DialogOverlay } from "../dialog/dialog.js";
 import { createComponent, memo, mergeProps, spread, template } from "solid-js/web";
 import { X } from "lucide-solid";
 import { Show, splitProps } from "solid-js";
-import { Dialog } from "@kobalte/core/dialog";
+import { Content, Dialog } from "@kobalte/core/dialog";
 //#region src/components/ui/sheet/sheet.tsx
 var _tmpl$ = /*#__PURE__*/ template(`<div data-slot=sheet-header>`);
 var _tmpl$2 = /*#__PURE__*/ template(`<div data-slot=sheet-body>`);
@@ -38,7 +38,7 @@ function SheetContent(props) {
 		"closeButton"
 	]);
 	return createComponent(Dialog.Portal, { get children() {
-		return [createComponent(DialogOverlay, {}), createComponent(Dialog.Content, mergeProps({ get ["class"]() {
+		return [createComponent(DialogOverlay, {}), createComponent(Content, mergeProps({ get ["class"]() {
 			return cn(sheetVariants({ side: local.side }), "data-expanded:animate-in data-expanded:fade-in-0 data-expanded:duration-200", "data-closed:animate-out data-closed:fade-out-0 data-closed:duration-150", local.class);
 		} }, rest, { get children() {
 			return [memo(() => local.children), createComponent(Show, {

package/dist/components/ui/sheet/sheet.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sheet.js","names":["Dialog","KobalteDialog","X","ComponentProps","JSX","Show","splitProps","cva","VariantProps","cn","DialogOverlay","sheetVariants","variants","side","top","bottom","start","end","defaultVariants","SheetContentProps","~~Content","~~closeButton","Element","SheetContent","props","local","rest","_$createComponent","Portal","children","_$mergeProps","class","_$memo","when","CloseButton","Sheet","SheetTrigger","Trigger","SheetCloseButton","SheetHeader","_el$","_tmpl$","_$spread","SheetBody","_el$2","_tmpl$2","SheetFooter","_el$3","_tmpl$3","SheetTitle","Title","SheetDescription","Description","_$createComponent","KobalteDialog","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/sheet/sheet.tsx"],"sourcesContent":["import { Dialog as KobalteDialog } from '@kobalte/core/dialog'\nimport { X } from 'lucide-solid'\nimport type { ComponentProps, JSX } from 'solid-js'\nimport { Show, splitProps } from 'solid-js'\nimport { cva, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\nimport { DialogOverlay } from '../dialog/dialog'\n\n/*\n Sheet.\n \n A dialog anchored to an edge of the window rather than centred. Use it when\n * the content is a panel beside the work — a details inspector, a filter rail,\n * a settings flyout — so the user keeps the context it belongs to in view.\n * A centred dialog interrupts; a sheet is inspected.\n \n `side` decides which edge; the panel is a full-height column for `start` and\n * `end`, and a full-width row for `top` and `bottom`. The slide-in direction\n * follows from the side, so a caller never pairs them by hand.\n */\nconst sheetVariants = cva(\n 'bg-popover text-popover-foreground fixed z-(--z-dialog) flex flex-col gap-4 border-border shadow-lg',\n {\n variants: {\n side: {\n top: 'inset-x-0 top-0 h-auto max-h-[85vh] rounded-b-xl border-b data-expanded:slide-in-from-top data-closed:slide-out-to-top',\n bottom:\n 'inset-x-0 bottom-0 h-auto max-h-[85vh] rounded-t-xl border-t data-expanded:slide-in-from-bottom data-closed:slide-out-to-bottom',\n start:\n 'inset-y-0 start-0 h-full w-80 max-w-[85vw] rounded-e-xl border-e data-expanded:slide-in-from-left data-closed:slide-out-to-left',\n end: 'inset-y-0 end-0 h-full w-80 max-w-[85vw] rounded-s-xl border-s data-expanded:slide-in-from-right data-closed:slide-out-to-right',\n },\n },\n defaultVariants: { side: 'end' },\n }\n)\n\nexport type SheetContentProps = ComponentProps<typeof ~~KobalteDialog.Content~~> &\n VariantProps<typeof sheetVariants> & {\n closeButton?: JSX.Element \| false\n }\n\nexport function SheetContent(props: SheetContentProps) {\n const [local, rest] = splitProps(props, ['class', 'side', 'children', 'closeButton'])\n\n return (\n <KobalteDialog.Portal>\n <DialogOverlay />\n <~~KobalteDialog.Content~~\n class={cn(\n sheetVariants({ side: local.side }),\n 'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:duration-200',\n 'data-closed:animate-out data-closed:fade-out-0 data-closed:duration-150',\n local.class\n )}\n {...rest}\n >\n {local.children}\n <Show when={local.closeButton !== false}>\n <KobalteDialog.CloseButton\n aria-label=\"Close\"\n class=\"absolute top-3.5 end-3.5 rounded-md p-1 text-muted-foreground transition-colors ease-out outline-none hover:bg-surface-hover hover:text-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle\"\n >\n {local.closeButton ?? <X class=\"size-4\" />}\n </KobalteDialog.CloseButton>\n </Show>\n </~~KobalteDialog.Content~~>\n </KobalteDialog.Portal>\n )\n}\n\nexport function Sheet(props: ComponentProps<typeof KobalteDialog>) {\n return <KobalteDialog {...props} />\n}\n\nexport function SheetTrigger(props: ComponentProps<typeof KobalteDialog.Trigger>) {\n return <KobalteDialog.Trigger {...props} />\n}\n\nexport function SheetCloseButton(props: ComponentProps<typeof KobalteDialog.CloseButton>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDialog.CloseButton class={cn(local.class)} {...rest} />\n}\n\nexport function SheetHeader(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"sheet-header\"\n class={cn('flex flex-col gap-1.5 border-b border-border p-4 pe-12 text-start', local.class)}\n {...rest}\n />\n )\n}\n\nexport function SheetBody(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"sheet-body\"\n class={cn('flex-1 overflow-y-auto px-4 pb-4', local.class)}\n {...rest}\n />\n )\n}\n\nexport function SheetFooter(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"sheet-footer\"\n class={cn('flex items-center justify-end gap-2 border-t border-border p-4', local.class)}\n {...rest}\n />\n )\n}\n\nexport function SheetTitle(props: ComponentProps<typeof KobalteDialog.Title>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialog.Title class={cn('text-sm leading-none font-semibold', local.class)} {...rest} />\n )\n}\n\nexport function SheetDescription(props: ComponentProps<typeof KobalteDialog.Description>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialog.Description class={cn('text-muted-foreground text-sm', local.class)} {...rest} />\n )\n}\n\nexport { sheetVariants }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;~~AAoBA~~,~~IAAMW~~,gBAAgBJ,IACpB,uGACA;CACEK,UAAU,EACRC,MAAM;EACJC,KAAK;EACLC,QACE;EACFC,OACE;EACFC,KAAK;CACP,EACF;CACAC,iBAAiB,EAAEL,MAAM,MAAM;AACjC,CACF;AAOA,~~SAAgBU~~,aAAaC,OAA0B;CACrD,MAAM,CAACC,OAAOC,~~QAAQpB~~,~~WAAWkB~~,OAAO;EAAC;EAAS;EAAQ;EAAY;CAAa,CAAC;CAEpF,OAAAG,~~gBACG1B~~,~~OAAc2B~~,QAAM,EAAA,IAAAC,WAAA;EAAA,OAAA,CAAAF,~~gBAClBjB~~,eAAa,CAAA,CAAA,~~GAAAiB~~,~~gBACb1B~~,~~OAAcmB~~,~~SAAOU,~~WAAA,EAAA,KAAA,WAAA;GAAA,~~OACbrB~~,GACLE,cAAc,EAAEE,~~MAAMY~~,~~MAAMZ~~,KAAK,CAAC,GAClC,+EACA,~~2EACAY~~,MAAMM,KACR;EAAC,EAAA,GACGL,MAAI,EAAA,IAAAG,WAAA;GAAA,OAAA,CAAAG,WAEPP,MAAMI,QAAQ,GAAAF,~~gBACdtB~~,MAAI;IAAA,~~IAAC4B~~,OAAI;KAAA,OAAER,MAAMJ,gBAAgB;IAAK;IAAA,IAAAQ,WAAA;KAAA,OAAAF,~~gBACpC1B~~,~~OAAciC~~,aAAW;MAAA,cAAA;MAAA,SAAA;MAAA,IAAAL,WAAA;OAAA,OAIvBJ,MAAMJ,eAAWM,~~gBAAKzB~~,GAAC,EAAA,SAAA,SAAA,CAAA;MAAkB;KAAA,CAAA;IAAA;GAAA,CAAA,CAAA;EAAA,EAAA,CAAA,CAAA,CAAA;CAAA,EAAA,CAAA;AAMtD;AAEA,~~SAAgBiC~~,MAAMX,OAA6C;CACjE,OAAAG,~~gBAAQ1B~~,~~QAAkBuB~~,KAAK;AACjC;AAEA,SAAgBY,aAAaZ,OAAqD;CAChF,OAAAG,~~gBAAQ1B~~,~~OAAcoC~~,SAAYb,KAAK;AACzC;AAEA,SAAgBc,iBAAiBd,OAAyD;CACxF,MAAM,CAACC,OAAOC,~~QAAQpB~~,~~WAAWkB~~,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,~~gBAAQ1B~~,~~OAAciC~~,aAAWJ,WAAA,EAAA,KAAA,WAAA;EAAA,~~OAAQrB~~,~~GAAGgB~~,MAAMM,KAAK;CAAC,EAAA,GAAML,IAAI,CAAA;AACpE;AAEA,SAAgBa,YAAYf,OAA8B;CACxD,MAAM,CAACC,OAAOC,~~QAAQpB~~,~~WAAWkB~~,OAAO,CAAC,OAAO,CAAC;CACjD,cAAA;EAAA,IAAAgB,OAAAC,OAAA;EAAAC,OAAAF,MAAAV,WAAA,EAAA,KAAA,WAAA;GAAA,~~OAGWrB~~,GAAG,~~qEAAqEgB~~,MAAMM,KAAK;EAAC,EAAA,GACvFL,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAc;CAAA,EAAA,CAAA;AAGd;AAEA,SAAgBG,UAAUnB,OAA8B;CACtD,MAAM,CAACC,OAAOC,~~QAAQpB~~,~~WAAWkB~~,OAAO,CAAC,OAAO,CAAC;CACjD,cAAA;EAAA,IAAAoB,QAAAC,QAAA;EAAAH,OAAAE,OAAAd,WAAA,EAAA,KAAA,WAAA;GAAA,~~OAGWrB~~,GAAG,~~oCAAoCgB~~,MAAMM,KAAK;EAAC,EAAA,GACtDL,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAkB;CAAA,EAAA,CAAA;AAGd;AAEA,SAAgBE,YAAYtB,OAA8B;CACxD,MAAM,CAACC,OAAOC,~~QAAQpB~~,~~WAAWkB~~,OAAO,CAAC,OAAO,CAAC;CACjD,cAAA;EAAA,IAAAuB,QAAAC,QAAA;EAAAN,OAAAK,OAAAjB,WAAA,EAAA,KAAA,WAAA;GAAA,~~OAGWrB~~,GAAG,~~kEAAkEgB~~,MAAMM,KAAK;EAAC,EAAA,GACpFL,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAqB;CAAA,EAAA,CAAA;AAGd;AAEA,SAAgBE,WAAWzB,OAAmD;CAC5E,MAAM,CAACC,OAAOC,~~QAAQpB~~,~~WAAWkB~~,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,~~gBACG1B~~,~~OAAciD~~,OAAKpB,WAAA,EAAA,KAAA,WAAA;EAAA,~~OAAQrB~~,GAAG,~~sCAAsCgB~~,MAAMM,KAAK;CAAC,EAAA,GAAML,IAAI,CAAA;AAE/F;AAEA,SAAgByB,iBAAiB3B,OAAyD;CACxF,MAAM,CAACC,OAAOC,~~QAAQpB~~,~~WAAWkB~~,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,~~gBACG1B~~,~~OAAcmD~~,aAAWtB,WAAA,EAAA,KAAA,WAAA;EAAA,~~OAAQrB~~,GAAG,~~iCAAiCgB~~,MAAMM,KAAK;CAAC,EAAA,GAAML,IAAI,CAAA;AAEhG"}
1	+ {"version":3,"file":"sheet.js","names":["Dialog","KobalteDialog","Content","KobalteDialogContent","X","ComponentProps","JSX","Show","splitProps","cva","VariantProps","cn","DialogOverlay","sheetVariants","variants","side","top","bottom","start","end","defaultVariants","SheetContentProps","closeButton","Element","SheetContent","props","local","rest","_$createComponent","Portal","children","_$mergeProps","class","_$memo","when","CloseButton","Sheet","SheetTrigger","Trigger","SheetCloseButton","SheetHeader","_el$","_tmpl$","_$spread","SheetBody","_el$2","_tmpl$2","SheetFooter","_el$3","_tmpl$3","SheetTitle","Title","SheetDescription","Description","_$createComponent","KobalteDialog","KobalteDialogContent","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/sheet/sheet.tsx"],"sourcesContent":["import { Dialog as KobalteDialog, Content as KobalteDialogContent } from '@kobalte/core/dialog'\n// AlertDialog shares DialogRoot.Content; Sheet uses the stable named primitive.\nimport { X } from 'lucide-solid'\nimport type { ComponentProps, JSX } from 'solid-js'\nimport { Show, splitProps } from 'solid-js'\nimport { cva, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\nimport { DialogOverlay } from '../dialog/dialog'\n\n/*\n Sheet.\n \n A dialog anchored to an edge of the window rather than centred. Use it when\n * the content is a panel beside the work — a details inspector, a filter rail,\n * a settings flyout — so the user keeps the context it belongs to in view.\n * A centred dialog interrupts; a sheet is inspected.\n \n `side` decides which edge; the panel is a full-height column for `start` and\n * `end`, and a full-width row for `top` and `bottom`. The slide-in direction\n * follows from the side, so a caller never pairs them by hand.\n */\nconst sheetVariants = cva(\n 'bg-popover text-popover-foreground fixed z-(--z-dialog) flex flex-col gap-4 border-border shadow-lg',\n {\n variants: {\n side: {\n top: 'inset-x-0 top-0 h-auto max-h-[85vh] rounded-b-xl border-b data-expanded:slide-in-from-top data-closed:slide-out-to-top',\n bottom:\n 'inset-x-0 bottom-0 h-auto max-h-[85vh] rounded-t-xl border-t data-expanded:slide-in-from-bottom data-closed:slide-out-to-bottom',\n start:\n 'inset-y-0 start-0 h-full w-80 max-w-[85vw] rounded-e-xl border-e data-expanded:slide-in-from-left data-closed:slide-out-to-left',\n end: 'inset-y-0 end-0 h-full w-80 max-w-[85vw] rounded-s-xl border-s data-expanded:slide-in-from-right data-closed:slide-out-to-right',\n },\n },\n defaultVariants: { side: 'end' },\n }\n)\n\nexport type SheetContentProps = ComponentProps<typeof KobalteDialogContent> &\n VariantProps<typeof sheetVariants> & {\n closeButton?: JSX.Element \| false\n }\n\nexport function SheetContent(props: SheetContentProps) {\n const [local, rest] = splitProps(props, ['class', 'side', 'children', 'closeButton'])\n\n return (\n <KobalteDialog.Portal>\n <DialogOverlay />\n <KobalteDialogContent\n class={cn(\n sheetVariants({ side: local.side }),\n 'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:duration-200',\n 'data-closed:animate-out data-closed:fade-out-0 data-closed:duration-150',\n local.class\n )}\n {...rest}\n >\n {local.children}\n <Show when={local.closeButton !== false}>\n <KobalteDialog.CloseButton\n aria-label=\"Close\"\n class=\"absolute top-3.5 end-3.5 rounded-md p-1 text-muted-foreground transition-colors ease-out outline-none hover:bg-surface-hover hover:text-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle\"\n >\n {local.closeButton ?? <X class=\"size-4\" />}\n </KobalteDialog.CloseButton>\n </Show>\n </KobalteDialogContent>\n </KobalteDialog.Portal>\n )\n}\n\nexport function Sheet(props: ComponentProps<typeof KobalteDialog>) {\n return <KobalteDialog {...props} />\n}\n\nexport function SheetTrigger(props: ComponentProps<typeof KobalteDialog.Trigger>) {\n return <KobalteDialog.Trigger {...props} />\n}\n\nexport function SheetCloseButton(props: ComponentProps<typeof KobalteDialog.CloseButton>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDialog.CloseButton class={cn(local.class)} {...rest} />\n}\n\nexport function SheetHeader(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"sheet-header\"\n class={cn('flex flex-col gap-1.5 border-b border-border p-4 pe-12 text-start', local.class)}\n {...rest}\n />\n )\n}\n\nexport function SheetBody(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"sheet-body\"\n class={cn('flex-1 overflow-y-auto px-4 pb-4', local.class)}\n {...rest}\n />\n )\n}\n\nexport function SheetFooter(props: ComponentProps<'div'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <div\n data-slot=\"sheet-footer\"\n class={cn('flex items-center justify-end gap-2 border-t border-border p-4', local.class)}\n {...rest}\n />\n )\n}\n\nexport function SheetTitle(props: ComponentProps<typeof KobalteDialog.Title>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialog.Title class={cn('text-sm leading-none font-semibold', local.class)} {...rest} />\n )\n}\n\nexport function SheetDescription(props: ComponentProps<typeof KobalteDialog.Description>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteDialog.Description class={cn('text-muted-foreground text-sm', local.class)} {...rest} />\n )\n}\n\nexport { sheetVariants }\n"],"mappings":"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"}

package/dist/components/ui/slider/slider.d.ts CHANGED Viewed

@@ -9,9 +9,13 @@ import type { ComponentProps } from 'solid-js';
  * nobody can set exactly.
  *
  * Kobalte handles pointer capture, keyboard stepping and the ARIA value
- * wiring; this paints the track, fill and thumb.
+ * wiring; this paints the track, fill and one thumb per value. Each thumb
+ * contains a form-native input, hidden from accessibility because the visible
+ * thumb already exposes the slider role.
  */
 export type SliderProps = ComponentProps<typeof KobalteSlider> & {
+    /** Accessible names for individual thumbs, in value order (for example minimum and maximum). */
+    thumbLabels?: readonly string[];
     trackClass?: string;
     rangeClass?: string;
     thumbClass?: string;

package/dist/components/ui/slider/slider.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/slider/slider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,sBAAsB,CAAA;AAC9D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C~~;;;;;;;;;;GAUG~~;AACH,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,aAAa,CAAC,GAAG;IAC/D,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,8DAA8D;IAC9D,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,~~kCAwDxC~~"}
1	+ {"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/slider/slider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,sBAAsB,CAAA;AAC9D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,aAAa,CAAC,GAAG;IAC/D,gGAAgG;IAChG,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,8DAA8D;IAC9D,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,kCAgFxC"}

package/dist/components/ui/slider/slider.js CHANGED Viewed

@@ -1,14 +1,16 @@
 import { cn } from "../../../lib/utils.js";
 import { createComponent, memo, mergeProps } from "solid-js/web";
-import { Show, splitProps } from "solid-js";
+import { For, Show, createRenderEffect, createUniqueId, splitProps } from "solid-js";
 import { Slider } from "@kobalte/core/slider";
 //#region src/components/ui/slider/slider.tsx
 function Slider$1(props) {
+	const inputId = createUniqueId();
 	const [local, rest] = splitProps(props, [
 		"class",
 		"trackClass",
 		"rangeClass",
 		"thumbClass",
+		"thumbLabels",
 		"valueLabel",
 		"children",
 		"aria-label",
@@ -29,26 +31,40 @@ function Slider$1(props) {
 				}
 			}),
 			memo(() => local.children),
-			createComponent(Slider.Thumb, {
-				get ["aria-label"]() {
-					return local["aria-label"];
+			createComponent(For, {
+				get each() {
+					return Array.from({ length: (props.value ?? props.defaultValue ?? [0]).length }, (_, index) => index);
 				},
-				get ["aria-labelledby"]() {
-					return local["aria-labelledby"];
-				},
-				get ["class"]() {
-					return cn("border-primary bg-background block size-4 shrink-0 rounded-full border-2 shadow-xs", "transition-[color,box-shadow] ease-out outline-none", "hover:ring-4 hover:ring-primary-subtle", "focus-visible:ring-4 focus-visible:ring-primary-subtle", local.thumbClass);
-				},
-				get children() {
-					return createComponent(Show, {
-						get when() {
-							return local.valueLabel;
-						},
-						get children() {
-							return createComponent(Slider.ValueLabel, { "class": "bg-popover text-popover-foreground absolute -top-6 left-1/2 -translate-x-1/2 rounded-sm border border-border px-1 text-2xs tabular-nums" });
-						}
-					});
-				}
+				children: (index) => createComponent(Slider.Thumb, {
+					get ["aria-label"]() {
+						return local.thumbLabels?.[index] ?? local["aria-label"];
+					},
+					get ["aria-labelledby"]() {
+						return memo(() => !!local.thumbLabels?.[index])() ? void 0 : local["aria-labelledby"];
+					},
+					get ["class"]() {
+						return cn("border-primary bg-background block size-4 shrink-0 rounded-full border-2 shadow-xs", "transition-[color,box-shadow] ease-out outline-none", "hover:ring-4 hover:ring-primary-subtle", "focus-visible:ring-4 focus-visible:ring-primary-subtle", local.thumbClass);
+					},
+					get children() {
+						return [createComponent(Slider.Input, {
+							id: `slider-${inputId}-${index}`,
+							ref: (input) => {
+								createRenderEffect(() => {
+									input.defaultValue = String(props.defaultValue?.[index] ?? props.value?.[index] ?? props.minValue ?? 0);
+								});
+							},
+							hidden: true,
+							"aria-hidden": "true"
+						}), createComponent(Show, {
+							get when() {
+								return local.valueLabel;
+							},
+							get children() {
+								return createComponent(Slider.ValueLabel, { "class": "bg-popover text-popover-foreground absolute -top-6 left-1/2 -translate-x-1/2 rounded-sm border border-border px-1 text-2xs tabular-nums" });
+							}
+						})];
+					}
+				})
 			})
 		];
 	} }));

package/dist/components/ui/slider/slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider.js","names":["Slider","KobalteSlider","ComponentProps","Show","splitProps","cn","SliderProps","trackClass","rangeClass","thumbClass","valueLabel","props","local","rest","_$createComponent","_$mergeProps","class","children","Track","Fill","_$memo","Thumb","aria-label","aria-labelledby","when","ValueLabel","Slider","_$createComponent","KobalteSlider","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/slider/slider.tsx"],"sourcesContent":["import { Slider as KobalteSlider } from '@kobalte/core/slider'\nimport type { ComponentProps } from 'solid-js'\nimport { Show, splitProps } from 'solid-js'\nimport { cn } from '#lib/utils'\n\n/*\n Slider.\n \n For a value on a continuum where position matters more than precision — a\n * zoom, a volume, a threshold. When the number matters, pass `valueLabel` so\n * the value is both adjustable and readable; a bare slider is a control\n * nobody can set exactly.\n \n Kobalte handles pointer capture, keyboard stepping and the ARIA value\n * wiring; this paints the track, fill and thumb.\n /\nexport type SliderProps = ComponentProps<typeof KobalteSlider> & {\n trackClass?: string\n rangeClass?: string\n thumbClass?: string\n /* Show the current value beside the thumb while dragging. */\n valueLabel?: boolean\n}\n\nexport function Slider(props: SliderProps) {\n const [local, rest] = splitProps(props, [\n 'class',\n 'trackClass',\n 'rangeClass',\n 'thumbClass',\n 'valueLabel',\n 'children',\n 'aria-label',\n 'aria-labelledby',\n ])\n\n return (\n <KobalteSlider\n class={cn(\n 'relative flex touch-none flex-col justify-center select-none',\n 'data-[orientation=vertical]:h-full data-[orientation=vertical]:w-5 data-[orientation=horizontal]:w-full',\n 'data-[disabled]:opacity-50',\n local.class\n )}\n {...rest}\n >\n <KobalteSlider.Track\n class={cn(\n 'bg-input relative grow overflow-hidden rounded-full',\n 'data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full',\n 'data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5',\n local.trackClass\n )}\n >\n <KobalteSlider.Fill\n class={cn(\n 'bg-primary absolute rounded-full',\n 'data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full',\n local.rangeClass\n )}\n />\n </KobalteSlider.Track>\n {local.children}\n <KobalteSlider.Thumb\n aria-label={local['aria-label']}\n aria-labelledby={local['aria-labelledby']}\n class={cn(\n 'border-primary bg-background block size-4 shrink-0 rounded-full border-2 shadow-xs',\n 'transition-[color,box-shadow] ease-out outline-none',\n 'hover:ring-4 hover:ring-primary-subtle',\n 'focus-visible:ring-4 focus-visible:ring-primary-subtle',\n local.thumbClass\n )}\n >\n <Show when={local.valueLabel}>\n <KobalteSlider.ValueLabel class=\"bg-popover text-popover-foreground absolute -top-6 left-1/2 -translate-x-1/2 rounded-sm border border-border px-1 text-2xs tabular-nums\" />\n </Show>\n </KobalteSlider.Thumb>\n </KobalteSlider>\n )\n}\n"],"mappings":";;;;;~~AAwBA~~,SAAgBA,~~SAAOW~~,OAAoB;CACzC,MAAM,~~CAACC~~,OAAOC,~~QAAQT~~,~~WAAWO~~,OAAO;EACtC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CAAiB,CAClB;CAED,~~OAAAG~~,~~gBACGb~~,~~QAAac~~,WAAA,EAAA,KAAA,WAAA;EAAA,~~OACLV~~,GACL,gEACA,2GACA,~~8BACAO~~,MAAMI,KACR;CAAC,EAAA,GACGH,MAAI,EAAA,IAAAI,WAAA;EAAA,OAAA;GAAAH,~~gBAEPb~~,~~OAAciB~~,OAAK;IAAA,KAAA,WAAA;KAAA,~~OACXb~~,GACL,uDACA,4EACA,~~wEACAO~~,~~MAAML~~,UACR;IAAC;IAAA,~~IAAAU~~,WAAA;KAAA,OAAAH,~~gBAEAb~~,~~OAAckB~~,MAAI,EAAA,KAAA,WAAA;MAAA,~~OACVd~~,GACL,oCACA,~~2EACAO~~,~~MAAMJ~~,UACR;KAAC,EAAA,CAAA;IAAA;GAAA,CAAA;~~GAAAY~~,WAGJR,MAAMK,QAAQ;GAAAH,~~gBACdb~~,~~OAAcoB~~,OAAK;~~IAAA~~,KAAA,gBAAA;~~KAAA~~,~~OACNT~~,MAAM;~~IAAa~~;~~IAAA~~,KAAA,qBAAA;~~KAAA~~,~~OACdA~~,MAAM;~~IAAkB~~;~~IAAA~~,KAAA,WAAA;~~KAAA~~,~~OAClCP~~,GACL,sFACA,uDACA,0CACA,~~0DACAO~~,~~MAAMH~~,UACR;~~IAAC~~;~~IAAA~~,~~IAAAQ~~,WAAA;~~KAAA~~,~~OAAAH~~,~~gBAEAX~~,~~MAAI~~;MAAA,~~IAACqB~~,~~OAAI~~;OAAA,~~OAAEZ~~,~~MAAMF~~;~~MAAU~~;~~MAAA~~,~~IAAAO~~,WAAA;~~OAAA~~,OAAAH,~~gBACzBb~~,~~OAAcwB~~,YAAU,EAAA,SAAA,0IAAA,CAAA;MAAA;KAAA,CAAA;~~IAAA;GAAA~~,CAAA;EAAA;CAAA,EAAA,CAAA,CAAA;~~AAKnC~~"}
1	+ {"version":3,"file":"slider.js","names":["Slider","KobalteSlider","ComponentProps","For","Show","createUniqueId","createRenderEffect","splitProps","cn","SliderProps","thumbLabels","trackClass","rangeClass","thumbClass","valueLabel","props","inputId","local","rest","_$createComponent","_$mergeProps","class","children","Track","Fill","_$memo","each","Array","from","length","value","defaultValue","_","index","Thumb","aria-label","aria-labelledby","undefined","Input","id","ref","input","String","minValue","hidden","when","ValueLabel","Slider","_$createComponent","KobalteSlider","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/slider/slider.tsx"],"sourcesContent":["import { Slider as KobalteSlider } from '@kobalte/core/slider'\nimport type { ComponentProps } from 'solid-js'\nimport { For, Show, createUniqueId, createRenderEffect, splitProps } from 'solid-js'\nimport { cn } from '#lib/utils'\n\n/*\n Slider.\n \n For a value on a continuum where position matters more than precision — a\n * zoom, a volume, a threshold. When the number matters, pass `valueLabel` so\n * the value is both adjustable and readable; a bare slider is a control\n * nobody can set exactly.\n \n Kobalte handles pointer capture, keyboard stepping and the ARIA value\n * wiring; this paints the track, fill and one thumb per value. Each thumb\n * contains a form-native input, hidden from accessibility because the visible\n * thumb already exposes the slider role.\n /\nexport type SliderProps = ComponentProps<typeof KobalteSlider> & {\n /* Accessible names for individual thumbs, in value order (for example minimum and maximum). /\n thumbLabels?: readonly string[]\n trackClass?: string\n rangeClass?: string\n thumbClass?: string\n /* Show the current value beside the thumb while dragging. /\n valueLabel?: boolean\n}\n\nexport function Slider(props: SliderProps) {\n const inputId = createUniqueId()\n const [local, rest] = splitProps(props, [\n 'class',\n 'trackClass',\n 'rangeClass',\n 'thumbClass',\n 'thumbLabels',\n 'valueLabel',\n 'children',\n 'aria-label',\n 'aria-labelledby',\n ])\n\n return (\n <KobalteSlider\n class={cn(\n 'relative flex touch-none flex-col justify-center select-none',\n 'data-[orientation=vertical]:h-full data-[orientation=vertical]:w-5 data-[orientation=horizontal]:w-full',\n 'data-[disabled]:opacity-50',\n local.class\n )}\n {...rest}\n >\n <KobalteSlider.Track\n class={cn(\n 'bg-input relative grow overflow-hidden rounded-full',\n 'data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full',\n 'data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5',\n local.trackClass\n )}\n >\n <KobalteSlider.Fill\n class={cn(\n 'bg-primary absolute rounded-full',\n 'data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full',\n local.rangeClass\n )}\n />\n </KobalteSlider.Track>\n {local.children}\n <For\n each={Array.from(\n { length: (props.value ?? props.defaultValue ?? [0]).length },\n (_, index) => index\n )}\n >\n {(index) => (\n <KobalteSlider.Thumb\n aria-label={local.thumbLabels?.[index] ?? local['aria-label']}\n aria-labelledby={local.thumbLabels?.[index] ? undefined : local['aria-labelledby']}\n class={cn(\n 'border-primary bg-background block size-4 shrink-0 rounded-full border-2 shadow-xs',\n 'transition-[color,box-shadow] ease-out outline-none',\n 'hover:ring-4 hover:ring-primary-subtle',\n 'focus-visible:ring-4 focus-visible:ring-primary-subtle',\n local.thumbClass\n )}\n >\n {/ Native reset uses the value property’s default, not an HTML defaultValue attribute. */}\n <KobalteSlider.Input\n id={`slider-${inputId}-${index}`}\n ref={(input) => {\n createRenderEffect(() => {\n input.defaultValue = String(\n props.defaultValue?.[index] ?? props.value?.[index] ?? props.minValue ?? 0\n )\n })\n }}\n hidden\n aria-hidden=\"true\"\n />\n <Show when={local.valueLabel}>\n <KobalteSlider.ValueLabel class=\"bg-popover text-popover-foreground absolute -top-6 left-1/2 -translate-x-1/2 rounded-sm border border-border px-1 text-2xs tabular-nums\" />\n </Show>\n </KobalteSlider.Thumb>\n )}\n </For>\n </KobalteSlider>\n )\n}\n"],"mappings":";;;;;AA4BA,SAAgBA,SAAOe,OAAoB;CACzC,MAAMC,UAAUX,eAAe;CAC/B,MAAM,CAACY,OAAOC,QAAQX,WAAWQ,OAAO;EACtC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CAAiB,CAClB;CAED,OAAAI,gBACGlB,QAAamB,WAAA,EAAA,KAAA,WAAA;EAAA,OACLZ,GACL,gEACA,2GACA,8BACAS,MAAMI,KACR;CAAC,EAAA,GACGH,MAAI,EAAA,IAAAI,WAAA;EAAA,OAAA;GAAAH,gBAEPlB,OAAcsB,OAAK;IAAA,KAAA,WAAA;KAAA,OACXf,GACL,uDACA,4EACA,wEACAS,MAAMN,UACR;IAAC;IAAA,IAAAW,WAAA;KAAA,OAAAH,gBAEAlB,OAAcuB,MAAI,EAAA,KAAA,WAAA;MAAA,OACVhB,GACL,oCACA,2EACAS,MAAML,UACR;KAAC,EAAA,CAAA;IAAA;GAAA,CAAA;GAAAa,WAGJR,MAAMK,QAAQ;GAAAH,gBACdhB,KAAG;IAAA,IACFuB,OAAI;KAAA,OAAEC,MAAMC,KACV,EAAEC,SAASd,MAAMe,SAASf,MAAMgB,gBAAgB,CAAC,CAAC,EAAA,CAAGF,OAAO,IAC3DG,GAAGC,UAAUA,KAChB;IAAC;IAAAX,WAECW,UAAKd,gBACJlB,OAAciC,OAAK;KAAA,KAAA,gBAAA;MAAA,OACNjB,MAAMP,cAAcuB,UAAUhB,MAAM;KAAa;KAAA,KAAA,qBAAA;MAAA,OAC5CQ,WAAA,CAAA,CAAAR,MAAMP,cAAcuB,MAAM,CAAA,CAAA,IAAGI,KAAAA,IAAYpB,MAAM;KAAkB;KAAA,KAAA,WAAA;MAAA,OAC3ET,GACL,sFACA,uDACA,0CACA,0DACAS,MAAMJ,UACR;KAAC;KAAA,IAAAS,WAAA;MAAA,OAAA,CAAAH,gBAGAlB,OAAcqC,OAAK;OAClBC,IAAI,UAAUvB,QAAO,GAAIiB;OAAOO,MAC1BC,UAAU;QACdnC,yBAAyB;SACvBmC,MAAMV,eAAeW,OACnB3B,MAAMgB,eAAeE,UAAUlB,MAAMe,QAAQG,UAAUlB,MAAM4B,YAAY,CAC3E;QACF,CAAC;OACH;OACAC,QAAM;OAAA,eAAA;MAAA,CAAA,GAAAzB,gBAGPf,MAAI;OAAA,IAACyC,OAAI;QAAA,OAAE5B,MAAMH;OAAU;OAAA,IAAAQ,WAAA;QAAA,OAAAH,gBACzBlB,OAAc6C,YAAU,EAAA,SAAA,0IAAA,CAAA;OAAA;MAAA,CAAA,CAAA;KAAA;IAAA,CAAA;GAG9B,CAAA;EAAA;CAAA,EAAA,CAAA,CAAA;AAIT"}

package/dist/r/src/components/ui/alert-dialog/alert-dialog.tsx CHANGED Viewed

@@ -1,4 +1,8 @@
-import { AlertDialog as KobalteAlertDialog } from '@kobalte/core/alert-dialog'
+import {
+  AlertDialog as KobalteAlertDialog,
+  Content as KobalteAlertDialogContent,
+} from '@kobalte/core/alert-dialog'
+// Use the alert-specific export rather than DialogRoot.Content, which other imports can replace.
 import type { ComponentProps } from 'solid-js'
 import { createEffect, createSignal, splitProps } from 'solid-js'
 import { overlayMotion, overlayPositioner, overlayScrim, overlaySurface } from '../../../lib/overlay'
@@ -70,14 +74,14 @@ const blockDismissal = {
   onInteractOutside: (event: Event) => event.preventDefault(),
 } as const
-export function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialog.Content>) {
+export function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialogContent>) {
   const [local, rest] = splitProps(props, ['class'])
   return (
     <KobalteAlertDialog.Portal>
       <AlertDialogOverlay />
       <div class={overlayPositioner}>
-        <KobalteAlertDialog.Content
+        <KobalteAlertDialogContent
           {...blockDismissal}
           class={cn(overlaySurface, overlayMotion, 'grid w-full max-w-md gap-4 p-5', local.class)}
           {...rest}

package/dist/r/src/components/ui/combobox/combobox.tsx CHANGED Viewed

@@ -96,6 +96,7 @@ export function ComboboxContent(props: ComponentProps<typeof KobalteCombobox.Con
         {...rest}
       >
         <KobalteCombobox.Listbox class={cn('max-h-72 overflow-y-auto', menuContentPadding)} />
+        {local.children}
         <KobalteCombobox.Arrow aria-hidden="true" class={popoverArrow} />
       </KobalteCombobox.Content>
     </KobalteCombobox.Portal>

package/dist/r/src/components/ui/dialog/dialog.tsx CHANGED Viewed

@@ -1,4 +1,9 @@
-import { Dialog as KobalteDialog } from '@kobalte/core/dialog'
+import {
+  Dialog as KobalteDialog,
+  Content as KobalteDialogContent,
+  Overlay as KobalteDialogOverlay,
+} from '@kobalte/core/dialog'
+// AlertDialog assigns to the shared DialogRoot.Content object, so these named exports stay role-stable.
 import { X } from 'lucide-solid'
 import type { Accessor, ComponentProps, JSX } from 'solid-js'
 import { createRenderEffect, onCleanup, Show, splitProps } from 'solid-js'
@@ -43,8 +48,8 @@ function hasOtherOverlay(content: HTMLElement, opener: HTMLElement): boolean {
 type DialogFocusRestorationOptions = {
   open: Accessor<boolean>
   restoreFocusRef?: Accessor<HTMLElement | undefined>
-  onOpenAutoFocus?: ComponentProps<typeof KobalteDialog.Content>['onOpenAutoFocus']
-  onCloseAutoFocus?: ComponentProps<typeof KobalteDialog.Content>['onCloseAutoFocus']
+  onOpenAutoFocus?: ComponentProps<typeof KobalteDialogContent>['onOpenAutoFocus']
+  onCloseAutoFocus?: ComponentProps<typeof KobalteDialogContent>['onCloseAutoFocus']
 }
 /**
@@ -231,10 +236,10 @@ export function DialogPortal(props: ComponentProps<typeof KobalteDialog.Portal>)
   return <KobalteDialog.Portal {...props} />
 }
-export function DialogOverlay(props: ComponentProps<typeof KobalteDialog.Overlay>) {
+export function DialogOverlay(props: ComponentProps<typeof KobalteDialogOverlay>) {
   const [local, rest] = splitProps(props, ['class'])
   return (
-    <KobalteDialog.Overlay
+    <KobalteDialogOverlay
       class={cn(
         overlayScrim,
         'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',
@@ -245,7 +250,7 @@ export function DialogOverlay(props: ComponentProps<typeof KobalteDialog.Overlay
   )
 }
-export type DialogContentProps = ComponentProps<typeof KobalteDialog.Content> & {
+export type DialogContentProps = ComponentProps<typeof KobalteDialogContent> & {
   /**
    * Replaces the default close button. Pass `false` to remove it — only for a
    * dialog that cannot be dismissed (an update that must finish); anything the
@@ -261,7 +266,7 @@ export function DialogContent(props: DialogContentProps) {
     <KobalteDialog.Portal>
       <DialogOverlay />
       <div class={overlayPositioner}>
-        <KobalteDialog.Content
+        <KobalteDialogContent
           class={cn(
             overlaySurface,
             overlayMotion,
@@ -283,7 +288,7 @@ export function DialogContent(props: DialogContentProps) {
               {local.closeButton ?? <X class="size-4" />}
             </KobalteDialog.CloseButton>
           </Show>
-        </KobalteDialog.Content>
+        </KobalteDialogContent>
       </div>
     </KobalteDialog.Portal>
   )

package/dist/r/src/components/ui/sheet/sheet.tsx CHANGED Viewed

@@ -1,4 +1,5 @@
-import { Dialog as KobalteDialog } from '@kobalte/core/dialog'
+import { Dialog as KobalteDialog, Content as KobalteDialogContent } from '@kobalte/core/dialog'
+// AlertDialog shares DialogRoot.Content; Sheet uses the stable named primitive.
 import { X } from 'lucide-solid'
 import type { ComponentProps, JSX } from 'solid-js'
 import { Show, splitProps } from 'solid-js'
@@ -35,7 +36,7 @@ const sheetVariants = cva(
   }
 )
-export type SheetContentProps = ComponentProps<typeof KobalteDialog.Content> &
+export type SheetContentProps = ComponentProps<typeof KobalteDialogContent> &
   VariantProps<typeof sheetVariants> & {
     closeButton?: JSX.Element | false
   }
@@ -46,7 +47,7 @@ export function SheetContent(props: SheetContentProps) {
   return (
     <KobalteDialog.Portal>
       <DialogOverlay />
-      <KobalteDialog.Content
+      <KobalteDialogContent
         class={cn(
           sheetVariants({ side: local.side }),
           'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:duration-200',
@@ -64,7 +65,7 @@ export function SheetContent(props: SheetContentProps) {
             {local.closeButton ?? <X class="size-4" />}
           </KobalteDialog.CloseButton>
         </Show>
-      </KobalteDialog.Content>
+      </KobalteDialogContent>
     </KobalteDialog.Portal>
   )
 }

package/dist/r/src/components/ui/slider/slider.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 import { Slider as KobalteSlider } from '@kobalte/core/slider'
 import type { ComponentProps } from 'solid-js'
-import { Show, splitProps } from 'solid-js'
+import { For, Show, createUniqueId, createRenderEffect, splitProps } from 'solid-js'
 import { cn } from '../../../lib/utils'
 /**
@@ -12,9 +12,13 @@ import { cn } from '../../../lib/utils'
  * nobody can set exactly.
  *
  * Kobalte handles pointer capture, keyboard stepping and the ARIA value
- * wiring; this paints the track, fill and thumb.
+ * wiring; this paints the track, fill and one thumb per value. Each thumb
+ * contains a form-native input, hidden from accessibility because the visible
+ * thumb already exposes the slider role.
  */
 export type SliderProps = ComponentProps<typeof KobalteSlider> & {
+  /** Accessible names for individual thumbs, in value order (for example minimum and maximum). */
+  thumbLabels?: readonly string[]
   trackClass?: string
   rangeClass?: string
   thumbClass?: string
@@ -23,11 +27,13 @@ export type SliderProps = ComponentProps<typeof KobalteSlider> & {
 }
 export function Slider(props: SliderProps) {
+  const inputId = createUniqueId()
   const [local, rest] = splitProps(props, [
     'class',
     'trackClass',
     'rangeClass',
     'thumbClass',
+    'thumbLabels',
     'valueLabel',
     'children',
     'aria-label',
@@ -61,21 +67,43 @@ export function Slider(props: SliderProps) {
         />
       </KobalteSlider.Track>
       {local.children}
-      <KobalteSlider.Thumb
-        aria-label={local['aria-label']}
-        aria-labelledby={local['aria-labelledby']}
-        class={cn(
-          'border-primary bg-background block size-4 shrink-0 rounded-full border-2 shadow-xs',
-          'transition-[color,box-shadow] ease-out outline-none',
-          'hover:ring-4 hover:ring-primary-subtle',
-          'focus-visible:ring-4 focus-visible:ring-primary-subtle',
-          local.thumbClass
+      <For
+        each={Array.from(
+          { length: (props.value ?? props.defaultValue ?? [0]).length },
+          (_, index) => index
         )}
       >
-        <Show when={local.valueLabel}>
-          <KobalteSlider.ValueLabel class="bg-popover text-popover-foreground absolute -top-6 left-1/2 -translate-x-1/2 rounded-sm border border-border px-1 text-2xs tabular-nums" />
-        </Show>
-      </KobalteSlider.Thumb>
+        {(index) => (
+          <KobalteSlider.Thumb
+            aria-label={local.thumbLabels?.[index] ?? local['aria-label']}
+            aria-labelledby={local.thumbLabels?.[index] ? undefined : local['aria-labelledby']}
+            class={cn(
+              'border-primary bg-background block size-4 shrink-0 rounded-full border-2 shadow-xs',
+              'transition-[color,box-shadow] ease-out outline-none',
+              'hover:ring-4 hover:ring-primary-subtle',
+              'focus-visible:ring-4 focus-visible:ring-primary-subtle',
+              local.thumbClass
+            )}
+          >
+            {/* Native reset uses the value property’s default, not an HTML defaultValue attribute. */}
+            <KobalteSlider.Input
+              id={`slider-${inputId}-${index}`}
+              ref={(input) => {
+                createRenderEffect(() => {
+                  input.defaultValue = String(
+                    props.defaultValue?.[index] ?? props.value?.[index] ?? props.minValue ?? 0
+                  )
+                })
+              }}
+              hidden
+              aria-hidden="true"
+            />
+            <Show when={local.valueLabel}>
+              <KobalteSlider.ValueLabel class="bg-popover text-popover-foreground absolute -top-6 left-1/2 -translate-x-1/2 rounded-sm border border-border px-1 text-2xs tabular-nums" />
+            </Show>
+          </KobalteSlider.Thumb>
+        )}
+      </For>
     </KobalteSlider>
   )
 }

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@adea-ai/ui",
-  "version": "0.72.1",
+  "version": "0.72.3",
   "description": "The Adea design system: Kobalte-backed Solid components, semantic OKLCH tokens, and the app-shell layout primitives shared by Adea and Cortana.",
   "keywords": [
     "adea",

package/src/components/ui/alert-dialog/alert-dialog.tsx CHANGED Viewed

@@ -1,4 +1,8 @@
-import { AlertDialog as KobalteAlertDialog } from '@kobalte/core/alert-dialog'
+import {
+  AlertDialog as KobalteAlertDialog,
+  Content as KobalteAlertDialogContent,
+} from '@kobalte/core/alert-dialog'
+// Use the alert-specific export rather than DialogRoot.Content, which other imports can replace.
 import type { ComponentProps } from 'solid-js'
 import { createEffect, createSignal, splitProps } from 'solid-js'
 import { overlayMotion, overlayPositioner, overlayScrim, overlaySurface } from '#lib/overlay'
@@ -70,14 +74,14 @@ const blockDismissal = {
   onInteractOutside: (event: Event) => event.preventDefault(),
 } as const
-export function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialog.Content>) {
+export function AlertDialogContent(props: ComponentProps<typeof KobalteAlertDialogContent>) {
   const [local, rest] = splitProps(props, ['class'])
   return (
     <KobalteAlertDialog.Portal>
       <AlertDialogOverlay />
       <div class={overlayPositioner}>
-        <KobalteAlertDialog.Content
+        <KobalteAlertDialogContent
           {...blockDismissal}
           class={cn(overlaySurface, overlayMotion, 'grid w-full max-w-md gap-4 p-5', local.class)}
           {...rest}

package/src/components/ui/combobox/combobox.tsx CHANGED Viewed

@@ -96,6 +96,7 @@ export function ComboboxContent(props: ComponentProps<typeof KobalteCombobox.Con
         {...rest}
       >
         <KobalteCombobox.Listbox class={cn('max-h-72 overflow-y-auto', menuContentPadding)} />
+        {local.children}
         <KobalteCombobox.Arrow aria-hidden="true" class={popoverArrow} />
       </KobalteCombobox.Content>
     </KobalteCombobox.Portal>

package/src/components/ui/dialog/dialog.tsx CHANGED Viewed

@@ -1,4 +1,9 @@
-import { Dialog as KobalteDialog } from '@kobalte/core/dialog'
+import {
+  Dialog as KobalteDialog,
+  Content as KobalteDialogContent,
+  Overlay as KobalteDialogOverlay,
+} from '@kobalte/core/dialog'
+// AlertDialog assigns to the shared DialogRoot.Content object, so these named exports stay role-stable.
 import { X } from 'lucide-solid'
 import type { Accessor, ComponentProps, JSX } from 'solid-js'
 import { createRenderEffect, onCleanup, Show, splitProps } from 'solid-js'
@@ -43,8 +48,8 @@ function hasOtherOverlay(content: HTMLElement, opener: HTMLElement): boolean {
 type DialogFocusRestorationOptions = {
   open: Accessor<boolean>
   restoreFocusRef?: Accessor<HTMLElement | undefined>
-  onOpenAutoFocus?: ComponentProps<typeof KobalteDialog.Content>['onOpenAutoFocus']
-  onCloseAutoFocus?: ComponentProps<typeof KobalteDialog.Content>['onCloseAutoFocus']
+  onOpenAutoFocus?: ComponentProps<typeof KobalteDialogContent>['onOpenAutoFocus']
+  onCloseAutoFocus?: ComponentProps<typeof KobalteDialogContent>['onCloseAutoFocus']
 }
 /**
@@ -231,10 +236,10 @@ export function DialogPortal(props: ComponentProps<typeof KobalteDialog.Portal>)
   return <KobalteDialog.Portal {...props} />
 }
-export function DialogOverlay(props: ComponentProps<typeof KobalteDialog.Overlay>) {
+export function DialogOverlay(props: ComponentProps<typeof KobalteDialogOverlay>) {
   const [local, rest] = splitProps(props, ['class'])
   return (
-    <KobalteDialog.Overlay
+    <KobalteDialogOverlay
       class={cn(
         overlayScrim,
         'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',
@@ -245,7 +250,7 @@ export function DialogOverlay(props: ComponentProps<typeof KobalteDialog.Overlay
   )
 }
-export type DialogContentProps = ComponentProps<typeof KobalteDialog.Content> & {
+export type DialogContentProps = ComponentProps<typeof KobalteDialogContent> & {
   /**
    * Replaces the default close button. Pass `false` to remove it — only for a
    * dialog that cannot be dismissed (an update that must finish); anything the
@@ -261,7 +266,7 @@ export function DialogContent(props: DialogContentProps) {
     <KobalteDialog.Portal>
       <DialogOverlay />
       <div class={overlayPositioner}>
-        <KobalteDialog.Content
+        <KobalteDialogContent
           class={cn(
             overlaySurface,
             overlayMotion,
@@ -283,7 +288,7 @@ export function DialogContent(props: DialogContentProps) {
               {local.closeButton ?? <X class="size-4" />}
             </KobalteDialog.CloseButton>
           </Show>
-        </KobalteDialog.Content>
+        </KobalteDialogContent>
       </div>
     </KobalteDialog.Portal>
   )

package/src/components/ui/sheet/sheet.tsx CHANGED Viewed

@@ -1,4 +1,5 @@
-import { Dialog as KobalteDialog } from '@kobalte/core/dialog'
+import { Dialog as KobalteDialog, Content as KobalteDialogContent } from '@kobalte/core/dialog'
+// AlertDialog shares DialogRoot.Content; Sheet uses the stable named primitive.
 import { X } from 'lucide-solid'
 import type { ComponentProps, JSX } from 'solid-js'
 import { Show, splitProps } from 'solid-js'
@@ -35,7 +36,7 @@ const sheetVariants = cva(
   }
 )
-export type SheetContentProps = ComponentProps<typeof KobalteDialog.Content> &
+export type SheetContentProps = ComponentProps<typeof KobalteDialogContent> &
   VariantProps<typeof sheetVariants> & {
     closeButton?: JSX.Element | false
   }
@@ -46,7 +47,7 @@ export function SheetContent(props: SheetContentProps) {
   return (
     <KobalteDialog.Portal>
       <DialogOverlay />
-      <KobalteDialog.Content
+      <KobalteDialogContent
         class={cn(
           sheetVariants({ side: local.side }),
           'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:duration-200',
@@ -64,7 +65,7 @@ export function SheetContent(props: SheetContentProps) {
             {local.closeButton ?? <X class="size-4" />}
           </KobalteDialog.CloseButton>
         </Show>
-      </KobalteDialog.Content>
+      </KobalteDialogContent>
     </KobalteDialog.Portal>
   )
 }

package/src/components/ui/slider/slider.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 import { Slider as KobalteSlider } from '@kobalte/core/slider'
 import type { ComponentProps } from 'solid-js'
-import { Show, splitProps } from 'solid-js'
+import { For, Show, createUniqueId, createRenderEffect, splitProps } from 'solid-js'
 import { cn } from '#lib/utils'
 /**
@@ -12,9 +12,13 @@ import { cn } from '#lib/utils'
  * nobody can set exactly.
  *
  * Kobalte handles pointer capture, keyboard stepping and the ARIA value
- * wiring; this paints the track, fill and thumb.
+ * wiring; this paints the track, fill and one thumb per value. Each thumb
+ * contains a form-native input, hidden from accessibility because the visible
+ * thumb already exposes the slider role.
  */
 export type SliderProps = ComponentProps<typeof KobalteSlider> & {
+  /** Accessible names for individual thumbs, in value order (for example minimum and maximum). */
+  thumbLabels?: readonly string[]
   trackClass?: string
   rangeClass?: string
   thumbClass?: string
@@ -23,11 +27,13 @@ export type SliderProps = ComponentProps<typeof KobalteSlider> & {
 }
 export function Slider(props: SliderProps) {
+  const inputId = createUniqueId()
   const [local, rest] = splitProps(props, [
     'class',
     'trackClass',
     'rangeClass',
     'thumbClass',
+    'thumbLabels',
     'valueLabel',
     'children',
     'aria-label',
@@ -61,21 +67,43 @@ export function Slider(props: SliderProps) {
         />
       </KobalteSlider.Track>
       {local.children}
-      <KobalteSlider.Thumb
-        aria-label={local['aria-label']}
-        aria-labelledby={local['aria-labelledby']}
-        class={cn(
-          'border-primary bg-background block size-4 shrink-0 rounded-full border-2 shadow-xs',
-          'transition-[color,box-shadow] ease-out outline-none',
-          'hover:ring-4 hover:ring-primary-subtle',
-          'focus-visible:ring-4 focus-visible:ring-primary-subtle',
-          local.thumbClass
+      <For
+        each={Array.from(
+          { length: (props.value ?? props.defaultValue ?? [0]).length },
+          (_, index) => index
         )}
       >
-        <Show when={local.valueLabel}>
-          <KobalteSlider.ValueLabel class="bg-popover text-popover-foreground absolute -top-6 left-1/2 -translate-x-1/2 rounded-sm border border-border px-1 text-2xs tabular-nums" />
-        </Show>
-      </KobalteSlider.Thumb>
+        {(index) => (
+          <KobalteSlider.Thumb
+            aria-label={local.thumbLabels?.[index] ?? local['aria-label']}
+            aria-labelledby={local.thumbLabels?.[index] ? undefined : local['aria-labelledby']}
+            class={cn(
+              'border-primary bg-background block size-4 shrink-0 rounded-full border-2 shadow-xs',
+              'transition-[color,box-shadow] ease-out outline-none',
+              'hover:ring-4 hover:ring-primary-subtle',
+              'focus-visible:ring-4 focus-visible:ring-primary-subtle',
+              local.thumbClass
+            )}
+          >
+            {/* Native reset uses the value property’s default, not an HTML defaultValue attribute. */}
+            <KobalteSlider.Input
+              id={`slider-${inputId}-${index}`}
+              ref={(input) => {
+                createRenderEffect(() => {
+                  input.defaultValue = String(
+                    props.defaultValue?.[index] ?? props.value?.[index] ?? props.minValue ?? 0
+                  )
+                })
+              }}
+              hidden
+              aria-hidden="true"
+            />
+            <Show when={local.valueLabel}>
+              <KobalteSlider.ValueLabel class="bg-popover text-popover-foreground absolute -top-6 left-1/2 -translate-x-1/2 rounded-sm border border-border px-1 text-2xs tabular-nums" />
+            </Show>
+          </KobalteSlider.Thumb>
+        )}
+      </For>
     </KobalteSlider>
   )
 }