@cascivo/react 0.9.0 → 0.10.0

package/dist/node/storage/src/drivers.js

@@ -0,0 +1,36 @@
+"use client";
+
+//#region ../storage/src/drivers.ts
+function e() {
+	let e = /* @__PURE__ */ new Map();
+	return {
+		get: (t) => e.get(t) ?? null,
+		set: (t, n) => {
+			e.set(t, n);
+		},
+		remove: (t) => {
+			e.delete(t);
+		}
+	};
+}
+function t() {
+	return typeof window > "u" ? e() : {
+		get: (e) => window.localStorage.getItem(e),
+		set: (e, t) => {
+			try {
+				window.localStorage.setItem(e, t);
+			} catch {}
+		},
+		remove: (e) => {
+			window.localStorage.removeItem(e);
+		},
+		subscribe(e, t) {
+			let n = (n) => {
+				n.storageArea === window.localStorage && n.key === e && t(n.newValue);
+			};
+			return window.addEventListener("storage", n), () => window.removeEventListener("storage", n);
+		}
+	};
+}
+//#endregion
+export { t as localStorageDriver };

package/dist/node/storage/src/persisted-signal.js

@@ -0,0 +1,43 @@
+"use client";
+
+import { localStorageDriver as e } from "./drivers.js";
+import { effect as t, signal as n } from "@cascivo/core";
+//#region ../storage/src/persisted-signal.ts
+function r(r, i, a = {}) {
+	let o = a.driver ?? e(), s = a.version ?? 1, c = n(i), l = n(!1), u = !1;
+	function d(e) {
+		if (e !== null) try {
+			let t = JSON.parse(e);
+			if (typeof t != "object" || !t || typeof t.v != "number") return;
+			if (t.v !== s) {
+				if (!a.migrate) return;
+				let e = a.migrate(t.value, t.v);
+				return o.set(r, JSON.stringify({
+					v: s,
+					value: e
+				})), e;
+			}
+			return t.value;
+		} catch {
+			return;
+		}
+	}
+	function f(e) {
+		let t = d(e);
+		t !== void 0 && (u = !0, c.value = t, u = !1);
+	}
+	let p = o.get(r);
+	p instanceof Promise ? p.then((e) => {
+		f(e), l.value = !0;
+	}) : (f(p), l.value = !0), t(() => {
+		let e = c.value;
+		!l.value || u || o.set(r, JSON.stringify({
+			v: s,
+			value: e
+		}));
+	}), o.subscribe?.(r, f);
+	let m = c;
+	return m.ready = l, m;
+}
+//#endregion
+export { r as persistedSignal };

package/dist/node/structured-list/structured-list.js

@@ -0,0 +1,101 @@
+"use client";
+
+import e from "./structured-list.module.js";
+import { cn as t, useControllableSignal as n, useRovingFocus as r, useSignals as i } from "@cascivo/core";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { useId as s } from "react";
+//#region ../components/src/structured-list/structured-list.tsx
+function c(n) {
+	let { items: r, headers: i, selectable: s = !1, className: c, "aria-label": u } = n;
+	return s ? /* @__PURE__ */ a(l, { ...n }) : /* @__PURE__ */ o("div", {
+		role: "table",
+		"aria-label": u,
+		className: t(e.list, c),
+		children: [i && /* @__PURE__ */ a("div", {
+			role: "row",
+			className: e.headerRow,
+			children: i.map((t, n) => /* @__PURE__ */ a("div", {
+				role: "columnheader",
+				className: e.headerCell,
+				children: t
+			}, n))
+		}), /* @__PURE__ */ a("div", {
+			role: "rowgroup",
+			className: e.body,
+			children: r.map((t) => /* @__PURE__ */ a("div", {
+				role: "row",
+				className: e.row,
+				children: t.cells.map((t, n) => /* @__PURE__ */ a("div", {
+					role: "cell",
+					className: e.cell,
+					children: t
+				}, n))
+			}, t.id))
+		})]
+	});
+}
+function l({ items: c, headers: l, value: u, defaultValue: d, onSelect: f, className: p, "aria-label": m }) {
+	i();
+	let h = s(), [g, _] = n({
+		value: u,
+		defaultValue: d ?? c.find((e) => e.selected)?.id ?? "",
+		onChange: f
+	}), v = r({
+		orientation: "vertical",
+		loop: !1
+	}), y = (e) => {
+		_(e);
+	};
+	return /* @__PURE__ */ o("div", {
+		role: "radiogroup",
+		"aria-label": m,
+		className: t(e.list, e.selectable, p),
+		children: [l && /* @__PURE__ */ o("div", {
+			className: e.headerRow,
+			children: [/* @__PURE__ */ a("div", {
+				className: e.headerCell,
+				"aria-hidden": "true"
+			}), l.map((t, n) => /* @__PURE__ */ a("div", {
+				className: e.headerCell,
+				children: t
+			}, n))]
+		}), /* @__PURE__ */ a("div", {
+			className: e.body,
+			children: c.map((t, n) => {
+				let r = g.value === t.id, { ref: i, ...s } = v.getItemProps(n);
+				return /* @__PURE__ */ o("div", {
+					role: "radio",
+					"aria-checked": r,
+					"aria-labelledby": `${h}-${t.id}-label`,
+					"data-selected": r || void 0,
+					className: e.row,
+					ref: i,
+					...s,
+					onClick: () => y(t.id),
+					onKeyDown: (e) => {
+						s.onKeyDown(e), (e.key === "Enter" || e.key === " ") && (e.preventDefault(), y(t.id));
+					},
+					children: [
+						/* @__PURE__ */ a("div", {
+							className: e.cell,
+							"aria-hidden": "true",
+							children: /* @__PURE__ */ a("span", { className: e.indicator })
+						}),
+						/* @__PURE__ */ a("div", {
+							className: e.cell,
+							id: `${h}-${t.id}-label`,
+							children: t.cells[0]
+						}),
+						t.cells.slice(1).map((t, n) => /* @__PURE__ */ a("div", {
+							role: "cell",
+							className: e.cell,
+							children: t
+						}, n))
+					]
+				}, t.id);
+			})
+		})]
+	});
+}
+//#endregion
+export { c as StructuredList };

package/dist/node/structured-list/structured-list.module.js

@@ -0,0 +1,14 @@
+"use client";
+
+var e = {
+	list: "_list_t5qxi_2",
+	headerRow: "_headerRow_t5qxi_12",
+	headerCell: "_headerCell_t5qxi_19",
+	body: "_body_t5qxi_28",
+	row: "_row_t5qxi_33",
+	cell: "_cell_t5qxi_44",
+	selectable: "_selectable_t5qxi_52",
+	indicator: "_indicator_t5qxi_77"
+};
+//#endregion
+export { e as default };

package/dist/node/swap/swap.js

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

package/dist/node/swap/swap.module.js

@@ -0,0 +1,9 @@
+"use client";
+
+var e = {
+	swap: "_swap_77yf0_2",
+	on: "_on_77yf0_19",
+	off: "_off_77yf0_20"
+};
+//#endregion
+export { e as default };

package/dist/node/swipe-item/swipe-item.js

@@ -0,0 +1,62 @@
+"use client";
+
+import e from "./swipe-item.module.js";
+import { cn as t, useDraggable as n, useSignal as r, useSignals as i } from "@cascivo/core";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region ../components/src/swipe-item/swipe-item.tsx
+var s = 72, c = 100;
+function l({ children: l, leadingActions: u = [], trailingActions: d = [], className: f }) {
+	i();
+	let p = r(0), m = r("closed"), h = u.length * s, g = d.length * s, { handleRef: _, offset: v, velocity: y, isDragging: b, reset: x } = n({
+		axis: "x",
+		onDragEnd: (e) => {
+			let t = y.value.x, n = p.value + e.x;
+			x();
+			let r = n + t * c, i = 0;
+			h > 0 && r > h / 2 ? i = h : g > 0 && r < -g / 2 && (i = -g), p.value = i, m.value = i > 0 ? "leading" : i < 0 ? "trailing" : "closed";
+		}
+	}), S = (e) => {
+		p.value = e === "leading" ? h : -g, m.value = e;
+	}, C = () => {
+		p.value = 0, m.value = "closed", x();
+	}, w = (e) => {
+		e.onSelect(), C();
+	}, T = Math.max(-g, Math.min(h, p.value + v.value.x)), E = (n, r) => /* @__PURE__ */ a("div", {
+		className: t(e.panel, e[n]),
+		children: r.map((t, r) => /* @__PURE__ */ o("button", {
+			type: "button",
+			"data-destructive": t.destructive ? "" : void 0,
+			className: e.action,
+			onFocus: () => S(n),
+			onClick: () => w(t),
+			children: [t.icon && /* @__PURE__ */ a("span", {
+				className: e.actionIcon,
+				"aria-hidden": "true",
+				children: t.icon
+			}), /* @__PURE__ */ a("span", {
+				className: e.actionLabel,
+				children: t.label
+			})]
+		}, t.id ?? `${r}-${t.label}`))
+	});
+	return /* @__PURE__ */ o("div", {
+		className: t(e.root, f),
+		"data-state": m.value,
+		onKeyDown: (e) => {
+			e.key === "Escape" && m.value !== "closed" && C();
+		},
+		children: [
+			u.length > 0 && E("leading", u),
+			d.length > 0 && E("trailing", d),
+			/* @__PURE__ */ a("div", {
+				ref: _,
+				className: e.content,
+				"data-dragging": b.value ? "" : void 0,
+				style: { transform: `translateX(${T}px)` },
+				children: l
+			})
+		]
+	});
+}
+//#endregion
+export { l as SwipeItem };

package/dist/node/swipe-item/swipe-item.module.js

@@ -0,0 +1,14 @@
+"use client";
+
+var e = {
+	root: "_root_3ykmd_2",
+	panel: "_panel_3ykmd_8",
+	leading: "_leading_3ykmd_14",
+	trailing: "_trailing_3ykmd_18",
+	content: "_content_3ykmd_22",
+	action: "_action_3ykmd_37",
+	actionIcon: "_actionIcon_3ykmd_64",
+	actionLabel: "_actionLabel_3ykmd_70"
+};
+//#endregion
+export { e as default };

package/dist/node/switcher/switcher.js

@@ -0,0 +1,32 @@
+"use client";
+
+import e from "./switcher.module.js";
+import { cn as t, getLinkComponent 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";
+//#region ../components/src/switcher/switcher.tsx
+function c({ items: c, label: l, className: u }) {
+	r();
+	let d = n();
+	return /* @__PURE__ */ o("ul", {
+		"aria-label": l ?? a(i.switcher.label),
+		className: t(e.switcher, u),
+		children: c.map((t, n) => "divider" in t ? /* @__PURE__ */ o("li", { children: /* @__PURE__ */ o("span", {
+			role: "separator",
+			"aria-orientation": "horizontal",
+			className: e.divider
+		}) }, `divider-${n}`) : /* @__PURE__ */ o("li", { children: /* @__PURE__ */ s(d, {
+			href: t.href,
+			"aria-current": t.active ? "page" : void 0,
+			"data-state": t.active ? "active" : void 0,
+			className: e.item,
+			children: [t.icon && /* @__PURE__ */ o("span", {
+				className: e.icon,
+				"aria-hidden": "true",
+				children: t.icon
+			}), t.label]
+		}) }, t.href))
+	});
+}
+//#endregion
+export { c as Switcher };

package/dist/node/switcher/switcher.module.js

@@ -0,0 +1,10 @@
+"use client";
+
+var e = {
+	switcher: "_switcher_13sqi_2",
+	item: "_item_13sqi_11",
+	icon: "_icon_13sqi_43",
+	divider: "_divider_13sqi_50"
+};
+//#endregion
+export { e as default };

package/dist/node/tabs/tabs.js

@@ -0,0 +1,95 @@
+"use client";
+
+import e from "./tabs.module.js";
+import { cn as t, useSignal as n, useSignals as r } from "@cascivo/core";
+import { jsx as i } from "react/jsx-runtime";
+import { createContext as a, useId as o, useRef as s } from "react";
+//#region ../components/src/tabs/tabs.tsx
+var c = a(null);
+function l({ defaultValue: r, value: a, onValueChange: s, className: l, children: u }) {
+	let d = o(), f = n(a ?? r ?? "");
+	a !== void 0 && (f.value = a);
+	let p = {
+		active: f,
+		baseId: d,
+		setValue: (e) => {
+			a === void 0 && (f.value = e), s?.(e);
+		}
+	};
+	return /* @__PURE__ */ i(c.Provider, {
+		value: p,
+		children: /* @__PURE__ */ i("div", {
+			className: t(e.tabs, l),
+			children: u
+		})
+	});
+}
+function u({ className: n, children: r, ...a }) {
+	let o = s(null);
+	return /* @__PURE__ */ i(c.Consumer, { children: (s) => /* @__PURE__ */ i("div", {
+		ref: o,
+		role: "tablist",
+		className: t(e.list, n),
+		onKeyDown: (e) => {
+			if (!s || ![
+				"ArrowRight",
+				"ArrowLeft",
+				"Home",
+				"End"
+			].includes(e.key)) return;
+			let t = Array.from(o.current?.querySelectorAll("[role=\"tab\"]:not([disabled])") ?? []);
+			if (t.length === 0) return;
+			e.preventDefault();
+			let n = t.findIndex((e) => e.dataset.value === s.active.value), r = n;
+			e.key === "ArrowRight" ? r = (n + 1) % t.length : e.key === "ArrowLeft" ? r = (n - 1 + t.length) % t.length : e.key === "Home" ? r = 0 : e.key === "End" && (r = t.length - 1);
+			let i = t[r];
+			i?.focus(), i?.dataset.value && s.setValue(i.dataset.value);
+		},
+		...a,
+		children: r
+	}) });
+}
+function d(e) {
+	return /* @__PURE__ */ i(c.Consumer, { children: (t) => t ? /* @__PURE__ */ i(f, {
+		store: t,
+		...e
+	}) : null });
+}
+function f({ store: n, value: a, className: o, children: s, disabled: c, ...l }) {
+	r();
+	let u = n.active.value === a;
+	return /* @__PURE__ */ i("button", {
+		type: "button",
+		role: "tab",
+		id: `${n.baseId}-trigger-${a}`,
+		"aria-selected": u,
+		"aria-controls": `${n.baseId}-content-${a}`,
+		tabIndex: u ? 0 : -1,
+		"data-state": u ? "active" : "inactive",
+		"data-value": a,
+		disabled: c,
+		className: t(e.trigger, o),
+		onClick: () => n.setValue(a),
+		...l,
+		children: s
+	});
+}
+function p(e) {
+	return /* @__PURE__ */ i(c.Consumer, { children: (t) => t ? /* @__PURE__ */ i(m, {
+		store: t,
+		...e
+	}) : null });
+}
+function m({ store: n, value: a, className: o, children: s, ...c }) {
+	return r(), n.active.value === a ? /* @__PURE__ */ i("div", {
+		role: "tabpanel",
+		id: `${n.baseId}-content-${a}`,
+		"aria-labelledby": `${n.baseId}-trigger-${a}`,
+		tabIndex: 0,
+		className: t(e.content, o),
+		...c,
+		children: s
+	}) : null;
+}
+//#endregion
+export { l as Tabs, p as TabsContent, u as TabsList, d as TabsTrigger };

package/dist/node/tabs/tabs.module.js

@@ -0,0 +1,10 @@
+"use client";
+
+var e = {
+	tabs: "_tabs_1i48y_2",
+	list: "_list_1i48y_8",
+	trigger: "_trigger_1i48y_20",
+	content: "_content_1i48y_68"
+};
+//#endregion
+export { e as default };

package/dist/node/tag/tag.js

@@ -0,0 +1,26 @@
+"use client";
+
+import e from "./tag.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/tag/tag.tsx
+function s({ variant: s = "default", size: c = "md", onDismiss: l, dismissLabel: u, className: d, children: f, ...p }) {
+	n();
+	let m = u ?? i(r.tag.dismiss);
+	return /* @__PURE__ */ o("span", {
+		"data-variant": s,
+		"data-size": c,
+		className: t(e.tag, d),
+		...p,
+		children: [f, l && /* @__PURE__ */ a("button", {
+			type: "button",
+			className: e.dismiss,
+			"aria-label": m,
+			onClick: l,
+			children: "✕"
+		})]
+	});
+}
+//#endregion
+export { s as Tag };

package/dist/node/tag/tag.module.js

@@ -0,0 +1,8 @@
+"use client";
+
+var e = {
+	tag: "_tag_onneh_2",
+	dismiss: "_dismiss_onneh_51"
+};
+//#endregion
+export { e as default };

package/dist/node/tags-input/tags-input.js

@@ -0,0 +1,64 @@
+"use client";
+
+import e from "./tags-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 { useRef as c } from "react";
+//#region ../components/src/tags-input/tags-input.tsx
+function l({ value: l, onValueChange: u, placeholder: d, validate: f, max: p, disabled: m = !1, className: h, ...g }) {
+	r();
+	let _ = n(""), v = c(null);
+	function y(e) {
+		let t = e.trim();
+		t && (p !== void 0 && l.length >= p || l.includes(t) || f && !f(t) || (u([...l, t]), _.value = ""));
+	}
+	function b(e) {
+		u(l.filter((t, n) => n !== e));
+	}
+	let x = d ?? a(i.tagsInput.placeholder);
+	return /* @__PURE__ */ s("div", {
+		className: t(e.wrapper, h),
+		"data-disabled": m ? "" : void 0,
+		onClick: () => v.current?.focus(),
+		...g,
+		children: [l.map((t, n) => {
+			let r = f ? !f(t) : !1;
+			return /* @__PURE__ */ s("span", {
+				className: e.tag,
+				"data-state": r ? "invalid" : void 0,
+				children: [t, /* @__PURE__ */ o("button", {
+					type: "button",
+					className: e.dismiss,
+					"aria-label": a(i.tagsInput.remove, { tag: t }),
+					disabled: m,
+					onClick: (e) => {
+						e.stopPropagation(), b(n);
+					},
+					children: /* @__PURE__ */ o("span", {
+						"aria-hidden": "true",
+						children: "×"
+					})
+				})]
+			}, n);
+		}), /* @__PURE__ */ o("input", {
+			ref: v,
+			className: e.input,
+			value: _.value,
+			"aria-label": a(i.tagsInput.label),
+			placeholder: l.length === 0 ? x : void 0,
+			disabled: m,
+			onChange: (e) => {
+				_.value = e.currentTarget.value;
+			},
+			onKeyDown: (e) => {
+				e.key === "Enter" || e.key === "," ? (e.preventDefault(), y(_.value)) : e.key === "Backspace" && !_.value && b(l.length - 1);
+			},
+			onBlur: () => {
+				_.value && y(_.value);
+			}
+		})]
+	});
+}
+//#endregion
+export { l as TagsInput };

package/dist/node/tags-input/tags-input.module.js

@@ -0,0 +1,10 @@
+"use client";
+
+var e = {
+	wrapper: "_wrapper_i1hay_2",
+	tag: "_tag_i1hay_28",
+	dismiss: "_dismiss_i1hay_55",
+	input: "_input_i1hay_85"
+};
+//#endregion
+export { e as default };

package/dist/node/text/text.js

@@ -0,0 +1,18 @@
+"use client";
+
+import e from "./text.module.js";
+import { cn as t } from "@cascivo/core";
+import { jsx as n } from "react/jsx-runtime";
+//#region ../components/src/text/text.tsx
+function r({ as: r = "p", size: i = "md", weight: a = "normal", muted: o = !1, className: s, children: c, ...l }) {
+	return /* @__PURE__ */ n(r, {
+		"data-size": i,
+		"data-weight": a,
+		"data-muted": o ? "" : void 0,
+		className: t(e.text, s),
+		...l,
+		children: c
+	});
+}
+//#endregion
+export { r as Text };

package/dist/node/text/text.module.js

@@ -0,0 +1,5 @@
+"use client";
+
+var e = { text: "_text_18h86_2" };
+//#endregion
+export { e as default };

package/dist/node/textarea/textarea.js

@@ -0,0 +1,56 @@
+"use client";
+
+import e from "./textarea.module.js";
+import { cn as t, createMachine as n, useMachine as r } from "@cascivo/core";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region ../components/src/textarea/textarea.tsx
+var o = n({
+	initial: "idle",
+	states: {
+		idle: { on: { FOCUS: "focused" } },
+		focused: { on: { BLUR: "idle" } }
+	}
+});
+function s({ label: n, hint: s, error: c, resize: l = "vertical", rows: u = 4, className: d, id: f, onFocus: p, onBlur: m, ...h }) {
+	let [g, _] = r(o), v = f ?? (n ? `cascade-textarea-${n.toLowerCase().replace(/\s+/g, "-")}` : void 0);
+	return /* @__PURE__ */ a("div", {
+		className: t(e.wrapper, d),
+		"data-state": c ? "error" : g.value,
+		"data-resize": l,
+		children: [
+			n && /* @__PURE__ */ i("label", {
+				className: e.label,
+				htmlFor: v,
+				children: n
+			}),
+			/* @__PURE__ */ i("textarea", {
+				id: v,
+				rows: u,
+				"aria-multiline": "true",
+				className: e.textarea,
+				"aria-invalid": c ? !0 : void 0,
+				"aria-describedby": c ? `${v}-error` : s ? `${v}-hint` : void 0,
+				onFocus: (e) => {
+					_("FOCUS"), p?.(e);
+				},
+				onBlur: (e) => {
+					_("BLUR"), m?.(e);
+				},
+				...h
+			}),
+			c && /* @__PURE__ */ i("span", {
+				id: `${v}-error`,
+				className: e.error,
+				role: "alert",
+				children: c
+			}),
+			!c && s && /* @__PURE__ */ i("span", {
+				id: `${v}-hint`,
+				className: e.hint,
+				children: s
+			})
+		]
+	});
+}
+//#endregion
+export { s as Textarea };

package/dist/node/textarea/textarea.module.js

@@ -0,0 +1,11 @@
+"use client";
+
+var e = {
+	wrapper: "_wrapper_xbrwe_2",
+	textarea: "_textarea_xbrwe_7",
+	label: "_label_xbrwe_18",
+	error: "_error_xbrwe_71",
+	hint: "_hint_xbrwe_78"
+};
+//#endregion
+export { e as default };