@cascivo/react 0.7.1 → 0.9.0

package/dist/number-input/number-input.js

@@ -30,66 +30,66 @@ function m(e) {
 	let n = Number(t);
 	return Number.isFinite(n) ? n : null;
 }
-function h({ value: n, defaultValue: h, onChange: g, min: _, max: v, step: y = 1, precision: b, formatOptions: x, label: S, hint: C, error: w, size: T = "md", disabled: E, incrementLabel: D, decrementLabel: O, className: k, id: A, onFocus: j, onBlur: M, onKeyDown: N, ...P }) {
+function h({ value: n, defaultValue: h, onValueChange: g, onChange: _, min: v, max: y, step: b = 1, precision: x, formatOptions: S, label: C, hint: w, error: T, size: E = "md", disabled: D, incrementLabel: O, decrementLabel: k, className: A, id: j, onFocus: M, onBlur: N, onKeyDown: P, ...F }) {
 	a();
-	let F = D ?? s(o.numberInput.increment), I = O ?? s(o.numberInput.decrement), [L, R] = r(u), z = n !== void 0, B = i(h ?? null), V = i(""), H = z ? n : B.value, U = A ?? (S ? `cascade-number-input-${S.toLowerCase().replace(/\s+/g, "-")}` : void 0), W = (e) => {
-		z || (B.value = e), V.value = e == null ? "" : String(e), e !== H && g?.(e);
-	}, G = () => {
-		let e = m(V.value);
-		e != null && (e = d(e, _, v), b !== void 0 && (e = p(e, b))), W(e);
-	}, K = (e) => {
-		let t = (L.value === "focused" ? m(V.value) : H) ?? 0, n = b ?? Math.max(f(y), f(t));
-		W(d(p(t + e * y, n), _, v));
-	}, q = L.value === "focused" ? V.value : ((e) => e == null ? "" : x ? new Intl.NumberFormat(void 0, x).format(e) : String(e))(H), J = H != null && v !== void 0 && H >= v, Y = H != null && _ !== void 0 && H <= _;
+	let I = O ?? s(o.numberInput.increment), L = k ?? s(o.numberInput.decrement), [R, z] = r(u), B = n !== void 0, V = i(h ?? null), H = i(""), U = B ? n : V.value, W = j ?? (C ? `cascade-number-input-${C.toLowerCase().replace(/\s+/g, "-")}` : void 0), G = (e) => {
+		B || (V.value = e), H.value = e == null ? "" : String(e), e !== U && (g ?? _)?.(e);
+	}, K = () => {
+		let e = m(H.value);
+		e != null && (e = d(e, v, y), x !== void 0 && (e = p(e, x))), G(e);
+	}, q = (e) => {
+		let t = (R.value === "focused" ? m(H.value) : U) ?? 0, n = x ?? Math.max(f(b), f(t));
+		G(d(p(t + e * b, n), v, y));
+	}, J = R.value === "focused" ? H.value : ((e) => e == null ? "" : S ? new Intl.NumberFormat(void 0, S).format(e) : String(e))(U), Y = U != null && y !== void 0 && U >= y, X = U != null && v !== void 0 && U <= v;
 	return /* @__PURE__ */ l("div", {
-		className: t(e.wrapper, k),
-		"data-state": w ? "error" : L.value,
-		"data-size": T,
+		className: t(e.wrapper, A),
+		"data-state": T ? "error" : R.value,
+		"data-size": E,
 		children: [
-			S && /* @__PURE__ */ c("label", {
+			C && /* @__PURE__ */ c("label", {
 				className: e.label,
-				htmlFor: U,
-				children: S
+				htmlFor: W,
+				children: C
 			}),
 			/* @__PURE__ */ l("div", {
 				className: e.field,
 				children: [/* @__PURE__ */ c("input", {
-					id: U,
+					id: W,
 					type: "text",
 					inputMode: "decimal",
 					autoComplete: "off",
 					role: "spinbutton",
 					className: e.input,
-					value: q,
-					disabled: E,
-					"aria-valuenow": H ?? void 0,
-					"aria-valuemin": _,
-					"aria-valuemax": v,
-					"aria-invalid": w ? !0 : void 0,
-					"aria-describedby": w ? `${U}-error` : C ? `${U}-hint` : void 0,
+					value: J,
+					disabled: D,
+					"aria-valuenow": U ?? void 0,
+					"aria-valuemin": v,
+					"aria-valuemax": y,
+					"aria-invalid": T ? !0 : void 0,
+					"aria-describedby": T ? `${W}-error` : w ? `${W}-hint` : void 0,
 					onChange: (e) => {
-						V.value = e.target.value;
+						H.value = e.target.value;
 					},
 					onFocus: (e) => {
-						V.value = H == null ? "" : String(H), R("FOCUS"), j?.(e);
+						H.value = U == null ? "" : String(U), z("FOCUS"), M?.(e);
 					},
 					onBlur: (e) => {
-						G(), R("BLUR"), M?.(e);
+						K(), z("BLUR"), N?.(e);
 					},
 					onKeyDown: (e) => {
-						e.key === "ArrowUp" ? (e.preventDefault(), K(1)) : e.key === "ArrowDown" ? (e.preventDefault(), K(-1)) : e.key === "Enter" && G(), N?.(e);
+						e.key === "ArrowUp" ? (e.preventDefault(), q(1)) : e.key === "ArrowDown" ? (e.preventDefault(), q(-1)) : e.key === "Enter" && K(), P?.(e);
 					},
-					...P
+					...F
 				}), /* @__PURE__ */ l("div", {
 					className: e.steppers,
 					children: [/* @__PURE__ */ c("button", {
 						type: "button",
 						className: e.stepper,
-						"aria-label": F,
+						"aria-label": I,
 						tabIndex: -1,
-						disabled: E || J,
+						disabled: D || Y,
 						onMouseDown: (e) => e.preventDefault(),
-						onClick: () => K(1),
+						onClick: () => q(1),
 						children: /* @__PURE__ */ c("svg", {
 							viewBox: "0 0 10 10",
 							"aria-hidden": "true",
@@ -106,11 +106,11 @@ function h({ value: n, defaultValue: h, onChange: g, min: _, max: v, step: y = 1
 					}), /* @__PURE__ */ c("button", {
 						type: "button",
 						className: e.stepper,
-						"aria-label": I,
+						"aria-label": L,
 						tabIndex: -1,
-						disabled: E || Y,
+						disabled: D || X,
 						onMouseDown: (e) => e.preventDefault(),
-						onClick: () => K(-1),
+						onClick: () => q(-1),
 						children: /* @__PURE__ */ c("svg", {
 							viewBox: "0 0 10 10",
 							"aria-hidden": "true",
@@ -127,16 +127,16 @@ function h({ value: n, defaultValue: h, onChange: g, min: _, max: v, step: y = 1
 					})]
 				})]
 			}),
-			w && /* @__PURE__ */ c("span", {
-				id: `${U}-error`,
+			T && /* @__PURE__ */ c("span", {
+				id: `${W}-error`,
 				className: e.error,
 				role: "alert",
-				children: w
+				children: T
 			}),
-			!w && C && /* @__PURE__ */ c("span", {
-				id: `${U}-hint`,
+			!T && w && /* @__PURE__ */ c("span", {
+				id: `${W}-hint`,
 				className: e.hint,
-				children: C
+				children: w
 			})
 		]
 	});

package/dist/react/src/index.js

@@ -134,5 +134,5 @@ import { Center as on } from "../../layouts/src/center/center.js";
 import { Spacer as sn } from "../../layouts/src/spacer/spacer.js";
 import { AutoGrid as cn } from "../../layouts/src/auto-grid/auto-grid.js";
 import { ThemeProvider as ln, setTheme as un, themePreloadScript as dn, useTheme as fn } from "./theme.js";
-import { ErrorBoundary as pn, FocusScope as mn, Portal as hn, SuspenseBoundary as gn } 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, Xt as AppShell, vt as AspectRatio, cn as AutoGrid, f as Avatar, p as AvatarGroup, c as Badge, et as Blockquote, xe as BottomSheet, z as Breadcrumb, t as Button, ft as ButtonGroup, It as Calendar, r as Card, i as CardContent, a as CardFooter, o as CardHeader, s as CardTitle, zt as Carousel, on as Center, Zt as ChatBubble, v as Checkbox, He as CheckboxCard, $e as Code, Wt as CodeSnippet, _t as Collapsible, Rt as ColorPicker, an as Columns, ce as Combobox, ne as CommandMenu, we as Comparison, Et as ContainedList, Dt as ContainedListItem, Se as ContextMenu, Ce as ContextMenuItem, Ue as CopyButton, Ot as DataList, te as DataTable, le as DatePicker, Lt as DateRangePicker, Vt as Dock, Ht as Drawer, w as Dropdown, Ie as Editable, X as EmptyState, pn as ErrorBoundary, Z as Fab, lt as Field, ue as FileUploader, ut as Filter, rn as Flex, mn as FocusScope, ae as Form, tn as Grid, nn as GridItem, H as Header, Be as HeaderPanel, Ze as Heading, Te as HoverCard, Ee as HoverCardContent, De as HoverCardTrigger, dt as IconButton, h as Image, qt as Indicator, mt as InlineLoading, n as Input, Ne as InputGroup, Pe as InputGroupAddon, At as Item, jt as ItemActions, Mt as ItemContent, Nt as ItemDescription, Pt as ItemMedia, Ft as ItemTitle, Jt as Join, L as Kbd, ct as Label, R as Link, tt as List, nt as ListItem, rt as LogViewer, he as Menu, yt as MenuButton, ge as MenuItem, _e as MenuSeparator, ve as MenuTrigger, xt as Menubar, l as Modal, ke as MultiSelect, Ut as NativeSelect, St as NavigationMenu, ht as Notification, ee as NumberInput, je as OtpInput, Q as OverflowMenu, G as Pagination, Oe as PasswordInput, fe as Popover, pe as PopoverContent, me as PopoverTrigger, hn as Portal, Ye as Progress, Y as ProgressBar, Xe as ProgressCircle, K as ProgressIndicator, it as Prose, at as PullToRefresh, ot as QrCode, Qt as RadialProgress, y as Radio, Le as RadioCard, Re as RadioCardGroup, b as RadioGroup, Fe as RatingGroup, st as RelativeTime, Bt as Resizable, gt as ScrollArea, $ as Search, Me as SegmentedControl, _ as Select, u as Separator, be as Sheet, ze as ShellHeader, W as SideNav, J as Skeleton, qe as SkipNavLink, Je as SkipNavTarget, S as Slider, sn as Spacer, e as Spinner, Yt as Stack, We as Stat, Ge as Status, Gt as Steps, Tt as StructuredList, gn as SuspenseBoundary, $t as Swap, en as SwipeItem, Ve as Switcher, O as Tabs, k as TabsContent, A as TabsList, j as TabsTrigger, q as Tag, Ae as TagsInput, Qe as Text, g as Textarea, ln as ThemeProvider, Kt as Tile, de as TimePicker, kt as Timeline, T as ToastProvider, B as Toc, x as Toggle, pt as ToggleGroup, bt as Toggletip, C as Tooltip, Ct as TreeView, m as User, Ke as VisuallyHidden, oe as createForm, E as dismissAllToasts, re as fuzzyMatch, ie as fuzzyScore, un as setTheme, dn as themePreloadScript, wt as treeViewMessages, se as useForm, U as usePopover, fn as useTheme, D as useToast, V as useTocFromRegion };
+import { ErrorBoundary as pn, FocusScope as mn, Portal as hn, SuspenseBoundary as gn, getLinkComponent as _n, setLinkComponent as vn } 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, Xt as AppShell, vt as AspectRatio, cn as AutoGrid, f as Avatar, p as AvatarGroup, c as Badge, et as Blockquote, xe as BottomSheet, z as Breadcrumb, t as Button, ft as ButtonGroup, It as Calendar, r as Card, i as CardContent, a as CardFooter, o as CardHeader, s as CardTitle, zt as Carousel, on as Center, Zt as ChatBubble, v as Checkbox, He as CheckboxCard, $e as Code, Wt as CodeSnippet, _t as Collapsible, Rt as ColorPicker, an as Columns, ce as Combobox, ne as CommandMenu, we as Comparison, Et as ContainedList, Dt as ContainedListItem, Se as ContextMenu, Ce as ContextMenuItem, Ue as CopyButton, Ot as DataList, te as DataTable, le as DatePicker, Lt as DateRangePicker, Vt as Dock, Ht as Drawer, w as Dropdown, Ie as Editable, X as EmptyState, pn as ErrorBoundary, Z as Fab, lt as Field, ue as FileUploader, ut as Filter, rn as Flex, mn as FocusScope, ae as Form, tn as Grid, nn as GridItem, H as Header, Be as HeaderPanel, Ze as Heading, Te as HoverCard, Ee as HoverCardContent, De as HoverCardTrigger, dt as IconButton, h as Image, qt as Indicator, mt as InlineLoading, n as Input, Ne as InputGroup, Pe as InputGroupAddon, At as Item, jt as ItemActions, Mt as ItemContent, Nt as ItemDescription, Pt as ItemMedia, Ft as ItemTitle, Jt as Join, L as Kbd, ct as Label, R as Link, tt as List, nt as ListItem, rt as LogViewer, he as Menu, yt as MenuButton, ge as MenuItem, _e as MenuSeparator, ve as MenuTrigger, xt as Menubar, l as Modal, ke as MultiSelect, Ut as NativeSelect, St as NavigationMenu, ht as Notification, ee as NumberInput, je as OtpInput, Q as OverflowMenu, G as Pagination, Oe as PasswordInput, fe as Popover, pe as PopoverContent, me as PopoverTrigger, hn as Portal, Ye as Progress, Y as ProgressBar, Xe as ProgressCircle, K as ProgressIndicator, it as Prose, at as PullToRefresh, ot as QrCode, Qt as RadialProgress, y as Radio, Le as RadioCard, Re as RadioCardGroup, b as RadioGroup, Fe as RatingGroup, st as RelativeTime, Bt as Resizable, gt as ScrollArea, $ as Search, Me as SegmentedControl, _ as Select, u as Separator, be as Sheet, ze as ShellHeader, W as SideNav, J as Skeleton, qe as SkipNavLink, Je as SkipNavTarget, S as Slider, sn as Spacer, e as Spinner, Yt as Stack, We as Stat, Ge as Status, Gt as Steps, Tt as StructuredList, gn as SuspenseBoundary, $t as Swap, en as SwipeItem, Ve as Switcher, O as Tabs, k as TabsContent, A as TabsList, j as TabsTrigger, q as Tag, Ae as TagsInput, Qe as Text, g as Textarea, ln as ThemeProvider, Kt as Tile, de as TimePicker, kt as Timeline, T as ToastProvider, B as Toc, x as Toggle, pt as ToggleGroup, bt as Toggletip, C as Tooltip, Ct as TreeView, m as User, Ke as VisuallyHidden, oe as createForm, E as dismissAllToasts, re as fuzzyMatch, ie as fuzzyScore, _n as getLinkComponent, vn as setLinkComponent, un as setTheme, dn as themePreloadScript, wt as treeViewMessages, se as useForm, U as usePopover, fn as useTheme, D as useToast, V as useTocFromRegion };

package/dist/react/src/theme.js

@@ -7,37 +7,42 @@ import { useRef as a } from "react";
 //#region src/theme.tsx
 var o = "cascivo-theme", s = "data-theme", c = null, l = {
 	storageKey: o,
-	defaultTheme: "light"
+	defaultTheme: "light",
+	explicit: !1
 };
 function u(e) {
 	return typeof window > "u" || typeof window.matchMedia != "function" ? e : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : window.matchMedia("(prefers-color-scheme: light)").matches ? "light" : e;
 }
 function d() {
-	return c ??= e(l.storageKey, u(l.defaultTheme)), c;
+	return l.explicit ? l.defaultTheme : u(l.defaultTheme);
 }
-function f(e) {
-	d().value = e;
+function f() {
+	return c ??= e(l.storageKey, d()), c;
 }
-function p() {
-	return n(), [d(), f];
+function p(e) {
+	f().value = e;
 }
-function m({ defaultTheme: e, value: n, storageKey: u = o, attribute: f = s, target: p, onChange: m, children: h }) {
+function m() {
+	return n(), [f(), p];
+}
+function h({ defaultTheme: e, value: n, storageKey: u = o, attribute: d = s, target: p, onChange: m, children: h }) {
 	let g = a(!1);
 	g.current || (g.current = !0, (c === null || l.storageKey !== u) && (l = {
 		storageKey: u,
-		defaultTheme: e ?? "light"
+		defaultTheme: e ?? "light",
+		explicit: e !== void 0
 	}, c = null));
-	let _ = d();
+	let _ = f();
 	n !== void 0 && (_.value = n);
 	let v = a(m);
 	return v.current = m, t(() => {
 		let e = _.value;
-		(p ? p.current : typeof document < "u" ? document.documentElement : null)?.setAttribute(f, e), v.current?.(e);
+		(p ? p.current : typeof document < "u" ? document.documentElement : null)?.setAttribute(d, e), v.current?.(e);
 	}), /* @__PURE__ */ i(r, { children: h });
 }
-function h(e = {}) {
-	let t = JSON.stringify(e.storageKey ?? o), n = JSON.stringify(e.attribute ?? s);
-	return `(function(){try{var v=${JSON.stringify(e.defaultTheme ?? "light")};if(typeof matchMedia==='function'){if(matchMedia('(prefers-color-scheme: dark)').matches)v='dark';else if(matchMedia('(prefers-color-scheme: light)').matches)v='light';}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(_){}})();`;
+function g(e = {}) {
+	let t = JSON.stringify(e.storageKey ?? o), n = JSON.stringify(e.attribute ?? s), 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 { m as ThemeProvider, f as setTheme, h as themePreloadScript, p as useTheme };
+export { h as ThemeProvider, p as setTheme, g as themePreloadScript, m as useTheme };

package/dist/search/search.js

@@ -29,59 +29,59 @@ function d() {
 		})]
 	});
 }
-function f({ value: f, defaultValue: p = "", onChange: m, onSearch: h, debounceMs: g = 300, placeholder: _, size: v = "md", label: y, disabled: b = !1, clearLabel: x, id: S, className: C }) {
+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 }) {
 	i();
-	let w = _ ?? o(a.search.placeholder), T = y ?? o(a.search.label), E = x ?? o(a.search.clear), D = l(null), O = l("");
-	O.current === "" && (u += 1, O.current = `cascade-search-${u}`);
-	let k = S ?? O.current, A = f !== void 0, j = n(A ? f : p);
-	A && (j.value = f);
-	let M = l(h);
-	M.current = h;
-	let N = l(null), P = () => {
-		N.current !== null && (clearTimeout(N.current), N.current = null);
+	let T = v ?? o(a.search.placeholder), E = b ?? o(a.search.label), D = S ?? o(a.search.clear), O = l(null), k = l("");
+	k.current === "" && (u += 1, k.current = `cascade-search-${u}`);
+	let A = C ?? k.current, j = f !== void 0, M = n(j ? f : p);
+	j && (M.value = f);
+	let N = l(g);
+	N.current = g;
+	let P = l(null), F = () => {
+		P.current !== null && (clearTimeout(P.current), P.current = null);
 	};
-	r(() => P);
-	let F = (e) => {
+	r(() => F);
+	let I = (e) => {
 		let t = e.target.value;
-		A || (j.value = t), m?.(t), P(), N.current = setTimeout(() => {
-			N.current = null, M.current?.(t);
-		}, g);
-	}, I = (e) => {
-		e.key === "Enter" && (P(), h?.(j.value));
-	}, L = () => {
-		P(), A || (j.value = ""), m?.(""), h?.(""), D.current?.focus();
-	}, R = j.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__ */ c("div", {
-		className: t(e.root, C),
-		"data-size": v,
-		"data-state": R ? "filled" : "empty",
+		className: t(e.root, w),
+		"data-size": y,
+		"data-state": z ? "filled" : "empty",
 		children: [
 			/* @__PURE__ */ s("label", {
 				className: e.label,
-				htmlFor: k,
-				children: T
+				htmlFor: A,
+				children: E
 			}),
 			/* @__PURE__ */ s("span", {
 				className: e.icon,
 				children: /* @__PURE__ */ s(d, {})
 			}),
 			/* @__PURE__ */ s("input", {
-				ref: D,
-				id: k,
+				ref: O,
+				id: A,
 				type: "search",
 				className: e.input,
-				value: j.value,
-				placeholder: w,
-				disabled: b,
-				onChange: F,
-				onKeyDown: I
+				value: M.value,
+				placeholder: T,
+				disabled: x,
+				onChange: I,
+				onKeyDown: L
 			}),
-			R && /* @__PURE__ */ s("button", {
+			z && /* @__PURE__ */ s("button", {
 				type: "button",
 				className: e.clear,
-				"aria-label": E,
-				disabled: b,
-				onClick: L,
+				"aria-label": D,
+				disabled: x,
+				onClick: R,
 				children: /* @__PURE__ */ s("span", {
 					"aria-hidden": "true",
 					children: "✕"

package/dist/swap/swap.js

@@ -4,23 +4,23 @@ import e from "./swap.module.js";
 import { useSignal as t, useSignals as n } from "@cascivo/core";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region ../components/src/swap/swap.tsx
-function a({ on: a, off: o, checked: s = !1, onChange: c, mode: l = "rotate", className: u, ...d }) {
+function a({ on: a, off: o, checked: s = !1, onValueChange: c, onChange: l, mode: u = "rotate", className: d, ...f }) {
 	n();
-	let f = t(s);
-	f.value = s;
-	function p() {
-		let e = !f.value;
-		c?.(e);
+	let p = t(s);
+	p.value = s;
+	function m() {
+		let e = !p.value;
+		(c ?? l)?.(e);
 	}
 	return /* @__PURE__ */ i("button", {
 		type: "button",
 		role: "switch",
-		"aria-checked": f.value,
-		className: [e.swap, u].filter(Boolean).join(" "),
-		"data-checked": f.value || void 0,
-		"data-mode": l,
-		onClick: p,
-		...d,
+		"aria-checked": p.value,
+		className: [e.swap, d].filter(Boolean).join(" "),
+		"data-checked": p.value || void 0,
+		"data-mode": u,
+		onClick: m,
+		...f,
 		children: [/* @__PURE__ */ r("span", {
 			className: e.on,
 			"aria-hidden": "true",

package/dist/time-picker/time-picker.js

@@ -11,49 +11,49 @@ var s = n({
 		focused: { on: { BLUR: "idle" } }
 	}
 });
-function c({ value: n, defaultValue: c, onChange: l, min: u, max: d, step: f, label: p, hint: m, error: h, size: g = "md", className: _, id: v, onFocus: y, onBlur: b, ...x }) {
+function c({ value: n, defaultValue: c, onValueChange: l, onChange: u, min: d, max: f, step: p, label: m, hint: h, error: g, size: _ = "md", className: v, id: y, onFocus: b, onBlur: x, ...S }) {
 	i();
-	let [S, C] = r(s), w = v ?? (p ? `cascade-time-picker-${p.toLowerCase().replace(/\s+/g, "-")}` : void 0);
+	let [C, w] = r(s), T = y ?? (m ? `cascade-time-picker-${m.toLowerCase().replace(/\s+/g, "-")}` : void 0);
 	return /* @__PURE__ */ o("div", {
-		className: t(e.wrapper, _),
-		"data-state": h ? "error" : S.value,
-		"data-size": g,
+		className: t(e.wrapper, v),
+		"data-state": g ? "error" : C.value,
+		"data-size": _,
 		children: [
-			p && /* @__PURE__ */ a("label", {
+			m && /* @__PURE__ */ a("label", {
 				className: e.label,
-				htmlFor: w,
-				children: p
+				htmlFor: T,
+				children: m
 			}),
 			/* @__PURE__ */ a("input", {
-				id: w,
+				id: T,
 				type: "time",
 				className: e.input,
 				value: n,
 				defaultValue: c,
-				min: u,
-				max: d,
-				step: f,
-				"aria-invalid": h ? !0 : void 0,
-				"aria-describedby": h ? `${w}-error` : m ? `${w}-hint` : void 0,
-				onChange: (e) => l?.(e.target.value),
+				min: d,
+				max: f,
+				step: p,
+				"aria-invalid": g ? !0 : void 0,
+				"aria-describedby": g ? `${T}-error` : h ? `${T}-hint` : void 0,
+				onChange: (e) => (l ?? u)?.(e.target.value),
 				onFocus: (e) => {
-					C("FOCUS"), y?.(e);
+					w("FOCUS"), b?.(e);
 				},
 				onBlur: (e) => {
-					C("BLUR"), b?.(e);
+					w("BLUR"), x?.(e);
 				},
-				...x
+				...S
 			}),
-			h && /* @__PURE__ */ a("span", {
-				id: `${w}-error`,
+			g && /* @__PURE__ */ a("span", {
+				id: `${T}-error`,
 				className: e.error,
 				role: "alert",
-				children: h
+				children: g
 			}),
-			!h && m && /* @__PURE__ */ a("span", {
-				id: `${w}-hint`,
+			!g && h && /* @__PURE__ */ a("span", {
+				id: `${T}-hint`,
 				className: e.hint,
-				children: m
+				children: h
 			})
 		]
 	});

package/dist/toggle/toggle.js

@@ -4,34 +4,34 @@ import e from "./toggle.module.js";
 import { cn as t, createMachine as n, useMachine as r, useSignals as i } from "@cascivo/core";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region ../components/src/toggle/toggle.tsx
-function s({ checked: s, defaultChecked: c = !1, onChange: l, label: u, size: d = "md", className: f, disabled: p, ...m }) {
+function s({ checked: s, defaultChecked: c = !1, onValueChange: l, onChange: u, label: d, size: f = "md", className: p, disabled: m, ...h }) {
 	i();
-	let [h, g] = r(n({
+	let [g, _] = r(n({
 		initial: c ? "on" : "off",
 		states: {
 			off: { on: { TOGGLE: "on" } },
 			on: { on: { TOGGLE: "off" } }
 		}
-	})), _ = s !== void 0, v = _ ? s : h.value === "on";
+	})), v = s !== void 0, y = v ? s : g.value === "on";
 	return /* @__PURE__ */ o("button", {
 		type: "button",
 		role: "switch",
-		"aria-checked": v,
-		"data-state": v ? "on" : "off",
-		"data-size": d,
-		disabled: p,
-		className: t(e.toggle, f),
+		"aria-checked": y,
+		"data-state": y ? "on" : "off",
+		"data-size": f,
+		disabled: m,
+		className: t(e.toggle, p),
 		onClick: () => {
-			_ || g("TOGGLE"), l?.(!v);
+			v || _("TOGGLE"), (l ?? u)?.(!y);
 		},
-		...m,
+		...h,
 		children: [/* @__PURE__ */ a("span", {
 			className: e.track,
 			"aria-hidden": "true",
 			children: /* @__PURE__ */ a("span", { className: e.thumb })
-		}), u && /* @__PURE__ */ a("span", {
+		}), d && /* @__PURE__ */ a("span", {
 			className: e.label,
-			children: u
+			children: d
 		})]
 	});
 }

package/dist/user/user.js

@@ -6,12 +6,16 @@ import { cn as n } from "@cascivo/core";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region ../components/src/user/user.tsx
 function a({ name: a, description: o, avatarProps: s, className: c, children: l, ...u }) {
+	let d = typeof a == "string" && s?.name === void 0 && s?.fallback === void 0 ? { name: a } : {};
 	return /* @__PURE__ */ i("div", {
 		role: "group",
 		className: n(t.user, c),
 		...u,
 		children: [
-			/* @__PURE__ */ r(e, { ...s }),
+			/* @__PURE__ */ r(e, {
+				...d,
+				...s
+			}),
 			/* @__PURE__ */ i("span", {
 				className: t.text,
 				children: [/* @__PURE__ */ r("span", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cascivo/react",
-  "version": "0.7.1",
+  "version": "0.9.0",
   "private": false,
   "description": "Prebuilt cascivo design system components — use without copying source",
   "keywords": [
@@ -33,8 +33,8 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/react/src/index.js",
-      "default": "./dist/react/src/index.js"
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
     },
     "./styles.css": "./dist/styles.css",
     "./package.json": "./package.json"
@@ -44,8 +44,8 @@
     "provenance": true
   },
   "dependencies": {
-    "@cascivo/core": "^0.4.0",
-    "@cascivo/i18n": "^0.2.7"
+    "@cascivo/core": "^0.5.0",
+    "@cascivo/i18n": "^0.2.9"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",
@@ -61,7 +61,7 @@
     "@cascivo/components": "0.0.0"
   },
   "peerDependencies": {
-    "@preact/signals-react": ">=2.0.0",
+    "@preact/signals-react": ">=3.0.0",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },

package/readme.body.md

@@ -18,6 +18,11 @@ supplies the tokens and themes the components read.
 Charts live in a separate package — add [`@cascivo/charts`](https://github.com/cascivo/cascivo/tree/main/packages/charts)
 for `LineChart`, `AreaChart`, `BarChart`, `Sparkline`, and more.
 
+> **Types are the reference.** The shipped `dist/index.d.ts` is a self-contained, flat
+> rollup — every component's `…Props` interface is real, documentation-grade API. Reading
+> it (or the per-component [`/llms/<name>.md`](https://cascivo.com/llms.txt)) is the fastest
+> way to learn a component's props with no web access.
+
 ### Framework setup (Next.js App Router)
 
 In a Server Component file (e.g. `app/layout.tsx`), import the themes once:
@@ -40,12 +45,20 @@ RSC without any extra wrapper.
 > only if you prefer one explicit stylesheet over per-component tree-shaking, or
 > for Vite SSR (below), where it is required.
 
-> **Vite SSR / TanStack Start / Remix / workerd?** Those per-component `.css`
-> imports need a bundler to resolve them; a bare server-side ESM loader throws
-> `Unknown file extension ".css"`. Add `ssr: { noExternal: [/^@cascivo\//] }` (or
-> the `cascivoSsr()` plugin from `@cascivo/vite-plugin`) and import
-> `@cascivo/react/styles.css` once in your root entry. Full recipe:
-> [USING-WITH-VITE-SSR.md](https://github.com/cascivo/cascivo/blob/main/docs/USING-WITH-VITE-SSR.md).
+> **Vite SSR / TanStack Start / Remix / workerd?** The 4-line SSR checklist (full
+> recipe: [USING-WITH-VITE-SSR.md](https://github.com/cascivo/cascivo/blob/main/docs/USING-WITH-VITE-SSR.md)):
+>
+> 1. **`ssr: { noExternal: [/^@cascivo\//] }`** in `vite.config` (or the
+>    `cascivoSsr()` plugin from `@cascivo/vite-plugin`). Without it a bare
+>    server-side ESM loader can't resolve the per-component `.css` side-effect
+>    imports and throws `Unknown file extension ".css"`.
+> 2. **`@preact/signals-react` 3.x** — on React 19 the 2.x line fails to load. The
+>    peer range enforces `>=3`.
+> 3. **Import the CSS once** in your root entry: `@cascivo/react/styles.css` +
+>    `@cascivo/themes/all` (+ `@cascivo/charts/styles.css` if you use charts).
+> 4. **Theme without a mismatch:** inline `themePreloadScript()` in `<head>` and add
+>    `suppressHydrationWarning` to `<html>`, or hard-code `data-theme` for a fixed theme.
+>
 > Next.js App Router needs none of this.
 
 ## Use
@@ -185,7 +198,7 @@ routing break after adding one of these, check that the import resolves to
 
 ## Component index
 
-192 components, exported from `@cascivo/react`. Full props, examples, and live demos at [docs.cascivo.com](https://docs.cascivo.com).
+192 components, exported from `@cascivo/react`. Full props, examples, and live demos at [cascivo.com/docs](https://cascivo.com/docs).
 
 ### Inputs