@cascivo/react 0.12.0 → 0.13.1

package/dist/notification/notification.js

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

package/dist/notification/notification.module.js

@@ -2,13 +2,13 @@
 
 import './notification.css';
 var e = {
-	notification: "_notification_10586_2",
-	icon: "_icon_10586_58",
-	body: "_body_10586_79",
-	title: "_title_10586_87",
-	description: "_description_10586_93",
-	actions: "_actions_10586_99",
-	dismiss: "_dismiss_10586_106"
+	notification: "_notification_imxvx_2",
+	icon: "_icon_imxvx_65",
+	body: "_body_imxvx_86",
+	title: "_title_imxvx_94",
+	description: "_description_imxvx_100",
+	actions: "_actions_imxvx_106",
+	dismiss: "_dismiss_imxvx_113"
 };
 //#endregion
 export { e as default };

package/dist/number-input/number-input.css

@@ -1 +1 @@
-@layer cascivo.component{._wrapper_q5e5w_2{gap:var(--cascivo-space-1);--_stepper-width:1.5rem;flex-direction:column;display:flex}._wrapper_q5e5w_2[data-size=sm]{--_input-height:2rem;--_input-font:var(--cascivo-text-sm);--_input-px:var(--cascivo-space-3)}._wrapper_q5e5w_2[data-size=md]{--_input-height:2.5rem;--_input-font:var(--cascivo-text-sm);--_input-px:var(--cascivo-space-4)}._wrapper_q5e5w_2[data-size=lg]{--_input-height:3rem;--_input-font:var(--cascivo-text-base);--_input-px:var(--cascivo-space-4)}._label_q5e5w_27{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);font-weight:var(--cascivo-font-medium);color:var(--cascivo-color-text);line-height:var(--cascivo-leading-snug)}._field_q5e5w_35{position:relative}._input_q5e5w_39{width:100%;height:var(--_input-height,2.5rem);font-family:var(--cascivo-font-sans);font-size:var(--_input-font,var(--cascivo-text-sm));font-variant-numeric:tabular-nums;color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);outline:none;padding-inline-start:var(--_input-px,var(--cascivo-space-4));padding-inline-end:calc(var(--_stepper-width) + var(--cascivo-space-2))}._input_q5e5w_39::placeholder{color:var(--cascivo-color-text-muted)}._input_q5e5w_39:hover:not(:disabled):not(:focus){border-color:var(--cascivo-color-border-strong)}._input_q5e5w_39:focus{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._input_q5e5w_39:disabled{opacity:.5;cursor:not-allowed;background-color:var(--cascivo-color-bg-subtle)}._wrapper_q5e5w_2[data-state=error] ._input_q5e5w_39{border-color:var(--cascivo-color-destructive)}._wrapper_q5e5w_2[data-state=error] ._input_q5e5w_39:focus{box-shadow:0 0 0 3px rgb(from var(--cascivo-color-destructive) r g b / .3)}._steppers_q5e5w_84{inline-size:var(--_stepper-width);border-start-end-radius:calc(var(--cascivo-radius-field) - 1px);border-end-end-radius:calc(var(--cascivo-radius-field) - 1px);flex-direction:column;display:flex;position:absolute;inset-block:1px;inset-inline-end:1px;overflow:hidden}._stepper_q5e5w_84{border:none;border-inline-start:1px solid var(--cascivo-color-border);color:var(--cascivo-color-text-subtle);cursor:pointer;transition:background-color var(--cascivo-duration-150) var(--cascivo-ease-out), color var(--cascivo-duration-150) var(--cascivo-ease-out);background-color:#0000;flex:1;justify-content:center;align-items:center;padding:0;display:flex}._stepper_q5e5w_84+._stepper_q5e5w_84{border-block-start:1px solid var(--cascivo-color-border)}._stepper_q5e5w_84:hover:not(:disabled){background-color:var(--cascivo-color-bg-subtle);color:var(--cascivo-color-text)}._stepper_q5e5w_84:disabled{opacity:.5;cursor:not-allowed}._stepper_q5e5w_84 svg{block-size:.625rem;inline-size:.625rem}._error_q5e5w_131{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-destructive);line-height:var(--cascivo-leading-snug)}._hint_q5e5w_138{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text-subtle);line-height:var(--cascivo-leading-snug)}}
+@layer cascivo.component{._wrapper_aavdw_2{gap:var(--cascivo-space-1);--_stepper-width:1.5rem;flex-direction:column;min-inline-size:0;display:flex}._wrapper_aavdw_2[data-size=sm]{--_input-height:2rem;--_input-font:var(--cascivo-text-sm);--_input-px:var(--cascivo-space-3)}._wrapper_aavdw_2[data-size=md]{--_input-height:2.5rem;--_input-font:var(--cascivo-text-sm);--_input-px:var(--cascivo-space-4)}._wrapper_aavdw_2[data-size=lg]{--_input-height:3rem;--_input-font:var(--cascivo-text-base);--_input-px:var(--cascivo-space-4)}._label_aavdw_31{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);font-weight:var(--cascivo-font-medium);color:var(--cascivo-color-text);line-height:var(--cascivo-leading-snug)}._field_aavdw_39{position:relative}._input_aavdw_43{width:100%;height:var(--_input-height,2.5rem);font-family:var(--cascivo-font-sans);font-size:var(--_input-font,var(--cascivo-text-sm));font-variant-numeric:tabular-nums;color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);outline:none;padding-inline-start:var(--_input-px,var(--cascivo-space-4));padding-inline-end:calc(var(--_stepper-width) + var(--cascivo-space-2))}._input_aavdw_43::placeholder{color:var(--cascivo-color-text-muted)}._input_aavdw_43:hover:not(:disabled):not(:focus){border-color:var(--cascivo-color-border-strong)}._input_aavdw_43:focus{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._input_aavdw_43:disabled{opacity:.5;cursor:not-allowed;background-color:var(--cascivo-color-bg-subtle)}._wrapper_aavdw_2[data-state=error] ._input_aavdw_43{border-color:var(--cascivo-color-destructive)}._wrapper_aavdw_2[data-state=error] ._input_aavdw_43:focus{box-shadow:0 0 0 3px rgb(from var(--cascivo-color-destructive) r g b / .3)}._steppers_aavdw_88{inline-size:var(--_stepper-width);border-start-end-radius:calc(var(--cascivo-radius-field) - 1px);border-end-end-radius:calc(var(--cascivo-radius-field) - 1px);flex-direction:column;display:flex;position:absolute;inset-block:1px;inset-inline-end:1px;overflow:hidden}._stepper_aavdw_88{border:none;border-inline-start:1px solid var(--cascivo-color-border);color:var(--cascivo-color-text-subtle);cursor:pointer;transition:background-color var(--cascivo-duration-150) var(--cascivo-ease-out), color var(--cascivo-duration-150) var(--cascivo-ease-out);background-color:#0000;flex:1;justify-content:center;align-items:center;padding:0;display:flex}._stepper_aavdw_88+._stepper_aavdw_88{border-block-start:1px solid var(--cascivo-color-border)}._stepper_aavdw_88:hover:not(:disabled){background-color:var(--cascivo-color-bg-subtle);color:var(--cascivo-color-text)}._stepper_aavdw_88:disabled{opacity:.5;cursor:not-allowed}._stepper_aavdw_88 svg{block-size:.625rem;inline-size:.625rem}._error_aavdw_135{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-destructive);line-height:var(--cascivo-leading-snug)}._hint_aavdw_142{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text-subtle);line-height:var(--cascivo-leading-snug)}}

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/number-input/number-input.module.js

@@ -2,14 +2,14 @@
 
 import './number-input.css';
 var e = {
-	wrapper: "_wrapper_q5e5w_2",
-	label: "_label_q5e5w_27",
-	field: "_field_q5e5w_35",
-	input: "_input_q5e5w_39",
-	steppers: "_steppers_q5e5w_84",
-	stepper: "_stepper_q5e5w_84",
-	error: "_error_q5e5w_131",
-	hint: "_hint_q5e5w_138"
+	wrapper: "_wrapper_aavdw_2",
+	label: "_label_aavdw_31",
+	field: "_field_aavdw_39",
+	input: "_input_aavdw_43",
+	steppers: "_steppers_aavdw_88",
+	stepper: "_stepper_aavdw_88",
+	error: "_error_aavdw_135",
+	hint: "_hint_aavdw_142"
 };
 //#endregion
 export { e as default };

package/dist/otp-input/otp-input.css

@@ -1 +1 @@
-@layer cascivo.component{._wrapper_15f1m_2{gap:var(--cascivo-space-2);align-items:center;display:flex}._slot_15f1m_8{width:2.75rem;height:3rem;font-family:var(--cascivo-font-mono,var(--cascivo-font-sans));font-size:var(--cascivo-text-xl);font-weight:var(--cascivo-font-semibold);text-align:center;color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1.5px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);caret-color:#0000;outline:none}._slot_15f1m_8:hover:not(:disabled){border-color:var(--cascivo-color-border-strong)}._slot_15f1m_8:focus{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._slot_15f1m_8[data-filled]{border-color:var(--cascivo-color-border-strong);background-color:var(--cascivo-color-bg-subtle)}._slot_15f1m_8:disabled{opacity:.5;cursor:not-allowed}}
+@layer cascivo.component{._wrapper_k67bx_2{gap:var(--cascivo-space-2);align-items:center;min-inline-size:0;display:flex}._slot_k67bx_12{width:2.75rem;height:3rem;font-family:var(--cascivo-font-mono,var(--cascivo-font-sans));font-size:var(--cascivo-text-xl);font-weight:var(--cascivo-font-semibold);text-align:center;color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1.5px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);caret-color:#0000;outline:none}._slot_k67bx_12:hover:not(:disabled){border-color:var(--cascivo-color-border-strong)}._slot_k67bx_12:focus{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._slot_k67bx_12[data-filled]{border-color:var(--cascivo-color-border-strong);background-color:var(--cascivo-color-bg-subtle)}._slot_k67bx_12:disabled{opacity:.5;cursor:not-allowed}}

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,

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

@@ -2,8 +2,8 @@
 
 import './otp-input.css';
 var e = {
-	wrapper: "_wrapper_15f1m_2",
-	slot: "_slot_15f1m_8"
+	wrapper: "_wrapper_k67bx_2",
+	slot: "_slot_k67bx_12"
 };
 //#endregion
 export { e as default };

package/dist/overflow-menu/overflow-menu.js

@@ -6,7 +6,12 @@ import { cn as n, useSignals as r } from "@cascivo/core";
 import { builtin as i, t as a } from "@cascivo/i18n";
 import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region ../components/src/overflow-menu/overflow-menu.tsx
-function l() {
+function l(e) {
+	let t = e.value ?? e.id;
+	if (t === void 0) throw Error(`OverflowMenu: item "${e.label}" has neither \`value\` nor \`id\`. One of them is required — it is what \`onSelect\` receives.`);
+	return t;
+}
+function u() {
 	return /* @__PURE__ */ c("svg", {
 		viewBox: "0 0 16 16",
 		width: "16",
@@ -32,12 +37,12 @@ function l() {
 		]
 	});
 }
-function u({ items: u, onSelect: d, placement: f = "bottom-end", ariaLabel: p, size: m = "md", disabled: h = !1, className: g }) {
+function d({ items: d, onSelect: f, placement: p = "bottom-end", ariaLabel: m, size: h = "md", disabled: g = !1, className: _ }) {
 	r();
-	let _ = p ?? a(i.overflowMenu.trigger), v = u.map((e) => {
+	let v = m ?? a(i.overflowMenu.trigger), y = d.map((e) => {
 		let n = {
 			label: e.label,
-			value: e.value
+			value: l(e)
 		};
 		return e.disabled !== void 0 && (n.disabled = e.disabled), e.destructive ? n.icon = /* @__PURE__ */ c(o, { children: [e.icon, /* @__PURE__ */ s("span", {
 			className: t["destructive-flag"],
@@ -45,21 +50,21 @@ function u({ items: u, onSelect: d, placement: f = "bottom-end", ariaLabel: p, s
 		})] }) : e.icon !== void 0 && (n.icon = e.icon), n;
 	});
 	return /* @__PURE__ */ s("div", {
-		className: n(t.root, g),
+		className: n(t.root, _),
 		children: /* @__PURE__ */ s(e, {
-			items: v,
-			onSelect: (e) => d?.(e),
-			placement: f,
+			items: y,
+			onSelect: (e) => f?.(e),
+			placement: p,
 			trigger: /* @__PURE__ */ s("button", {
 				type: "button",
 				className: t.trigger,
-				"data-size": m,
-				disabled: h,
-				"aria-label": _,
-				children: /* @__PURE__ */ s(l, {})
+				"data-size": h,
+				disabled: g,
+				"aria-label": v,
+				children: /* @__PURE__ */ s(u, {})
 			})
 		})
 	});
 }
 //#endregion
-export { u as OverflowMenu };
+export { d as OverflowMenu };

package/dist/password-input/password-input.css

@@ -1 +1 @@
-@layer cascivo.component{._wrapper_r2rcd_2{gap:var(--cascivo-space-1);flex-direction:column;display:flex}._wrapper_r2rcd_2[data-size=sm]{--_height:2rem;--_font:var(--cascivo-text-sm);--_px:var(--cascivo-space-3)}._wrapper_r2rcd_2[data-size=md]{--_height:2.5rem;--_font:var(--cascivo-text-sm);--_px:var(--cascivo-space-4)}._wrapper_r2rcd_2[data-size=lg]{--_height:3rem;--_font:var(--cascivo-text-base);--_px:var(--cascivo-space-4)}._input-row_r2rcd_26{align-items:center;display:flex;position:relative}._input_r2rcd_26{width:100%;height:var(--_height,2.5rem);padding-inline:var(--_px,var(--cascivo-space-4));font-family:var(--cascivo-font-sans);font-size:var(--_font,var(--cascivo-text-sm));color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);outline:none;padding-inline-end:calc(var(--_px,var(--cascivo-space-4)) + 2.5rem)}._input_r2rcd_26::placeholder{color:var(--cascivo-color-text-muted)}._input_r2rcd_26:hover:not(:disabled):not(:focus){border-color:var(--cascivo-color-border-strong)}._input_r2rcd_26:focus{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._input_r2rcd_26:disabled{opacity:.5;cursor:not-allowed;background-color:var(--cascivo-color-bg-subtle)}._reveal-btn_r2rcd_68{border-radius:var(--cascivo-radius-control);width:2rem;height:2rem;color:var(--cascivo-color-text-subtle);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;inset-inline-end:var(--cascivo-space-2)}._reveal-btn_r2rcd_68:hover{color:var(--cascivo-color-text);background-color:var(--cascivo-color-bg-subtle)}._reveal-btn_r2rcd_68:focus-visible{outline:2px solid var(--cascivo-color-accent);outline-offset:1px}._reveal-icon_r2rcd_94{background-color:currentColor;width:1.25rem;height:1.25rem;display:block;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}._wrapper_r2rcd_2[data-revealed] ._reveal-icon_r2rcd_94{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E")}._strength-meter_r2rcd_114{gap:var(--cascivo-space-1);display:flex}._strength-meter_r2rcd_114[data-strength=weak]{--_seg-color:var(--cascivo-color-destructive)}._strength-meter_r2rcd_114[data-strength=fair]{--_seg-color:var(--cascivo-color-warning)}._strength-meter_r2rcd_114[data-strength=good],._strength-meter_r2rcd_114[data-strength=strong]{--_seg-color:var(--cascivo-color-success)}._strength-segment_r2rcd_135{border-radius:var(--cascivo-radius-full);background-color:var(--cascivo-color-border);height:.25rem;transition:background-color var(--cascivo-duration-150) var(--cascivo-ease-out);flex:1}._strength-segment_r2rcd_135[data-filled]{background-color:var(--_seg-color,var(--cascivo-color-accent))}}
+@layer cascivo.component{._wrapper_19052_2{gap:var(--cascivo-space-1);flex-direction:column;min-inline-size:0;display:flex}._wrapper_19052_2[data-size=sm]{--_height:2rem;--_font:var(--cascivo-text-sm);--_px:var(--cascivo-space-3)}._wrapper_19052_2[data-size=md]{--_height:2.5rem;--_font:var(--cascivo-text-sm);--_px:var(--cascivo-space-4)}._wrapper_19052_2[data-size=lg]{--_height:3rem;--_font:var(--cascivo-text-base);--_px:var(--cascivo-space-4)}._input-row_19052_30{align-items:center;display:flex;position:relative}._input_19052_30{width:100%;height:var(--_height,2.5rem);padding-inline:var(--_px,var(--cascivo-space-4));font-family:var(--cascivo-font-sans);font-size:var(--_font,var(--cascivo-text-sm));color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-field);transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);outline:none;padding-inline-end:calc(var(--_px,var(--cascivo-space-4)) + 2.5rem)}._input_19052_30::placeholder{color:var(--cascivo-color-text-muted)}._input_19052_30:hover:not(:disabled):not(:focus){border-color:var(--cascivo-color-border-strong)}._input_19052_30:focus{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._input_19052_30:disabled{opacity:.5;cursor:not-allowed;background-color:var(--cascivo-color-bg-subtle)}._reveal-btn_19052_72{border-radius:var(--cascivo-radius-control);width:2rem;height:2rem;color:var(--cascivo-color-text-subtle);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;inset-inline-end:var(--cascivo-space-2)}._reveal-btn_19052_72:hover{color:var(--cascivo-color-text);background-color:var(--cascivo-color-bg-subtle)}._reveal-btn_19052_72:focus-visible{outline:2px solid var(--cascivo-color-accent);outline-offset:1px}._reveal-icon_19052_98{background-color:currentColor;width:1.25rem;height:1.25rem;display:block;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}._wrapper_19052_2[data-revealed] ._reveal-icon_19052_98{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E")}._strength-meter_19052_118{gap:var(--cascivo-space-1);display:flex}._strength-meter_19052_118[data-strength=weak]{--_seg-color:var(--cascivo-color-destructive)}._strength-meter_19052_118[data-strength=fair]{--_seg-color:var(--cascivo-color-warning)}._strength-meter_19052_118[data-strength=good],._strength-meter_19052_118[data-strength=strong]{--_seg-color:var(--cascivo-color-success)}._strength-segment_19052_139{border-radius:var(--cascivo-radius-full);background-color:var(--cascivo-color-border);height:.25rem;transition:background-color var(--cascivo-duration-150) var(--cascivo-ease-out);flex:1}._strength-segment_19052_139[data-filled]{background-color:var(--_seg-color,var(--cascivo-color-accent))}}