@jfrader/ui 0.5.0 → 0.6.0

package/dist/slider-DjAnGmlC.js

@@ -0,0 +1,535 @@
+'use client';
+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-DgVO3NaB.js";
+import { t as s } from "./renderable-DzcIj1Lo.js";
+import { useEffect as c, useId as l, useMemo as u, useRef as d, useState as f } from "react";
+import { vars as p } from "@jfrader/tokens/vars";
+import { createElement as m } from "@emotion/react";
+import { jsx as h, jsxs as g } from "@emotion/react/jsx-runtime";
+import { MotionConfig as _, motion as ee, useReducedMotion as v } from "motion/react";
+//#region src/components/slider/use-slider-interaction.ts
+var y = 1e-7, b = "data-slider-thumb";
+function x(e, t) {
+	return typeof e == "number" ? e === t : typeof t != "number" && e[0] === t[0] && e[1] === t[1];
+}
+function te(...e) {
+	return e.filter(Boolean).join(" ") || void 0;
+}
+function S(e) {
+	return s(e) && e !== "";
+}
+function C(e, t) {
+	return typeof e == "function" ? e(t) : e;
+}
+function w(e, t, n) {
+	let r = u(() => new Intl.NumberFormat(e, t), [e, t]);
+	return {
+		formatter: r,
+		format: (e) => n ? n(e, r) : r.format(e)
+	};
+}
+function T(e) {
+	let { component: t, range: n, value: r, defaultValue: i, min: o, max: s, step: u, largeStep: p, minStepsBetweenThumbs: m, disabled: h, onValueChange: g, onValueCommit: _, onPointerSample: ee, resolvePointer: v, onGestureEnd: te } = e, S = (s - o) / u;
+	if (![
+		o,
+		s,
+		u,
+		S
+	].every(Number.isFinite) || s <= o || u <= 0 || !Number.isSafeInteger(Math.round(S)) || Math.abs(S - Math.round(S)) > y) throw Error(`${t} requires finite min < max, a positive step, and max aligned to min + n * step.`);
+	if (!Number.isInteger(m) || m < 0 || m > Math.round(S)) throw Error(`${t} minStepsBetweenThumbs must be a nonnegative integer that fits the domain.`);
+	if (p !== void 0 && (!Number.isFinite(p) || p <= 0)) throw Error(`${t} largeStep must be finite and positive.`);
+	let C = m * u, w = Math.max(1, Math.round((p ?? (s - o) / 10) / u)) * u, T = (e) => {
+		if (!Number.isFinite(e)) throw Error(`${t} values must be finite.`);
+		let n = Math.max(0, Math.min(Math.round(S), Math.round((e - o) / u))), r = o + n * u, i = Number(r.toPrecision(15));
+		return Math.abs(i - r) <= u * y ? i : r;
+	}, E = (e) => {
+		if (!n) {
+			if (typeof e != "number") throw Error(`${t} single mode requires a number.`);
+			return T(e);
+		}
+		if (typeof e == "number" || e.length !== 2 || e[0] > e[1]) throw Error(`${t} range requires an ordered [lower, upper] tuple.`);
+		let r = T(e[0]), i = T(e[1]);
+		if ((i - r) / u + y < m) throw Error(`${t} range values must respect minStepsBetweenThumbs.`);
+		return [r, i];
+	}, [ne] = f(() => E(i ?? (n ? [o, s] : o))), [re, ie, D] = a(r, ne, g), O = E(re ?? ne), k = typeof O == "number" ? [O] : O, ae = l(), A = d(null), j = d(null), M = d(0), [oe, N] = f(null), P = (e) => n ? [e === 0 ? o : T(k[0] + C), e === 0 ? T(k[1] - C) : s] : [o, s], F = (e, t) => {
+		let [r, i] = P(e), a = T(Math.max(r, Math.min(i, t)));
+		return n ? e === 0 ? [a, k[1]] : [k[0], a] : a;
+	}, I = (e) => {
+		x(O, e) || ie(e);
+	}, L = (e) => {
+		let t = j.current;
+		t && (j.current = null, N(null), te?.(e), t.control.hasPointerCapture(t.pointerId) && t.control.releasePointerCapture(t.pointerId), e && !x(t.initial, t.candidate) && _(t.candidate));
+	};
+	c(() => {
+		h && L(!1);
+	}, [h]), c(() => () => {
+		let e = j.current;
+		j.current = null, e?.control.hasPointerCapture(e.pointerId) && e.control.releasePointerCapture(e.pointerId);
+	}, []), c(() => {
+		let e = A.current?.closest("form");
+		if (!e) return;
+		let t = (e) => {
+			queueMicrotask(() => {
+				e.defaultPrevented || (L(!1), D());
+			});
+		};
+		return e.addEventListener("reset", t), () => e.removeEventListener("reset", t);
+	}, [D]);
+	let R = (e) => A.current?.querySelector(`[${b}="${e}"]`)?.focus(), z = () => A.current?.matches(":dir(rtl)") ?? !1, B = (e) => {
+		let t = A.current.getBoundingClientRect(), n = t.width > 0 ? (e - t.left) / t.width : 0;
+		return o + (z() ? 1 - n : n) * (s - o);
+	}, V = (e) => n ? Math.abs(e - k[0]) === Math.abs(e - k[1]) ? M.current : Math.abs(e - k[0]) < Math.abs(e - k[1]) ? 0 : 1 : 0, H = (e) => {
+		let t = j.current;
+		if (!t || e.pointerId !== t.pointerId || h) return;
+		t.coincident && e.clientX !== t.originX && (t.thumb = e.clientX > t.originX === z() ? 0 : 1, t.coincident = !1, N(t.thumb), R(t.thumb));
+		let [n, r] = P(t.thumb), i = A.current.getBoundingClientRect().width, a = {
+			raw: B(e.clientX - t.offset),
+			low: n,
+			high: r,
+			pxPerUnit: i / (s - o),
+			rtl: z(),
+			pointerType: e.pointerType
+		};
+		ee?.(a);
+		let c = F(t.thumb, v ? v(a) : a.raw);
+		x(t.candidate, c) || (t.candidate = c, I(c));
+	}, se = (e) => {
+		if (e.defaultPrevented || h || j.current || !e.isPrimary || e.button !== 0) return;
+		let t = e.target.closest(`[${b}]`), r = t ? Number(t.getAttribute(b)) : V(B(e.clientX)), i = t?.getBoundingClientRect(), a = i ? e.clientX - (i.left + i.width / 2) : 0;
+		j.current = {
+			pointerId: e.pointerId,
+			thumb: r,
+			offset: a,
+			originX: e.clientX,
+			coincident: n && k[0] === k[1],
+			initial: O,
+			candidate: O,
+			control: e.currentTarget
+		}, e.currentTarget.setPointerCapture(e.pointerId), e.preventDefault(), N(r), R(r), t || H(e);
+	}, ce = (e, t) => {
+		if (h || e.defaultPrevented) return;
+		let n = z() ? -1 : 1, r = e.shiftKey ? w : u, [i, a] = P(t), o = {
+			ArrowRight: k[t] + r * n,
+			ArrowLeft: k[t] - r * n,
+			ArrowUp: k[t] + r,
+			ArrowDown: k[t] - r,
+			PageUp: k[t] + w,
+			PageDown: k[t] - w,
+			Home: i,
+			End: a
+		}[e.key];
+		if (o === void 0) return;
+		e.preventDefault();
+		let s = F(t, o);
+		x(O, s) || (I(s), _(s));
+	};
+	return {
+		id: ae,
+		controlRef: A,
+		current: O,
+		values: k,
+		active: oe,
+		bounds: P,
+		percent: (e) => (e - o) / (s - o) * 100,
+		normalizeMarks: (e) => Array.from(new Map(e.flatMap((e) => {
+			let t = typeof e == "number" ? { value: e } : e;
+			return Number.isFinite(t.value) && t.value >= o && t.value <= s ? [[T(t.value), {
+				...t,
+				value: T(t.value)
+			}]] : [];
+		})).values()),
+		controlHandlers: (e) => ({
+			ref: (t) => {
+				A.current = t;
+				let n = e?.ref;
+				if (typeof n == "function") return n(t);
+				n && (n.current = t);
+			},
+			onPointerDown: (t) => {
+				e?.onPointerDown?.(t), se(t);
+			},
+			onPointerMove: (t) => {
+				e?.onPointerMove?.(t), t.defaultPrevented || H(t);
+			},
+			onPointerUp: (t) => {
+				e?.onPointerUp?.(t), j.current?.pointerId === t.pointerId && L(!0);
+			},
+			onPointerCancel: (t) => {
+				e?.onPointerCancel?.(t), j.current?.pointerId === t.pointerId && L(!1);
+			},
+			onLostPointerCapture: (t) => {
+				e?.onLostPointerCapture?.(t), j.current?.pointerId === t.pointerId && L(!1);
+			}
+		}),
+		handleRootKeyDown: (e) => {
+			let t = e.target.closest(`[${b}]`);
+			t && A.current?.contains(t) && ce(e, Number(t.getAttribute(b)));
+		},
+		selectMark: (e) => {
+			if (h) return;
+			let t = F(V(e), e);
+			x(O, t) || (I(t), _(t));
+		},
+		noteFocus: (e) => {
+			M.current = e;
+		}
+	};
+}
+//#endregion
+//#region src/components/slider/slider-style.ts
+var E = e({
+	display: "grid",
+	gap: p.space[2],
+	minInlineSize: 0,
+	inlineSize: "100%",
+	fontFamily: p.font.sans,
+	fontSize: p.textSize.sm,
+	lineHeight: p.lineHeight.base,
+	color: p.color.text
+}), ne = e({
+	display: "flex",
+	flexWrap: "wrap",
+	justifyContent: "space-between",
+	gap: p.space[2],
+	alignItems: "baseline"
+}), re = e({ fontWeight: p.fontWeight.medium }), ie = e({
+	fontVariantNumeric: "tabular-nums",
+	overflowWrap: "anywhere"
+}), D = e({ color: p.color.textMuted }), O = e({ color: p.color.dangerText }), k = e({
+	display: "flex",
+	alignItems: "center",
+	gap: p.space[3],
+	minInlineSize: 0,
+	paddingBlockStart: p.space[8]
+}), ae = e({
+	position: "relative",
+	flex: 1,
+	minInlineSize: p.space[8],
+	marginInline: p.space[4],
+	touchAction: "pan-y",
+	userSelect: "none",
+	cursor: "pointer",
+	"&[data-disabled]": { cursor: "default" }
+}), A = {
+	sm: e({ minBlockSize: p.space[8] }),
+	md: e({ minBlockSize: p.space[10] })
+}, j = e({
+	display: "flex",
+	flexWrap: "wrap",
+	gap: p.space[2]
+}), M = e({
+	minBlockSize: p.space[8],
+	minInlineSize: p.space[8],
+	paddingBlock: p.space[1],
+	paddingInline: p.space[2],
+	font: "inherit",
+	overflowWrap: "anywhere",
+	maxInlineSize: "100%",
+	color: p.color.text,
+	background: p.color.surfaceRaised,
+	border: `1px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.md,
+	cursor: "pointer",
+	"&:focus-visible": t,
+	"&:disabled": { cursor: "default" },
+	[n]: { borderColor: "ButtonText" }
+}), oe = {
+	type: "spring",
+	stiffness: 420,
+	damping: 30
+}, N = 8, P = e(E, { label: "slider" }), F = e({
+	position: "absolute",
+	insetInline: 0,
+	insetBlockStart: "50%",
+	transform: "translateY(-50%)",
+	blockSize: p.space[1],
+	boxSizing: "border-box",
+	border: `1px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.full,
+	background: p.color.surfaceInset,
+	pointerEvents: "none",
+	[n]: {
+		forcedColorAdjust: "none",
+		background: "Canvas",
+		borderColor: "CanvasText"
+	}
+}), I = e({
+	position: "absolute",
+	insetBlock: 0,
+	background: p.color.accent,
+	borderRadius: p.radius.full,
+	[n]: { background: "Highlight" }
+}), L = e({
+	position: "absolute",
+	insetBlockStart: "50%",
+	transform: "translate(-50%, -50%)",
+	"&:dir(rtl)": { transform: "translate(50%, -50%)" },
+	inlineSize: p.space[8],
+	blockSize: p.space[8],
+	display: "grid",
+	placeItems: "center",
+	borderRadius: p.radius.full,
+	cursor: "grab",
+	"&:focus-visible": {
+		...t,
+		zIndex: 2
+	},
+	"&[data-dragging]": {
+		cursor: "grabbing",
+		zIndex: 3
+	},
+	"&[aria-disabled=\"true\"]": { cursor: "default" }
+}), R = e({
+	inlineSize: p.space[6],
+	blockSize: p.space[6],
+	boxSizing: "border-box",
+	border: `2px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.full,
+	background: p.color.surfaceRaised,
+	boxShadow: p.shadow.raised,
+	pointerEvents: "none",
+	[n]: {
+		forcedColorAdjust: "none",
+		background: "Canvas",
+		borderColor: "CanvasText",
+		boxShadow: "none"
+	}
+}), z = e({
+	position: "absolute",
+	insetBlockEnd: `calc(100% + ${p.space[2]})`,
+	paddingInline: p.space[2],
+	paddingBlock: p.space[1],
+	inlineSize: "max-content",
+	maxInlineSize: "min(24rem, 80vw)",
+	overflowWrap: "anywhere",
+	border: `1px solid ${p.color.borderControl}`,
+	borderRadius: p.radius.md,
+	background: p.color.surfaceRaised,
+	color: p.color.text,
+	boxShadow: p.shadow.raised,
+	pointerEvents: "none",
+	fontSize: p.textSize.xs,
+	opacity: 0,
+	transition: `opacity ${p.motion.duration.fast} ${p.motion.easeStandard}`,
+	"[data-dragging] > &, [data-slider-thumb]:focus-visible > &": { opacity: 1 },
+	[r]: { transitionDuration: "0s" },
+	[n]: {
+		borderColor: "CanvasText",
+		boxShadow: "none"
+	}
+}), B = e({
+	position: "absolute",
+	insetBlockStart: "50%",
+	transform: "translate(-50%, -50%)",
+	inlineSize: p.space[1],
+	blockSize: p.space[2],
+	border: `1px solid ${p.color.borderControl}`,
+	background: p.color.surfaceRaised,
+	boxSizing: "border-box",
+	pointerEvents: "none",
+	[n]: {
+		background: "Canvas",
+		borderColor: "CanvasText"
+	}
+});
+function V(e) {
+	let { ref: t, type: n = "single", value: r, defaultValue: a, label: s, description: c, error: l, invalid: u = !1, disabled: d = !1, min: p = 0, max: y = 100, step: b = 1, largeStep: x, minStepsBetweenThumbs: E = 0, marks: V = [], thumbLabels: H, locale: se, formatOptions: ce, formatValue: le, showValue: ue = !0, start: de, end: fe, name: U, size: pe = "md", slotProps: W, onValueChange: me, onValueCommit: he, className: ge, sx: _e, onKeyDown: ve, "aria-label": ye, "aria-labelledby": be, "aria-describedby": xe, "aria-invalid": Se, ...Ce } = e, G = n === "range", K = v(), [we, Te] = f(0), q = T({
+		component: "Slider",
+		range: G,
+		value: r,
+		defaultValue: a,
+		min: p,
+		max: y,
+		step: b,
+		largeStep: x,
+		minStepsBetweenThumbs: E,
+		disabled: d,
+		onValueChange: (t) => {
+			e.type, e.onValueChange?.(t);
+		},
+		onValueCommit: (t) => {
+			e.type, e.onValueCommit?.(t);
+		},
+		onPointerSample: ({ raw: e, low: t, high: n, rtl: r }) => Te(K ? 0 : Math.max(-8, Math.min(N, (e - Math.max(t, Math.min(n, e))) * (r ? -1 : 1)))),
+		onGestureEnd: () => Te(0)
+	}), { id: J, current: Y, values: X, active: Ee, bounds: De, percent: Z } = q, { formatter: Oe, format: Q } = w(se, ce, le), ke = typeof Y == "number" ? Q(Y) : !le && "formatRange" in Oe ? Oe.formatRange(Y[0], Y[1]) : `${Q(Y[0])} – ${Q(Y[1])}`, Ae = q.normalizeMarks(V), je = G ? Z(X[0]) : 0, Me = Z(X[+!!G]), Ne = S(s), Pe = S(c), $ = S(l);
+	return /* @__PURE__ */ h(_, {
+		reducedMotion: "user",
+		children: /* @__PURE__ */ h(i, {
+			className: ge,
+			styles: P,
+			sx: _e,
+			children: (e) => /* @__PURE__ */ g("div", {
+				...Ce,
+				ref: t,
+				className: e,
+				"data-ui": "slider",
+				"data-disabled": d || void 0,
+				onKeyDown: (e) => {
+					ve?.(e), q.handleRootKeyDown(e);
+				},
+				children: [
+					(Ne || ue) && /* @__PURE__ */ g("div", {
+						css: ne,
+						children: [Ne && /* @__PURE__ */ h("span", {
+							...W?.label,
+							id: `${J}-label`,
+							css: [re, W?.label?.css],
+							children: s
+						}), ue && /* @__PURE__ */ h("span", {
+							...W?.readout,
+							"aria-hidden": "true",
+							css: [ie, W?.readout?.css],
+							children: ke
+						})]
+					}),
+					Pe && /* @__PURE__ */ h("div", {
+						...W?.description,
+						id: `${J}-description`,
+						css: [D, W?.description?.css],
+						children: c
+					}),
+					$ && /* @__PURE__ */ h("div", {
+						...W?.error,
+						id: `${J}-error`,
+						role: "alert",
+						css: [O, W?.error?.css],
+						children: l
+					}),
+					/* @__PURE__ */ g("div", {
+						css: k,
+						children: [
+							S(de) && /* @__PURE__ */ h("div", {
+								...W?.start,
+								children: de
+							}),
+							/* @__PURE__ */ g("div", {
+								...W?.control,
+								...q.controlHandlers(W?.control),
+								css: [
+									ae,
+									A[pe],
+									W?.control?.css
+								],
+								"data-ui": "slider-control",
+								"data-disabled": d || void 0,
+								children: [
+									/* @__PURE__ */ h("div", {
+										...W?.track,
+										"data-ui": "slider-track",
+										"aria-hidden": "true",
+										css: [F, W?.track?.css],
+										children: /* @__PURE__ */ h("div", {
+											...W?.fill,
+											"data-ui": "slider-fill",
+											css: [I, W?.fill?.css],
+											style: {
+												...W?.fill?.style,
+												insetInlineStart: `${je}%`,
+												inlineSize: `${Me - je}%`
+											}
+										})
+									}),
+									Ae.map((e, t) => /* @__PURE__ */ h("span", {
+										"aria-hidden": "true",
+										css: B,
+										style: { insetInlineStart: `${Z(e.value)}%` }
+									}, t)),
+									X.map((e, t) => {
+										let n = C(W?.thumb, t), [r, i] = De(t);
+										return /* @__PURE__ */ m("div", {
+											...n,
+											key: t,
+											id: `${J}-thumb-${t}`,
+											"data-slider-thumb": t,
+											"data-dragging": Ee === t || void 0,
+											role: "slider",
+											tabIndex: d ? -1 : 0,
+											"aria-orientation": "horizontal",
+											"aria-disabled": d,
+											"aria-invalid": $ || u ? !0 : n?.["aria-invalid"] ?? Se,
+											"aria-valuemin": r,
+											"aria-valuemax": i,
+											"aria-valuenow": e,
+											"aria-valuetext": Q(e),
+											"aria-label": n?.["aria-label"] ?? (G ? H?.[t] : ye),
+											"aria-labelledby": te(be, n?.["aria-labelledby"], G ? `${J}-name-${t}` : Ne && `${J}-label`),
+											"aria-describedby": te(xe, n?.["aria-describedby"], Pe && `${J}-description`, $ && `${J}-error`),
+											css: [L, n?.css],
+											style: {
+												...n?.style,
+												insetInlineStart: `${Z(e)}%`
+											},
+											onFocus: (e) => {
+												q.noteFocus(t), n?.onFocus?.(e);
+											},
+											onKeyDown: (e) => {
+												n?.onKeyDown?.(e);
+											}
+										}, /* @__PURE__ */ h(ee.span, {
+											"aria-hidden": "true",
+											css: R,
+											animate: {
+												scale: K ? 1 : Ee === t ? .95 : 1,
+												x: K ? 0 : Ee === t ? we : 0
+											},
+											transition: K ? { duration: 0 } : oe
+										}), G && /* @__PURE__ */ h("span", {
+											id: `${J}-name-${t}`,
+											css: o,
+											children: H?.[t]
+										}), /* @__PURE__ */ h("span", {
+											...W?.bubble,
+											"data-ui": "slider-bubble",
+											"aria-hidden": "true",
+											css: [z, W?.bubble?.css],
+											style: {
+												...W?.bubble?.style,
+												...Z(e) <= 50 ? { insetInlineStart: 0 } : { insetInlineEnd: 0 }
+											},
+											children: Q(e)
+										}));
+									})
+								]
+							}),
+							S(fe) && /* @__PURE__ */ h("div", {
+								...W?.end,
+								children: fe
+							})
+						]
+					}),
+					Ae.some((e) => S(e.label)) && /* @__PURE__ */ h("div", {
+						css: j,
+						children: Ae.map((e, t) => {
+							if (!S(e.label)) return null;
+							let n = C(W?.mark, t);
+							return /* @__PURE__ */ m("button", {
+								...n,
+								key: t,
+								type: "button",
+								disabled: d,
+								css: [M, n?.css],
+								onClick: (t) => {
+									n?.onClick?.(t), t.defaultPrevented || q.selectMark(e.value);
+								}
+							}, e.label);
+						})
+					}),
+					U !== void 0 && X.map((e, t) => /* @__PURE__ */ h("input", {
+						type: "hidden",
+						disabled: d,
+						name: typeof U == "string" ? U : U[t],
+						value: e
+					}, t))
+				]
+			})
+		})
+	});
+}
+V.displayName = "Slider";
+//#endregion
+export { V as t };

package/dist/slider.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Slider } from "./slider-t0B5cecO.js";
+export { t as Slider } from "./slider-DjAnGmlC.js";

package/dist/{sortable-data-table-tirqlLY2.js → sortable-data-table-Bpitup_d.js}

@@ -1,12 +1,13 @@
 'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { t as 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 { 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 ee } from "./button-C92uYFJW.js";
-import { t as c } from "./checkbox-cFquiSdy.js";
+import { t as ee } from "./button-C6OV0C7J.js";
+import { t as c } from "./checkbox-CClE61GV.js";
 import { useEffect as te, useId as ne, useLayoutEffect as re, useMemo as l, useRef as u, useState as ie } from "react";
 import { vars as d } from "@jfrader/tokens/vars";
 import { jsx as f, jsxs as p } from "@emotion/react/jsx-runtime";
@@ -34,7 +35,7 @@ var ae = {
 	maxInlineSize: "100%",
 	border: `1px solid ${d.color.border}`,
 	borderRadius: d.radius.md,
-	"&:focus-visible": n
+	"&:focus-visible": t
 }), ce = e({
 	inlineSize: "100%",
 	borderCollapse: "separate",
@@ -85,15 +86,15 @@ var ae = {
 	transitionDuration: d.motion.duration.fast,
 	transitionTimingFunction: d.motion.easeStandard,
 	"&:hover": { backgroundColor: d.color.surfaceHover },
-	"&:focus-visible": n,
-	[i]: { transitionDuration: "0s" },
-	[r]: {
+	"&:focus-visible": t,
+	[r]: { transitionDuration: "0s" },
+	[n]: {
 		borderColor: "ButtonText",
 		color: "ButtonText"
 	}
 }), de = e({
 	"&[data-selected]": { backgroundColor: d.color.accentSoft },
-	[r]: { "&[data-selected]": {
+	[n]: { "&[data-selected]": {
 		outline: "1px solid Highlight",
 		outlineOffset: "-1px"
 	} }
@@ -115,11 +116,11 @@ var ae = {
 function _e(e, t, n) {
 	return typeof e == "number" && typeof t == "number" ? e - t : e instanceof Date && t instanceof Date ? e.getTime() - t.getTime() : typeof e == "string" && typeof t == "string" ? n.compare(e, t) : 0;
 }
-function b({ ref: e, rows: n, columns: r, getRowId: i, caption: d, captionHidden: b = !1, value: ve, defaultValue: ye = null, onValueChange: be, sortMode: x = "client", selectable: S = !1, getRowLabel: xe, selectedKeys: Se, defaultSelectedKeys: Ce = me, onSelectionChange: we, locale: C, dateFormatOptions: w, timeZone: T, messages: Te, empty: E, loading: Ee = !1, size: D = "md", tableRef: De, slotProps: O, className: Oe, sx: ke, ...k }) {
+function b({ ref: e, rows: t, columns: n, getRowId: r, caption: d, captionHidden: b = !1, value: ve, defaultValue: ye = null, onValueChange: be, sortMode: x = "client", selectable: S = !1, getRowLabel: xe, selectedKeys: Se, defaultSelectedKeys: Ce = me, onSelectionChange: we, locale: C, dateFormatOptions: w, timeZone: T, messages: Te, empty: E, loading: Ee = !1, size: D = "md", tableRef: De, slotProps: O, className: Oe, sx: ke, ...k }) {
 	let A = {
 		...ae,
 		...Te
-	}, Ae = ne(), [j, je] = a(ve, ye, be), [Me, Ne] = a(Se, Ce, we), M = y(Me ?? me), N = new Set(M), P = r.find((e) => e.id === j?.columnId && _(e)), F = P && j ? j : null, I = l(() => new Intl.NumberFormat(C), [C]), Pe = l(() => new Intl.DateTimeFormat(C, {
+	}, Ae = ne(), [j, je] = a(ve, ye, be), [Me, Ne] = a(Se, Ce, we), M = y(Me ?? me), N = new Set(M), P = n.find((e) => e.id === j?.columnId && _(e)), F = P && j ? j : null, I = l(() => new Intl.NumberFormat(C), [C]), Pe = l(() => new Intl.DateTimeFormat(C, {
 		...w,
 		...T ? { timeZone: T } : {}
 	}), [
@@ -129,7 +130,7 @@ function b({ ref: e, rows: n, columns: r, getRowId: i, caption: d, captionHidden
 	]), L = l(() => new Intl.Collator(C, {
 		numeric: !0,
 		sensitivity: "base"
-	}), [C]), R = l(() => x === "manual" || !F || !P ? n : n.map((e, t) => ({
+	}), [C]), R = l(() => x === "manual" || !F || !P ? t : t.map((e, t) => ({
 		row: e,
 		index: t
 	})).sort((e, t) => {
@@ -138,13 +139,13 @@ function b({ ref: e, rows: n, columns: r, getRowId: i, caption: d, captionHidden
 		let i = P.compare ? P.compare(e.row, t.row) : _e(n, r, L);
 		return (Number.isFinite(i) ? i : 0) * (F.direction === "asc" ? 1 : -1) || e.index - t.index;
 	}).map(({ row: e }) => e), [
-		n,
+		t,
 		F?.columnId,
 		F?.direction,
 		x,
 		P,
 		L
-	]), z = R.map(i), B = z.filter((e) => N.has(e)).length, V = z.length > 0 && B === z.length, Fe = B > 0 && !V, H = A.selectionStatus(B, M.length, z.length, {
+	]), z = R.map(r), B = z.filter((e) => N.has(e)).length, V = z.length > 0 && B === z.length, Fe = B > 0 && !V, H = A.selectionStatus(B, M.length, z.length, {
 		visibleSelected: I.format(B),
 		totalSelected: I.format(M.length),
 		visibleRows: I.format(z.length)
@@ -203,7 +204,7 @@ function b({ ref: e, rows: n, columns: r, getRowId: i, caption: d, captionHidden
 			$(a, e.currentTarget.checked), U.current = t;
 		}
 	});
-	return /* @__PURE__ */ f(t, {
+	return /* @__PURE__ */ f(i, {
 		className: Oe,
 		styles: [oe],
 		sx: ke,
@@ -238,7 +239,7 @@ function b({ ref: e, rows: n, columns: r, getRowId: i, caption: d, captionHidden
 								],
 								children: d
 							}),
-							/* @__PURE__ */ p("colgroup", { children: [S && /* @__PURE__ */ f("col", {}), r.map((e) => /* @__PURE__ */ f("col", { style: { width: e.width } }, e.id))] }),
+							/* @__PURE__ */ p("colgroup", { children: [S && /* @__PURE__ */ f("col", {}), n.map((e) => /* @__PURE__ */ f("col", { style: { width: e.width } }, e.id))] }),
 							/* @__PURE__ */ f("thead", { children: /* @__PURE__ */ p("tr", { children: [S && /* @__PURE__ */ f("th", {
 								scope: "col",
 								css: [
@@ -257,7 +258,7 @@ function b({ ref: e, rows: n, columns: r, getRowId: i, caption: d, captionHidden
 										!e.defaultPrevented && !e.nativeEvent.defaultPrevented && $(z, e.currentTarget.checked);
 									}
 								})
-							}), r.map((e) => /* @__PURE__ */ f("th", {
+							}), n.map((e) => /* @__PURE__ */ f("th", {
 								scope: "col",
 								"data-numeric": e.numeric || void 0,
 								"aria-sort": F?.columnId === e.id ? F.direction === "asc" ? "ascending" : "descending" : void 0,
@@ -288,17 +289,17 @@ function b({ ref: e, rows: n, columns: r, getRowId: i, caption: d, captionHidden
 							/* @__PURE__ */ f("tbody", {
 								ref: J,
 								children: R.length ? R.map((e, t) => {
-									let n = i(e);
+									let i = r(e);
 									return /* @__PURE__ */ p("tr", {
-										"data-selected": S && N.has(n) || void 0,
+										"data-selected": S && N.has(i) || void 0,
 										className: O?.row?.className,
 										css: [de, O?.row?.css],
 										onFocusCapture: (e) => {
-											let r = Array.from(e.currentTarget.querySelectorAll("input, button, a[href], select, textarea, [tabindex=\"0\"]"));
+											let n = Array.from(e.currentTarget.querySelectorAll("input, button, a[href], select, textarea, [tabindex=\"0\"]"));
 											q.current = {
-												key: n,
+												key: i,
 												index: t,
-												control: r.indexOf(e.target)
+												control: n.indexOf(e.target)
 											};
 										},
 										onBlurCapture: (e) => {
@@ -306,8 +307,8 @@ function b({ ref: e, rows: n, columns: r, getRowId: i, caption: d, captionHidden
 										},
 										children: [S && /* @__PURE__ */ f("td", {
 											css: [m, h[D]],
-											children: Be(e, n)
-										}), r.map((t) => /* @__PURE__ */ f("td", {
+											children: Be(e, i)
+										}), n.map((t) => /* @__PURE__ */ f("td", {
 											"data-numeric": t.numeric || void 0,
 											className: O?.cell?.className,
 											css: [
@@ -317,9 +318,9 @@ function b({ ref: e, rows: n, columns: r, getRowId: i, caption: d, captionHidden
 											],
 											children: ze(t, e)
 										}, t.id))]
-									}, n);
+									}, i);
 								}) : /* @__PURE__ */ f("tr", { children: /* @__PURE__ */ f("td", {
-									colSpan: r.length + Number(S),
+									colSpan: n.length + Number(S),
 									className: O?.cell?.className,
 									css: [
 										m,