@jfrader/ui 0.5.0 → 0.6.0

package/dist/sortable-data-table.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as SortableDataTable } from "./sortable-data-table-tirqlLY2.js";
+export { t as SortableDataTable } from "./sortable-data-table-Bpitup_d.js";

package/dist/{spinner-DtxvDPdM.js → spinner-CvzajSg9.js}

@@ -1,8 +1,9 @@
 'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { r as n } from "./media-8yrN85VT.js";
-import { t as r } from "./visually-hidden-BJdvqqvn.js";
-import { n as i, t as a } from "./loading-ring-B8-30Dl1.js";
+import { i as e } from "./css-BYJhdGh-.js";
+import { r as t } from "./media-8yrN85VT.js";
+import { t as n } from "./sx-BJXJ2xJK.js";
+import { t as r } from "./visually-hidden-DgVO3NaB.js";
+import { n as i, t as a } from "./loading-ring-D0lGrK8z.js";
 import { vars as o } from "@jfrader/tokens/vars";
 import { jsx as s, jsxs as c } from "@emotion/react/jsx-runtime";
 //#region src/components/spinner/spinner.tsx
@@ -14,7 +15,7 @@ var l = e({
 	...a,
 	flexShrink: 0,
 	boxSizing: "border-box",
-	[n]: { animation: `${i} 1.6s ease-in-out infinite alternate` }
+	[t]: { animation: `${i} 1.6s ease-in-out infinite alternate` }
 }), d = {
 	sm: e({
 		inlineSize: o.space[4],
@@ -29,21 +30,21 @@ var l = e({
 		blockSize: o.space[6]
 	})
 };
-function f({ ref: e, size: n = "md", label: i = "Loading", className: a, sx: o, ...f }) {
-	return /* @__PURE__ */ s(t, {
+function f({ ref: e, size: t = "md", label: i = "Loading", className: a, sx: o, ...f }) {
+	return /* @__PURE__ */ s(n, {
 		className: a,
 		styles: l,
 		sx: o,
-		children: (t) => /* @__PURE__ */ c("span", {
+		children: (n) => /* @__PURE__ */ c("span", {
 			...f,
 			ref: e,
 			role: "status",
 			"data-ui": "spinner",
-			className: t,
+			className: n,
 			children: [/* @__PURE__ */ s("span", {
 				"aria-hidden": "true",
 				"data-ui": "spinner-indicator",
-				css: [u, d[n]]
+				css: [u, d[t]]
 			}), /* @__PURE__ */ s("span", {
 				css: r,
 				children: i

package/dist/spinner.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Spinner } from "./spinner-DtxvDPdM.js";
+export { t as Spinner } from "./spinner-CvzajSg9.js";

package/dist/{split-button-Cb3EHs64.js → split-button-Bu41f2AY.js}

@@ -1,113 +1,108 @@
 'use client';
-import { i as e, r as t, t as n } from "./sx-Dx9JUKp5.js";
-import { n as r, r as i } from "./media-8yrN85VT.js";
+import { a as e, i as t } from "./css-BYJhdGh-.js";
+import { n, r } from "./media-8yrN85VT.js";
+import { t as i } from "./sx-BJXJ2xJK.js";
 import { t as a } from "./use-controlled-state-DpeVQZNR.js";
 import { t as o } from "./renderable-DzcIj1Lo.js";
-import { t as s } from "./button-C92uYFJW.js";
-import { s as c } from "./listbox-style-WX-RASp1.js";
-import { a as l, i as u, n as d, o as f, r as p, s as m, t as h } from "./menu-xwOOUtWP.js";
-import { createContext as g, useContext as _, useEffect as v, useLayoutEffect as y, useMemo as b, useRef as x, useState as S } from "react";
-import { vars as C } from "@jfrader/tokens/vars";
-import { jsx as w, jsxs as T } from "@emotion/react/jsx-runtime";
-import { useMergeRefs as E } from "@floating-ui/react";
+import { t as s } from "./button-C6OV0C7J.js";
+import { s as c } from "./listbox-style-DNOxAulu.js";
+import { a as l, d as u, f as d, o as f, r as p, s as m, t as h, u as g } from "./menu-CVzpsyXn.js";
+import { createContext as _, useContext as v, useEffect as y, useLayoutEffect as b, useMemo as x, useRef as S, useState as C } from "react";
+import { vars as w } from "@jfrader/tokens/vars";
+import { jsx as T, jsxs as E } from "@emotion/react/jsx-runtime";
+import { useMergeRefs as D } from "@floating-ui/react";
 //#region src/components/split-button/split-button.tsx
-var D = "SplitButton", O = g(null);
-function k(e) {
-	let t = _(O);
-	if (!t) throw Error(`${D}.${e} must be rendered inside <${D}>.`);
+var O = "SplitButton", k = _(null);
+function A(e) {
+	let t = v(k);
+	if (!t) throw Error(`${O}.${e} must be rendered inside <${O}>.`);
 	return t;
 }
-var A = {
+var j = {
 	solid: "soft",
 	soft: "soft",
 	outline: "outline",
 	ghost: "ghost"
-}, j = {
+}, M = {
 	sm: "32px",
 	md: "40px",
 	lg: "48px"
-}, M = t({
+}, N = t({
 	label: "split-button",
 	display: "inline-flex",
 	alignItems: "stretch",
 	maxInlineSize: "100%",
 	verticalAlign: "middle",
 	isolation: "isolate"
-}), N = { "&:focus-visible": {
+}), P = { "&:focus-visible": {
 	position: "relative",
 	zIndex: 1
-} }, P = t({
+} }, F = t({
 	label: "split-button-action",
 	flex: "0 1 auto",
 	minInlineSize: 0,
 	blockSize: "auto",
-	paddingBlock: C.space[1],
+	paddingBlock: w.space[1],
 	whiteSpace: "normal",
 	textAlign: "center",
 	borderStartEndRadius: 0,
 	borderEndEndRadius: 0,
 	borderInlineEndWidth: 0,
-	...N,
-	[r]: { borderColor: "ButtonText" }
-}), F = t({
+	...P,
+	[n]: { borderColor: "ButtonText" }
+}), I = t({
 	label: "split-button-trigger",
 	flexShrink: 0,
 	blockSize: "auto",
 	paddingInline: 0,
 	borderStartStartRadius: 0,
 	borderEndStartRadius: 0,
-	borderInlineStartColor: C.color.borderControl,
-	...N,
-	[r]: { borderColor: "ButtonText" }
-}), I = Object.fromEntries(Object.entries(j).map(([e, n]) => [e, t({ minBlockSize: n })])), L = Object.fromEntries(Object.entries(j).map(([e, n]) => [e, t({
+	borderInlineStartColor: w.color.borderControl,
+	...P,
+	[n]: { borderColor: "ButtonText" }
+}), L = Object.fromEntries(Object.entries(M).map(([e, n]) => [e, t({ minBlockSize: n })])), R = Object.fromEntries(Object.entries(M).map(([e, n]) => [e, t({
 	minBlockSize: n,
 	inlineSize: n
-})])), R = t({
+})])), z = t({
 	display: "inline-flex",
 	transitionProperty: "transform",
-	transitionDuration: C.motion.duration.fast,
-	transitionTimingFunction: C.motion.easeStandard,
+	transitionDuration: w.motion.duration.fast,
+	transitionTimingFunction: w.motion.easeStandard,
 	"& svg": {
 		inlineSize: "1em",
 		blockSize: "1em"
 	},
 	"[aria-expanded=\"true\"] > &": { transform: "rotate(180deg)" },
-	[i]: {
+	[r]: {
 		transitionDuration: "0s",
 		"[aria-expanded=\"true\"] > &": { transform: "none" }
 	},
-	[r]: { color: "ButtonText" }
-}), z = e({
+	[n]: { color: "ButtonText" }
+}), B = e({
 	from: { opacity: 0 },
 	to: { opacity: 1 }
-}), B = t({
+}), V = t({
 	display: "inline-grid",
 	justifyItems: "center",
 	"& > *": { gridArea: "1 / 1" }
-}), V = t({ visibility: "hidden" }), H = t({
-	"&[data-swapped]": { animation: `${z} ${C.motion.duration.base} ${C.motion.easeStandard}` },
-	[i]: { "&[data-swapped]": { animation: "none" } }
-}), U = {
-	neutral: t({}),
-	danger: t({
-		color: C.color.dangerText,
-		"&:hover:not([aria-disabled=\"true\"]), &[data-active]:not([aria-disabled=\"true\"])": { backgroundColor: C.color.dangerSoft }
-	})
-}, W = /* @__PURE__ */ w("svg", {
+}), H = t({ visibility: "hidden" }), U = t({
+	"&[data-swapped]": { animation: `${B} ${w.motion.duration.base} ${w.motion.easeStandard}` },
+	[r]: { "&[data-swapped]": { animation: "none" } }
+}), W = /* @__PURE__ */ T("svg", {
 	viewBox: "0 0 16 16",
 	fill: "none",
 	stroke: "currentColor",
 	strokeWidth: "1.5",
 	strokeLinecap: "round",
 	strokeLinejoin: "round",
-	children: /* @__PURE__ */ w("path", { d: "M4 6l4 4 4-4" })
+	children: /* @__PURE__ */ T("path", { d: "M4 6l4 4 4-4" })
 });
-function G({ ref: e, variant: t = "solid", tone: r = "accent", size: i = "md", disabled: o = !1, open: s, defaultOpen: c = !1, onOpenChange: l, placement: u = "bottom-end", className: d, sx: f, children: p, ...m }) {
-	let [g = !1, _] = a(s, c, l), C = x(null), T = E([C, e]), [D, k] = S(), [A, j] = S(), N = x(!1);
-	y(() => {
-		C.current && k(getComputedStyle(C.current).direction === "rtl" ? "rtl" : "ltr");
-	}, [g]), v(() => {
-		o ? g && !N.current && (N.current = !0, _(!1)) : N.current = !1;
+function G({ ref: e, variant: t = "solid", tone: n = "accent", size: r = "md", disabled: o = !1, open: s, defaultOpen: c = !1, onOpenChange: l, placement: u = "bottom-end", className: d, sx: f, children: p, ...m }) {
+	let [g = !1, _] = a(s, c, l), v = S(null), w = D([v, e]), [E, O] = C(), [A, j] = C(), M = S(!1);
+	b(() => {
+		v.current && O(getComputedStyle(v.current).direction === "rtl" ? "rtl" : "ltr");
+	}, [g]), y(() => {
+		o ? g && !M.current && (M.current = !0, _(!1)) : M.current = !1;
 	}, [
 		o,
 		g,
@@ -115,35 +110,35 @@ function G({ ref: e, variant: t = "solid", tone: r = "accent", size: i = "md", d
 	]);
 	let P = (e) => {
 		e && o || _(e);
-	}, F = b(() => ({
+	}, F = x(() => ({
 		variant: t,
-		tone: r,
-		size: i,
+		tone: n,
+		size: r,
 		disabled: o,
-		direction: D,
+		direction: E,
 		triggerLabelledBy: A,
 		setTriggerLabelledBy: j
 	}), [
 		t,
+		n,
 		r,
-		i,
 		o,
-		D,
+		E,
 		A
 	]);
-	return /* @__PURE__ */ w(h, {
+	return /* @__PURE__ */ T(h, {
 		open: g,
 		onOpenChange: P,
 		placement: u,
-		children: /* @__PURE__ */ w(O.Provider, {
+		children: /* @__PURE__ */ T(k.Provider, {
 			value: F,
-			children: /* @__PURE__ */ w(n, {
+			children: /* @__PURE__ */ T(i, {
 				className: d,
-				styles: M,
+				styles: N,
 				sx: f,
-				children: (e) => /* @__PURE__ */ w("div", {
+				children: (e) => /* @__PURE__ */ T("div", {
 					...m,
-					ref: T,
+					ref: w,
 					role: "group",
 					"data-ui": "split-button",
 					className: e,
@@ -156,24 +151,24 @@ function G({ ref: e, variant: t = "solid", tone: r = "accent", size: i = "md", d
 G.displayName = "SplitButton";
 var K = (e) => typeof e == "string" || typeof e == "number" ? String(e) : void 0;
 function q({ reserveLabels: e, children: t }) {
-	let n = K(t), [r, i] = S(n), [a, o] = S(!1);
-	return n !== r && (i(n), o(!0)), /* @__PURE__ */ T("span", {
-		css: B,
+	let n = K(t), [r, i] = C(n), [a, o] = C(!1);
+	return n !== r && (i(n), o(!0)), /* @__PURE__ */ E("span", {
+		css: V,
 		"data-ui": "split-button-label",
-		children: [e.map((e) => /* @__PURE__ */ w("span", {
-			css: V,
+		children: [e.map((e) => /* @__PURE__ */ T("span", {
+			css: H,
 			"aria-hidden": !0,
 			children: e
-		}, e)), /* @__PURE__ */ w("span", {
-			css: H,
+		}, e)), /* @__PURE__ */ T("span", {
+			css: U,
 			"data-swapped": a || void 0,
 			children: t
 		}, n)]
 	});
 }
 function J({ ref: e, variant: t, tone: n, size: r, disabled: i = !1, reserveLabels: a, children: o, className: c, sx: l, ...u }) {
-	let d = k("Action"), f = d.disabled || i, p = r ?? d.size;
-	return /* @__PURE__ */ w(s, {
+	let d = A("Action"), f = d.disabled || i, p = r ?? d.size;
+	return /* @__PURE__ */ T(s, {
 		...u,
 		ref: e,
 		variant: t ?? d.variant,
@@ -181,16 +176,16 @@ function J({ ref: e, variant: t, tone: n, size: r, disabled: i = !1, reserveLabe
 		size: p,
 		disabled: f,
 		"data-ui": "split-button-action",
-		css: [P, I[p]],
+		css: [F, L[p]],
 		className: c,
 		sx: l,
-		render: ({ "data-ui": e, ...t }) => /* @__PURE__ */ w("button", {
+		render: ({ "data-ui": e, ...t }) => /* @__PURE__ */ T("button", {
 			...t,
 			type: t.type ?? "button",
 			"data-ui": e,
 			disabled: f
 		}),
-		children: a !== void 0 && a.length > 0 ? /* @__PURE__ */ w(q, {
+		children: a !== void 0 && a.length > 0 ? /* @__PURE__ */ T(q, {
 			reserveLabels: a,
 			children: o
 		}) : o
@@ -198,28 +193,28 @@ function J({ ref: e, variant: t, tone: n, size: r, disabled: i = !1, reserveLabe
 }
 J.displayName = "SplitButton.Action";
 function Y({ ref: e, disabled: t = !1, children: n = W, className: r, sx: i, ...a }) {
-	let c = k("Trigger"), u = c.disabled || t, d = "aria-labelledby" in a ? a["aria-labelledby"] : void 0, { setTriggerLabelledBy: f } = c;
-	return y(() => (f(d), () => f(void 0)), [d, f]), /* @__PURE__ */ w(s, {
+	let c = A("Trigger"), l = c.disabled || t, u = "aria-labelledby" in a ? a["aria-labelledby"] : void 0, { setTriggerLabelledBy: d } = c;
+	return b(() => (d(u), () => d(void 0)), [u, d]), /* @__PURE__ */ T(s, {
 		...a,
 		ref: e,
-		variant: A[c.variant],
+		variant: j[c.variant],
 		tone: c.tone,
 		size: c.size,
-		disabled: u,
+		disabled: l,
 		"data-ui": "split-button-trigger",
-		css: [F, L[c.size]],
+		css: [I, R[c.size]],
 		className: r,
 		sx: i,
-		render: ({ "data-ui": e, ref: t, ...n }) => /* @__PURE__ */ w(l, {
+		render: ({ "data-ui": e, ref: t, ...n }) => /* @__PURE__ */ T(m, {
 			...n,
 			ref: t,
 			type: "button",
-			disabled: u,
-			family: D,
+			disabled: l,
+			family: O,
 			marker: e
 		}),
-		children: o(n) && n !== "" && /* @__PURE__ */ w("span", {
-			css: R,
+		children: o(n) && n !== "" && /* @__PURE__ */ T("span", {
+			css: z,
 			"aria-hidden": !0,
 			children: n
 		})
@@ -227,33 +222,33 @@ function Y({ ref: e, disabled: t = !1, children: n = W, className: r, sx: i, ...
 }
 Y.displayName = "SplitButton.Trigger";
 function X({ dir: e, "aria-labelledby": t, ...n }) {
-	let { direction: r, triggerLabelledBy: i } = k("Content"), a = [t, n["aria-label"] === void 0 ? i : void 0].filter(Boolean).join(" ");
-	return /* @__PURE__ */ w(d, {
+	let { direction: r, triggerLabelledBy: i } = A("Content"), a = [t, n["aria-label"] === void 0 ? i : void 0].filter(Boolean).join(" ");
+	return /* @__PURE__ */ T(p, {
 		...n,
 		"aria-labelledby": a || void 0,
 		dir: e ?? r,
-		family: D,
+		family: O,
 		marker: "split-button-content",
 		styles: c
 	});
 }
 X.displayName = "SplitButton.Content";
 function Z({ tone: e = "neutral", disabled: t = !1, ...n }) {
-	let r = k("Item");
-	return /* @__PURE__ */ w(p, {
+	let r = A("Item");
+	return /* @__PURE__ */ T(l, {
 		...n,
 		disabled: r.disabled || t,
-		family: D,
+		family: O,
 		marker: "split-button-item",
-		styles: [f, U[e]]
+		styles: [g, u[e]]
 	});
 }
 Z.displayName = "SplitButton.Item";
 function Q(e) {
-	return k("Separator"), /* @__PURE__ */ w(u, {
+	return A("Separator"), /* @__PURE__ */ T(f, {
 		...e,
 		marker: "split-button-separator",
-		styles: m
+		styles: d
 	});
 }
 Q.displayName = "SplitButton.Separator";

package/dist/split-button.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as SplitButton } from "./split-button-Cb3EHs64.js";
+export { t as SplitButton } from "./split-button-Bu41f2AY.js";

package/dist/{stack-DC3IbtWk.js → stack-Bac4sJeI.js}

@@ -1,6 +1,6 @@
 'use client';
-import { t as e } from "./sx-Dx9JUKp5.js";
-import { t } from "./layout-style-Cbd1Vilw.js";
+import { t as e } from "./sx-BJXJ2xJK.js";
+import { t } from "./layout-style-BE0gSqrH.js";
 import { jsx as n } from "@emotion/react/jsx-runtime";
 //#region src/components/stack/stack.tsx
 function r({ ref: r, gap: i = "md", align: a, justify: o, wrap: s, className: c, sx: l, ...u }) {

package/dist/stack.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Stack } from "./stack-DC3IbtWk.js";
+export { t as Stack } from "./stack-Bac4sJeI.js";

package/dist/{stepper-CruHbXxX.js → stepper-C8Ncavbr.js}

@@ -1,9 +1,10 @@
 'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { n } from "./focus-ring-BK5W5_NY.js";
-import { n as r, r as i } from "./media-8yrN85VT.js";
+import { i as e } from "./css-BYJhdGh-.js";
+import { n as t } from "./focus-ring-BK5W5_NY.js";
+import { n, r } from "./media-8yrN85VT.js";
+import { t as i } from "./sx-BJXJ2xJK.js";
 import { t as a } from "./use-controlled-state-DpeVQZNR.js";
-import { t as o } from "./visually-hidden-BJdvqqvn.js";
+import { t as o } from "./visually-hidden-DgVO3NaB.js";
 import { t as s } from "./renderable-DzcIj1Lo.js";
 import { t as c } from "./part-id-D0zksy32.js";
 import { useId as l, useLayoutEffect as u, useRef as d, useState as f } from "react";
@@ -132,7 +133,7 @@ var ae = e({
 	transitionProperty: "background-color, transform",
 	transitionDuration: p.motion.duration.base,
 	transitionTimingFunction: p.motion.easeStandard,
-	[i]: { transitionDuration: "0s" }
+	[r]: { transitionDuration: "0s" }
 }), A = {
 	horizontal: e({ gridColumn: 1 }),
 	vertical: e({ gridColumn: "1 / -1" })
@@ -141,8 +142,8 @@ var ae = e({
 	"&[aria-disabled=\"true\"]": { cursor: "default" },
 	"&:not([aria-disabled=\"true\"]):hover": { backgroundColor: p.color.surfaceHover },
 	"&:not([aria-disabled=\"true\"]):active": { transform: "scale(0.98)" },
-	"&:focus-visible": n,
-	[i]: { "&:not([aria-disabled=\"true\"]):active": { transform: "none" } }
+	"&:focus-visible": t,
+	[r]: { "&:not([aria-disabled=\"true\"]):active": { transform: "none" } }
 }), j = e({
 	boxSizing: "border-box",
 	display: "inline-flex",
@@ -187,8 +188,8 @@ var ae = e({
 		backgroundColor: p.color.dangerSoft,
 		color: p.color.dangerText
 	},
-	[i]: { transitionDuration: "0s" },
-	[r]: {
+	[r]: { transitionDuration: "0s" },
+	[n]: {
 		borderColor: "CanvasText",
 		"&[data-state=\"current\"], &[data-state=\"error\"]": {
 			borderColor: "Highlight",
@@ -245,8 +246,8 @@ var ae = e({
 		transitionTimingFunction: p.motion.easeStandard
 	},
 	"&[data-state=\"complete\"]::after": { transform: "none" },
-	[i]: { "&::after": { transitionDuration: "0s" } },
-	[r]: {
+	[r]: { "&::after": { transitionDuration: "0s" } },
+	[n]: {
 		forcedColorAdjust: "none",
 		backgroundColor: "CanvasText",
 		"&::after": { backgroundColor: "Highlight" }
@@ -289,17 +290,17 @@ var ae = e({
 	fontWeight: p.fontWeight.medium
 });
 function N(e) {
-	let { ref: n, steps: r, value: i, defaultValue: p = 0, onValueChange: y, interactive: x = !1, orientation: S = "horizontal", details: C = "all", compact: w = !1, responsive: T = !0, size: E = "md", label: D = _, completeLabel: N = v, locale: P, getStepLabel: F, getChangeLabel: I, announceChanges: L = !1, slotProps: R, className: ge, sx: _e, "aria-label": ve, "aria-labelledby": z, ...ye } = e, B = r.length, be = l(), [xe, Se] = a(O(i, B), O(p, B), y), V = O(xe, B) ?? 0, H = r[V] ?? null, Ce = B > 0 && H === null, U = new Intl.NumberFormat(P), W = F ?? ee(U), we = I ?? b(U), [Te, Ee] = f(V), [De, Oe] = f("");
+	let { ref: t, steps: n, value: r, defaultValue: p = 0, onValueChange: y, interactive: x = !1, orientation: S = "horizontal", details: C = "all", compact: w = !1, responsive: T = !0, size: E = "md", label: D = _, completeLabel: N = v, locale: P, getStepLabel: F, getChangeLabel: I, announceChanges: L = !1, slotProps: R, className: ge, sx: _e, "aria-label": ve, "aria-labelledby": z, ...ye } = e, B = n.length, be = l(), [xe, Se] = a(O(r, B), O(p, B), y), V = O(xe, B) ?? 0, H = n[V] ?? null, Ce = B > 0 && H === null, U = new Intl.NumberFormat(P), W = F ?? ee(U), we = I ?? b(U), [Te, Ee] = f(V), [De, Oe] = f("");
 	Te !== V && (Ee(V), L && Oe(we(H, V, B)));
-	let ke = (e) => e === V || e < V && r[e]?.disabled !== !0, G = x ? r.flatMap((e, t) => ke(t) ? [t] : []) : [], [Ae, je] = f(null), K = r.findIndex((e) => e.id === Ae), q = G.includes(K) ? K : G.includes(V) ? V : G[0], J = d(/* @__PURE__ */ new Map()), Y = d(!1);
+	let ke = (e) => e === V || e < V && n[e]?.disabled !== !0, G = x ? n.flatMap((e, t) => ke(t) ? [t] : []) : [], [Ae, je] = f(null), K = n.findIndex((e) => e.id === Ae), q = G.includes(K) ? K : G.includes(V) ? V : G[0], J = d(/* @__PURE__ */ new Map()), Y = d(!1);
 	u(() => {
 		if (!Y.current) return;
 		Y.current = !1;
-		let e = q === void 0 ? void 0 : J.current.get(r[q]?.id ?? ""), t = e?.ownerDocument.activeElement;
+		let e = q === void 0 ? void 0 : J.current.get(n[q]?.id ?? ""), t = e?.ownerDocument.activeElement;
 		e && (!t || t === e.ownerDocument.body) && e.focus();
 	});
 	let Me = (e, t) => {
-		let n = getComputedStyle(e.currentTarget).direction === "rtl", [i, a] = S === "vertical" ? ["ArrowUp", "ArrowDown"] : n ? ["ArrowRight", "ArrowLeft"] : ["ArrowLeft", "ArrowRight"], o = G.indexOf(G.includes(t) ? t : q ?? -1), s = {
+		let r = getComputedStyle(e.currentTarget).direction === "rtl", [i, a] = S === "vertical" ? ["ArrowUp", "ArrowDown"] : r ? ["ArrowRight", "ArrowLeft"] : ["ArrowLeft", "ArrowRight"], o = G.indexOf(G.includes(t) ? t : q ?? -1), s = {
 			[i]: G[Math.max(o - 1, 0)],
 			[a]: G[Math.min(o + 1, G.length - 1)],
 			Home: G[0],
@@ -307,16 +308,16 @@ function N(e) {
 		};
 		if (!(e.key in s)) return;
 		e.preventDefault();
-		let c = s[e.key], l = c === void 0 ? void 0 : r[c];
+		let c = s[e.key], l = c === void 0 ? void 0 : n[c];
 		l && J.current.get(l.id)?.focus();
 	}, Ne = (e) => {
-		e < V && r[e]?.disabled !== !0 && Se(e);
+		e < V && n[e]?.disabled !== !0 && Se(e);
 	}, { className: X, css: Z, onClick: Pe, onKeyDown: Fe, onFocus: Ie, "aria-describedby": Le, ...Re } = R?.head ?? {}, ze = /* @__PURE__ */ h("ol", {
 		role: "list",
 		"data-ui": "stepper-list",
 		className: R?.list?.className,
 		css: [se[S], R?.list?.css],
-		children: r.map((e, t) => {
+		children: n.map((e, t) => {
 			let n = te(e, t, V), r = t === V, i = W(e, t, B, n), a = n === "error", l = a || s(e.description) && (C === "all" || r), u = c(be, "detail", e.id), d = s(e.icon), f = n === "complete" ? /* @__PURE__ */ h(re, {}) : a ? /* @__PURE__ */ h(ie, {}) : null, p = d || f ? void 0 : U.format(t + 1), _ = /* @__PURE__ */ g(m, { children: [
 				/* @__PURE__ */ h("span", {
 					"aria-hidden": "true",
@@ -453,7 +454,7 @@ function N(e) {
 			children: De
 		})
 	] });
-	return /* @__PURE__ */ h(t, {
+	return /* @__PURE__ */ h(i, {
 		className: [R?.root?.className, ge].filter(Boolean).join(" ") || void 0,
 		styles: [
 			ae,
@@ -463,12 +464,12 @@ function N(e) {
 		sx: _e,
 		children: (e) => x ? /* @__PURE__ */ h("nav", {
 			...Q,
-			ref: n,
+			ref: t,
 			className: e,
 			children: $
 		}) : /* @__PURE__ */ h("div", {
 			...Q,
-			ref: n,
+			ref: t,
 			role: "group",
 			className: e,
 			children: $

package/dist/stepper.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Stepper } from "./stepper-CruHbXxX.js";
+export { t as Stepper } from "./stepper-C8Ncavbr.js";