@cascivo/react 0.13.0 → 0.14.0

package/dist/node/radio-card/radio-card.js

@@ -2,62 +2,63 @@
 
 import e from "./radio-card.module.js";
 import { cn as t } from "@cascivo/core";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { createContext as i } from "react";
+import { createContext as n, forwardRef as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region ../components/src/radio-card/radio-card.tsx
-var a = i({ name: "" });
-function o({ name: r, label: i, value: o, defaultValue: s, onValueChange: c, children: l, className: u }) {
-	return /* @__PURE__ */ n(a.Provider, {
+var o = n({ name: "" });
+function s({ name: n, label: r, value: a, defaultValue: s, onValueChange: c, children: l, className: u }) {
+	return /* @__PURE__ */ i(o.Provider, {
 		value: {
-			name: r,
-			value: o,
+			name: n,
+			value: a,
 			defaultValue: s,
 			onValueChange: c
 		},
-		children: /* @__PURE__ */ n("div", {
+		children: /* @__PURE__ */ i("div", {
 			role: "radiogroup",
-			"aria-label": i,
+			"aria-label": r,
 			className: t(e.group, u),
 			children: l
 		})
 	});
 }
-function s({ value: t, title: i, description: o, disabled: s, hideIndicator: c, ...l }) {
-	return /* @__PURE__ */ n(a.Consumer, { children: (a) => /* @__PURE__ */ r("label", {
+var c = r(function({ value: t, title: n, description: r, disabled: s, hideIndicator: c, ...l }, u) {
+	return /* @__PURE__ */ i(o.Consumer, { children: (o) => /* @__PURE__ */ a("label", {
 		className: e.card,
 		"data-disabled": s || void 0,
 		children: [
-			/* @__PURE__ */ n("input", {
+			/* @__PURE__ */ i("input", {
 				type: "radio",
 				className: e.input,
-				name: a.name,
+				name: o.name,
 				value: t,
 				disabled: s,
-				...a.value === void 0 ? {
-					defaultChecked: a.defaultValue === t,
-					onChange: () => a.onValueChange?.(t)
+				...o.value === void 0 ? {
+					defaultChecked: o.defaultValue === t,
+					onChange: () => o.onValueChange?.(t)
 				} : {
-					checked: a.value === t,
-					onChange: () => a.onValueChange?.(t)
+					checked: o.value === t,
+					onChange: () => o.onValueChange?.(t)
 				},
+				ref: u,
 				...l
 			}),
-			!c && /* @__PURE__ */ n("span", {
+			!c && /* @__PURE__ */ i("span", {
 				className: e.glyph,
 				"aria-hidden": "true"
 			}),
-			/* @__PURE__ */ r("span", {
+			/* @__PURE__ */ a("span", {
 				className: e.body,
-				children: [/* @__PURE__ */ n("span", {
+				children: [/* @__PURE__ */ i("span", {
 					className: e.title,
-					children: i
-				}), o && /* @__PURE__ */ n("span", {
+					children: n
+				}), r && /* @__PURE__ */ i("span", {
 					className: e.description,
-					children: o
+					children: r
 				})]
 			})
 		]
 	}) });
-}
+});
 //#endregion
-export { s as RadioCard, o as RadioCardGroup };
+export { c as RadioCard, s as RadioCardGroup };

package/dist/node/react/src/index.js

@@ -134,6 +134,6 @@ import { Center as an } from "../../layouts/src/center/center.js";
 import { Spacer as on } from "../../layouts/src/spacer/spacer.js";
 import { AutoGrid as sn } from "../../layouts/src/auto-grid/auto-grid.js";
 import { PageHeader as cn } from "../../layouts/src/page-header/page-header.js";
-import { ThemeProvider as ln, setTheme as un, themePreloadScript as dn, themeSignal as fn, useTheme as pn } from "./theme.js";
-import { DismissableLayer as mn, ErrorBoundary as hn, FocusScope as gn, Portal as _n, Presence as vn, Slot as yn, SuspenseBoundary as bn, VisuallyHidden as xn, batch as Sn, cn as Cn, composeRefs as wn, computePosition as Tn, computed as En, createMachine as Dn, createScope as On, createStreamBuffer as kn, effect as An, getLinkComponent as jn, mergeProps as Mn, setLinkComponent as Nn, signal as Pn, useAnchorPosition as Fn, useClipboard as In, useComputed as Ln, useControllableSignal as Rn, useDisclosure as zn, useEffectPropSignal as Bn, useId as Vn, useMachine as Hn, useMediaQuery as Un, useRovingFocus as Wn, useScope as Gn, useScrollLock as Kn, useSignal as qn, useSignalEffect as Jn, useSignals as Yn, useStreamBuffer as Xn, useTypeahead as Zn } from "@cascivo/core";
-export { M as Accordion, N as AccordionContent, P as AccordionItem, F as AccordionTrigger, I as ActionSheet, d as Alert, ye as AlertDialog, Yt as AppShell, _t as AspectRatio, sn as AutoGrid, f as Avatar, p as AvatarGroup, c as Badge, $e as Blockquote, xe as BottomSheet, z as Breadcrumb, t as Button, dt as ButtonGroup, Ft as Calendar, r as Card, i as CardContent, a as CardFooter, o as CardHeader, s as CardTitle, Rt as Carousel, an as Center, Xt as ChatBubble, v as Checkbox, He as CheckboxCard, Qe as Code, Ut as CodeSnippet, gt as Collapsible, Lt as ColorPicker, rn as Columns, ce as Combobox, ne as CommandMenu, we as Comparison, Tt as ContainedList, Et as ContainedListItem, Se as ContextMenu, Ce as ContextMenuItem, Ue as CopyButton, Dt as DataList, te as DataTable, le as DatePicker, It as DateRangePicker, mn as DismissableLayer, Bt as Dock, Vt as Drawer, w as Dropdown, Ie as Editable, X as EmptyState, hn as ErrorBoundary, Z as Fab, ct as Field, ue as FileUploader, lt as Filter, nn as Flex, gn as FocusScope, ae as Form, en as Grid, tn as GridItem, H as Header, Be as HeaderPanel, Xe as Heading, Te as HoverCard, Ee as HoverCardContent, De as HoverCardTrigger, ut as IconButton, h as Image, Kt as Indicator, pt as InlineLoading, n as Input, Ne as InputGroup, Pe as InputGroupAddon, kt as Item, At as ItemActions, jt as ItemContent, Mt as ItemDescription, Nt as ItemMedia, Pt as ItemTitle, qt as Join, L as Kbd, st as Label, R as Link, et as List, tt as ListItem, nt as LogViewer, he as Menu, vt as MenuButton, ge as MenuItem, _e as MenuSeparator, ve as MenuTrigger, bt as Menubar, l as Modal, ke as MultiSelect, Ht as NativeSelect, xt as NavigationMenu, mt as Notification, ee as NumberInput, je as OtpInput, Q as OverflowMenu, cn as PageHeader, G as Pagination, Oe as PasswordInput, fe as Popover, pe as PopoverContent, me as PopoverTrigger, _n as Portal, vn as Presence, Je as Progress, Y as ProgressBar, Ye as ProgressCircle, K as ProgressIndicator, rt as Prose, it as PullToRefresh, at as QrCode, Zt as RadialProgress, y as Radio, Le as RadioCard, Re as RadioCardGroup, b as RadioGroup, Fe as RatingGroup, ot as RelativeTime, zt as Resizable, ht as ScrollArea, $ as Search, Me as SegmentedControl, _ as Select, u as Separator, be as Sheet, ze as ShellHeader, W as SideNav, J as Skeleton, Ke as SkipNavLink, qe as SkipNavTarget, S as Slider, yn as Slot, on as Spacer, e as Spinner, Jt as Stack, We as Stat, Ge as Status, Wt as Steps, wt as StructuredList, bn as SuspenseBoundary, Qt as Swap, $t as SwipeItem, Ve as Switcher, O as Tabs, k as TabsContent, A as TabsList, j as TabsTrigger, q as Tag, Ae as TagsInput, Ze as Text, g as Textarea, ln as ThemeProvider, Gt as Tile, de as TimePicker, Ot as Timeline, T as ToastProvider, B as Toc, x as Toggle, ft as ToggleGroup, yt as Toggletip, C as Tooltip, St as TreeView, m as User, xn as VisuallyHidden, Sn as batch, Cn as cn, wn as composeRefs, Tn as computePosition, En as computed, oe as createForm, Dn as createMachine, On as createScope, kn as createStreamBuffer, E as dismissAllToasts, An as effect, re as fuzzyMatch, ie as fuzzyScore, jn as getLinkComponent, Mn as mergeProps, Nn as setLinkComponent, un as setTheme, Pn as signal, dn as themePreloadScript, fn as themeSignal, Ct as treeViewMessages, Fn as useAnchorPosition, In as useClipboard, Ln as useComputed, Rn as useControllableSignal, zn as useDisclosure, Bn as useEffectPropSignal, se as useForm, Vn as useId, Hn as useMachine, Un as useMediaQuery, U as usePopover, Wn as useRovingFocus, Gn as useScope, Kn as useScrollLock, qn as useSignal, Jn as useSignalEffect, Yn as useSignals, Xn as useStreamBuffer, pn as useTheme, D as useToast, V as useTocFromRegion, Zn as useTypeahead };
+import { ThemeProvider as ln, applyTheme as un, setTheme as dn, themePreloadScript as fn, themeSignal as pn, useTheme as mn } from "./theme.js";
+import { DismissableLayer as hn, ErrorBoundary as gn, FocusScope as _n, Portal as vn, Presence as yn, Slot as bn, SuspenseBoundary as xn, VisuallyHidden as Sn, batch as Cn, cn as wn, composeRefs as Tn, computePosition as En, computed as Dn, createMachine as On, createScope as kn, createStreamBuffer as An, effect as jn, getLinkComponent as Mn, mergeProps as Nn, setLinkComponent as Pn, signal as Fn, useAnchorPosition as In, useClipboard as Ln, useComputed as Rn, useControllableSignal as zn, useDisclosure as Bn, useEffectPropSignal as Vn, useId as Hn, useMachine as Un, useMediaQuery as Wn, useRovingFocus as Gn, useScope as Kn, useScrollLock as qn, useSignal as Jn, useSignalEffect as Yn, useSignals as Xn, useStreamBuffer as Zn, useTypeahead as Qn } from "@cascivo/core";
+export { M as Accordion, N as AccordionContent, P as AccordionItem, F as AccordionTrigger, I as ActionSheet, d as Alert, ye as AlertDialog, Yt as AppShell, _t as AspectRatio, sn as AutoGrid, f as Avatar, p as AvatarGroup, c as Badge, $e as Blockquote, xe as BottomSheet, z as Breadcrumb, t as Button, dt as ButtonGroup, Ft as Calendar, r as Card, i as CardContent, a as CardFooter, o as CardHeader, s as CardTitle, Rt as Carousel, an as Center, Xt as ChatBubble, v as Checkbox, He as CheckboxCard, Qe as Code, Ut as CodeSnippet, gt as Collapsible, Lt as ColorPicker, rn as Columns, ce as Combobox, ne as CommandMenu, we as Comparison, Tt as ContainedList, Et as ContainedListItem, Se as ContextMenu, Ce as ContextMenuItem, Ue as CopyButton, Dt as DataList, te as DataTable, le as DatePicker, It as DateRangePicker, hn as DismissableLayer, Bt as Dock, Vt as Drawer, w as Dropdown, Ie as Editable, X as EmptyState, gn as ErrorBoundary, Z as Fab, ct as Field, ue as FileUploader, lt as Filter, nn as Flex, _n as FocusScope, ae as Form, en as Grid, tn as GridItem, H as Header, Be as HeaderPanel, Xe as Heading, Te as HoverCard, Ee as HoverCardContent, De as HoverCardTrigger, ut as IconButton, h as Image, Kt as Indicator, pt as InlineLoading, n as Input, Ne as InputGroup, Pe as InputGroupAddon, kt as Item, At as ItemActions, jt as ItemContent, Mt as ItemDescription, Nt as ItemMedia, Pt as ItemTitle, qt as Join, L as Kbd, st as Label, R as Link, et as List, tt as ListItem, nt as LogViewer, he as Menu, vt as MenuButton, ge as MenuItem, _e as MenuSeparator, ve as MenuTrigger, bt as Menubar, l as Modal, ke as MultiSelect, Ht as NativeSelect, xt as NavigationMenu, mt as Notification, ee as NumberInput, je as OtpInput, Q as OverflowMenu, cn as PageHeader, G as Pagination, Oe as PasswordInput, fe as Popover, pe as PopoverContent, me as PopoverTrigger, vn as Portal, yn as Presence, Je as Progress, Y as ProgressBar, Ye as ProgressCircle, K as ProgressIndicator, rt as Prose, it as PullToRefresh, at as QrCode, Zt as RadialProgress, y as Radio, Le as RadioCard, Re as RadioCardGroup, b as RadioGroup, Fe as RatingGroup, ot as RelativeTime, zt as Resizable, ht as ScrollArea, $ as Search, Me as SegmentedControl, _ as Select, u as Separator, be as Sheet, ze as ShellHeader, W as SideNav, J as Skeleton, Ke as SkipNavLink, qe as SkipNavTarget, S as Slider, bn as Slot, on as Spacer, e as Spinner, Jt as Stack, We as Stat, Ge as Status, Wt as Steps, wt as StructuredList, xn as SuspenseBoundary, Qt as Swap, $t as SwipeItem, Ve as Switcher, O as Tabs, k as TabsContent, A as TabsList, j as TabsTrigger, q as Tag, Ae as TagsInput, Ze as Text, g as Textarea, ln as ThemeProvider, Gt as Tile, de as TimePicker, Ot as Timeline, T as ToastProvider, B as Toc, x as Toggle, ft as ToggleGroup, yt as Toggletip, C as Tooltip, St as TreeView, m as User, Sn as VisuallyHidden, un as applyTheme, Cn as batch, wn as cn, Tn as composeRefs, En as computePosition, Dn as computed, oe as createForm, On as createMachine, kn as createScope, An as createStreamBuffer, E as dismissAllToasts, jn as effect, re as fuzzyMatch, ie as fuzzyScore, Mn as getLinkComponent, Nn as mergeProps, Pn as setLinkComponent, dn as setTheme, Fn as signal, fn as themePreloadScript, pn as themeSignal, Ct as treeViewMessages, In as useAnchorPosition, Ln as useClipboard, Rn as useComputed, zn as useControllableSignal, Bn as useDisclosure, Vn as useEffectPropSignal, se as useForm, Hn as useId, Un as useMachine, Wn as useMediaQuery, U as usePopover, Gn as useRovingFocus, Kn as useScope, qn as useScrollLock, Jn as useSignal, Yn as useSignalEffect, Xn as useSignals, Zn as useStreamBuffer, mn as useTheme, D as useToast, V as useTocFromRegion, Qn as useTypeahead };

package/dist/node/react/src/theme.js

@@ -2,8 +2,8 @@
 
 import { persistedSignal as e } from "../../storage/src/persisted-signal.js";
 import { useSignalEffect as t, useSignals as n } from "@cascivo/core";
-import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
-import { useRef as o } from "react";
+import { useRef as r } from "react";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/theme.tsx
 var s = "cascivo-theme", c = "data-theme";
 function l() {
@@ -12,7 +12,7 @@ function l() {
 var u = /* @__PURE__ */ new Set();
 function d(e, t) {
 	l() && (e === null || typeof document > "u" || typeof requestAnimationFrame != "function" || u.has(t) || requestAnimationFrame(() => {
-		u.has(t) || getComputedStyle(e).getPropertyValue("--cascivo-color-accent").trim() === "" && (u.add(t), console.warn(`cascivo ThemeProvider: data-theme=${JSON.stringify(t)} was set, but no cascivo theme CSS defines it — every --cascivo-color-* token is unresolved, so components render grayscale. Import '@cascivo/themes/all.css' once in your entry (or '@cascivo/react/styles.css', which bundles the light and dark themes). Using a custom theme? Ensure its stylesheet is loaded and defines [data-theme=${JSON.stringify(t)}]. Docs: https://cascivo.com/docs/theming — offline: npx -y @cascivo/docs guide theming`));
+		u.has(t) || getComputedStyle(e).getPropertyValue("--cascivo-color-accent").trim() === "" && (u.add(t), console.warn(`cascivo ThemeProvider: data-theme=${JSON.stringify(t)} was set, but no cascivo theme CSS defines it — every --cascivo-color-* token is unresolved, so components render grayscale. Import '@cascivo/themes/all.css' once in your entry (or '@cascivo/react/styles.css', which bundles the light and dark themes). Using a custom theme? Ensure its stylesheet is loaded and defines [data-theme=${JSON.stringify(t)}]. Docs: https://cascivo.com/docs/theming.md — offline: npx -y @cascivo/docs guide theming`));
 	}));
 }
 var f = null, p = {
@@ -29,39 +29,50 @@ function h() {
 function g() {
 	return f ??= e(p.storageKey, h()), f;
 }
-function _(e) {
+var _ = !1, v = !1;
+function y(e) {
+	!l() || v || typeof requestAnimationFrame == "function" && requestAnimationFrame(() => {
+		_ || v || (v = !0, console.warn(`cascivo setTheme(${JSON.stringify(e)}): no <ThemeProvider> is mounted, so the theme signal updated but the ${c} attribute was never written — nothing on the page will restyle. Wrap your app in <ThemeProvider> (it is SSR-safe and persists the choice), or call applyTheme() to write the attribute directly if you are theming outside React. Docs: https://cascivo.com/docs/theming.md — offline: npx -y @cascivo/docs guide theming`));
+	});
+}
+function b(e) {
+	g().value = e, y(e);
+}
+function x(e, t) {
 	g().value = e;
+	let n = t ?? (typeof document < "u" ? document.documentElement : null);
+	n !== null && (n.setAttribute(c, e), d(n, e));
 }
-function v() {
-	return n(), [g().value, _];
+function S() {
+	return n(), [g().value, b];
 }
-function y() {
+function C() {
 	return g();
 }
-function b(e) {
+function w(e) {
 	return JSON.stringify(e).replace(/</g, "\\u003c");
 }
-function x({ defaultTheme: e, value: n, storageKey: l = s, attribute: u = c, target: m, onChange: h, nonce: _, children: v }) {
-	let y = o(!1);
-	y.current || (y.current = !0, (f === null || p.storageKey !== l) && (p = {
+function T({ defaultTheme: e, value: n, storageKey: l = s, attribute: u = c, target: m, onChange: h, nonce: v, children: y }) {
+	let b = r(!1);
+	b.current || (b.current = !0, (f === null || p.storageKey !== l) && (p = {
 		storageKey: l,
 		defaultTheme: e ?? "light",
 		explicit: e !== void 0
 	}, f = null));
 	let x = g();
 	n !== void 0 && (x.value = n);
-	let S = o(h);
+	let S = r(h);
 	return S.current = h, t(() => {
 		let e = x.value, t = m ? m.current : typeof document < "u" ? document.documentElement : null;
-		t?.setAttribute(u, e), d(t, e), S.current?.(e);
-	}), n !== void 0 && !m ? /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("script", {
-		nonce: _,
-		dangerouslySetInnerHTML: { __html: `document.documentElement.setAttribute(${b(u)},${b(n)})` }
-	}), v] }) : /* @__PURE__ */ i(r, { children: v });
+		_ = !0, t?.setAttribute(u, e), d(t, e), S.current?.(e);
+	}), n !== void 0 && !m ? /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a("script", {
+		nonce: v,
+		dangerouslySetInnerHTML: { __html: `document.documentElement.setAttribute(${w(u)},${w(n)})` }
+	}), y] }) : /* @__PURE__ */ a(i, { children: y });
 }
-function S(e = {}) {
+function E(e = {}) {
 	let t = JSON.stringify(e.storageKey ?? s), n = JSON.stringify(e.attribute ?? c), r = JSON.stringify(e.defaultTheme ?? "light"), i = e.defaultTheme === void 0 ? "if(typeof matchMedia==='function'){if(matchMedia('(prefers-color-scheme: dark)').matches)v='dark';else if(matchMedia('(prefers-color-scheme: light)').matches)v='light';}" : "";
 	return `(function(){try{var v=${r};` + i + `var raw=localStorage.getItem(${t});if(raw){v=raw;try{var e=JSON.parse(raw);if(e&&typeof e==='object'&&'value'in e)v=e.value;}catch(_){}}document.documentElement.setAttribute(${n},v);}catch(_){}})();`;
 }
 //#endregion
-export { x as ThemeProvider, _ as setTheme, S as themePreloadScript, y as themeSignal, v as useTheme };
+export { T as ThemeProvider, x as applyTheme, b as setTheme, E as themePreloadScript, C as themeSignal, S as useTheme };

package/dist/node/resizable/resizable.js

@@ -2,20 +2,20 @@
 
 import e from "./resizable.module.js";
 import { cn as t, useControllableSignal as n, useSignal as r, useSignalEffect as i, useSignals as a } from "@cascivo/core";
-import { builtin as o, t as s } from "@cascivo/i18n";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { Children as u, useRef as d } from "react";
+import { Children as o, useRef as s } from "react";
+import { builtin as c, t as l } from "@cascivo/i18n";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region ../components/src/resizable/resizable.tsx
 function f(e, t, n) {
 	return Math.min(n, Math.max(t, e));
 }
 function p({ children: p, orientation: m = "horizontal", defaultRatio: h = .5, ratio: g, minRatio: _ = .1, maxRatio: v = .9, onRatioChange: y, className: b, label: x }) {
 	a();
-	let [S, C] = u.toArray(p), [w, T] = n({
+	let [S, C] = o.toArray(p), [w, T] = n({
 		value: g,
 		defaultValue: h,
 		onChange: y
-	}), E = d(null), D = r(!1), O = (e) => {
+	}), E = s(null), D = r(!1), O = (e) => {
 		T(f(e, _, v));
 	}, k = (e, t) => {
 		let n = E.current;
@@ -40,18 +40,18 @@ function p({ children: p, orientation: m = "horizontal", defaultRatio: h = .5, r
 		else if (e.key === "End") O(v);
 		else return;
 		e.preventDefault();
-	}, j = x ?? s(o.resizable.handle), M = Math.round(w.value * 100);
-	return /* @__PURE__ */ l("div", {
+	}, j = x ?? l(c.resizable.handle), M = Math.round(w.value * 100);
+	return /* @__PURE__ */ d("div", {
 		ref: E,
 		className: t(e.resizable, b),
 		"data-orientation": m,
 		style: { "--cascivo-resizable-ratio": w.value },
 		children: [
-			/* @__PURE__ */ c("div", {
+			/* @__PURE__ */ u("div", {
 				className: e.pane,
 				children: S
 			}),
-			/* @__PURE__ */ c("div", {
+			/* @__PURE__ */ u("div", {
 				className: e.handle,
 				role: "separator",
 				"aria-orientation": m,
@@ -64,12 +64,12 @@ function p({ children: p, orientation: m = "horizontal", defaultRatio: h = .5, r
 				onPointerDown: (e) => {
 					e.preventDefault(), D.value = !0;
 				},
-				children: /* @__PURE__ */ c("span", {
+				children: /* @__PURE__ */ u("span", {
 					className: e.grip,
 					"aria-hidden": "true"
 				})
 			}),
-			/* @__PURE__ */ c("div", {
+			/* @__PURE__ */ u("div", {
 				className: e.pane,
 				children: C
 			})

package/dist/node/scroll-area/scroll-area.js

@@ -2,12 +2,12 @@
 
 import e from "./scroll-area.module.js";
 import { cn as t, useSignalEffect as n, useSignals as r } from "@cascivo/core";
-import { jsx as i } from "react/jsx-runtime";
-import { useRef as a } from "react";
+import { useRef as i } from "react";
+import { jsx as a } from "react/jsx-runtime";
 //#region ../components/src/scroll-area/scroll-area.tsx
 function o({ height: o, width: s, orientation: c = "vertical", edges: l = "shadow", className: u, style: d, children: f, ...p }) {
 	r();
-	let m = a(null);
+	let m = i(null);
 	n(() => {
 		let e = m.current;
 		if (!e) return;
@@ -24,7 +24,7 @@ function o({ height: o, width: s, orientation: c = "vertical", edges: l = "shado
 		...s === void 0 ? {} : { "--cascivo-scroll-area-width": s },
 		...d
 	};
-	return /* @__PURE__ */ i("div", {
+	return /* @__PURE__ */ a("div", {
 		ref: m,
 		"data-orientation": c,
 		"data-edges": l,

package/dist/node/search/search.js

@@ -1,13 +1,13 @@
 "use client";
 
 import e from "./search.module.js";
-import { cn as t, useId as n, useSignal as r, useSignalEffect as i, useSignals as a } from "@cascivo/core";
-import { builtin as o, t as s } from "@cascivo/i18n";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { useRef as u } from "react";
+import { cn as t, focusElement as n, useId as r, useSignal as i, useSignalEffect as a, useSignals as o } from "@cascivo/core";
+import { useRef as s } from "react";
+import { builtin as c, t as l } from "@cascivo/i18n";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region ../components/src/search/search.tsx
-function d() {
-	return /* @__PURE__ */ l("svg", {
+function f() {
+	return /* @__PURE__ */ d("svg", {
 		viewBox: "0 0 16 16",
 		width: "16",
 		height: "16",
@@ -16,11 +16,11 @@ function d() {
 		strokeWidth: "1.5",
 		strokeLinecap: "round",
 		"aria-hidden": "true",
-		children: [/* @__PURE__ */ c("circle", {
+		children: [/* @__PURE__ */ u("circle", {
 			cx: "7",
 			cy: "7",
 			r: "4.5"
-		}), /* @__PURE__ */ c("line", {
+		}), /* @__PURE__ */ u("line", {
 			x1: "10.5",
 			y1: "10.5",
 			x2: "14",
@@ -28,58 +28,58 @@ function d() {
 		})]
 	});
 }
-function f({ value: f, defaultValue: p = "", onValueChange: m, onChange: h, onSearch: g, debounceMs: _ = 300, placeholder: v, size: y = "md", label: b, disabled: x = !1, clearLabel: S, id: C, className: w }) {
-	a();
-	let T = v ?? s(o.search.placeholder), E = b ?? s(o.search.label), D = S ?? s(o.search.clear), O = u(null), k = n("cascade-search"), A = C ?? k, j = f !== void 0, M = r(j ? f : p);
-	j && (M.value = f);
-	let N = u(g);
-	N.current = g;
-	let P = u(null), F = () => {
-		P.current !== null && (clearTimeout(P.current), P.current = null);
+function p({ value: p, defaultValue: m = "", onValueChange: h, onChange: g, onSearch: _, debounceMs: v = 300, placeholder: y, size: b = "md", label: x, disabled: S = !1, clearLabel: C, id: w, className: T }) {
+	o();
+	let E = y ?? l(c.search.placeholder), D = x ?? l(c.search.label), O = C ?? l(c.search.clear), k = s(null), A = r("cascade-search"), j = w ?? A, M = p !== void 0, N = i(M ? p : m);
+	M && (N.value = p);
+	let P = s(_);
+	P.current = _;
+	let F = s(null), I = () => {
+		F.current !== null && (clearTimeout(F.current), F.current = null);
 	};
-	i(() => F);
-	let I = (e) => {
+	a(() => I);
+	let L = (e) => {
 		let t = e.target.value;
-		j || (M.value = t), (m ?? h)?.(t), F(), P.current = setTimeout(() => {
-			P.current = null, N.current?.(t);
-		}, _);
-	}, L = (e) => {
-		e.key === "Enter" && (F(), g?.(M.value));
-	}, R = () => {
-		F(), j || (M.value = ""), (m ?? h)?.(""), g?.(""), O.current?.focus();
-	}, z = M.value !== "";
-	return /* @__PURE__ */ l("div", {
-		className: t(e.root, w),
-		"data-size": y,
-		"data-state": z ? "filled" : "empty",
+		M || (N.value = t), (h ?? g)?.(t), I(), F.current = setTimeout(() => {
+			F.current = null, P.current?.(t);
+		}, v);
+	}, R = (e) => {
+		e.key === "Enter" && (I(), _?.(N.value));
+	}, z = () => {
+		I(), M || (N.value = ""), (h ?? g)?.(""), _?.(""), n(k.current);
+	}, B = N.value !== "";
+	return /* @__PURE__ */ d("div", {
+		className: t(e.root, T),
+		"data-size": b,
+		"data-state": B ? "filled" : "empty",
 		children: [
-			/* @__PURE__ */ c("label", {
+			/* @__PURE__ */ u("label", {
 				className: e.label,
-				htmlFor: A,
-				children: E
+				htmlFor: j,
+				children: D
 			}),
-			/* @__PURE__ */ c("span", {
+			/* @__PURE__ */ u("span", {
 				className: e.icon,
-				children: /* @__PURE__ */ c(d, {})
+				children: /* @__PURE__ */ u(f, {})
 			}),
-			/* @__PURE__ */ c("input", {
-				ref: O,
-				id: A,
+			/* @__PURE__ */ u("input", {
+				ref: k,
+				id: j,
 				type: "search",
 				className: e.input,
-				value: M.value,
-				placeholder: T,
-				disabled: x,
-				onChange: I,
-				onKeyDown: L
+				value: N.value,
+				placeholder: E,
+				disabled: S,
+				onChange: L,
+				onKeyDown: R
 			}),
-			z && /* @__PURE__ */ c("button", {
+			B && /* @__PURE__ */ u("button", {
 				type: "button",
 				className: e.clear,
-				"aria-label": D,
-				disabled: x,
-				onClick: R,
-				children: /* @__PURE__ */ c("span", {
+				"aria-label": O,
+				disabled: S,
+				onClick: z,
+				children: /* @__PURE__ */ u("span", {
 					"aria-hidden": "true",
 					children: "✕"
 				})
@@ -88,4 +88,4 @@ function f({ value: f, defaultValue: p = "", onValueChange: m, onChange: h, onSe
 	});
 }
 //#endregion
-export { f as Search };
+export { p as Search };

package/dist/node/select/select.js

@@ -2,70 +2,71 @@
 
 import e from "./select.module.js";
 import { cn as t, createMachine as n, useMachine as r } from "@cascivo/core";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { forwardRef as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region ../components/src/select/select.tsx
-var o = n({
+var s = n({
 	initial: "idle",
 	states: {
 		idle: { on: { FOCUS: "focused" } },
 		focused: { on: { BLUR: "idle" } }
 	}
-});
-function s({ label: n, hint: s, error: c, placeholder: l, options: u, size: d = "md", className: f, id: p, defaultValue: m, value: h, onFocus: g, onBlur: _, ...v }) {
-	let [y, b] = r(o), x = p ?? (n ? `cascade-select-${n.toLowerCase().replace(/\s+/g, "-")}` : void 0), S = h !== void 0, C = l !== void 0;
-	return /* @__PURE__ */ a("div", {
+}), c = i(function({ label: n, hint: i, error: c, placeholder: l, options: u, size: d = "md", className: f, id: p, defaultValue: m, value: h, onFocus: g, onBlur: _, ...v }, y) {
+	let [b, x] = r(s), S = p ?? (n ? `cascade-select-${n.toLowerCase().replace(/\s+/g, "-")}` : void 0), C = h !== void 0, w = l !== void 0;
+	return /* @__PURE__ */ o("div", {
 		className: t(e.wrapper, f),
-		"data-state": c ? "error" : y.value,
+		"data-state": c ? "error" : b.value,
 		"data-size": d,
 		children: [
-			n && /* @__PURE__ */ i("label", {
+			n && /* @__PURE__ */ a("label", {
 				className: e.label,
-				htmlFor: x,
+				htmlFor: S,
 				children: n
 			}),
-			/* @__PURE__ */ a("div", {
+			/* @__PURE__ */ o("div", {
 				className: e.field,
-				children: [/* @__PURE__ */ a("select", {
-					id: x,
+				children: [/* @__PURE__ */ o("select", {
+					id: S,
 					className: e.select,
 					"aria-invalid": c ? !0 : void 0,
-					"aria-describedby": c ? `${x}-error` : s ? `${x}-hint` : void 0,
+					"aria-describedby": c ? `${S}-error` : i ? `${S}-hint` : void 0,
 					value: h,
-					defaultValue: !S && C ? m ?? "" : m,
+					defaultValue: !C && w ? m ?? "" : m,
 					onFocus: (e) => {
-						b("FOCUS"), g?.(e);
+						x("FOCUS"), g?.(e);
 					},
 					onBlur: (e) => {
-						b("BLUR"), _?.(e);
+						x("BLUR"), _?.(e);
 					},
+					ref: y,
 					...v,
-					children: [C && /* @__PURE__ */ i("option", {
+					children: [w && /* @__PURE__ */ a("option", {
 						value: "",
 						disabled: !0,
 						children: l
-					}), u.map((e) => /* @__PURE__ */ i("option", {
+					}), u.map((e) => /* @__PURE__ */ a("option", {
 						value: e.value,
 						disabled: e.disabled,
 						children: e.label
 					}, e.value))]
-				}), /* @__PURE__ */ i("span", {
+				}), /* @__PURE__ */ a("span", {
 					className: e.chevron,
 					"aria-hidden": "true"
 				})]
 			}),
-			c && /* @__PURE__ */ i("span", {
-				id: `${x}-error`,
+			c && /* @__PURE__ */ a("span", {
+				id: `${S}-error`,
 				className: e.error,
 				role: "alert",
 				children: c
 			}),
-			!c && s && /* @__PURE__ */ i("span", {
-				id: `${x}-hint`,
+			!c && i && /* @__PURE__ */ a("span", {
+				id: `${S}-hint`,
 				className: e.hint,
-				children: s
+				children: i
 			})
 		]
 	});
-}
+});
 //#endregion
-export { s as Select };
+export { c as Select };

package/dist/node/sheet/sheet.js

@@ -2,12 +2,12 @@
 
 import e from "./sheet.module.js";
 import { useEffectPropSignal as t, useSignalEffect as n } from "@cascivo/core";
-import { builtin as r, t as i } from "@cascivo/i18n";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { useId as s, useRef as c } from "react";
+import { useId as r, useRef as i } from "react";
+import { builtin as a, t as o } from "@cascivo/i18n";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region ../components/src/sheet/sheet.tsx
 function l({ open: l, onClose: u, title: d, children: f, side: p = "end" }) {
-	let m = c(null), h = s(), g = t(l), _ = c(u);
+	let m = i(null), h = r(), g = t(l), _ = i(u);
 	return _.current = u, n(() => {
 		let e = m.current;
 		if (e) if (g.value) try {
@@ -16,7 +16,7 @@ function l({ open: l, onClose: u, title: d, children: f, side: p = "end" }) {
 		else try {
 			e.hidePopover();
 		} catch {}
-	}), /* @__PURE__ */ o("div", {
+	}), /* @__PURE__ */ c("div", {
 		ref: m,
 		popover: "manual",
 		role: "dialog",
@@ -25,21 +25,22 @@ function l({ open: l, onClose: u, title: d, children: f, side: p = "end" }) {
 		"data-state": l ? "open" : "closed",
 		"data-side": p,
 		className: e.sheet,
-		children: [/* @__PURE__ */ o("div", {
+		children: [/* @__PURE__ */ c("div", {
 			className: e.header,
-			children: [d != null && /* @__PURE__ */ a("span", {
+			children: [d != null && /* @__PURE__ */ s("span", {
 				id: h,
 				className: e.title,
 				children: d
-			}), /* @__PURE__ */ a("button", {
+			}), /* @__PURE__ */ s("button", {
 				type: "button",
-				"aria-label": i(r.sheet.close),
+				"aria-label": o(a.sheet.close),
 				onClick: () => _.current(),
 				className: e.close,
 				children: "✕"
 			})]
-		}), /* @__PURE__ */ a("div", {
+		}), /* @__PURE__ */ s("div", {
 			className: e.body,
+			"data-cascivo-sheet-body": "",
 			children: f
 		})]
 	});

package/dist/node/sheet/sheet.module.js

@@ -1,11 +1,11 @@
 "use client";
 
 var e = {
-	sheet: "_sheet_18eks_2",
-	header: "_header_18eks_133",
-	title: "_title_18eks_142",
-	close: "_close_18eks_148",
-	body: "_body_18eks_176"
+	sheet: "_sheet_gx7nz_2",
+	header: "_header_gx7nz_141",
+	title: "_title_gx7nz_150",
+	close: "_close_gx7nz_156",
+	body: "_body_gx7nz_184"
 };
 //#endregion
 export { e as default };