@cascivo/react 0.3.4 → 0.3.8

package/dist/notification/notification.module.js

@@ -0,0 +1,14 @@
+"use client";
+
+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"
+};
+//#endregion
+export { e as default };

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

@@ -0,0 +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)}}

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

@@ -0,0 +1,145 @@
+"use client";
+
+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";
+//#region ../components/src/number-input/number-input.tsx
+var u = n({
+	initial: "idle",
+	states: {
+		idle: { on: { FOCUS: "focused" } },
+		focused: { on: { BLUR: "idle" } }
+	}
+});
+function d(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) {
+	let t = String(e), n = t.indexOf(".");
+	return n === -1 ? 0 : t.length - n - 1;
+}
+function p(e, t) {
+	let n = 10 ** t;
+	return Math.round(e * n) / n;
+}
+function m(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, 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 }) {
+	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 <= _;
+	return /* @__PURE__ */ l("div", {
+		className: t(e.wrapper, k),
+		"data-state": w ? "error" : L.value,
+		"data-size": T,
+		children: [
+			S && /* @__PURE__ */ c("label", {
+				className: e.label,
+				htmlFor: U,
+				children: S
+			}),
+			/* @__PURE__ */ l("div", {
+				className: e.field,
+				children: [/* @__PURE__ */ c("input", {
+					id: U,
+					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,
+					onChange: (e) => {
+						V.value = e.target.value;
+					},
+					onFocus: (e) => {
+						V.value = H == null ? "" : String(H), R("FOCUS"), j?.(e);
+					},
+					onBlur: (e) => {
+						G(), R("BLUR"), M?.(e);
+					},
+					onKeyDown: (e) => {
+						e.key === "ArrowUp" ? (e.preventDefault(), K(1)) : e.key === "ArrowDown" ? (e.preventDefault(), K(-1)) : e.key === "Enter" && G(), N?.(e);
+					},
+					...P
+				}), /* @__PURE__ */ l("div", {
+					className: e.steppers,
+					children: [/* @__PURE__ */ c("button", {
+						type: "button",
+						className: e.stepper,
+						"aria-label": F,
+						tabIndex: -1,
+						disabled: E || J,
+						onMouseDown: (e) => e.preventDefault(),
+						onClick: () => K(1),
+						children: /* @__PURE__ */ c("svg", {
+							viewBox: "0 0 10 10",
+							"aria-hidden": "true",
+							focusable: "false",
+							children: /* @__PURE__ */ c("path", {
+								d: "M2 6.5 5 3.5 8 6.5",
+								fill: "none",
+								stroke: "currentColor",
+								strokeWidth: "1.5",
+								strokeLinecap: "round",
+								strokeLinejoin: "round"
+							})
+						})
+					}), /* @__PURE__ */ c("button", {
+						type: "button",
+						className: e.stepper,
+						"aria-label": I,
+						tabIndex: -1,
+						disabled: E || Y,
+						onMouseDown: (e) => e.preventDefault(),
+						onClick: () => K(-1),
+						children: /* @__PURE__ */ c("svg", {
+							viewBox: "0 0 10 10",
+							"aria-hidden": "true",
+							focusable: "false",
+							children: /* @__PURE__ */ c("path", {
+								d: "M2 3.5 5 6.5 8 3.5",
+								fill: "none",
+								stroke: "currentColor",
+								strokeWidth: "1.5",
+								strokeLinecap: "round",
+								strokeLinejoin: "round"
+							})
+						})
+					})]
+				})]
+			}),
+			w && /* @__PURE__ */ c("span", {
+				id: `${U}-error`,
+				className: e.error,
+				role: "alert",
+				children: w
+			}),
+			!w && C && /* @__PURE__ */ c("span", {
+				id: `${U}-hint`,
+				className: e.hint,
+				children: C
+			})
+		]
+	});
+}
+//#endregion
+export { h as NumberInput };

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

@@ -0,0 +1,15 @@
+"use client";
+
+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"
+};
+//#endregion
+export { e as default };

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

@@ -0,0 +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}}

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

@@ -0,0 +1,70 @@
+"use client";
+
+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";
+//#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] ?? "");
+	JSON.stringify(h.value) !== JSON.stringify(_) && (h.value = _);
+	function v(e) {
+		u(e.join("")), h.value = e;
+	}
+	function y(e) {
+		let t = Math.max(0, Math.min(c - 1, e));
+		g.current[t]?.focus();
+	}
+	function b(e, t) {
+		if (!(f === "numeric" ? /^\d$/ : /^[a-zA-Z0-9]$/).test(t)) return;
+		let n = [...h.value];
+		n[e] = t, v(n), e < c - 1 && y(e + 1);
+	}
+	function x(e, t) {
+		if (t.key === "Backspace") {
+			t.preventDefault();
+			let n = [...h.value];
+			n[e] ? (n[e] = "", v(n)) : e > 0 && (n[e - 1] = "", v(n), y(e - 1));
+		} else t.key === "ArrowLeft" ? (t.preventDefault(), y(e - 1)) : t.key === "ArrowRight" && (t.preventDefault(), y(e + 1));
+	}
+	function S(e, t) {
+		let n = t.clipboardData.getData("text").replace(/\s/g, "").slice(0, c - e);
+		if (!(f === "numeric" ? /^\d+$/ : /^[a-zA-Z0-9]+$/).test(n)) return;
+		t.preventDefault();
+		let r = [...h.value];
+		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", {
+		className: t(e.wrapper, p),
+		role: "group",
+		"aria-label": C,
+		...m,
+		children: h.value.map((t, n) => /* @__PURE__ */ o("input", {
+			ref: (e) => {
+				g.current[n] = e;
+			},
+			type: f === "numeric" ? "tel" : "text",
+			inputMode: f === "numeric" ? "numeric" : "text",
+			className: e.slot,
+			value: t,
+			maxLength: 1,
+			"aria-label": a(i.otpInput.digit, { n: String(n + 1) }),
+			autoComplete: n === 0 ? "one-time-code" : "off",
+			disabled: d,
+			"data-filled": t ? "" : void 0,
+			onChange: (e) => {
+				let t = e.currentTarget.value.slice(-1);
+				t && b(n, t);
+			},
+			onKeyDown: (e) => x(n, e),
+			onPaste: (e) => S(n, e),
+			onFocus: (e) => e.currentTarget.select()
+		}, n))
+	});
+}
+//#endregion
+export { c as OtpInput };

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

@@ -0,0 +1,9 @@
+"use client";
+
+import './otp-input.css';
+var e = {
+	wrapper: "_wrapper_15f1m_2",
+	slot: "_slot_15f1m_8"
+};
+//#endregion
+export { e as default };

package/dist/overflow-menu/overflow-menu.css

@@ -0,0 +1 @@
+@layer cascivo.component{._root_14jtg_2{display:inline-flex}._trigger_14jtg_6{color:var(--cascivo-color-text-muted);border-radius:var(--cascivo-radius-control);cursor:pointer;transition:background-color var(--cascivo-duration-150) var(--cascivo-ease-out), color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);background-color:#0000;border:1px solid #0000;justify-content:center;align-items:center;padding:0;display:inline-flex}._trigger_14jtg_6[data-size=sm]{block-size:2rem;inline-size:2rem}._trigger_14jtg_6[data-size=md]{block-size:2.5rem;inline-size:2.5rem}._trigger_14jtg_6:hover:not(:disabled){color:var(--cascivo-color-text);background-color:var(--cascivo-color-bg-subtle)}._trigger_14jtg_6:focus-visible{box-shadow:var(--cascivo-focus-ring);outline:none}._trigger_14jtg_6:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}._destructive-flag_14jtg_49{display:none}._root_14jtg_2 [role=menuitem]:has(._destructive-flag_14jtg_49){color:var(--cascivo-color-destructive)}._root_14jtg_2 [role=menuitem]:has(._destructive-flag_14jtg_49):hover:not(:disabled),._root_14jtg_2 [role=menuitem]:has(._destructive-flag_14jtg_49):focus-visible{background-color:var(--cascivo-color-destructive-subtle)}._root_14jtg_2 [role=menuitem]:has(._destructive-flag_14jtg_49)>span{color:inherit}._root_14jtg_2 [role=menuitem]>span:has(>._destructive-flag_14jtg_49:only-child){display:none}}

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

@@ -0,0 +1,65 @@
+"use client";
+
+import { Dropdown as e } from "../dropdown/dropdown.js";
+import t from "./overflow-menu.module.js";
+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() {
+	return /* @__PURE__ */ c("svg", {
+		viewBox: "0 0 16 16",
+		width: "16",
+		height: "16",
+		fill: "currentColor",
+		"aria-hidden": "true",
+		children: [
+			/* @__PURE__ */ s("circle", {
+				cx: "8",
+				cy: "3",
+				r: "1.5"
+			}),
+			/* @__PURE__ */ s("circle", {
+				cx: "8",
+				cy: "8",
+				r: "1.5"
+			}),
+			/* @__PURE__ */ s("circle", {
+				cx: "8",
+				cy: "13",
+				r: "1.5"
+			})
+		]
+	});
+}
+function u({ items: u, onSelect: d, placement: f = "bottom-end", ariaLabel: p, size: m = "md", disabled: h = !1, className: g }) {
+	r();
+	let _ = p ?? a(i.overflowMenu.trigger), v = u.map((e) => {
+		let n = {
+			label: e.label,
+			value: e.value
+		};
+		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"],
+			"aria-hidden": "true"
+		})] }) : e.icon !== void 0 && (n.icon = e.icon), n;
+	});
+	return /* @__PURE__ */ s("div", {
+		className: n(t.root, g),
+		children: /* @__PURE__ */ s(e, {
+			items: v,
+			onSelect: (e) => d?.(e),
+			placement: f,
+			trigger: /* @__PURE__ */ s("button", {
+				type: "button",
+				className: t.trigger,
+				"data-size": m,
+				disabled: h,
+				"aria-label": _,
+				children: /* @__PURE__ */ s(l, {})
+			})
+		})
+	});
+}
+//#endregion
+export { u as OverflowMenu };

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

@@ -0,0 +1,10 @@
+"use client";
+
+import './overflow-menu.css';
+var e = {
+	root: "_root_14jtg_2",
+	trigger: "_trigger_14jtg_6",
+	"destructive-flag": "_destructive-flag_14jtg_49"
+};
+//#endregion
+export { e as default };

package/dist/pagination/pagination.css

@@ -0,0 +1 @@
+@layer cascivo.component{._pagination_1rt7c_2{align-items:center;gap:var(--cascivo-space-4);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text);flex-wrap:wrap;display:flex;container-type:inline-size}._group_1rt7c_13{align-items:center;gap:var(--cascivo-space-2);display:flex}._label_1rt7c_19{color:var(--cascivo-color-text-muted);line-height:var(--cascivo-leading-snug);white-space:nowrap}._range_1rt7c_25{color:var(--cascivo-color-text-muted);line-height:var(--cascivo-leading-snug);white-space:nowrap}@container (width<=28rem){._range_1rt7c_25{display:none}}._select_1rt7c_35{appearance:none;height:2rem;font-family:var(--cascivo-font-sans);font-size: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);cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='gray' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--cascivo-space-1) center;transition:border-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);background-size:1rem;outline:none;padding-inline-start:var(--cascivo-space-2);padding-inline-end:var(--cascivo-space-6)}._select_1rt7c_35:hover:not(:disabled):not(:focus){border-color:var(--cascivo-color-border-strong)}._select_1rt7c_35:focus-visible{border-color:var(--cascivo-color-accent);box-shadow:var(--cascivo-focus-ring)}._select_1rt7c_35:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){background-position:left var(--cascivo-space-1) center}._buttons_1rt7c_70{align-items:center;gap:var(--cascivo-space-1);display:flex}._button_1rt7c_70{block-size:2rem;inline-size:2rem;font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-lg);line-height:var(--cascivo-leading-none);color:var(--cascivo-color-text);border-radius:var(--cascivo-radius-control);cursor:pointer;transition:background-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);background-color:#0000;border:1px solid #0000;justify-content:center;align-items:center;display:inline-flex}._button_1rt7c_70:hover:not(:disabled){background-color:var(--cascivo-color-bg-subtle)}._button_1rt7c_70:active:not(:disabled){background-color:var(--cascivo-color-accent-subtle)}._button_1rt7c_70:focus-visible{box-shadow:var(--cascivo-focus-ring);outline:none}._button_1rt7c_70:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}}

package/dist/pagination/pagination.js

@@ -0,0 +1,92 @@
+"use client";
+
+import e from "./pagination.module.js";
+import { cn as t, useSignals 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";
+//#region ../components/src/pagination/pagination.tsx
+var s = [
+	10,
+	25,
+	50,
+	100
+];
+function c({ page: c, pageSize: l, totalItems: u, onPageChange: d, onPageSizeChange: f, pageSizeOptions: p = s, labels: m, className: h }) {
+	n();
+	let g = Math.max(1, Math.ceil(u / l)), _ = Math.min(Math.max(c, 1), g), v = u === 0 ? 0 : (_ - 1) * l + 1, y = Math.min(_ * l, u), b = m?.nav ?? i(r.pagination.nav), x = m?.itemsPerPage ?? i(r.pagination.itemsPerPage), S = m?.pageOf?.(_, g) ?? i(r.pagination.pageOf, {
+		page: _,
+		total: g
+	}), C = m?.range?.(v, y, u) ?? i(r.pagination.range, {
+		start: v,
+		end: y,
+		total: u
+	}), w = m?.previous ?? i(r.pagination.previous), T = m?.next ?? i(r.pagination.next);
+	return /* @__PURE__ */ o("nav", {
+		"aria-label": b,
+		className: t(e.pagination, h),
+		children: [
+			f && /* @__PURE__ */ o("label", {
+				className: e.group,
+				children: [/* @__PURE__ */ a("span", {
+					className: e.label,
+					children: x
+				}), /* @__PURE__ */ a("select", {
+					className: e.select,
+					value: l,
+					onChange: (e) => f(Number(e.target.value)),
+					children: p.map((e) => /* @__PURE__ */ a("option", {
+						value: e,
+						children: e
+					}, e))
+				})]
+			}),
+			/* @__PURE__ */ a("span", {
+				className: e.range,
+				children: C
+			}),
+			/* @__PURE__ */ o("div", {
+				className: e.group,
+				children: [/* @__PURE__ */ a("select", {
+					className: e.select,
+					"aria-label": S,
+					value: _,
+					onChange: (e) => d(Number(e.target.value)),
+					children: Array.from({ length: g }, (e, t) => /* @__PURE__ */ a("option", {
+						value: t + 1,
+						children: t + 1
+					}, t + 1))
+				}), /* @__PURE__ */ a("span", {
+					className: e.label,
+					"aria-hidden": "true",
+					children: S
+				})]
+			}),
+			/* @__PURE__ */ o("div", {
+				className: e.buttons,
+				children: [/* @__PURE__ */ a("button", {
+					type: "button",
+					className: e.button,
+					"aria-label": w,
+					disabled: _ <= 1,
+					onClick: () => d(_ - 1),
+					children: /* @__PURE__ */ a("span", {
+						"aria-hidden": "true",
+						children: "‹"
+					})
+				}), /* @__PURE__ */ a("button", {
+					type: "button",
+					className: e.button,
+					"aria-label": T,
+					disabled: _ >= g,
+					onClick: () => d(_ + 1),
+					children: /* @__PURE__ */ a("span", {
+						"aria-hidden": "true",
+						children: "›"
+					})
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { c as Pagination };

package/dist/pagination/pagination.module.js

@@ -0,0 +1,14 @@
+"use client";
+
+import './pagination.css';
+var e = {
+	pagination: "_pagination_1rt7c_2",
+	group: "_group_1rt7c_13",
+	label: "_label_1rt7c_19",
+	range: "_range_1rt7c_25",
+	select: "_select_1rt7c_35",
+	buttons: "_buttons_1rt7c_70",
+	button: "_button_1rt7c_70"
+};
+//#endregion
+export { e as default };

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

@@ -0,0 +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))}}

package/dist/password-input/password-input.js

@@ -0,0 +1,76 @@
+"use client";
+
+import e from "./password-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, jsxs as s } from "react/jsx-runtime";
+import { useId as c } from "react";
+//#region ../components/src/password-input/password-input.tsx
+function l(e) {
+	if (!e) return {
+		score: 0,
+		label: "weak"
+	};
+	let t = 0;
+	return /[a-z]/.test(e) && t++, /[A-Z]/.test(e) && t++, /[0-9]/.test(e) && t++, /[^a-zA-Z0-9]/.test(e) && t++, e.length >= 12 && (t = Math.min(4, t + 1)), t = Math.min(4, t), {
+		score: t,
+		label: [
+			"weak",
+			"weak",
+			"fair",
+			"good",
+			"strong"
+		][t]
+	};
+}
+function u({ showStrengthMeter: u = !1, size: d = "md", labels: f, className: p, id: m, value: h, defaultValue: g, onChange: _, ...v }) {
+	r();
+	let y = n(!1), b = n(typeof h == "string" ? h : typeof g == "string" ? g : "");
+	typeof h == "string" && (b.value = h);
+	let x = c(), S = m ?? `cascade-password-${x}`, C = u ? l(b.value) : null, w = y.value ? f?.hide ?? a(i.passwordInput.hide) : f?.reveal ?? a(i.passwordInput.reveal), T = C ? f?.strengthLabel ? f.strengthLabel(C.label) : a(i.passwordInput.strengthLabel, { level: C.label }) : void 0;
+	return /* @__PURE__ */ s("div", {
+		className: t(e.wrapper, p),
+		"data-size": d,
+		"data-revealed": y.value ? "" : void 0,
+		children: [/* @__PURE__ */ s("div", {
+			className: e["input-row"],
+			children: [/* @__PURE__ */ o("input", {
+				...v,
+				id: S,
+				type: y.value ? "text" : "password",
+				className: e.input,
+				value: h,
+				defaultValue: g,
+				onChange: (e) => {
+					typeof h != "string" && (b.value = e.currentTarget.value), _?.(e);
+				}
+			}), /* @__PURE__ */ o("button", {
+				type: "button",
+				className: e["reveal-btn"],
+				"aria-label": w,
+				onClick: () => {
+					y.value = !y.value;
+				},
+				children: /* @__PURE__ */ o("span", {
+					className: e["reveal-icon"],
+					"aria-hidden": "true"
+				})
+			})]
+		}), u && C && /* @__PURE__ */ o("div", {
+			className: e["strength-meter"],
+			"aria-label": T,
+			"data-strength": C.label,
+			children: [
+				0,
+				1,
+				2,
+				3
+			].map((t) => /* @__PURE__ */ o("div", {
+				className: e["strength-segment"],
+				"data-filled": t < C.score ? "" : void 0
+			}, t))
+		})]
+	});
+}
+//#endregion
+export { u as PasswordInput };

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

@@ -0,0 +1,14 @@
+"use client";
+
+import './password-input.css';
+var e = {
+	wrapper: "_wrapper_r2rcd_2",
+	"input-row": "_input-row_r2rcd_26",
+	input: "_input_r2rcd_26",
+	"reveal-btn": "_reveal-btn_r2rcd_68",
+	"reveal-icon": "_reveal-icon_r2rcd_94",
+	"strength-meter": "_strength-meter_r2rcd_114",
+	"strength-segment": "_strength-segment_r2rcd_135"
+};
+//#endregion
+export { e as default };

package/dist/popover/popover.css

@@ -0,0 +1 @@
+@layer cascivo.component{._content_208tz_6{padding:var(--cascivo-space-3);background:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-overlay);box-shadow:var(--cascivo-shadow-md);margin:0;position:fixed;inset:auto}@supports (anchor-name:--a){._content_208tz_6{position-try-fallbacks:flip-block, flip-inline, flip-block flip-inline;inset-block-start:anchor(end);inset-inline-start:anchor(start)}}._content_208tz_6{opacity:1;transition:opacity var(--cascivo-motion-enter), translate var(--cascivo-motion-enter), display var(--cascivo-motion-enter) allow-discrete, overlay var(--cascivo-motion-enter) allow-discrete;translate:0}@starting-style{._content_208tz_6{opacity:0;translate:0 calc(-1 * var(--cascivo-space-2))}}._content_208tz_6[data-state=closed]{opacity:0;translate:0 calc(-1 * var(--cascivo-space-2));transition:opacity var(--cascivo-motion-exit), translate var(--cascivo-motion-exit), display var(--cascivo-motion-exit) allow-discrete, overlay var(--cascivo-motion-exit) allow-discrete}}

package/dist/popover/popover.js

@@ -0,0 +1,49 @@
+"use client";
+
+import { usePopover as e } from "./use-popover.js";
+import t from "./popover.module.js";
+import { useSignals as n } from "@cascivo/core";
+import { jsx as r } from "react/jsx-runtime";
+import { createContext as i } from "react";
+//#region ../components/src/popover/popover.tsx
+var a = i(null);
+function o({ children: t, ...n }) {
+	let i = e(n);
+	return /* @__PURE__ */ r(a.Provider, {
+		value: i,
+		children: t
+	});
+}
+function s({ children: e }) {
+	return n(), /* @__PURE__ */ r(a.Consumer, { children: (n) => {
+		if (!n) throw Error("PopoverTrigger must be used inside <Popover>");
+		let { triggerRef: i, toggle: a, anchorName: o, isOpen: s } = n;
+		return /* @__PURE__ */ r("button", {
+			ref: i,
+			type: "button",
+			"aria-expanded": s.value,
+			"aria-haspopup": "dialog",
+			style: { anchorName: o },
+			onClick: a,
+			className: t.trigger,
+			children: e
+		});
+	} });
+}
+function c({ children: e, className: i }) {
+	return n(), /* @__PURE__ */ r(a.Consumer, { children: (n) => {
+		if (!n) throw Error("PopoverContent must be used inside <Popover>");
+		let { popoverRef: a, anchorName: o, isOpen: s } = n;
+		return /* @__PURE__ */ r("div", {
+			ref: a,
+			popover: "auto",
+			role: "dialog",
+			"data-state": s.value ? "open" : "closed",
+			style: { positionAnchor: o },
+			className: [t.content, i].filter(Boolean).join(" "),
+			children: e
+		});
+	} });
+}
+//#endregion
+export { o as Popover, c as PopoverContent, s as PopoverTrigger };

package/dist/popover/popover.module.js

@@ -0,0 +1,9 @@
+"use client";
+
+import './popover.css';
+var e = {
+	trigger: "_trigger_208tz_2",
+	content: "_content_208tz_6"
+};
+//#endregion
+export { e as default };