@cascivo/react 0.13.0 → 0.13.1

package/dist/node/toggletip/toggletip.js

@@ -2,9 +2,9 @@
 
 import e from "./toggletip.module.js";
 import { DismissableLayer as t, cn as n, useAnchorPosition as r, useControllableSignal 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 { useId as u, useRef as d } from "react";
+import { useId 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/toggletip/toggletip.tsx
 function f({ trigger: f, children: p, placement: m = "top", defaultOpen: h = !1, open: g, onOpenChange: _, labels: v, className: y }) {
 	a();
@@ -12,27 +12,27 @@ function f({ trigger: f, children: p, placement: m = "top", defaultOpen: h = !1,
 		...g !== void 0 && { value: g },
 		defaultValue: h,
 		..._ && { onChange: _ }
-	}), S = d(null), C = d(null), w = u(), { anchorStyle: T, floatingStyle: E } = r({
+	}), S = s(null), C = s(null), w = o(), { anchorStyle: T, floatingStyle: E } = r({
 		anchorRef: S,
 		floatingRef: C,
 		placement: m,
 		enabled: b
 	});
-	return /* @__PURE__ */ l("span", {
+	return /* @__PURE__ */ d("span", {
 		className: n(e.root, y),
-		children: [/* @__PURE__ */ c("button", {
+		children: [/* @__PURE__ */ u("button", {
 			ref: S,
 			type: "button",
 			className: e.trigger,
 			"aria-expanded": b.value,
 			"aria-controls": w,
-			"aria-label": v?.label ?? s(o.toggletip.label),
+			"aria-label": v?.label ?? l(c.toggletip.label),
 			style: T,
 			onClick: () => x(!b.value),
 			children: f
-		}), b.value ? /* @__PURE__ */ c(t, {
+		}), b.value ? /* @__PURE__ */ u(t, {
 			onDismiss: () => x(!1),
-			children: /* @__PURE__ */ c("div", {
+			children: /* @__PURE__ */ u("div", {
 				ref: C,
 				id: w,
 				role: "status",

package/dist/node/tooltip/tooltip.js

@@ -2,8 +2,8 @@
 
 import e from "./tooltip.module.js";
 import { createMachine as t, useId as n, useMachine as r, useSignalEffect as i, useSignals as a } from "@cascivo/core";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { cloneElement as c, useRef as l } from "react";
+import { cloneElement as o, useRef as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region ../components/src/tooltip/tooltip.tsx
 var u = t({
 	initial: "hidden",
@@ -14,7 +14,7 @@ var u = t({
 });
 function d({ content: t, placement: d = "top", children: f, delay: p = 200 }) {
 	a();
-	let [m, h] = r(u), g = n("cascivo-tooltip"), _ = n("cascivo-anchor"), v = l(void 0), y = l(null), b = m.value === "visible", x = () => {
+	let [m, h] = r(u), g = n("cascivo-tooltip"), _ = n("cascivo-anchor"), v = s(void 0), y = s(null), b = m.value === "visible", x = () => {
 		clearTimeout(v.current), v.current = setTimeout(() => h("SHOW"), p);
 	}, S = () => {
 		clearTimeout(v.current), h("HIDE");
@@ -39,9 +39,9 @@ function d({ content: t, placement: d = "top", children: f, delay: p = 200 }) {
 		},
 		"aria-describedby": b ? g : w["aria-describedby"]
 	};
-	return /* @__PURE__ */ s("span", {
+	return /* @__PURE__ */ l("span", {
 		className: e.root,
-		children: [c(C, T), /* @__PURE__ */ o("span", {
+		children: [o(C, T), /* @__PURE__ */ c("span", {
 			ref: y,
 			popover: "manual",
 			role: "tooltip",

package/dist/node/tree-view/tree-view.js

@@ -2,9 +2,9 @@
 
 import e from "./tree-view.module.js";
 import { cn as t, useControllableSignal as n, useSignal as r, useSignals as i } from "@cascivo/core";
-import { builtin as a, t as o } from "@cascivo/i18n";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { useRef as l } from "react";
+import { useRef as a } from "react";
+import { builtin as o, t as s } from "@cascivo/i18n";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region ../components/src/tree-view/tree-view.tsx
 function u(e, t) {
 	let n = [], r = (e, i, a) => {
@@ -24,17 +24,17 @@ function u(e, t) {
 function d(e) {
 	return e === void 0 ? [] : Array.isArray(e) ? e : e === "" ? [] : [e];
 }
-function f({ items: a, selectionMode: o = "single", selected: c, defaultSelected: f, onSelectChange: h, expanded: g, defaultExpanded: _, onExpandedChange: v, className: y, "aria-label": b }) {
+function f({ items: o, selectionMode: s = "single", selected: l, defaultSelected: f, onSelectChange: h, expanded: g, defaultExpanded: _, onExpandedChange: v, className: y, "aria-label": b }) {
 	i();
 	let [x, S] = n({
 		value: g,
 		defaultValue: _ ?? [],
 		onChange: v
 	}), [C, w] = n({
-		value: c,
-		defaultValue: f ?? (o === "multi" ? [] : ""),
+		value: l,
+		defaultValue: f ?? (s === "multi" ? [] : ""),
 		onChange: h
-	}), T = r(null), E = l(/* @__PURE__ */ new Map()), D = new Set(x.value), O = u(a, D), k = new Map(O.map((e, t) => [e.id, t])), A = d(C.value), j = new Set(A), M = T.value ?? A[0] ?? O[0]?.id ?? null, N = (e) => S([...e]), P = (e) => {
+	}), T = r(null), E = a(/* @__PURE__ */ new Map()), D = new Set(x.value), O = u(o, D), k = new Map(O.map((e, t) => [e.id, t])), A = d(C.value), j = new Set(A), M = T.value ?? A[0] ?? O[0]?.id ?? null, N = (e) => S([...e]), P = (e) => {
 		if (D.has(e)) return;
 		let t = new Set(D);
 		t.add(e), N(t);
@@ -45,17 +45,17 @@ function f({ items: a, selectionMode: o = "single", selected: c, defaultSelected
 	}, I = (e) => {
 		T.value = e, E.current.get(e)?.focus();
 	}, L = (e) => {
-		if (o === "multi") {
+		if (s === "multi") {
 			let t = new Set(j);
 			t.has(e) ? t.delete(e) : t.add(e), w([...t]);
 		} else w(e);
-	}, R = l({
+	}, R = a({
 		buffer: "",
 		at: 0
 	}), z = (e, t) => {
 		let n = k.get(t.id);
 		if (n === void 0) return;
-		let { hasChildren: r, level: i, parentId: o, expanded: s } = O[n];
+		let { hasChildren: r, level: i, parentId: a, expanded: s } = O[n];
 		switch (e.key) {
 			case "ArrowDown": {
 				e.preventDefault();
@@ -77,7 +77,7 @@ function f({ items: a, selectionMode: o = "single", selected: c, defaultSelected
 				}
 				break;
 			case "ArrowLeft":
-				e.preventDefault(), r && s ? F(t.id) : o && I(o);
+				e.preventDefault(), r && s ? F(t.id) : a && I(a);
 				break;
 			case "Home":
 				e.preventDefault(), O[0] && I(O[0].id);
@@ -96,17 +96,17 @@ function f({ items: a, selectionMode: o = "single", selected: c, defaultSelected
 				if (e.key.length === 1 && !e.metaKey && !e.ctrlKey && !e.altKey) {
 					let t = R.current, r = Date.now();
 					t.buffer = r - t.at > 500 ? e.key : t.buffer + e.key, t.at = r;
-					let i = t.buffer.toLowerCase(), o = (e) => typeof e.label == "string" && e.label.toLowerCase().startsWith(i), s = p(a, D), c = [...O.slice(n + 1), ...O.slice(0, n + 1)].find((e) => {
+					let i = t.buffer.toLowerCase(), a = (e) => typeof e.label == "string" && e.label.toLowerCase().startsWith(i), s = p(o, D), c = [...O.slice(n + 1), ...O.slice(0, n + 1)].find((e) => {
 						let t = s.get(e.id);
-						return t ? o(t) : !1;
+						return t ? a(t) : !1;
 					});
 					c && I(c.id);
 				}
 				break;
 		}
 	}, B = (e, t, n, r) => {
-		let i = !!e.children && e.children.length > 0, a = D.has(e.id), o = j.has(e.id), c = M === e.id, l = e.children?.length ?? 0;
-		return /* @__PURE__ */ s(m, {
+		let i = !!e.children && e.children.length > 0, a = D.has(e.id), o = j.has(e.id), s = M === e.id, l = e.children?.length ?? 0;
+		return /* @__PURE__ */ c(m, {
 			node: e,
 			level: t,
 			posInSet: n,
@@ -114,7 +114,7 @@ function f({ items: a, selectionMode: o = "single", selected: c, defaultSelected
 			hasChildren: i,
 			isExpanded: a,
 			isSelected: o,
-			isTabbable: c,
+			isTabbable: s,
 			itemRefs: E,
 			onFocusNode: () => T.value = e.id,
 			onKeyDown: (t) => z(t, e),
@@ -124,11 +124,11 @@ function f({ items: a, selectionMode: o = "single", selected: c, defaultSelected
 			children: i && e.children.map((e, n) => B(e, t + 1, n + 1, l))
 		}, e.id);
 	};
-	return /* @__PURE__ */ s("ul", {
+	return /* @__PURE__ */ c("ul", {
 		role: "tree",
 		"aria-label": b,
 		className: t(e.tree, y),
-		children: a.map((e, t) => B(e, 1, t + 1, a.length))
+		children: o.map((e, t) => B(e, 1, t + 1, o.length))
 	});
 }
 function p(e, t) {
@@ -137,16 +137,16 @@ function p(e, t) {
 	};
 	return r(e), n;
 }
-function m({ node: t, level: n, posInSet: r, setSize: i, hasChildren: a, isExpanded: o, isSelected: l, isTabbable: u, itemRefs: d, onFocusNode: f, onKeyDown: p, onActivate: m, children: h }) {
-	return /* @__PURE__ */ c("li", {
+function m({ node: t, level: n, posInSet: r, setSize: i, hasChildren: a, isExpanded: o, isSelected: s, isTabbable: u, itemRefs: d, onFocusNode: f, onKeyDown: p, onActivate: m, children: h }) {
+	return /* @__PURE__ */ l("li", {
 		role: "treeitem",
 		"aria-level": n,
 		"aria-posinset": r,
 		"aria-setsize": i,
-		"aria-selected": l,
+		"aria-selected": s,
 		"aria-expanded": a ? o : void 0,
 		tabIndex: u ? 0 : -1,
-		"data-selected": l || void 0,
+		"data-selected": s || void 0,
 		"data-state": a ? o ? "open" : "closed" : void 0,
 		style: { "--cascivo-tree-level": n },
 		className: e.item,
@@ -160,31 +160,31 @@ function m({ node: t, level: n, posInSet: r, setSize: i, hasChildren: a, isExpan
 		onClick: (e) => {
 			e.stopPropagation(), m();
 		},
-		children: [/* @__PURE__ */ c("span", {
+		children: [/* @__PURE__ */ l("span", {
 			className: e.row,
 			children: [
-				a ? /* @__PURE__ */ s("span", {
+				a ? /* @__PURE__ */ c("span", {
 					className: e.twisty,
 					"aria-hidden": "true",
 					"data-state": o ? "open" : "closed"
-				}) : /* @__PURE__ */ s("span", {
+				}) : /* @__PURE__ */ c("span", {
 					className: e.twistySpacer,
 					"aria-hidden": "true"
 				}),
-				t.icon && /* @__PURE__ */ s("span", {
+				t.icon && /* @__PURE__ */ c("span", {
 					className: e.icon,
 					"aria-hidden": "true",
 					children: t.icon
 				}),
-				/* @__PURE__ */ s("span", {
+				/* @__PURE__ */ c("span", {
 					className: e.label,
 					children: t.label
 				})
 			]
-		}), a && /* @__PURE__ */ s("div", {
+		}), a && /* @__PURE__ */ c("div", {
 			className: e.groupWrap,
 			"data-state": o ? "open" : "closed",
-			children: /* @__PURE__ */ s("ul", {
+			children: /* @__PURE__ */ c("ul", {
 				role: "group",
 				className: e.group,
 				children: h
@@ -193,9 +193,9 @@ function m({ node: t, level: n, posInSet: r, setSize: i, hasChildren: a, isExpan
 	});
 }
 var h = {
-	loading: () => o(a.treeView.loading),
-	expand: () => o(a.treeView.expand),
-	collapse: () => o(a.treeView.collapse)
+	loading: () => s(o.treeView.loading),
+	expand: () => s(o.treeView.expand),
+	collapse: () => s(o.treeView.collapse)
 };
 //#endregion
 export { f as TreeView, h as treeViewMessages };

package/dist/notification/notification.js

@@ -2,9 +2,9 @@
 
 import e from "./notification.module.js";
 import { Presence as t, cn as n, normalizeTone as r, useSignal 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 { useRef as o } from "react";
+import { builtin as s, t as c } from "@cascivo/i18n";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region ../components/src/notification/notification.tsx
 var d = {
 	neutral: "neutral",
@@ -14,73 +14,73 @@ var d = {
 	danger: "error"
 }, f = new Set(["warning", "error"]), p = 160;
 function m({ variant: e }) {
-	return e === "success" ? /* @__PURE__ */ l("svg", {
+	return e === "success" ? /* @__PURE__ */ u("svg", {
 		viewBox: "0 0 20 20",
 		width: "20",
 		height: "20",
 		fill: "none",
 		"aria-hidden": "true",
-		children: [/* @__PURE__ */ c("circle", {
+		children: [/* @__PURE__ */ l("circle", {
 			cx: "10",
 			cy: "10",
 			r: "8",
 			stroke: "currentColor",
 			strokeWidth: "1.5"
-		}), /* @__PURE__ */ c("path", {
+		}), /* @__PURE__ */ l("path", {
 			d: "M6.5 10.5l2.5 2.5 4.5-5",
 			stroke: "currentColor",
 			strokeWidth: "1.5",
 			strokeLinecap: "round",
 			strokeLinejoin: "round"
 		})]
-	}) : e === "warning" ? /* @__PURE__ */ l("svg", {
+	}) : e === "warning" ? /* @__PURE__ */ u("svg", {
 		viewBox: "0 0 20 20",
 		width: "20",
 		height: "20",
 		fill: "none",
 		"aria-hidden": "true",
-		children: [/* @__PURE__ */ c("path", {
+		children: [/* @__PURE__ */ l("path", {
 			d: "M10 2.5L18.5 17H1.5L10 2.5z",
 			stroke: "currentColor",
 			strokeWidth: "1.5",
 			strokeLinejoin: "round"
-		}), /* @__PURE__ */ c("path", {
+		}), /* @__PURE__ */ l("path", {
 			d: "M10 8v3.5M10 14h.01",
 			stroke: "currentColor",
 			strokeWidth: "1.5",
 			strokeLinecap: "round"
 		})]
-	}) : e === "error" ? /* @__PURE__ */ l("svg", {
+	}) : e === "error" ? /* @__PURE__ */ u("svg", {
 		viewBox: "0 0 20 20",
 		width: "20",
 		height: "20",
 		fill: "none",
 		"aria-hidden": "true",
-		children: [/* @__PURE__ */ c("circle", {
+		children: [/* @__PURE__ */ l("circle", {
 			cx: "10",
 			cy: "10",
 			r: "8",
 			stroke: "currentColor",
 			strokeWidth: "1.5"
-		}), /* @__PURE__ */ c("path", {
+		}), /* @__PURE__ */ l("path", {
 			d: "M10 6v4.5M10 13.5h.01",
 			stroke: "currentColor",
 			strokeWidth: "1.5",
 			strokeLinecap: "round"
 		})]
-	}) : /* @__PURE__ */ l("svg", {
+	}) : /* @__PURE__ */ u("svg", {
 		viewBox: "0 0 20 20",
 		width: "20",
 		height: "20",
 		fill: "none",
 		"aria-hidden": "true",
-		children: [/* @__PURE__ */ c("circle", {
+		children: [/* @__PURE__ */ l("circle", {
 			cx: "10",
 			cy: "10",
 			r: "8",
 			stroke: "currentColor",
 			strokeWidth: "1.5"
-		}), /* @__PURE__ */ c("path", {
+		}), /* @__PURE__ */ l("path", {
 			d: "M10 9v5M10 6.5h.01",
 			stroke: "currentColor",
 			strokeWidth: "1.5",
@@ -90,45 +90,45 @@ function m({ variant: e }) {
 }
 function h({ title: h, description: g, variant: _ = "info", dismissible: v = !1, onDismiss: y, actions: b, icon: x, labels: S, className: C, ...w }) {
 	a();
-	let T = d[r(_)] ?? _, E = i(!0), D = u(y);
+	let T = d[r(_)] ?? _, E = i(!0), D = o(y);
 	D.current = y;
 	let O = v || y !== void 0, k = () => {
 		E.value = !1, setTimeout(() => D.current?.(), p);
 	};
-	return /* @__PURE__ */ c(t, {
+	return /* @__PURE__ */ l(t, {
 		present: E,
-		children: /* @__PURE__ */ l("div", {
+		children: /* @__PURE__ */ u("div", {
 			role: f.has(T) ? "alert" : "status",
 			"data-variant": T,
 			className: n(e.notification, C),
 			...w,
 			children: [
-				/* @__PURE__ */ c("span", {
+				/* @__PURE__ */ l("span", {
 					className: e.icon,
 					"aria-hidden": "true",
-					children: x ?? /* @__PURE__ */ c(m, { variant: T })
+					children: x ?? /* @__PURE__ */ l(m, { variant: T })
 				}),
-				/* @__PURE__ */ l("div", {
+				/* @__PURE__ */ u("div", {
 					className: e.body,
 					children: [
-						/* @__PURE__ */ c("div", {
+						/* @__PURE__ */ l("div", {
 							className: e.title,
 							children: h
 						}),
-						g && /* @__PURE__ */ c("div", {
+						g && /* @__PURE__ */ l("div", {
 							className: e.description,
 							children: g
 						}),
-						b && /* @__PURE__ */ c("div", {
+						b && /* @__PURE__ */ l("div", {
 							className: e.actions,
 							children: b
 						})
 					]
 				}),
-				O && /* @__PURE__ */ c("button", {
+				O && /* @__PURE__ */ l("button", {
 					type: "button",
 					className: e.dismiss,
-					"aria-label": S?.dismiss ?? s(o.notification.dismiss),
+					"aria-label": S?.dismiss ?? c(s.notification.dismiss),
 					onClick: k,
 					children: "✕"
 				})

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

@@ -2,99 +2,101 @@
 
 import e from "./number-input.module.js";
 import { cn as t, createMachine as n, useMachine as r, useSignal 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 { forwardRef as o } from "react";
+import { builtin as s, t as c } from "@cascivo/i18n";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region ../components/src/number-input/number-input.tsx
-var u = n({
+var d = n({
 	initial: "idle",
 	states: {
 		idle: { on: { FOCUS: "focused" } },
 		focused: { on: { BLUR: "idle" } }
 	}
 });
-function d(e, t, n) {
+function f(e, t, n) {
 	let r = e;
 	return t !== void 0 && (r = Math.max(r, t)), n !== void 0 && (r = Math.min(r, n)), r;
 }
-function f(e) {
+function p(e) {
 	let t = String(e), n = t.indexOf(".");
 	return n === -1 ? 0 : t.length - n - 1;
 }
-function p(e, t) {
+function m(e, t) {
 	let n = 10 ** t;
 	return Math.round(e * n) / n;
 }
-function m(e) {
+function h(e) {
 	let t = e.trim();
 	if (t === "") return null;
 	let n = Number(t);
 	return Number.isFinite(n) ? n : null;
 }
-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 }) {
+var g = o(function({ value: n, defaultValue: o, 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 }, I) {
 	a();
-	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", {
+	let L = O ?? c(s.numberInput.increment), R = k ?? c(s.numberInput.decrement), [z, B] = r(d), V = n !== void 0, H = i(o ?? null), U = i(""), W = V ? n : H.value, G = j ?? (C ? `cascade-number-input-${C.toLowerCase().replace(/\s+/g, "-")}` : void 0), K = (e) => {
+		V || (H.value = e), U.value = e == null ? "" : String(e), e !== W && (g ?? _)?.(e);
+	}, q = () => {
+		let e = h(U.value);
+		e != null && (e = f(e, v, y), x !== void 0 && (e = m(e, x))), K(e);
+	}, J = (e) => {
+		let t = (z.value === "focused" ? h(U.value) : W) ?? 0, n = x ?? Math.max(p(b), p(t));
+		K(f(m(t + e * b, n), v, y));
+	}, Y = z.value === "focused" ? U.value : ((e) => e == null ? "" : S ? new Intl.NumberFormat(void 0, S).format(e) : String(e))(W), X = W != null && y !== void 0 && W >= y, Z = W != null && v !== void 0 && W <= v;
+	return /* @__PURE__ */ u("div", {
 		className: t(e.wrapper, A),
-		"data-state": T ? "error" : R.value,
+		"data-state": T ? "error" : z.value,
 		"data-size": E,
 		children: [
-			C && /* @__PURE__ */ c("label", {
+			C && /* @__PURE__ */ l("label", {
 				className: e.label,
-				htmlFor: W,
+				htmlFor: G,
 				children: C
 			}),
-			/* @__PURE__ */ l("div", {
+			/* @__PURE__ */ u("div", {
 				className: e.field,
-				children: [/* @__PURE__ */ c("input", {
-					id: W,
+				children: [/* @__PURE__ */ l("input", {
+					id: G,
 					type: "text",
 					inputMode: "decimal",
 					autoComplete: "off",
 					role: "spinbutton",
 					className: e.input,
-					value: J,
+					value: Y,
 					disabled: D,
-					"aria-valuenow": U ?? void 0,
+					"aria-valuenow": W ?? void 0,
 					"aria-valuemin": v,
 					"aria-valuemax": y,
 					"aria-invalid": T ? !0 : void 0,
-					"aria-describedby": T ? `${W}-error` : w ? `${W}-hint` : void 0,
+					"aria-describedby": T ? `${G}-error` : w ? `${G}-hint` : void 0,
 					onChange: (e) => {
-						H.value = e.target.value;
+						U.value = e.target.value;
 					},
 					onFocus: (e) => {
-						H.value = U == null ? "" : String(U), z("FOCUS"), M?.(e);
+						U.value = W == null ? "" : String(W), B("FOCUS"), M?.(e);
 					},
 					onBlur: (e) => {
-						K(), z("BLUR"), N?.(e);
+						q(), B("BLUR"), N?.(e);
 					},
 					onKeyDown: (e) => {
-						e.key === "ArrowUp" ? (e.preventDefault(), q(1)) : e.key === "ArrowDown" ? (e.preventDefault(), q(-1)) : e.key === "Enter" && K(), P?.(e);
+						e.key === "ArrowUp" ? (e.preventDefault(), J(1)) : e.key === "ArrowDown" ? (e.preventDefault(), J(-1)) : e.key === "Enter" && q(), P?.(e);
 					},
+					ref: I,
 					...F
-				}), /* @__PURE__ */ l("div", {
+				}), /* @__PURE__ */ u("div", {
 					className: e.steppers,
-					children: [/* @__PURE__ */ c("button", {
+					children: [/* @__PURE__ */ l("button", {
 						type: "button",
 						className: e.stepper,
-						"aria-label": I,
+						"aria-label": L,
 						tabIndex: -1,
-						disabled: D || Y,
+						disabled: D || X,
 						onMouseDown: (e) => e.preventDefault(),
-						onClick: () => q(1),
-						children: /* @__PURE__ */ c("svg", {
+						onClick: () => J(1),
+						children: /* @__PURE__ */ l("svg", {
 							viewBox: "0 0 10 10",
 							"aria-hidden": "true",
 							focusable: "false",
-							children: /* @__PURE__ */ c("path", {
+							children: /* @__PURE__ */ l("path", {
 								d: "M2 6.5 5 3.5 8 6.5",
 								fill: "none",
 								stroke: "currentColor",
@@ -103,19 +105,19 @@ function h({ value: n, defaultValue: h, onValueChange: g, onChange: _, min: v, m
 								strokeLinejoin: "round"
 							})
 						})
-					}), /* @__PURE__ */ c("button", {
+					}), /* @__PURE__ */ l("button", {
 						type: "button",
 						className: e.stepper,
-						"aria-label": L,
+						"aria-label": R,
 						tabIndex: -1,
-						disabled: D || X,
+						disabled: D || Z,
 						onMouseDown: (e) => e.preventDefault(),
-						onClick: () => q(-1),
-						children: /* @__PURE__ */ c("svg", {
+						onClick: () => J(-1),
+						children: /* @__PURE__ */ l("svg", {
 							viewBox: "0 0 10 10",
 							"aria-hidden": "true",
 							focusable: "false",
-							children: /* @__PURE__ */ c("path", {
+							children: /* @__PURE__ */ l("path", {
 								d: "M2 3.5 5 6.5 8 3.5",
 								fill: "none",
 								stroke: "currentColor",
@@ -127,19 +129,19 @@ function h({ value: n, defaultValue: h, onValueChange: g, onChange: _, min: v, m
 					})]
 				})]
 			}),
-			T && /* @__PURE__ */ c("span", {
-				id: `${W}-error`,
+			T && /* @__PURE__ */ l("span", {
+				id: `${G}-error`,
 				className: e.error,
 				role: "alert",
 				children: T
 			}),
-			!T && w && /* @__PURE__ */ c("span", {
-				id: `${W}-hint`,
+			!T && w && /* @__PURE__ */ l("span", {
+				id: `${G}-hint`,
 				className: e.hint,
 				children: w
 			})
 		]
 	});
-}
+});
 //#endregion
-export { h as NumberInput };
+export { g as NumberInput };

package/dist/otp-input/otp-input.js

@@ -2,13 +2,13 @@
 
 import e from "./otp-input.module.js";
 import { cn as t, useSignal as n, useSignals as r } from "@cascivo/core";
-import { builtin as i, t as a } from "@cascivo/i18n";
-import { jsx as o } from "react/jsx-runtime";
-import { useRef as s } from "react";
+import { useRef as i } from "react";
+import { builtin as a, t as o } from "@cascivo/i18n";
+import { jsx as s } from "react/jsx-runtime";
 //#region ../components/src/otp-input/otp-input.tsx
 function c({ length: c = 6, value: l, onValueChange: u, disabled: d = !1, type: f = "numeric", className: p, ...m }) {
 	r();
-	let h = n(Array.from({ length: c }, (e, t) => l[t] ?? "")), g = s([]), _ = Array.from({ length: c }, (e, t) => l[t] ?? "");
+	let h = n(Array.from({ length: c }, (e, t) => l[t] ?? "")), g = i([]), _ = Array.from({ length: c }, (e, t) => l[t] ?? "");
 	JSON.stringify(h.value) !== JSON.stringify(_) && (h.value = _);
 	function v(e) {
 		u(e.join("")), h.value = e;
@@ -37,13 +37,13 @@ function c({ length: c = 6, value: l, onValueChange: u, disabled: d = !1, type:
 		for (let t = 0; t < n.length; t++) e + t < c && (r[e + t] = n[t] ?? "");
 		v(r), y(Math.min(e + n.length, c - 1));
 	}
-	let C = a(i.otpInput.label);
-	return /* @__PURE__ */ o("div", {
+	let C = o(a.otpInput.label);
+	return /* @__PURE__ */ s("div", {
 		className: t(e.wrapper, p),
 		role: "group",
 		"aria-label": C,
 		...m,
-		children: h.value.map((t, n) => /* @__PURE__ */ o("input", {
+		children: h.value.map((t, n) => /* @__PURE__ */ s("input", {
 			ref: (e) => {
 				g.current[n] = e;
 			},
@@ -52,7 +52,7 @@ function c({ length: c = 6, value: l, onValueChange: u, disabled: d = !1, type:
 			className: e.slot,
 			value: t,
 			maxLength: 1,
-			"aria-label": a(i.otpInput.digit, { n: String(n + 1) }),
+			"aria-label": o(a.otpInput.digit, { n: String(n + 1) }),
 			autoComplete: n === 0 ? "one-time-code" : "off",
 			disabled: d,
 			"data-filled": t ? "" : void 0,