@adea-ai/ui 0.106.2 → 0.108.0

package/dist/components/layout/contextual-sidebar/contextual-sidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contextual-sidebar.js","names":["Accessor","JSX","Show","createSignal","createUniqueId","onCleanup","onMount","cn","Sheet","SheetContent","SheetTitle","SidebarNav","SidebarNavContent","SidebarNavFooter","SidebarNavHeader","SidebarNavTitle","PixelResizeHandle","ContextualSidebarRenderContext","mobile","portalMount","HTMLElement","ContextualSidebarProps","id","label","title","open","onOpenChange","width","minimum","maximum","step","wideViewportAtLoad","resizeLabel","restoreFocusRef","onSidebarElement","element","sidebarClass","sheetClass","headerClass","contentClass","footerClass","headingAs","header","context","Element","content","footer","onWidthChange","onWidthCommit","ContextualSidebar","props","isNarrowViewport","setIsNarrowViewport","mobileMount","setMobileMount","connected","mount","isConnected","undefined","media","window","matchMedia","updateViewport","wasNarrow","matches","addEventListener","removeEventListener","renderSidebar","navigationId","_$createComponent","as","aria-label","aria-hidden","inert","data-open","String","ref","node","queueMicrotask","class","children","when","side","value","controls","onChange","onCommit","_$memo","_wide","_$createComponent","_$memo"],"sources":["../../../../src/components/layout/contextual-sidebar/contextual-sidebar.tsx"],"sourcesContent":["import type { Accessor, JSX } from 'solid-js'\nimport { Show, createSignal, createUniqueId, onCleanup, onMount } from 'solid-js'\nimport { cn } from '#lib/utils'\nimport { Sheet, SheetContent, SheetTitle } from '../../ui/sheet'\nimport {\n  SidebarNav,\n  SidebarNavContent,\n  SidebarNavFooter,\n  SidebarNavHeader,\n  SidebarNavTitle,\n} from '../sidebar-nav/sidebar-nav'\nimport { PixelResizeHandle } from '../pixel-resize-handle/pixel-resize-handle'\n\nexport type ContextualSidebarRenderContext = {\n  /** Whether the slot is being rendered inside the modal mobile sheet. */\n  mobile: boolean\n  /** Mount nested popovers and menus inside the mobile dialog's accessibility tree. */\n  portalMount(): HTMLElement | undefined\n}\n\nexport type ContextualSidebarProps = {\n  /** Stable host id prefix; generated when omitted. */\n  id?: string\n  /** Landmark name shared by the desktop and mobile navigation. */\n  label: string\n  /** Visible navigation title and mobile dialog title. */\n  title: string\n  /** Host-controlled expanded state for the desktop panel and mobile dialog. */\n  open: boolean\n  onOpenChange(open: boolean): void\n  /** Current host-owned pixel width, reflected by the resize handle. */\n  width: number\n  minimum: number\n  maximum: number\n  step?: number\n  /** Pass the host's initial viewport seed to distinguish stale desktop state. */\n  wideViewportAtLoad?: boolean\n  resizeLabel?: string\n  /** Stable external opener used when the modal mobile sheet closes. */\n  restoreFocusRef?: Accessor<HTMLElement | undefined>\n  /** Called with the nav node so a host can project width onto its layout root. */\n  onSidebarElement?: (element: HTMLElement | undefined, mobile: boolean) => void\n  /** Host-owned layout classes applied to both nav instances. */\n  sidebarClass?: string\n  /** Host-owned responsive constraints for the modal sheet. */\n  sheetClass?: string\n  headerClass?: string\n  contentClass?: string\n  footerClass?: string\n  headingAs?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n  /** Optional action/content slot alongside the shared heading. */\n  header?(context: ContextualSidebarRenderContext): JSX.Element\n  /** View-specific navigation rows, projects, rooms, files, or sessions. */\n  content(context: ContextualSidebarRenderContext): JSX.Element\n  /** Optional view-specific footer, such as an archive affordance. */\n  footer?(context: ContextualSidebarRenderContext): JSX.Element\n  onWidthChange(width: number): void\n  onWidthCommit?(width: number): void\n}\n\n/**\n * ContextualSidebar.\n *\n * Shared navigation geometry and interaction policy for an application's\n * contextual sidebar. The host keeps ownership of the actual grid width,\n * persisted preference, open state, and view-specific navigation content.\n */\nexport function ContextualSidebar(props: ContextualSidebarProps) {\n  const [isNarrowViewport, setIsNarrowViewport] = createSignal(false)\n  const [mobileMount, setMobileMount] = createSignal<\n    { element: HTMLElement; connected: boolean } | undefined\n  >()\n  const id = props.id ?? `contextual-sidebar-${createUniqueId()}`\n  const resizeLabel = () => props.resizeLabel ?? `Resize ${props.label}`\n  const portalMount = () => {\n    const mount = mobileMount()\n    return mount?.connected && mount.element.isConnected ? mount.element : undefined\n  }\n\n  onMount(() => {\n    const media = window.matchMedia('(max-width: 48rem)')\n    const updateViewport = () => {\n      const wasNarrow = isNarrowViewport()\n      // Close before mounting a modal. A desktop-expanded host state is not\n      // mobile intent, and opening the Sheet for one frame can steal focus.\n      if (media.matches && !wasNarrow) props.onOpenChange(false)\n      setIsNarrowViewport(media.matches)\n    }\n\n    // A route can mount after a wide-loaded host crosses into mobile. Clear\n    // that stale seed, but preserve a sidebar intentionally opened at a\n    // narrow boot viewport.\n    if (media.matches && props.wideViewportAtLoad && props.open) props.onOpenChange(false)\n    setIsNarrowViewport(media.matches)\n    media.addEventListener('change', updateViewport)\n    onCleanup(() => media.removeEventListener('change', updateViewport))\n  })\n\n  const renderSidebar = (mobile: boolean) => {\n    let element: HTMLElement | undefined\n    const context: ContextualSidebarRenderContext = {\n      mobile,\n      portalMount: () => (mobile ? portalMount() : undefined),\n    }\n    const navigationId = `${id}-${mobile ? 'mobile' : 'desktop'}`\n\n    onCleanup(() => {\n      if (mobile && mobileMount()?.element === element) setMobileMount(undefined)\n      element = undefined\n      props.onSidebarElement?.(undefined, mobile)\n    })\n\n    return (\n      <SidebarNav\n        as=\"aside\"\n        id={navigationId}\n        aria-label={props.label}\n        aria-hidden={!mobile && !props.open ? 'true' : undefined}\n        inert={!mobile && !props.open}\n        data-contextual-sidebar={mobile ? 'mobile' : 'desktop'}\n        data-open={mobile ? undefined : String(props.open)}\n        ref={(node) => {\n          element = node\n          if (mobile) {\n            setMobileMount({ element: node, connected: node.isConnected })\n            queueMicrotask(() => {\n              if (node.isConnected && mobileMount()?.element === node)\n                setMobileMount({ element: node, connected: true })\n            })\n          }\n          props.onSidebarElement?.(node, mobile)\n        }}\n        class={cn('relative h-full w-full max-w-full', props.sidebarClass)}\n      >\n        <Show when={!mobile && props.open}>\n          <PixelResizeHandle\n            side=\"left\"\n            value={props.width}\n            minimum={props.minimum}\n            maximum={props.maximum}\n            step={props.step}\n            label={resizeLabel()}\n            controls={navigationId}\n            onChange={props.onWidthChange}\n            onCommit={props.onWidthCommit}\n          />\n        </Show>\n        <Show when={!mobile || mobileMount()?.connected}>\n          <SidebarNavHeader class={cn(mobile && 'pe-12', props.headerClass)}>\n            <SidebarNavTitle as={props.headingAs ?? 'h2'}>{props.title}</SidebarNavTitle>\n            {props.header?.(context)}\n          </SidebarNavHeader>\n          <SidebarNavContent class={props.contentClass}>{props.content(context)}</SidebarNavContent>\n          {props.footer ? (\n            <SidebarNavFooter class={props.footerClass}>{props.footer(context)}</SidebarNavFooter>\n          ) : null}\n        </Show>\n      </SidebarNav>\n    )\n  }\n\n  return (\n    <Sheet\n      open={isNarrowViewport() && props.open}\n      onOpenChange={(open) => props.onOpenChange(open)}\n    >\n      <Show when={!isNarrowViewport()}>{(_wide) => renderSidebar(false)}</Show>\n      <Show when={isNarrowViewport()}>\n        <SheetContent\n          side=\"start\"\n          class={cn('gap-0 p-0', props.sheetClass)}\n          restoreFocusRef={props.restoreFocusRef}\n        >\n          <SheetTitle class=\"sr-only\">{props.title} navigation</SheetTitle>\n          {renderSidebar(true)}\n        </SheetContent>\n      </Show>\n    </Sheet>\n  )\n}\n"],"mappings":"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"}

package/dist/components/layout/contextual-sidebar/index.d.ts

@@ -0,0 +1,3 @@
+export { ContextualSidebar, type ContextualSidebarProps, type ContextualSidebarRenderContext, } from './contextual-sidebar';
+export { PixelResizeHandle, type PixelResizeHandleProps } from '../pixel-resize-handle';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/layout/contextual-sidebar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/contextual-sidebar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,KAAK,sBAAsB,EAC3B,KAAK,8BAA8B,GACpC,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,wBAAwB,CAAA"}

package/dist/components/layout/contextual-sidebar/index.js

@@ -0,0 +1,3 @@
+import { PixelResizeHandle } from "../pixel-resize-handle/pixel-resize-handle.js";
+import { ContextualSidebar } from "./contextual-sidebar.js";
+export { ContextualSidebar, PixelResizeHandle };

package/dist/components/layout/pixel-resize-handle/index.d.ts

@@ -0,0 +1,2 @@
+export { PixelResizeHandle, type PixelResizeHandleProps } from './pixel-resize-handle';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/layout/pixel-resize-handle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/pixel-resize-handle/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,uBAAuB,CAAA"}

package/dist/components/layout/pixel-resize-handle/index.js

@@ -0,0 +1,2 @@
+import { PixelResizeHandle } from "./pixel-resize-handle.js";
+export { PixelResizeHandle };

package/dist/components/layout/pixel-resize-handle/pixel-resize-handle.d.ts

@@ -0,0 +1,29 @@
+export type PixelResizeHandleProps = {
+    /** Which physical edge of the ruler the resizable surface is attached to. */
+    side: 'left' | 'right';
+    /** Current width in CSS pixels. */
+    value: number;
+    minimum: number;
+    maximum: number;
+    step?: number;
+    label?: string;
+    controls?: string;
+    class?: string;
+    onChange(value: number): void;
+    onCommit?(value: number): void;
+};
+/**
+ * PixelResizeHandle.
+ *
+ * A keyboard- and pointer-operable edge ruler for a host-owned pane. Keep the
+ * pane's actual width and any persistence in its layout owner; this component
+ * reports a bounded pixel value and places the shared resizable grip at the
+ * matching left or right edge.
+ *
+ * Corvu 0.2.5 supplies geometry, keyboard resizing, ARIA and the shared grip,
+ * but its global drag handler does not end on pointer cancellation. Prevent
+ * that handler through its public start hook and use local pointer capture
+ * for bounded pixel gestures, including cancellation and lost capture.
+ */
+export declare function PixelResizeHandle(props: PixelResizeHandleProps): import("solid-js").JSX.Element;
+//# sourceMappingURL=pixel-resize-handle.d.ts.map

package/dist/components/layout/pixel-resize-handle/pixel-resize-handle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pixel-resize-handle.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/pixel-resize-handle/pixel-resize-handle.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,sBAAsB,GAAG;IACnC,6EAA6E;IAC7E,IAAI,EAAE,MAAM,GAAG,OAAO,CAAA;IACtB,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,QAAQ,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,kCAgJ9D"}

package/dist/components/layout/pixel-resize-handle/pixel-resize-handle.js

@@ -0,0 +1,183 @@
+import { cn } from "../../../lib/utils.js";
+import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "../../ui/resizable/resizable.js";
+import { createComponent, memo } from "solid-js/web";
+import { createSignal, onCleanup } from "solid-js";
+//#region src/components/layout/pixel-resize-handle/pixel-resize-handle.tsx
+/**
+* PixelResizeHandle.
+*
+* A keyboard- and pointer-operable edge ruler for a host-owned pane. Keep the
+* pane's actual width and any persistence in its layout owner; this component
+* reports a bounded pixel value and places the shared resizable grip at the
+* matching left or right edge.
+*
+* Corvu 0.2.5 supplies geometry, keyboard resizing, ARIA and the shared grip,
+* but its global drag handler does not end on pointer cancellation. Prevent
+* that handler through its public start hook and use local pointer capture
+* for bounded pixel gestures, including cancellation and lost capture.
+*/
+function PixelResizeHandle(props) {
+	const maximum = () => Math.max(1, props.maximum);
+	const minimum = () => Math.min(maximum(), Math.max(0, props.minimum));
+	const value = () => Math.min(maximum(), Math.max(minimum(), Math.round(props.value)));
+	const ratio = () => value() / maximum();
+	const isRight = () => props.side === "right";
+	const rulerSizes = () => isRight() ? [1 - ratio(), ratio()] : [ratio(), 1 - ratio()];
+	const commit = () => props.onCommit?.(value());
+	let interacting = false;
+	const [drag, setDrag] = createSignal();
+	const endPointer = (shouldCommit) => {
+		const current = drag();
+		if (!current) return;
+		setDrag(void 0);
+		if (current.handle.hasPointerCapture(current.pointerId)) current.handle.releasePointerCapture(current.pointerId);
+		if (shouldCommit) commit();
+	};
+	const endKeyboard = () => {
+		const wasInteracting = interacting;
+		interacting = false;
+		if (wasInteracting) commit();
+	};
+	onCleanup(() => {
+		endKeyboard();
+		endPointer(false);
+	});
+	return createComponent(ResizablePanelGroup, {
+		orientation: "horizontal",
+		dir: "ltr",
+		get sizes() {
+			return rulerSizes();
+		},
+		get keyboardDelta() {
+			return `${props.step ?? 16}px`;
+		},
+		get style() {
+			return { width: `${maximum()}px` };
+		},
+		get ["class"]() {
+			return cn("pointer-events-none absolute inset-y-0 flex", {
+				"left-0": props.side === "left",
+				"right-0": props.side === "right"
+			}, props.class);
+		},
+		onSizesChange: (sizes) => {
+			if (!interacting || sizes.length !== 2) return;
+			const next = Math.round((sizes[isRight() ? 1 : 0] ?? ratio()) * maximum());
+			const bounded = Math.min(maximum(), Math.max(minimum(), next));
+			if (bounded !== value()) props.onChange(bounded);
+		},
+		get children() {
+			return [
+				createComponent(ResizablePanel, {
+					get minSize() {
+						return memo(() => !!isRight())() ? 0 : minimum() / maximum();
+					},
+					maxSize: 1,
+					"aria-hidden": "true"
+				}),
+				createComponent(ResizableHandle, {
+					withHandle: true,
+					get label() {
+						return props.label ?? `Resize ${props.side} pane`;
+					},
+					get ["aria-controls"]() {
+						return props.controls;
+					},
+					get ["aria-valuemin"]() {
+						return minimum();
+					},
+					get ["aria-valuemax"]() {
+						return maximum();
+					},
+					get ["aria-valuenow"]() {
+						return value();
+					},
+					get ["aria-valuetext"]() {
+						return `${value()} pixels`;
+					},
+					get ["data-dragging"]() {
+						return drag() ? "" : void 0;
+					},
+					onHandleDragStart: (event) => {
+						event.preventDefault();
+						if (event.button !== 0 || !event.isPrimary) return;
+						const handle = event.currentTarget;
+						if (!(handle instanceof HTMLElement)) return;
+						endPointer(false);
+						interacting = false;
+						handle.focus();
+						handle.setPointerCapture(event.pointerId);
+						setDrag({
+							pointerId: event.pointerId,
+							startX: event.clientX,
+							startValue: value(),
+							handle
+						});
+					},
+					onPointerMove: (event) => {
+						const current = drag();
+						if (!current || event.pointerId !== current.pointerId) return;
+						if (!current.handle.hasPointerCapture(current.pointerId)) {
+							endPointer(false);
+							return;
+						}
+						const delta = (event.clientX - current.startX) * (isRight() ? -1 : 1);
+						const next = Math.min(maximum(), Math.max(minimum(), Math.round(current.startValue + delta)));
+						if (next !== value()) props.onChange(next);
+					},
+					onPointerUp: (event) => {
+						if (event.pointerId === drag()?.pointerId) endPointer(true);
+					},
+					onPointerCancel: (event) => {
+						if (event.pointerId === drag()?.pointerId) endPointer(false);
+					},
+					onLostPointerCapture: (event) => {
+						if (event.pointerId === drag()?.pointerId) endPointer(false);
+					},
+					onBlur: () => {
+						endKeyboard();
+						endPointer(false);
+					},
+					onKeyDown: (event) => {
+						const current = drag();
+						if (current && !current.handle.hasPointerCapture(current.pointerId)) endPointer(false);
+						if (drag()) {
+							event.preventDefault();
+							return;
+						}
+						if ([
+							"ArrowLeft",
+							"ArrowRight",
+							"Home",
+							"End"
+						].includes(event.key)) interacting = true;
+						if (event.key === "Home" || event.key === "End") {
+							event.preventDefault();
+							props.onChange(event.key === "Home" ? minimum() : maximum());
+						}
+					},
+					onKeyUp: (event) => {
+						if ([
+							"ArrowLeft",
+							"ArrowRight",
+							"Home",
+							"End"
+						].includes(event.key)) endKeyboard();
+					},
+					"class": "pointer-events-auto"
+				}),
+				createComponent(ResizablePanel, {
+					get minSize() {
+						return memo(() => !!isRight())() ? minimum() / maximum() : 0;
+					},
+					maxSize: 1,
+					"aria-hidden": "true"
+				})
+			];
+		}
+	});
+}
+//#endregion
+export { PixelResizeHandle };
+
+//# sourceMappingURL=pixel-resize-handle.js.map

package/dist/components/layout/pixel-resize-handle/pixel-resize-handle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pixel-resize-handle.js","names":["ResizableHandle","ResizablePanel","ResizablePanelGroup","createSignal","onCleanup","cn","PixelResizeHandleProps","side","value","minimum","maximum","step","label","controls","class","onChange","onCommit","PixelResizeHandle","props","Math","max","min","round","ratio","isRight","rulerSizes","commit","interacting","drag","setDrag","pointerId","startX","startValue","handle","HTMLElement","endPointer","shouldCommit","current","undefined","hasPointerCapture","releasePointerCapture","endKeyboard","wasInteracting","_$createComponent","orientation","dir","sizes","keyboardDelta","style","width","onSizesChange","length","next","bounded","children","minSize","_$memo","maxSize","withHandle","aria-controls","aria-valuemin","aria-valuemax","aria-valuenow","aria-valuetext","data-dragging","onHandleDragStart","event","preventDefault","button","isPrimary","currentTarget","focus","setPointerCapture","clientX","onPointerMove","PointerEvent","delta","onPointerUp","onPointerCancel","onLostPointerCapture","onBlur","onKeyDown","includes","key","onKeyUp","_$createComponent","_$memo"],"sources":["../../../../src/components/layout/pixel-resize-handle/pixel-resize-handle.tsx"],"sourcesContent":["import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from '../../ui/resizable'\nimport { createSignal, onCleanup } from 'solid-js'\nimport { cn } from '#lib/utils'\n\nexport type PixelResizeHandleProps = {\n  /** Which physical edge of the ruler the resizable surface is attached to. */\n  side: 'left' | 'right'\n  /** Current width in CSS pixels. */\n  value: number\n  minimum: number\n  maximum: number\n  step?: number\n  label?: string\n  controls?: string\n  class?: string\n  onChange(value: number): void\n  onCommit?(value: number): void\n}\n\n/**\n * PixelResizeHandle.\n *\n * A keyboard- and pointer-operable edge ruler for a host-owned pane. Keep the\n * pane's actual width and any persistence in its layout owner; this component\n * reports a bounded pixel value and places the shared resizable grip at the\n * matching left or right edge.\n *\n * Corvu 0.2.5 supplies geometry, keyboard resizing, ARIA and the shared grip,\n * but its global drag handler does not end on pointer cancellation. Prevent\n * that handler through its public start hook and use local pointer capture\n * for bounded pixel gestures, including cancellation and lost capture.\n */\nexport function PixelResizeHandle(props: PixelResizeHandleProps) {\n  const maximum = () => Math.max(1, props.maximum)\n  const minimum = () => Math.min(maximum(), Math.max(0, props.minimum))\n  const value = () => Math.min(maximum(), Math.max(minimum(), Math.round(props.value)))\n  const ratio = () => value() / maximum()\n  const isRight = () => props.side === 'right'\n  const rulerSizes = () => (isRight() ? [1 - ratio(), ratio()] : [ratio(), 1 - ratio()])\n  const commit = () => props.onCommit?.(value())\n  let interacting = false\n  const [drag, setDrag] = createSignal<{\n    pointerId: number\n    startX: number\n    startValue: number\n    handle: HTMLElement\n  }>()\n  const endPointer = (shouldCommit: boolean) => {\n    const current = drag()\n    if (!current) return\n    setDrag(undefined)\n    if (current.handle.hasPointerCapture(current.pointerId))\n      current.handle.releasePointerCapture(current.pointerId)\n    if (shouldCommit) commit()\n  }\n  const endKeyboard = () => {\n    const wasInteracting = interacting\n    interacting = false\n    if (wasInteracting) commit()\n  }\n  onCleanup(() => {\n    endKeyboard()\n    endPointer(false)\n  })\n\n  return (\n    <ResizablePanelGroup\n      orientation=\"horizontal\"\n      dir=\"ltr\"\n      sizes={rulerSizes()}\n      keyboardDelta={`${props.step ?? 16}px`}\n      style={{ width: `${maximum()}px` }}\n      class={cn(\n        'pointer-events-none absolute inset-y-0 flex',\n        {\n          'left-0': props.side === 'left',\n          'right-0': props.side === 'right',\n        },\n        props.class\n      )}\n      onSizesChange={(sizes) => {\n        // Panel registration and teardown also emit sizes. Only user resizing\n        // may update the host preference; collapsing must preserve its width.\n        if (!interacting || sizes.length !== 2) return\n        const next = Math.round((sizes[isRight() ? 1 : 0] ?? ratio()) * maximum())\n        const bounded = Math.min(maximum(), Math.max(minimum(), next))\n        if (bounded !== value()) props.onChange(bounded)\n      }}\n    >\n      <ResizablePanel\n        minSize={isRight() ? 0 : minimum() / maximum()}\n        maxSize={1}\n        aria-hidden=\"true\"\n      />\n      <ResizableHandle\n        withHandle\n        label={props.label ?? `Resize ${props.side} pane`}\n        aria-controls={props.controls}\n        aria-valuemin={minimum()}\n        aria-valuemax={maximum()}\n        aria-valuenow={value()}\n        aria-valuetext={`${value()} pixels`}\n        data-dragging={drag() ? '' : undefined}\n        onHandleDragStart={(event) => {\n          // Corvu checks defaultPrevented before starting its global handler.\n          event.preventDefault()\n          if (event.button !== 0 || !event.isPrimary) return\n          const handle = event.currentTarget\n          if (!(handle instanceof HTMLElement)) return\n          endPointer(false)\n          interacting = false\n          handle.focus()\n          handle.setPointerCapture(event.pointerId)\n          setDrag({\n            pointerId: event.pointerId,\n            startX: event.clientX,\n            startValue: value(),\n            handle,\n          })\n        }}\n        onPointerMove={(event: PointerEvent) => {\n          const current = drag()\n          if (!current || event.pointerId !== current.pointerId) return\n          if (!current.handle.hasPointerCapture(current.pointerId)) {\n            endPointer(false)\n            return\n          }\n          const delta = (event.clientX - current.startX) * (isRight() ? -1 : 1)\n          const next = Math.min(\n            maximum(),\n            Math.max(minimum(), Math.round(current.startValue + delta))\n          )\n          if (next !== value()) props.onChange(next)\n        }}\n        onPointerUp={(event: PointerEvent) => {\n          if (event.pointerId === drag()?.pointerId) endPointer(true)\n        }}\n        onPointerCancel={(event: PointerEvent) => {\n          if (event.pointerId === drag()?.pointerId) endPointer(false)\n        }}\n        onLostPointerCapture={(event: PointerEvent) => {\n          if (event.pointerId === drag()?.pointerId) endPointer(false)\n        }}\n        onBlur={() => {\n          endKeyboard()\n          endPointer(false)\n        }}\n        onKeyDown={(event) => {\n          const current = drag()\n          if (current && !current.handle.hasPointerCapture(current.pointerId)) endPointer(false)\n          if (drag()) {\n            event.preventDefault()\n            return\n          }\n          if (['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) interacting = true\n          // Corvu operates on physical panel order. Home/End here describe\n          // the controlled pane width, including a pane after the separator.\n          if (event.key === 'Home' || event.key === 'End') {\n            event.preventDefault()\n            props.onChange(event.key === 'Home' ? minimum() : maximum())\n          }\n        }}\n        onKeyUp={(event) => {\n          if (['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) {\n            endKeyboard()\n          }\n        }}\n        class=\"pointer-events-auto\"\n      />\n      <ResizablePanel\n        minSize={isRight() ? minimum() / maximum() : 0}\n        maxSize={1}\n        aria-hidden=\"true\"\n      />\n    </ResizablePanelGroup>\n  )\n}\n"],"mappings":"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"}

package/dist/components/layout/sidebar-nav/sidebar-nav-resize-handle.d.ts

@@ -1,21 +1,5 @@
-export type SidebarNavResizeHandleProps = {
-    value: number;
-    minimum: number;
-    maximum: number;
-    step?: number;
-    label?: string;
-    controls?: string;
-    class?: string;
-    onChange(value: number): void;
-    onCommit?(value: number): void;
-};
-/**
- * Resize a contextual sidebar without making its host recreate a separator
- * widget. Corvu owns pointer capture, cancellation, constraints, keyboard
- * movement and cleanup. Its two invisible panels provide a bounded pixel
- * ruler; the host retains the real pane layout and preference persistence.
- * Place this inside the positioned sidebar. The ruler can extend over the
- * adjacent content, but only its handle participates in pointer hit testing.
- */
+import { type PixelResizeHandleProps } from '../pixel-resize-handle/pixel-resize-handle';
+export type SidebarNavResizeHandleProps = Omit<PixelResizeHandleProps, 'side'>;
+/** Keep the established left-sidebar API as a thin adapter over the shared edge ruler. */
 export declare function SidebarNavResizeHandle(props: SidebarNavResizeHandleProps): import("solid-js").JSX.Element;
 //# sourceMappingURL=sidebar-nav-resize-handle.d.ts.map

package/dist/components/layout/sidebar-nav/sidebar-nav-resize-handle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar-nav-resize-handle.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/sidebar-nav/sidebar-nav-resize-handle.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,2BAA2B,GAAG;IACxC,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,QAAQ,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B,CAAA;AAED;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,kCAmCxE"}
+{"version":3,"file":"sidebar-nav-resize-handle.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/sidebar-nav/sidebar-nav-resize-handle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,sBAAsB,EAC5B,MAAM,4CAA4C,CAAA;AAEnD,MAAM,MAAM,2BAA2B,GAAG,IAAI,CAAC,sBAAsB,EAAE,MAAM,CAAC,CAAA;AAE9E,0FAA0F;AAC1F,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,kCAExE"}

package/dist/components/layout/sidebar-nav/sidebar-nav-resize-handle.js

@@ -1,82 +1,14 @@
-import { cn } from "../../../lib/utils.js";
-import { createComponent } from "solid-js/web";
-import Resizable from "@corvu/resizable";
+import { PixelResizeHandle } from "../pixel-resize-handle/pixel-resize-handle.js";
+import { createComponent, mergeProps } from "solid-js/web";
 //#region src/components/layout/sidebar-nav/sidebar-nav-resize-handle.tsx
-/**
-* Resize a contextual sidebar without making its host recreate a separator
-* widget. Corvu owns pointer capture, cancellation, constraints, keyboard
-* movement and cleanup. Its two invisible panels provide a bounded pixel
-* ruler; the host retains the real pane layout and preference persistence.
-* Place this inside the positioned sidebar. The ruler can extend over the
-* adjacent content, but only its handle participates in pointer hit testing.
-*/
+/** Keep the established left-sidebar API as a thin adapter over the shared edge ruler. */
 function SidebarNavResizeHandle(props) {
-	const maximum = () => Math.max(1, props.maximum);
-	const minimum = () => Math.min(maximum(), Math.max(0, props.minimum));
-	const value = () => Math.min(maximum(), Math.max(minimum(), props.value));
-	const commit = () => props.onCommit?.(value());
-	return createComponent(Resizable, {
-		orientation: "horizontal",
-		get sizes() {
-			return [value() / maximum(), 1 - value() / maximum()];
-		},
-		get keyboardDelta() {
-			return `${props.step ?? 16}px`;
-		},
-		get style() {
-			return { width: `${maximum()}px` };
-		},
-		get ["class"]() {
-			return cn("pointer-events-none absolute inset-y-0 start-0 flex", props.class);
-		},
-		onSizesChange: (sizes) => {
-			const next = Math.round((sizes[0] ?? 0) * maximum());
-			if (next !== value()) props.onChange(Math.min(maximum(), Math.max(minimum(), next)));
-		},
-		get children() {
-			return [
-				createComponent(Resizable.Panel, {
-					get minSize() {
-						return minimum() / maximum();
-					},
-					maxSize: 1,
-					"aria-hidden": "true"
-				}),
-				createComponent(Resizable.Handle, {
-					get ["aria-label"]() {
-						return props.label ?? "Resize navigation";
-					},
-					get ["aria-controls"]() {
-						return props.controls;
-					},
-					"aria-orientation": "vertical",
-					get ["aria-valuemin"]() {
-						return minimum();
-					},
-					get ["aria-valuemax"]() {
-						return maximum();
-					},
-					get ["aria-valuenow"]() {
-						return value();
-					},
-					onHandleDragEnd: commit,
-					onKeyUp: (event) => {
-						if ([
-							"ArrowLeft",
-							"ArrowRight",
-							"Home",
-							"End"
-						].includes(event.key)) commit();
-					},
-					"class": "pointer-events-auto relative z-(--z-docked) w-px -translate-x-full shrink-0 bg-transparent after:absolute after:inset-y-0 after:-inset-x-1 after:w-3 hover:bg-primary focus-visible:bg-primary focus-visible:ring-3 focus-visible:ring-primary-subtle focus-visible:outline-none"
-				}),
-				createComponent(Resizable.Panel, {
-					minSize: 0,
-					"aria-hidden": "true"
-				})
-			];
+	return createComponent(PixelResizeHandle, mergeProps(props, {
+		side: "left",
+		get label() {
+			return props.label ?? "Resize navigation";
 		}
-	});
+	}));
 }
 //#endregion
 export { SidebarNavResizeHandle };

package/dist/components/layout/sidebar-nav/sidebar-nav-resize-handle.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar-nav-resize-handle.js","names":["Resizable","cn","SidebarNavResizeHandleProps","value","minimum","maximum","step","label","controls","class","onChange","onCommit","SidebarNavResizeHandle","props","Math","max","min","commit","_$createComponent","orientation","sizes","keyboardDelta","style","width","onSizesChange","next","round","children","Panel","minSize","maxSize","Handle","aria-label","aria-controls","aria-valuemin","aria-valuemax","aria-valuenow","onHandleDragEnd","onKeyUp","event","includes","key","_$createComponent"],"sources":["../../../../src/components/layout/sidebar-nav/sidebar-nav-resize-handle.tsx"],"sourcesContent":["import Resizable from '@corvu/resizable'\nimport { cn } from '#lib/utils'\n\nexport type SidebarNavResizeHandleProps = {\n  value: number\n  minimum: number\n  maximum: number\n  step?: number\n  label?: string\n  controls?: string\n  class?: string\n  onChange(value: number): void\n  onCommit?(value: number): void\n}\n\n/**\n * Resize a contextual sidebar without making its host recreate a separator\n * widget. Corvu owns pointer capture, cancellation, constraints, keyboard\n * movement and cleanup. Its two invisible panels provide a bounded pixel\n * ruler; the host retains the real pane layout and preference persistence.\n * Place this inside the positioned sidebar. The ruler can extend over the\n * adjacent content, but only its handle participates in pointer hit testing.\n */\nexport function SidebarNavResizeHandle(props: SidebarNavResizeHandleProps) {\n  const maximum = () => Math.max(1, props.maximum)\n  const minimum = () => Math.min(maximum(), Math.max(0, props.minimum))\n  const value = () => Math.min(maximum(), Math.max(minimum(), props.value))\n  const commit = () => props.onCommit?.(value())\n\n  return (\n    <Resizable\n      orientation=\"horizontal\"\n      sizes={[value() / maximum(), 1 - value() / maximum()]}\n      keyboardDelta={`${props.step ?? 16}px`}\n      style={{ width: `${maximum()}px` }}\n      class={cn('pointer-events-none absolute inset-y-0 start-0 flex', props.class)}\n      onSizesChange={(sizes) => {\n        const next = Math.round((sizes[0] ?? 0) * maximum())\n        if (next !== value()) props.onChange(Math.min(maximum(), Math.max(minimum(), next)))\n      }}\n    >\n      <Resizable.Panel minSize={minimum() / maximum()} maxSize={1} aria-hidden=\"true\" />\n      <Resizable.Handle\n        aria-label={props.label ?? 'Resize navigation'}\n        aria-controls={props.controls}\n        aria-orientation=\"vertical\"\n        aria-valuemin={minimum()}\n        aria-valuemax={maximum()}\n        aria-valuenow={value()}\n        onHandleDragEnd={commit}\n        onKeyUp={(event) => {\n          if (['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) commit()\n        }}\n        class=\"pointer-events-auto relative z-(--z-docked) w-px -translate-x-full shrink-0 bg-transparent after:absolute after:inset-y-0 after:-inset-x-1 after:w-3 hover:bg-primary focus-visible:bg-primary focus-visible:ring-3 focus-visible:ring-primary-subtle focus-visible:outline-none\"\n      />\n      <Resizable.Panel minSize={0} aria-hidden=\"true\" />\n    </Resizable>\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAuBA,SAAgBY,uBAAuBC,OAAoC;CACzE,MAAMR,gBAAgBS,KAAKC,IAAI,GAAGF,MAAMR,OAAO;CAC/C,MAAMD,gBAAgBU,KAAKE,IAAIX,QAAQ,GAAGS,KAAKC,IAAI,GAAGF,MAAMT,OAAO,CAAC;CACpE,MAAMD,cAAcW,KAAKE,IAAIX,QAAQ,GAAGS,KAAKC,IAAIX,QAAQ,GAAGS,MAAMV,KAAK,CAAC;CACxE,MAAMc,eAAeJ,MAAMF,WAAWR,MAAM,CAAC;CAE7C,OAAAe,gBACGlB,WAAS;EACRmB,aAAW;EAAA,IACXC,QAAK;GAAA,OAAE,CAACjB,MAAM,IAAIE,QAAQ,GAAG,IAAIF,MAAM,IAAIE,QAAQ,CAAC;EAAC;EAAA,IACrDgB,gBAAa;GAAA,OAAE,GAAGR,MAAMP,QAAQ,GAAE;EAAI;EAAA,IACtCgB,QAAK;GAAA,OAAE,EAAEC,OAAO,GAAGlB,QAAQ,EAAC,IAAK;EAAC;EAAA,KAAA,WAAA;GAAA,OAC3BJ,GAAG,uDAAuDY,MAAMJ,KAAK;EAAC;EAC7Ee,gBAAgBJ,UAAU;GACxB,MAAMK,OAAOX,KAAKY,OAAON,MAAM,MAAM,KAAKf,QAAQ,CAAC;GACnD,IAAIoB,SAAStB,MAAM,GAAGU,MAAMH,SAASI,KAAKE,IAAIX,QAAQ,GAAGS,KAAKC,IAAIX,QAAQ,GAAGqB,IAAI,CAAC,CAAC;EACrF;EAAC,IAAAE,WAAA;GAAA,OAAA;IAAAT,gBAEAlB,UAAU4B,OAAK;KAAA,IAACC,UAAO;MAAA,OAAEzB,QAAQ,IAAIC,QAAQ;KAAC;KAAEyB,SAAS;KAAC,eAAA;IAAA,CAAA;IAAAZ,gBAC1DlB,UAAU+B,QAAM;KAAA,KAAA,gBAAA;MAAA,OACHlB,MAAMN,SAAS;KAAmB;KAAA,KAAA,mBAAA;MAAA,OAC/BM,MAAML;KAAQ;KAAA,oBAAA;KAAA,KAAA,mBAAA;MAAA,OAEdJ,QAAQ;KAAC;KAAA,KAAA,mBAAA;MAAA,OACTC,QAAQ;KAAC;KAAA,KAAA,mBAAA;MAAA,OACTF,MAAM;KAAC;KACtBkC,iBAAiBpB;KACjBqB,UAAUC,UAAU;MAClB,IAAI;OAAC;OAAa;OAAc;OAAQ;MAAK,CAAC,CAACC,SAASD,MAAME,GAAG,GAAGxB,OAAO;KAC7E;KAAC,SAAA;IAAA,CAAA;IAAAC,gBAGFlB,UAAU4B,OAAK;KAACC,SAAS;KAAC,eAAA;IAAA,CAAA;GAAA;EAAA;CAAA,CAAA;AAGjC"}
+{"version":3,"file":"sidebar-nav-resize-handle.js","names":["PixelResizeHandle","PixelResizeHandleProps","SidebarNavResizeHandleProps","Omit","SidebarNavResizeHandle","props","_$createComponent","_$mergeProps","side","label","_$createComponent","_$mergeProps"],"sources":["../../../../src/components/layout/sidebar-nav/sidebar-nav-resize-handle.tsx"],"sourcesContent":["import {\n  PixelResizeHandle,\n  type PixelResizeHandleProps,\n} from '../pixel-resize-handle/pixel-resize-handle'\n\nexport type SidebarNavResizeHandleProps = Omit<PixelResizeHandleProps, 'side'>\n\n/** Keep the established left-sidebar API as a thin adapter over the shared edge ruler. */\nexport function SidebarNavResizeHandle(props: SidebarNavResizeHandleProps) {\n  return <PixelResizeHandle {...props} side=\"left\" label={props.label ?? 'Resize navigation'} />\n}\n"],"mappings":";;;;AAQA,SAAgBI,uBAAuBC,OAAoC;CACzE,OAAAC,gBAAQN,mBAAiBO,WAAKF,OAAK;EAAEG,MAAI;EAAA,IAAQC,QAAK;GAAA,OAAEJ,MAAMI,SAAS;EAAmB;CAAA,CAAA,CAAA;AAC5F"}

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

@@ -1 +1 @@
-{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/badge/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAA;AAC/E,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAA;AAGtD;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa;;;8EAiCzB,CAAA;AAED,KAAK,iBAAiB,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAA;AAE3D,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,cAAc,GAAG,MAAM,IAAI,gBAAgB,CAC1E,CAAC,EACD,iBAAiB,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CACvC,CAAA;AAED,wBAAgB,KAAK,CAAC,CAAC,SAAS,cAAc,GAAG,MAAM,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,kCAU5E"}
+{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/badge/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAA;AAC/E,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAA;AAGtD;;;;;;;GAOG;AACH,eAAO,MAAM,aAAa;;;8EAqCzB,CAAA;AAED,KAAK,iBAAiB,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAA;AAE3D,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,cAAc,GAAG,MAAM,IAAI,gBAAgB,CAC1E,CAAC,EACD,iBAAiB,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CACvC,CAAA;AAED,wBAAgB,KAAK,CAAC,CAAC,SAAS,cAAc,GAAG,MAAM,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,kCAU5E"}

package/dist/components/ui/badge/badge.js

@@ -18,11 +18,15 @@ var badgeVariants = cva("inline-flex w-fit shrink-0 items-center justify-center
 			default: "bg-primary text-primary-foreground",
 			secondary: "bg-secondary text-secondary-foreground",
 			outline: "border-border text-foreground",
-			/** Tinted status fills, for counts and states rather than actions. */
-			success: "bg-success-subtle text-foreground",
-			warning: "bg-warning-subtle text-foreground",
-			destructive: "bg-destructive-subtle text-foreground",
-			info: "bg-info-subtle text-foreground",
+			/**
+			* Tinted status fills, for counts and states rather than actions. The
+			* word stays in `foreground` for contrast; the glyph takes the status
+			* hue, so tags of different tones read apart at a glance.
+			*/
+			success: "bg-success-subtle text-foreground [&_svg]:text-success",
+			warning: "bg-warning-subtle text-foreground [&_svg]:text-warning",
+			destructive: "bg-destructive-subtle text-foreground [&_svg]:text-destructive",
+			info: "bg-info-subtle text-foreground [&_svg]:text-info",
 			subtle: "bg-primary-subtle text-primary",
 			/**
 			* A count that asks for attention, pinned to a corner of another control

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

@@ -1 +1 @@
-{"version":3,"file":"badge.js","names":["Polymorphic","PolymorphicProps","ComponentProps","splitProps","ValidComponent","cva","VariantProps","cn","badgeVariants","variants","variant","default","secondary","outline","success","warning","destructive","info","subtle","notification","size","sm","md","lg","defaultVariants","BadgeVariantProps","BadgeProps","T","class","Badge","props","local","rest","_$createComponent","_$mergeProps","as","_$createComponent","_$mergeProps"],"sources":["../../../../src/components/ui/badge/badge.tsx"],"sourcesContent":["import { Polymorphic, type PolymorphicProps } from '@kobalte/core/polymorphic'\nimport { type ComponentProps, splitProps, type ValidComponent } from 'solid-js'\nimport { cva, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\n\n/**\n * Badge.\n *\n * A short, non-interactive status label. If it can be clicked it is a Button\n * with `size=\"2xs\"`, not a Badge — the difference matters because a Badge\n * carries no focus or pressed state and must never be the only way to reach an\n * action.\n */\nexport const badgeVariants = cva(\n  'inline-flex w-fit shrink-0 items-center justify-center gap-1 whitespace-nowrap rounded-md border border-transparent font-medium transition-colors [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:size-3',\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground',\n        secondary: 'bg-secondary text-secondary-foreground',\n        outline: 'border-border text-foreground',\n        /** Tinted status fills, for counts and states rather than actions. */\n        success: 'bg-success-subtle text-foreground',\n        warning: 'bg-warning-subtle text-foreground',\n        destructive: 'bg-destructive-subtle text-foreground',\n        info: 'bg-info-subtle text-foreground',\n        subtle: 'bg-primary-subtle text-primary',\n        /**\n         * A count that asks for attention, pinned to a corner of another control\n         * (a workspace mark, a rail icon). At `sm` it is a 2xs label on whatever\n         * surface sits behind the corner, where the destructive tint all but\n         * disappears — so it takes the solid, contrast-measured action fill.\n         */\n        notification: 'bg-destructive-action text-destructive-action-foreground',\n      },\n      size: {\n        sm: 'h-4 px-1.5 text-2xs',\n        md: 'h-5 px-2 text-xs',\n        lg: 'h-6 px-2.5 text-xs',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'md',\n    },\n  }\n)\n\ntype BadgeVariantProps = VariantProps<typeof badgeVariants>\n\nexport type BadgeProps<T extends ValidComponent = 'span'> = PolymorphicProps<\n  T,\n  BadgeVariantProps & { class?: string }\n>\n\nexport function Badge<T extends ValidComponent = 'span'>(props: BadgeProps<T>) {\n  const [local, rest] = splitProps(props as BadgeProps, ['variant', 'size', 'class'])\n\n  return (\n    <Polymorphic\n      as=\"span\"\n      class={cn(badgeVariants({ variant: local.variant, size: local.size }), local.class)}\n      {...(rest as ComponentProps<'span'>)}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAaA,IAAaQ,gBAAgBH,IAC3B,iNACA;CACEI,UAAU;EACRC,SAAS;GACPC,SAAS;GACTC,WAAW;GACXC,SAAS;;GAETC,SAAS;GACTC,SAAS;GACTC,aAAa;GACbC,MAAM;GACNC,QAAQ;;;;;;;GAORC,cAAc;EAChB;EACAC,MAAM;GACJC,IAAI;GACJC,IAAI;GACJC,IAAI;EACN;CACF;CACAC,iBAAiB;EACfd,SAAS;EACTU,MAAM;CACR;AACF,CACF;AASA,SAAgBS,MAAyCC,OAAsB;CAC7E,MAAM,CAACC,OAAOC,QAAQ7B,WAAW2B,OAAqB;EAAC;EAAW;EAAQ;CAAO,CAAC;CAElF,OAAAG,gBACGjC,aAAWkC,WAAA;EACVC,IAAE;EAAA,KAAA,WAAA;GAAA,OACK5B,GAAGC,cAAc;IAAEE,SAASqB,MAAMrB;IAASU,MAAMW,MAAMX;GAAK,CAAC,GAAGW,MAAMH,KAAK;EAAC;CAAA,GAC9EI,IAA8B,CAAA;AAGzC"}
+{"version":3,"file":"badge.js","names":["Polymorphic","PolymorphicProps","ComponentProps","splitProps","ValidComponent","cva","VariantProps","cn","badgeVariants","variants","variant","default","secondary","outline","success","warning","destructive","info","subtle","notification","size","sm","md","lg","defaultVariants","BadgeVariantProps","BadgeProps","T","class","Badge","props","local","rest","_$createComponent","_$mergeProps","as","_$createComponent","_$mergeProps"],"sources":["../../../../src/components/ui/badge/badge.tsx"],"sourcesContent":["import { Polymorphic, type PolymorphicProps } from '@kobalte/core/polymorphic'\nimport { type ComponentProps, splitProps, type ValidComponent } from 'solid-js'\nimport { cva, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\n\n/**\n * Badge.\n *\n * A short, non-interactive status label. If it can be clicked it is a Button\n * with `size=\"2xs\"`, not a Badge — the difference matters because a Badge\n * carries no focus or pressed state and must never be the only way to reach an\n * action.\n */\nexport const badgeVariants = cva(\n  'inline-flex w-fit shrink-0 items-center justify-center gap-1 whitespace-nowrap rounded-md border border-transparent font-medium transition-colors [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:size-3',\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground',\n        secondary: 'bg-secondary text-secondary-foreground',\n        outline: 'border-border text-foreground',\n        /**\n         * Tinted status fills, for counts and states rather than actions. The\n         * word stays in `foreground` for contrast; the glyph takes the status\n         * hue, so tags of different tones read apart at a glance.\n         */\n        success: 'bg-success-subtle text-foreground [&_svg]:text-success',\n        warning: 'bg-warning-subtle text-foreground [&_svg]:text-warning',\n        destructive: 'bg-destructive-subtle text-foreground [&_svg]:text-destructive',\n        info: 'bg-info-subtle text-foreground [&_svg]:text-info',\n        subtle: 'bg-primary-subtle text-primary',\n        /**\n         * A count that asks for attention, pinned to a corner of another control\n         * (a workspace mark, a rail icon). At `sm` it is a 2xs label on whatever\n         * surface sits behind the corner, where the destructive tint all but\n         * disappears — so it takes the solid, contrast-measured action fill.\n         */\n        notification: 'bg-destructive-action text-destructive-action-foreground',\n      },\n      size: {\n        sm: 'h-4 px-1.5 text-2xs',\n        md: 'h-5 px-2 text-xs',\n        lg: 'h-6 px-2.5 text-xs',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'md',\n    },\n  }\n)\n\ntype BadgeVariantProps = VariantProps<typeof badgeVariants>\n\nexport type BadgeProps<T extends ValidComponent = 'span'> = PolymorphicProps<\n  T,\n  BadgeVariantProps & { class?: string }\n>\n\nexport function Badge<T extends ValidComponent = 'span'>(props: BadgeProps<T>) {\n  const [local, rest] = splitProps(props as BadgeProps, ['variant', 'size', 'class'])\n\n  return (\n    <Polymorphic\n      as=\"span\"\n      class={cn(badgeVariants({ variant: local.variant, size: local.size }), local.class)}\n      {...(rest as ComponentProps<'span'>)}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAaA,IAAaQ,gBAAgBH,IAC3B,iNACA;CACEI,UAAU;EACRC,SAAS;GACPC,SAAS;GACTC,WAAW;GACXC,SAAS;;;;;;GAMTC,SAAS;GACTC,SAAS;GACTC,aAAa;GACbC,MAAM;GACNC,QAAQ;;;;;;;GAORC,cAAc;EAChB;EACAC,MAAM;GACJC,IAAI;GACJC,IAAI;GACJC,IAAI;EACN;CACF;CACAC,iBAAiB;EACfd,SAAS;EACTU,MAAM;CACR;AACF,CACF;AASA,SAAgBS,MAAyCC,OAAsB;CAC7E,MAAM,CAACC,OAAOC,QAAQ7B,WAAW2B,OAAqB;EAAC;EAAW;EAAQ;CAAO,CAAC;CAElF,OAAAG,gBACGjC,aAAWkC,WAAA;EACVC,IAAE;EAAA,KAAA,WAAA;GAAA,OACK5B,GAAGC,cAAc;IAAEE,SAASqB,MAAMrB;IAASU,MAAMW,MAAMX;GAAK,CAAC,GAAGW,MAAMH,KAAK;EAAC;CAAA,GAC9EI,IAA8B,CAAA;AAGzC"}

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

@@ -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;AAM9C;;;;;;;;;;;;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,kCAmChF;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"}
+{"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;AAM9C;;;;;;;;;;;;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,kCAmChF;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,kCAuBpF;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

@@ -1,5 +1,5 @@
 import { cn } from "../../../lib/utils.js";
-import { menuItem, popoverArrow } from "../../../lib/overlay.js";
+import { menuItem, popoverArrow, topLayerProps } from "../../../lib/overlay.js";
 import { useFormFieldControl } from "../../../lib/form-field.js";
 import { className, createComponent, delegateEvents, effect, insert, memo, mergeProps, template } from "solid-js/web";
 import { Check, ChevronDown, X } from "lucide-solid";
@@ -84,7 +84,7 @@ function ComboboxTrigger(props) {
 function ComboboxContent(props) {
 	const [local, rest] = splitProps(props, ["class", "children"]);
 	return createComponent(Combobox.Portal, { get children() {
-		return createComponent(Combobox.Content, mergeProps({ get ["class"]() {
+		return createComponent(Combobox.Content, mergeProps(topLayerProps, { 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 [

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

@@ -1 +1 @@
-{"version":3,"file":"combobox.js","names":["Combobox","KobalteCombobox","Check","ChevronDown","X","ComponentProps","Show","splitProps","menuContentPadding","menuItem","popoverArrow","useFormFieldControl","cn","props","Option","OptGroup","_$createComponent","ComboboxControl","Control","local","rest","_$mergeProps","class","ComboboxInput","Input","field","id","aria-label","aria-labelledby","aria-describedby","aria-invalid","aria-errormessage","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 { useFormFieldControl } from '#lib/form-field'\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, [\n    'class',\n    'id',\n    'aria-label',\n    'aria-labelledby',\n    'aria-describedby',\n    'aria-invalid',\n    'aria-errormessage',\n  ])\n  const field = useFormFieldControl('control', {\n    id: local.id,\n    'aria-label': local['aria-label'],\n    'aria-labelledby': local['aria-labelledby'],\n    'aria-describedby': local['aria-describedby'],\n    'aria-invalid': local['aria-invalid'],\n    'aria-errormessage': local['aria-errormessage'],\n  })\n\n  return (\n    <KobalteCombobox.Input\n      id={field?.id ?? local.id}\n      aria-label={local['aria-label']}\n      aria-labelledby={field?.['aria-labelledby'] ?? local['aria-labelledby']}\n      aria-describedby={field?.['aria-describedby'] ?? local['aria-describedby']}\n      aria-invalid={field?.['aria-invalid'] ?? local['aria-invalid']}\n      aria-errormessage={field?.['aria-errormessage'] ?? local['aria-errormessage']}\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":";;;;;;;;;;;;;;;;;;;;;;AAqBA,SAAgBA,WACda,OACA;CACA,OAAAG,gBAAQf,UAAoBY,KAAK;AACnC;AAEA,SAAgBI,gBAAgBJ,OAAuD;CACrF,MAAM,CAACM,OAAOC,QAAQb,WAAWM,OAAO,CAAC,OAAO,CAAC;CAEjD,OAAAG,gBACGf,SAAgBiB,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,QAAQb,WAAWM,OAAO;EACtC;EACA;EACA;EACA;EACA;EACA;EACA;CAAmB,CACpB;CACD,MAAMY,QAAQd,oBAAoB,WAAW;EAC3Ce,IAAIP,MAAMO;EACV,cAAcP,MAAM;EACpB,mBAAmBA,MAAM;EACzB,oBAAoBA,MAAM;EAC1B,gBAAgBA,MAAM;EACtB,qBAAqBA,MAAM;CAC7B,CAAC;CAED,OAAAH,gBACGf,SAAgBuB,OAAKH,WAAA;EAAA,IACpBK,KAAE;GAAA,OAAED,OAAOC,MAAMP,MAAMO;EAAE;EAAA,KAAA,gBAAA;GAAA,OACbP,MAAM;EAAa;EAAA,KAAA,qBAAA;GAAA,OACdM,QAAQ,sBAAsBN,MAAM;EAAkB;EAAA,KAAA,sBAAA;GAAA,OACrDM,QAAQ,uBAAuBN,MAAM;EAAmB;EAAA,KAAA,kBAAA;GAAA,OAC5DM,QAAQ,mBAAmBN,MAAM;EAAe;EAAA,KAAA,uBAAA;GAAA,OAC3CM,QAAQ,wBAAwBN,MAAM;EAAoB;EAAA,KAAA,WAAA;GAAA,OACtEP,GACL,uFACA,+BACAO,MAAMG,KACR;EAAC;CAAA,GACGF,IAAI,CAAA;AAGd;AAEA,SAAgBY,gBAAgBnB,OAAuD;CACrF,MAAM,CAACM,OAAOC,QAAQb,WAAWM,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAG,gBACGf,SAAgBgC,SAAOZ,WAAA,EAAA,KAAA,WAAA;EAAA,OACfT,GACL,2FACA,oDACA,oFACA,oDACAO,MAAMG,KACR;CAAC,EAAA,GACGF,MAAI,EAAA,IAAAc,WAAA;EAAA,OAAA,CAAAC,WAEPhB,MAAMe,QAAQ,GAAAlB,gBACdf,SAAgBmC,MAAI,EAAA,IAAAF,WAAA;GAAA,OAAAlB,gBAClBb,aAAW,EAAA,SAAA,SAAA,CAAA;EAAA,EAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAIpB;AAEA,SAAgBkC,gBAAgBxB,OAAuD;CACrF,MAAM,CAACM,OAAOC,QAAQb,WAAWM,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAG,gBACGf,SAAgBsC,QAAM,EAAA,IAAAL,WAAA;EAAA,OAAAlB,gBACpBf,SAAgBqC,SAAOjB,WAAA,EAAA,KAAA,WAAA;GAAA,OACfT,GACL,gFACA,0HACA,6EACA,0EACA,uDACAO,MAAMG,KACR;EAAC,EAAA,GACGF,MAAI,EAAA,IAAAc,WAAA;GAAA,OAAA;IAAAlB,gBAEPf,SAAgBuC,SAAO,EAAA,KAAA,WAAA;KAAA,OAAQ5B,GAAG,4BAAA,KAA8C;IAAC,EAAA,CAAA;IAAAuB,WACjFhB,MAAMe,QAAQ;IAAAlB,gBACdf,SAAgBwC,OAAK;KAAA,eAAA;KAAA,SAA2B/B;IAAY,CAAA;GAAA;EAAA,EAAA,CAAA,CAAA;CAAA,EAAA,CAAA;AAIrE;AAEA,SAAgBgC,aAAa7B,OAAoD;CAC/E,MAAM,CAACM,OAAOC,QAAQb,WAAWM,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAG,gBACGf,SAAgB0C,MAAItB,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQT,GAAGH,UAAU,QAAQU,MAAMG,KAAK;CAAC,EAAA,GAAMF,MAAI,EAAA,IAAAc,WAAA;EAAA,OAAA,CAAAlB,gBACrEf,SAAgB2C,WAAS,EAAA,IAAAV,WAAA;GAAA,OAAEf,MAAMe;EAAQ,EAAA,CAAA,GAAAlB,gBACzCf,SAAgB4C,eAAa;GAAA,SAAA;GAAA,IAAAX,WAAA;IAAA,OAAAlB,gBAC3Bd,OAAK,EAAA,SAAA,SAAA,CAAA;GAAA;EAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAId;AAEA,SAAgB4C,gBAAgBjC,OAAuD;CACrF,MAAM,CAACM,OAAOC,QAAQb,WAAWM,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,gBAAQf,SAAgB8C,SAAO1B,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQT,GAAG,iBAAiBO,MAAMG,KAAK;CAAC,EAAA,GAAMF,IAAI,CAAA;AACnF;;AAGA,SAAgB4B,cAAcnC,OAAgD;CAC5E,OAAAG,gBACGV,MAAI;EAAA,IAAC4C,OAAI;GAAA,OAAErC,MAAMoC;EAAO;EAAA,IAAAf,WAAA;GAAA,IAAAiB,OAAAC,OAAA;GAAAD,KAAAE,gBAINxC,MAAMoC,QAAQ;GAACK,OAAAH,MAAAnC,gBAQ7BZ,GAAC,EAAA,SAAA,WAAA,CAAA,CAAA;GAAAmD,aAAAC,UAAAL,MAPKvC,GACL,qFACA,iEACA,oFACAC,MAAMS,KACR,CAAC,CAAA;GAAA,OAAA6B;EAAA;CAAA,CAAA;AAMT;AAACM,eAAA,CAAA,OAAA,CAAA"}
+{"version":3,"file":"combobox.js","names":["Combobox","KobalteCombobox","Check","ChevronDown","X","ComponentProps","Show","splitProps","menuContentPadding","menuItem","popoverArrow","topLayerProps","useFormFieldControl","cn","props","Option","OptGroup","_$createComponent","ComboboxControl","Control","local","rest","_$mergeProps","class","ComboboxInput","Input","field","id","aria-label","aria-labelledby","aria-describedby","aria-invalid","aria-errormessage","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, topLayerProps } from '#lib/overlay'\nimport { useFormFieldControl } from '#lib/form-field'\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, [\n    'class',\n    'id',\n    'aria-label',\n    'aria-labelledby',\n    'aria-describedby',\n    'aria-invalid',\n    'aria-errormessage',\n  ])\n  const field = useFormFieldControl('control', {\n    id: local.id,\n    'aria-label': local['aria-label'],\n    'aria-labelledby': local['aria-labelledby'],\n    'aria-describedby': local['aria-describedby'],\n    'aria-invalid': local['aria-invalid'],\n    'aria-errormessage': local['aria-errormessage'],\n  })\n\n  return (\n    <KobalteCombobox.Input\n      id={field?.id ?? local.id}\n      aria-label={local['aria-label']}\n      aria-labelledby={field?.['aria-labelledby'] ?? local['aria-labelledby']}\n      aria-describedby={field?.['aria-describedby'] ?? local['aria-describedby']}\n      aria-invalid={field?.['aria-invalid'] ?? local['aria-invalid']}\n      aria-errormessage={field?.['aria-errormessage'] ?? local['aria-errormessage']}\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        {...topLayerProps}\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/context-menu/context-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context-menu.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/context-menu/context-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,IAAI,kBAAkB,EAAE,MAAM,4BAA4B,CAAA;AAE9E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAa9C;;;;;;;;;;;;GAYG;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,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAiB1F;AAED,wBAAgB,eAAe,CAC7B,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,GAAG;IACtD,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAA;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,kCAiCF;AAED,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,YAAY,CAAC,kCAY9D;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,kCAEhG;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,SAAS,CAAC,kCAW9F;AAED;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,kCAG3F;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,KAAK,CAAC,kCAEtF;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,SAAS,CAAC,kCAG9F;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,GAAG,CAAC,kCAElF;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,kCAShG;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,kCAiBhG"}
+{"version":3,"file":"context-menu.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/context-menu/context-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,IAAI,kBAAkB,EAAE,MAAM,4BAA4B,CAAA;AAE9E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAc9C;;;;;;;;;;;;GAYG;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,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAkB1F;AAED,wBAAgB,eAAe,CAC7B,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC,GAAG;IACtD,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAA;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,kCAiCF;AAED,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,YAAY,CAAC,kCAY9D;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,kCAEhG;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,SAAS,CAAC,kCAW9F;AAED;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,kCAG3F;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,KAAK,CAAC,kCAEtF;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,SAAS,CAAC,kCAG9F;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,GAAG,CAAC,kCAElF;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,kCAShG;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,kCAkBhG"}

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

@@ -1,5 +1,5 @@
 import { cn } from "../../../lib/utils.js";
-import { destructiveMenuItem, menuItem, menuLabel, menuSeparator, overlayMotion, overlaySurface } from "../../../lib/overlay.js";
+import { destructiveMenuItem, menuItem, menuLabel, menuSeparator, overlayMotion, overlaySurface, topLayerProps } from "../../../lib/overlay.js";
 import { createComponent, insert, memo, mergeProps, template } from "solid-js/web";
 import { Check, ChevronRight, Circle } from "lucide-solid";
 import { splitProps } from "solid-js";
@@ -28,7 +28,7 @@ function ContextMenuTrigger(props) {
 function ContextMenuContent(props) {
 	const [local, rest] = splitProps(props, ["class"]);
 	return createComponent(ContextMenu.Portal, { get children() {
-		return createComponent(ContextMenu.Content, mergeProps({ get ["class"]() {
+		return createComponent(ContextMenu.Content, mergeProps(topLayerProps, { get ["class"]() {
 			return cn(overlaySurface, overlayMotion, "z-(--z-menu) min-w-[10rem] origin-(--kb-menu-content-transform-origin) overflow-hidden", "p-1", local.class);
 		} }, rest));
 	} });
@@ -122,7 +122,7 @@ function ContextMenuSubTrigger(props) {
 function ContextMenuSubContent(props) {
 	const [local, rest] = splitProps(props, ["class"]);
 	return createComponent(ContextMenu.Portal, { get children() {
-		return createComponent(ContextMenu.SubContent, mergeProps({ get ["class"]() {
+		return createComponent(ContextMenu.SubContent, mergeProps(topLayerProps, { get ["class"]() {
 			return cn(overlaySurface, overlayMotion, "z-(--z-menu) min-w-[8rem] origin-(--kb-menu-content-transform-origin) overflow-hidden", "p-1", local.class);
 		} }, rest));
 	} });