@cascivo/react 0.14.0 → 0.16.1

package/dist/reorder-list/reorder-list.js

@@ -0,0 +1,143 @@
+"use client";
+
+import e from "./reorder-list.module.js";
+import { useRef as t } from "react";
+import { cn as n, useSignal as r, useSignalEffect 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/reorder-list/reorder-list.tsx
+function u(e) {
+	return e.name ?? (typeof e.label == "string" ? e.label : e.id);
+}
+function d(e, t, n) {
+	let r = e.slice(), [i] = r.splice(t, 1);
+	return i && r.splice(n, 0, i), r;
+}
+function f({ value: f, onValueChange: p, disabled: m = !1, labels: h, className: g }) {
+	a();
+	let _ = t(null), v = r(null), y = r(""), b = t(f);
+	b.current = f;
+	let x = t(p);
+	x.current = p;
+	let S = t(m);
+	S.current = m;
+	let C = t(null), w = (e, t, n) => {
+		y.value = e ? e.replace("{name}", n.name).replace("{position}", String(n.position)).replace("{total}", String(n.total)) : t;
+	}, T = (e, t) => {
+		let n = b.current, r = Math.max(0, Math.min(n.length - 1, t));
+		if (r === e) return;
+		let i = n[e];
+		if (!i) return;
+		x.current(d(n, e, r)), v.value = r;
+		let a = {
+			name: u(i),
+			position: r + 1,
+			total: n.length
+		};
+		w(h?.moved, s(o.reorderList.moved, a), a);
+	}, E = (e) => {
+		let t = b.current, n = t[e];
+		if (!n) return;
+		C.current = t, v.value = e;
+		let r = {
+			name: u(n),
+			position: e + 1,
+			total: t.length
+		};
+		w(h?.grabbed, s(o.reorderList.grabbed, r), r);
+	}, D = () => {
+		let e = v.value;
+		if (e === null) return;
+		let t = b.current, n = t[e];
+		if (C.current = null, v.value = null, !n) return;
+		let r = {
+			name: u(n),
+			position: e + 1,
+			total: t.length
+		};
+		w(h?.dropped, s(o.reorderList.dropped, r), r);
+	}, O = () => {
+		let e = C.current, t = v.value;
+		if (C.current = null, v.value = null, !e) return;
+		x.current(e);
+		let n = t === null ? void 0 : e[t], r = {
+			name: n ? u(n) : "",
+			position: (t ?? 0) + 1,
+			total: e.length
+		};
+		w(h?.cancelled, s(o.reorderList.cancelled, r), r);
+	}, k = (e, t) => {
+		if (m) return;
+		let n = v.value;
+		if (e.key === " " || e.key === "Enter") {
+			e.preventDefault(), n === t ? D() : E(t);
+			return;
+		}
+		if (e.key === "Escape" && n !== null) {
+			e.preventDefault(), O();
+			return;
+		}
+		n === t && (e.key === "ArrowUp" ? (e.preventDefault(), T(t, t - 1)) : e.key === "ArrowDown" && (e.preventDefault(), T(t, t + 1)));
+	};
+	return i(() => {
+		let e = _.current;
+		if (!e || typeof window > "u") return;
+		let t = (t) => {
+			let n = v.value;
+			if (n === null || S.current) return;
+			let r = [...e.querySelectorAll("[data-reorder-row]")].findIndex((e) => {
+				let n = e.getBoundingClientRect();
+				return t.clientY >= n.top && t.clientY <= n.bottom;
+			});
+			r !== -1 && r !== n && T(n, r);
+		}, n = () => {
+			v.value !== null && C.current && D();
+		};
+		return window.addEventListener("pointermove", t), window.addEventListener("pointerup", n), window.addEventListener("pointercancel", n), () => {
+			window.removeEventListener("pointermove", t), window.removeEventListener("pointerup", n), window.removeEventListener("pointercancel", n);
+		};
+	}), /* @__PURE__ */ l("div", {
+		className: n(e.root, g),
+		children: [/* @__PURE__ */ c("ul", {
+			ref: _,
+			className: e.list,
+			children: f.map((t, n) => /* @__PURE__ */ l("li", {
+				"data-reorder-row": "",
+				"data-active": v.value === n ? "" : void 0,
+				className: e.row,
+				children: [/* @__PURE__ */ c("button", {
+					type: "button",
+					disabled: m,
+					"aria-label": h?.handle ? h.handle.replace("{name}", u(t)) : s(o.reorderList.handle, { name: u(t) }),
+					"aria-pressed": v.value === n,
+					className: e.handle,
+					onKeyDown: (e) => k(e, n),
+					onPointerDown: () => {
+						m || E(n);
+					},
+					children: /* @__PURE__ */ c("svg", {
+						"aria-hidden": "true",
+						viewBox: "0 0 16 16",
+						className: e.grip,
+						children: /* @__PURE__ */ c("path", {
+							d: "M6 4h.01M10 4h.01M6 8h.01M10 8h.01M6 12h.01M10 12h.01",
+							stroke: "currentColor",
+							strokeWidth: "2",
+							strokeLinecap: "round"
+						})
+					})
+				}), /* @__PURE__ */ c("span", {
+					className: e.label,
+					children: t.label
+				})]
+			}, t.id))
+		}), /* @__PURE__ */ c("span", {
+			role: "status",
+			"aria-live": "polite",
+			className: e.srOnly,
+			children: y.value
+		})]
+	});
+}
+//#endregion
+export { f as ReorderList };

package/dist/reorder-list/reorder-list.module.js

@@ -0,0 +1,12 @@
+import './reorder-list.css';
+var e = {
+	root: "_root_1tie9_4",
+	list: "_list_1tie9_8",
+	row: "_row_1tie9_16",
+	handle: "_handle_1tie9_34",
+	grip: "_grip_1tie9_69",
+	label: "_label_1tie9_74",
+	srOnly: "_srOnly_1tie9_79"
+};
+//#endregion
+export { e as default };

package/dist/resizable/resizable.js

@@ -1,8 +1,8 @@
 "use client";
 
 import e from "./resizable.module.js";
-import { cn as t, useControllableSignal as n, useSignal as r, useSignalEffect as i, useSignals as a } from "@cascivo/core";
-import { Children as o, useRef as s } from "react";
+import { Children as t, useRef as n } from "react";
+import { cn as r, useControllableSignal as i, useSignal as a, useSignalEffect as o, useSignals as s } from "@cascivo/core";
 import { builtin as c, t as l } from "@cascivo/i18n";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region ../components/src/resizable/resizable.tsx
@@ -10,12 +10,12 @@ function f(e, t, n) {
 	return Math.min(n, Math.max(t, e));
 }
 function p({ children: p, orientation: m = "horizontal", defaultRatio: h = .5, ratio: g, minRatio: _ = .1, maxRatio: v = .9, onRatioChange: y, className: b, label: x }) {
-	a();
-	let [S, C] = o.toArray(p), [w, T] = n({
+	s();
+	let [S, C] = t.toArray(p), [w, T] = i({
 		value: g,
 		defaultValue: h,
 		onChange: y
-	}), E = s(null), D = r(!1), O = (e) => {
+	}), E = n(null), D = a(!1), O = (e) => {
 		T(f(e, _, v));
 	}, k = (e, t) => {
 		let n = E.current;
@@ -23,7 +23,7 @@ function p({ children: p, orientation: m = "horizontal", defaultRatio: h = .5, r
 		let r = n.getBoundingClientRect();
 		return m === "horizontal" ? (e - r.left) / r.width : (t - r.top) / r.height;
 	};
-	i(() => {
+	o(() => {
 		if (!D.value) return;
 		let e = (e) => O(k(e.clientX, e.clientY)), t = () => {
 			D.value = !1;
@@ -43,7 +43,7 @@ function p({ children: p, orientation: m = "horizontal", defaultRatio: h = .5, r
 	}, j = x ?? l(c.resizable.handle), M = Math.round(w.value * 100);
 	return /* @__PURE__ */ d("div", {
 		ref: E,
-		className: t(e.resizable, b),
+		className: r(e.resizable, b),
 		"data-orientation": m,
 		style: { "--cascivo-resizable-ratio": w.value },
 		children: [

package/dist/resizable/resizable.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './resizable.css';
 var e = {
 	resizable: "_resizable_1agxs_2",

package/dist/scroll-area/scroll-area.js

@@ -1,14 +1,14 @@
 "use client";
 
 import e from "./scroll-area.module.js";
-import { cn as t, useSignalEffect as n, useSignals as r } from "@cascivo/core";
-import { useRef as i } from "react";
+import { useRef as t } from "react";
+import { cn as n, useSignalEffect as r, useSignals as i } from "@cascivo/core";
 import { jsx as a } from "react/jsx-runtime";
 //#region ../components/src/scroll-area/scroll-area.tsx
 function o({ height: o, width: s, orientation: c = "vertical", edges: l = "shadow", className: u, style: d, children: f, ...p }) {
-	r();
-	let m = i(null);
-	n(() => {
+	i();
+	let m = t(null);
+	r(() => {
 		let e = m.current;
 		if (!e) return;
 		let t = () => {
@@ -28,7 +28,7 @@ function o({ height: o, width: s, orientation: c = "vertical", edges: l = "shado
 		ref: m,
 		"data-orientation": c,
 		"data-edges": l,
-		className: t(e.root, u),
+		className: n(e.root, u),
 		style: h,
 		...p,
 		children: f

package/dist/scroll-area/scroll-area.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './scroll-area.css';
 var e = { root: "_root_v07bg_2" };
 //#endregion

package/dist/search/search.js

@@ -1,8 +1,8 @@
 "use client";
 
 import e from "./search.module.js";
-import { cn as t, focusElement as n, useId as r, useSignal as i, useSignalEffect as a, useSignals as o } from "@cascivo/core";
-import { useRef as s } from "react";
+import { useRef as t } from "react";
+import { cn as n, focusElement as r, useId as i, useSignal as a, useSignalEffect as o, useSignals as s } from "@cascivo/core";
 import { builtin as c, t as l } from "@cascivo/i18n";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region ../components/src/search/search.tsx
@@ -29,15 +29,15 @@ function f() {
 	});
 }
 function p({ value: p, defaultValue: m = "", onValueChange: h, onChange: g, onSearch: _, debounceMs: v = 300, placeholder: y, size: b = "md", label: x, disabled: S = !1, clearLabel: C, id: w, className: T }) {
-	o();
-	let E = y ?? l(c.search.placeholder), D = x ?? l(c.search.label), O = C ?? l(c.search.clear), k = s(null), A = r("cascade-search"), j = w ?? A, M = p !== void 0, N = i(M ? p : m);
+	s();
+	let E = y ?? l(c.search.placeholder), D = x ?? l(c.search.label), O = C ?? l(c.search.clear), k = t(null), A = i("cascade-search"), j = w ?? A, M = p !== void 0, N = a(M ? p : m);
 	M && (N.value = p);
-	let P = s(_);
+	let P = t(_);
 	P.current = _;
-	let F = s(null), I = () => {
+	let F = t(null), I = () => {
 		F.current !== null && (clearTimeout(F.current), F.current = null);
 	};
-	a(() => I);
+	o(() => I);
 	let L = (e) => {
 		let t = e.target.value;
 		M || (N.value = t), (h ?? g)?.(t), I(), F.current = setTimeout(() => {
@@ -46,10 +46,10 @@ function p({ value: p, defaultValue: m = "", onValueChange: h, onChange: g, onSe
 	}, R = (e) => {
 		e.key === "Enter" && (I(), _?.(N.value));
 	}, z = () => {
-		I(), M || (N.value = ""), (h ?? g)?.(""), _?.(""), n(k.current);
+		I(), M || (N.value = ""), (h ?? g)?.(""), _?.(""), r(k.current);
 	}, B = N.value !== "";
 	return /* @__PURE__ */ d("div", {
-		className: t(e.root, T),
+		className: n(e.root, T),
 		"data-size": b,
 		"data-state": B ? "filled" : "empty",
 		children: [

package/dist/search/search.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './search.css';
 var e = {
 	root: "_root_1ppci_2",

package/dist/segmented-control/segmented-control.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './segmented-control.css';
 var e = {
 	wrapper: "_wrapper_196gt_2",

package/dist/select/select.js

@@ -1,27 +1,27 @@
 "use client";
 
 import e from "./select.module.js";
-import { cn as t, createMachine as n, useMachine as r } from "@cascivo/core";
-import { forwardRef as i } from "react";
+import { forwardRef as t } from "react";
+import { cn as n, createMachine as r, useMachine as i } from "@cascivo/core";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region ../components/src/select/select.tsx
-var s = n({
+var s = r({
 	initial: "idle",
 	states: {
 		idle: { on: { FOCUS: "focused" } },
 		focused: { on: { BLUR: "idle" } }
 	}
-}), c = i(function({ label: n, hint: i, error: c, placeholder: l, options: u, size: d = "md", className: f, id: p, defaultValue: m, value: h, onFocus: g, onBlur: _, ...v }, y) {
-	let [b, x] = r(s), S = p ?? (n ? `cascade-select-${n.toLowerCase().replace(/\s+/g, "-")}` : void 0), C = h !== void 0, w = l !== void 0;
+}), c = t(function({ label: t, hint: r, error: c, placeholder: l, options: u, size: d = "md", className: f, id: p, defaultValue: m, value: h, onFocus: g, onBlur: _, ...v }, y) {
+	let [b, x] = i(s), S = p ?? (t ? `cascade-select-${t.toLowerCase().replace(/\s+/g, "-")}` : void 0), C = h !== void 0, w = l !== void 0;
 	return /* @__PURE__ */ o("div", {
-		className: t(e.wrapper, f),
+		className: n(e.wrapper, f),
 		"data-state": c ? "error" : b.value,
 		"data-size": d,
 		children: [
-			n && /* @__PURE__ */ a("label", {
+			t && /* @__PURE__ */ a("label", {
 				className: e.label,
 				htmlFor: S,
-				children: n
+				children: t
 			}),
 			/* @__PURE__ */ o("div", {
 				className: e.field,
@@ -29,7 +29,7 @@ var s = n({
 					id: S,
 					className: e.select,
 					"aria-invalid": c ? !0 : void 0,
-					"aria-describedby": c ? `${S}-error` : i ? `${S}-hint` : void 0,
+					"aria-describedby": c ? `${S}-error` : r ? `${S}-hint` : void 0,
 					value: h,
 					defaultValue: !C && w ? m ?? "" : m,
 					onFocus: (e) => {
@@ -60,10 +60,10 @@ var s = n({
 				role: "alert",
 				children: c
 			}),
-			!c && i && /* @__PURE__ */ a("span", {
+			!c && r && /* @__PURE__ */ a("span", {
 				id: `${S}-hint`,
 				className: e.hint,
-				children: i
+				children: r
 			})
 		]
 	});

package/dist/select/select.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './select.css';
 var e = {
 	wrapper: "_wrapper_1b5d9_2",

package/dist/separator/separator.js

@@ -1,7 +1,5 @@
-"use client";
-
 import e from "./separator.module.js";
-import { cn as t } from "@cascivo/core";
+import { cn as t } from "@cascivo/core/pure";
 import { jsx as n } from "react/jsx-runtime";
 //#region ../components/src/separator/separator.tsx
 function r({ orientation: r = "horizontal", decorative: i = !1, className: a, ...o }) {

package/dist/separator/separator.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './separator.css';
 var e = { separator: "_separator_fgwc8_2" };
 //#endregion

package/dist/sheet/sheet.js

@@ -1,14 +1,14 @@
 "use client";
 
 import e from "./sheet.module.js";
-import { useEffectPropSignal as t, useSignalEffect as n } from "@cascivo/core";
-import { useId as r, useRef as i } from "react";
+import { useId as t, useRef as n } from "react";
+import { useEffectPropSignal as r, useSignalEffect 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";
 //#region ../components/src/sheet/sheet.tsx
 function l({ open: l, onClose: u, title: d, children: f, side: p = "end" }) {
-	let m = i(null), h = r(), g = t(l), _ = i(u);
-	return _.current = u, n(() => {
+	let m = n(null), h = t(), g = r(l), _ = n(u);
+	return _.current = u, i(() => {
 		let e = m.current;
 		if (e) if (g.value) try {
 			e.showPopover();

package/dist/sheet/sheet.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './sheet.css';
 var e = {
 	sheet: "_sheet_gx7nz_2",

package/dist/shell-header/shell-header.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './shell-header.css';
 var e = {
 	header: "_header_6njjo_2",

package/dist/side-nav/side-nav.js

@@ -3,8 +3,8 @@
 import { Tooltip as e } from "../tooltip/tooltip.js";
 import { usePopover as t } from "../popover/use-popover.js";
 import n from "./side-nav.module.js";
-import { cn as r, focusElement as i, getLinkComponent as a, useSignal as o, useSignals as s } from "@cascivo/core";
-import { Fragment as c, useId as l } from "react";
+import { Fragment as r, useId as i } from "react";
+import { cn as a, focusElement as o, getLinkComponent as s, useSignal as c, useSignals as l } from "@cascivo/core";
 import { builtin as u, t as d } from "@cascivo/i18n";
 import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
 //#region ../components/src/side-nav/side-nav.tsx
@@ -28,8 +28,8 @@ function g() {
 		})
 	});
 }
-function _(e, { inMenu: t, onActivate: i, extraClass: o }) {
-	let s = t ? "menuitem" : void 0, c = r(n.link, n.sublink, o), l = /* @__PURE__ */ m(f, { children: [
+function _(e, { inMenu: t, onActivate: r, extraClass: i }) {
+	let o = t ? "menuitem" : void 0, c = a(n.link, n.sublink, i), l = /* @__PURE__ */ m(f, { children: [
 		e.icon ? /* @__PURE__ */ p("span", {
 			className: n.icon,
 			"aria-hidden": "true",
@@ -43,19 +43,19 @@ function _(e, { inMenu: t, onActivate: i, extraClass: o }) {
 	] });
 	return e.onSelect && !e.href ? /* @__PURE__ */ p("button", {
 		type: "button",
-		role: s,
+		role: o,
 		"aria-current": e.active ? "page" : void 0,
 		"data-state": e.active ? "active" : void 0,
 		"data-selected": e.selected || void 0,
 		disabled: e.disabled,
 		className: c,
 		onClick: () => {
-			e.onSelect?.(), i?.();
+			e.onSelect?.(), r?.();
 		},
 		children: l
-	}) : /* @__PURE__ */ p(a(), {
+	}) : /* @__PURE__ */ p(s(), {
 		href: e.disabled ? void 0 : e.href,
-		role: s,
+		role: o,
 		"aria-current": e.active ? "page" : void 0,
 		"aria-disabled": e.disabled || void 0,
 		tabIndex: e.disabled ? -1 : void 0,
@@ -67,7 +67,7 @@ function _(e, { inMenu: t, onActivate: i, extraClass: o }) {
 				t.preventDefault();
 				return;
 			}
-			e.onSelect?.(), i?.();
+			e.onSelect?.(), r?.();
 		},
 		children: l
 	});
@@ -80,20 +80,20 @@ function v(e) {
 	return [...e][0] ?? "";
 }
 function y({ item: e }) {
-	let { triggerRef: r, popoverRef: a, isOpen: o, anchorName: s, open: l, close: u, toggle: d } = t(), g = "[role=\"menuitem\"]:not([disabled]):not([aria-disabled=\"true\"])";
+	let { triggerRef: i, popoverRef: a, isOpen: s, anchorName: c, open: l, close: u, toggle: d } = t(), g = "[role=\"menuitem\"]:not([disabled]):not([aria-disabled=\"true\"])";
 	return /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("button", {
-		ref: r,
+		ref: i,
 		type: "button",
 		"aria-haspopup": "menu",
-		"aria-expanded": o.value,
+		"aria-expanded": s.value,
 		"aria-label": e.label,
-		"data-state": o.value ? "open" : "closed",
-		style: { anchorName: s },
+		"data-state": s.value ? "open" : "closed",
+		style: { anchorName: c },
 		className: n.groupTrigger,
 		onClick: () => d(),
 		onKeyDown: (e) => {
 			if (e.key === "ArrowDown") {
-				e.preventDefault(), o.value || l();
+				e.preventDefault(), s.value || l();
 				let t = a.current;
 				t && setTimeout(() => {
 					t.querySelector(g)?.focus();
@@ -115,19 +115,19 @@ function y({ item: e }) {
 		popover: "auto",
 		role: "menu",
 		"aria-label": e.label,
-		style: { positionAnchor: s },
+		style: { positionAnchor: c },
 		className: n.railFlyout,
 		onKeyDown: (e) => {
 			let t = a.current;
 			if (!t) return;
-			let n = Array.from(t.querySelectorAll(g)), o = n.indexOf(e.target);
-			e.key === "ArrowDown" ? (e.preventDefault(), n[(o + 1) % n.length]?.focus()) : e.key === "ArrowUp" ? (e.preventDefault(), n[(o - 1 + n.length) % n.length]?.focus()) : e.key === "Escape" && (e.preventDefault(), u(), i(r.current));
+			let n = Array.from(t.querySelectorAll(g)), r = n.indexOf(e.target);
+			e.key === "ArrowDown" ? (e.preventDefault(), n[(r + 1) % n.length]?.focus()) : e.key === "ArrowUp" ? (e.preventDefault(), n[(r - 1 + n.length) % n.length]?.focus()) : e.key === "Escape" && (e.preventDefault(), u(), o(i.current));
 		},
 		children: [/* @__PURE__ */ p("div", {
 			className: n.railFlyoutCaption,
 			"aria-hidden": "true",
 			children: e.label
-		}), e.items.map((e, t) => h(e) ? /* @__PURE__ */ p(c, { children: _(e, {
+		}), e.items.map((e, t) => h(e) ? /* @__PURE__ */ p(r, { children: _(e, {
 			inMenu: !0,
 			onActivate: u,
 			extraClass: n.flyoutItem
@@ -141,22 +141,22 @@ function y({ item: e }) {
 		}, t))]
 	})] });
 }
-function b({ items: t, groups: i, collapsed: c, defaultCollapsed: g = !1, onCollapsedChange: b, ariaLabel: x, collapseLabel: S, expandLabel: C, expandOnHover: w = !1, showCollapseToggle: T = !0, header: E, footer: D, className: O }) {
-	s();
-	let k = x ?? d(u.sideNav.nav), A = S ?? d(u.sideNav.collapse), j = C ?? d(u.sideNav.expand), M = l(), N = o(c ?? g);
-	c !== void 0 && (N.value = c);
-	let P = i ?? (t ? [{ items: t }] : [{ items: [] }]), F = o(P.flatMap((e) => e.items).filter((e) => e.items?.some((e) => h(e) && e.active)).map((e) => e.label)), I = (e) => {
+function b({ items: t, groups: r, collapsed: o, defaultCollapsed: g = !1, onCollapsedChange: b, ariaLabel: x, collapseLabel: S, expandLabel: C, expandOnHover: w = !1, showCollapseToggle: T = !0, header: E, footer: D, className: O }) {
+	l();
+	let k = x ?? d(u.sideNav.nav), A = S ?? d(u.sideNav.collapse), j = C ?? d(u.sideNav.expand), M = i(), N = c(o ?? g);
+	o !== void 0 && (N.value = o);
+	let P = r ?? (t ? [{ items: t }] : [{ items: [] }]), F = c(P.flatMap((e) => e.items).filter((e) => e.items?.some((e) => h(e) && e.active)).map((e) => e.label)), I = (e) => {
 		let t = F.value;
 		F.value = t.includes(e) ? t.filter((t) => t !== e) : [...t, e];
 	}, L = () => {
 		let e = !N.value;
-		c === void 0 && (N.value = e), b?.(e);
+		o === void 0 && (N.value = e), b?.(e);
 	}, R = N.value;
 	return /* @__PURE__ */ m("nav", {
 		"aria-label": k,
 		"data-state": R ? "collapsed" : "expanded",
 		"data-expand-on-hover": R && w ? "" : void 0,
-		className: r(n.sideNav, O),
+		className: a(n.sideNav, O),
 		children: [
 			E && /* @__PURE__ */ p("div", {
 				className: n.header,
@@ -172,10 +172,10 @@ function b({ items: t, groups: i, collapsed: c, defaultCollapsed: g = !1, onColl
 					}), /* @__PURE__ */ p("ul", {
 						className: n.groupItems,
 						children: t.items.map((t, i) => {
-							let o = `${r}-${i}`;
+							let a = `${r}-${i}`;
 							if (t.items) {
-								if (R && !w) return /* @__PURE__ */ p("li", { children: /* @__PURE__ */ p(y, { item: t }) }, t.id ?? o);
-								let e = F.value.includes(t.label), r = `${M}-group-${o}`;
+								if (R && !w) return /* @__PURE__ */ p("li", { children: /* @__PURE__ */ p(y, { item: t }) }, t.id ?? a);
+								let e = F.value.includes(t.label), r = `${M}-group-${a}`;
 								return /* @__PURE__ */ m("li", { children: [/* @__PURE__ */ m("button", {
 									type: "button",
 									"aria-expanded": e,
@@ -230,9 +230,9 @@ function b({ items: t, groups: i, collapsed: c, defaultCollapsed: g = !1, onColl
 											children: e.label
 										}, t))
 									})
-								})] }, t.id ?? o);
+								})] }, t.id ?? a);
 							}
-							let s = /* @__PURE__ */ m(f, { children: [
+							let o = /* @__PURE__ */ m(f, { children: [
 								t.icon ? /* @__PURE__ */ p("span", {
 									className: n.icon,
 									"aria-hidden": "true",
@@ -274,11 +274,11 @@ function b({ items: t, groups: i, collapsed: c, defaultCollapsed: g = !1, onColl
 								className: n.customItem,
 								children: t.render({
 									collapsed: R,
-									children: s,
+									children: o,
 									linkProps: l
 								})
-							}, t.id ?? o);
-							let u = a(), d = t.onClick && !t.href ? /* @__PURE__ */ p("button", {
+							}, t.id ?? a);
+							let u = s(), d = t.onClick && !t.href ? /* @__PURE__ */ p("button", {
 								type: "button",
 								"aria-current": t.active ? "page" : void 0,
 								"aria-label": R ? t.label : void 0,
@@ -287,16 +287,16 @@ function b({ items: t, groups: i, collapsed: c, defaultCollapsed: g = !1, onColl
 								className: n.link,
 								disabled: t.disabled,
 								onClick: (e) => t.onClick?.(e),
-								children: s
+								children: o
 							}) : /* @__PURE__ */ p(u, {
 								...l,
-								children: s
+								children: o
 							});
 							return /* @__PURE__ */ p("li", { children: R && !w ? /* @__PURE__ */ p(e, {
 								content: t.label,
 								placement: "right",
 								children: d
-							}) : d }, t.id ?? o);
+							}) : d }, t.id ?? a);
 						})
 					})]
 				}, r))

package/dist/side-nav/side-nav.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './side-nav.css';
 var e = {
 	sideNav: "_sideNav_1v53b_2",

package/dist/skeleton/skeleton.js

@@ -1,7 +1,5 @@
-"use client";
-
 import e from "./skeleton.module.js";
-import { cn as t } from "@cascivo/core";
+import { cn as t } from "@cascivo/core/pure";
 import { jsx as n } from "react/jsx-runtime";
 //#region ../components/src/skeleton/skeleton.tsx
 function r({ variant: r = "text", width: i, height: a, lines: o = 1, className: s, style: c, ...l }) {

package/dist/skeleton/skeleton.module.js

@@ -1,5 +1,3 @@
-"use client";
-
 import './skeleton.css';
 var e = {
 	skeleton: "_skeleton_14kv6_2",