@solostylist/ui-kit 2.0.0 → 2.0.1

package/dist/s-select/s-select.js

@@ -1,2 +1,201 @@
-import { t as e } from "../s-select-dwY2DYa9.js";
-export { e as SSelect, e as default };
+import { staticFieldLabelStyles as e } from "../theme/components/field-label-styles.js";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Box as i, FormControl as a, FormHelperText as o, InputAdornment as s, InputLabel as c, ListSubheader as l, MenuItem as u, Select as ee, TextField as d, styled as f, useThemeProps as te } from "@mui/material";
+import { mergeSlotProps as p } from "@mui/material/utils";
+import ne from "@mui/icons-material/Search";
+//#region lib/s-select/s-select.tsx
+function m(e) {
+	return typeof e == "string" || typeof e == "number";
+}
+function h(e, t) {
+	return m(e) ? String(e) : String(e[t]);
+}
+function re(e, t) {
+	return m(e) ? e : e[t];
+}
+function g(e) {
+	return /* @__PURE__ */ n(i, {
+		component: "span",
+		sx: { color: "text.secondary" },
+		children: e
+	});
+}
+function _(e, t, n) {
+	return e.find((e) => n(e) === t);
+}
+function ie(e, t, n, r, i, a) {
+	if (e == null || e === "") return g(r);
+	if (t) return String(e);
+	let o = _(n, e, a);
+	return o ? i(o) : "";
+}
+function ae(e, t, n, r, i, a) {
+	return e.length === 0 ? g(r) : t ? e.map(String).join(", ") : e.map((e) => {
+		let t = _(n, e, a);
+		return t ? i(t) : "";
+	}).filter(Boolean).join(", ");
+}
+function oe(e, t, n, r) {
+	if (!t || !n) return e;
+	let i = n.toLowerCase();
+	return e.filter((e) => r(e).toLowerCase().includes(i));
+}
+function v(e, t) {
+	return e.reduce((e, n) => {
+		let r = String(t(n));
+		return e.set(r, (e.get(r) ?? 0) + 1), e;
+	}, /* @__PURE__ */ new Map());
+}
+function y(e, t, n, r, i) {
+	let a = i?.(e, t);
+	if (a !== void 0) return a;
+	let o = String(r(e));
+	return (n.get(o) ?? 0) > 1 ? `${o}-${t}` : o;
+}
+function b(e, t, r, i, a) {
+	let o = v(e, t);
+	return e.map((e, s) => {
+		let c = t(e), l = y(e, s, o, t, a);
+		return /* @__PURE__ */ n(u, {
+			disabled: e?.disabled ?? !1,
+			value: c,
+			children: i ? i(e) : r(e)
+		}, l);
+	});
+}
+function x(e) {
+	if (e) return {
+		autoFocus: !1,
+		slotProps: { paper: { onKeyDown: (e) => {
+			e.key !== "Escape" && e.stopPropagation();
+		} } }
+	};
+}
+function se(e, t) {
+	let n = x(e);
+	if (!n) return t;
+	if (!t) return n;
+	let { slotProps: r, slots: i, ...a } = n, { slotProps: o, slots: s, ...c } = t;
+	return {
+		...a,
+		...c,
+		slots: {
+			...i,
+			...s
+		},
+		slotProps: {
+			...r,
+			...o,
+			paper: p(o?.paper, r?.paper ?? {})
+		}
+	};
+}
+var S = f(a, {
+	name: "SSelect",
+	slot: "Root",
+	shouldForwardProp: (e) => e !== "ownerState"
+})({ ...e });
+function C(e, a) {
+	let f = te({
+		props: e,
+		name: "SSelect"
+	}), { options: p = [], getOptionKey: m, optionLabel: g = "name", optionValue: _ = "id", placeholder: v, label: y = "", error: x = !1, helperText: C, required: w = !1, simple: T = !1, searchable: E = !1, searchPlaceholder: ce = "", noResultsText: le = "No results found", renderOption: D, className: O, color: k = "primary", defaultValue: A, disabled: j = !1, displayEmpty: M = !0, fullWidth: N = !0, id: ue, inputProps: P, labelId: F, margin: I = "none", MenuProps: L, onChange: R, onClose: z, onOpen: B, open: V, renderValue: H, size: U = "medium", sx: de, variant: W = "outlined", ...G } = f, [K, q] = t.useState(""), fe = t.useId(), J = ue ?? fe, Y = F ?? `${J}-label`, X = C ? `${J}-helper-text` : void 0, pe = [P?.["aria-describedby"], X].filter(Boolean).join(" ") || void 0, me = G.value === void 0 ? A ?? (G.multiple ? [] : "") : void 0, he = {
+		...f,
+		color: k,
+		disabled: j,
+		displayEmpty: M,
+		error: x,
+		fullWidth: N,
+		margin: I,
+		required: w,
+		searchable: E,
+		size: U,
+		variant: W
+	}, Z = (e) => h(e, g), Q = (e) => re(e, _), $ = oe(p, E, K, Z), ge = (e) => {
+		z?.(e), E && q("");
+	}, _e = (e) => G.multiple ? ae(Array.isArray(e) ? e : [], T, p, v, Z, Q) : ie(e, T, p, v, Z, Q), ve = () => E ? $.length > 0 ? b($, Q, Z, D, m) : K ? /* @__PURE__ */ n(u, {
+		disabled: !0,
+		children: /* @__PURE__ */ n(i, {
+			sx: {
+				color: "text.secondary",
+				textAlign: "center",
+				width: "100%"
+			},
+			children: le
+		})
+	}) : b(p, Q, Z, D, m) : b(p, Q, Z, D, m), ye = se(E, L);
+	return /* @__PURE__ */ r(S, {
+		className: O,
+		color: k,
+		disabled: j,
+		error: x,
+		fullWidth: N,
+		margin: I,
+		ownerState: he,
+		ref: a,
+		required: w,
+		size: U,
+		sx: de,
+		variant: W,
+		children: [
+			y ? /* @__PURE__ */ n(c, {
+				id: Y,
+				shrink: !!v || M && !!H || void 0,
+				children: y
+			}) : null,
+			/* @__PURE__ */ r(ee, {
+				...G,
+				defaultValue: me,
+				id: J,
+				label: y,
+				labelId: y ? Y : F,
+				displayEmpty: M,
+				inputProps: {
+					...P,
+					"aria-describedby": pe
+				},
+				open: V,
+				onOpen: B,
+				onClose: ge,
+				MenuProps: ye,
+				onChange: R,
+				renderValue: H ?? _e,
+				variant: W,
+				children: [E && /* @__PURE__ */ n(l, {
+					sx: {
+						px: 2,
+						py: 1,
+						position: "sticky",
+						top: 0,
+						bgcolor: "background.paper",
+						zIndex: 1
+					},
+					children: /* @__PURE__ */ n(d, {
+						fullWidth: !0,
+						autoFocus: !0,
+						placeholder: ce,
+						value: K,
+						onChange: (e) => q(e.target.value),
+						onKeyDown: (e) => {
+							e.key !== "Escape" && e.stopPropagation();
+						},
+						onClick: (e) => e.stopPropagation(),
+						slotProps: { input: { startAdornment: /* @__PURE__ */ n(s, {
+							position: "start",
+							children: /* @__PURE__ */ n(ne, {})
+						}) } }
+					})
+				}), ve()]
+			}),
+			C ? /* @__PURE__ */ n(o, {
+				id: X,
+				children: C
+			}) : null
+		]
+	});
+}
+var w = t.forwardRef(C);
+w.displayName = "SSelect";
+//#endregion
+export { w as SSelect, w as default };

package/dist/s-select-list/s-select-list.js

@@ -1,13 +1,10 @@
 import { resolveOwnerStateSlotProps as e } from "../utils/slots.js";
-import { t } from "../useForkRef-CKneCEtr.js";
-import { t as n } from "../useEventCallback-CVqMfiG_.js";
-import { t as r } from "../appendOwnerState-CELpvdMz.js";
-import { t as i } from "../useControlled-BeB0W_Ui.js";
-import { t as a } from "../mergeSlotProps-xl1-PgWL.js";
-import * as o from "react";
-import { createElement as s } from "react";
-import { jsx as c } from "react/jsx-runtime";
-import { Box as l, Collapse as u, FormControlLabel as d, Radio as f, RadioGroup as p, formControlLabelClasses as m, styled as h, useThemeProps as g } from "@mui/material";
+import * as t from "react";
+import { createElement as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+import { Box as i, Collapse as a, FormControlLabel as o, Radio as s, RadioGroup as c, formControlLabelClasses as l, styled as u, useThemeProps as d } from "@mui/material";
+import { mergeSlotProps as f, useControlled as p, useEventCallback as m, useForkRef as h } from "@mui/material/utils";
+import g from "@mui/utils/appendOwnerState";
 import { visuallyHidden as _ } from "@mui/utils";
 //#region lib/s-select-list/s-select-list.tsx
 var v = [
@@ -30,11 +27,11 @@ function x(e, t) {
 		delete n[e];
 	}), n;
 }
-var S = h(p, {
+var S = u(c, {
 	name: "SSelectList",
 	slot: "Root",
 	shouldForwardProp: (e) => e !== "ownerState"
-})(({ theme: e }) => ({ gap: e.spacing(1) })), C = h(l, {
+})(({ theme: e }) => ({ gap: e.spacing(1) })), C = u(i, {
 	name: "SSelectList",
 	slot: "Option",
 	shouldForwardProp: (e) => e !== "ownerState"
@@ -48,7 +45,7 @@ var S = h(p, {
 			width: 0
 		}
 	}]
-}), w = h(d, {
+}), w = u(o, {
 	name: "SSelectList",
 	slot: "Item",
 	shouldForwardProp: (e) => e !== "ownerState"
@@ -60,7 +57,7 @@ var S = h(p, {
 	margin: 0,
 	padding: e.spacing(1, 2),
 	width: "100%",
-	[`&.${m.disabled}`]: { color: (e.vars ?? e).palette.text.disabled },
+	[`&.${l.disabled}`]: { color: (e.vars ?? e).palette.text.disabled },
 	variants: [{
 		props: ({ ownerState: e }) => e.selected,
 		style: { borderColor: (e.vars ?? e).palette.primary.dark }
@@ -71,7 +68,7 @@ var S = h(p, {
 			outlineOffset: 2
 		} }
 	}]
-})), T = h("span", {
+})), T = u("span", {
 	name: "SSelectList",
 	slot: "Label",
 	shouldForwardProp: (e) => e !== "ownerState"
@@ -79,18 +76,18 @@ var S = h(p, {
 	display: "block",
 	flex: 1,
 	minWidth: 0
-}), E = h(f, {
+}), E = u(s, {
 	name: "SSelectList",
 	slot: "Radio",
 	shouldForwardProp: (e) => e !== "ownerState"
 })({ variants: [{
 	props: ({ ownerState: e }) => !e.showRadio,
 	style: b
-}] }), D = h(u, {
+}] }), D = u(a, {
 	name: "SSelectList",
 	slot: "Transition",
 	shouldForwardProp: (e) => e !== "ownerState"
-})({}), O = h(l, {
+})({}), O = u(i, {
 	name: "SSelectList",
 	slot: "Details",
 	shouldForwardProp: (e) => e !== "ownerState"
@@ -99,64 +96,64 @@ var S = h(p, {
 	marginTop: e.spacing(1),
 	width: "100%"
 }));
-function k(o, l) {
-	let u = g({
-		props: o,
+function k(t, i) {
+	let a = d({
+		props: t,
 		name: "SSelectList"
-	}), { defaultValue: d, items: f, onChange: p, renderBelow: m, renderItem: h, showRadio: _ = !0, slotProps: b, slots: k, value: A, ...j } = u, [M, N] = i({
+	}), { defaultValue: o, items: s, onChange: c, renderBelow: l, renderItem: u, showRadio: _ = !0, slotProps: b, slots: k, value: A, ...j } = a, [M, N] = p({
 		controlled: A,
-		default: d ?? "",
+		default: o ?? "",
 		name: "SSelectList",
 		state: "value"
 	}), P = {
-		...u,
+		...a,
 		showRadio: _,
 		value: M
-	}, F = k?.root ?? S, I = k?.option ?? C, L = k?.item ?? w, R = k?.label ?? T, z = k?.radio ?? E, B = k?.transition ?? D, V = k?.details ?? O, H = n((e, t) => {
-		N(t), p?.(e, t);
-	}), { ref: U, ...W } = r(F, a(e(b?.root, P), {
+	}, F = k?.root ?? S, I = k?.option ?? C, L = k?.item ?? w, R = k?.label ?? T, z = k?.radio ?? E, B = k?.transition ?? D, V = k?.details ?? O, H = m((e, t) => {
+		N(t), c?.(e, t);
+	}), { ref: U, ...W } = g(F, f(e(b?.root, P), {
 		...j,
 		onChange: H,
 		value: M
-	}), P), G = t(U, l);
-	return /* @__PURE__ */ c(F, {
+	}), P), G = h(U, i);
+	return /* @__PURE__ */ r(F, {
 		...W,
 		ref: G,
-		children: f.map((t) => {
-			let n = t.id === M, i = {
+		children: s.map((t) => {
+			let i = t.id === M, a = {
 				...P,
 				item: t,
-				selected: n
-			}, o = e(b?.option, i), l = e(b?.item, i), u = e(b?.label, i), d = e(b?.radio, i), f = e(b?.transition, i) ?? {}, p = r(I, o ?? {}, i), g = r(L, x(a(l, {
+				selected: i
+			}, o = e(b?.option, a), s = e(b?.item, a), c = e(b?.label, a), d = e(b?.radio, a), p = e(b?.transition, a) ?? {}, m = g(I, o ?? {}, a), h = g(L, x(f(s, {
 				disableTypography: !0,
 				labelPlacement: "start"
-			}), v), i), _ = r(R, u ?? {}, i), S = r(z, x(d, y), i);
-			return /* @__PURE__ */ s(I, {
-				...p,
+			}), v), a), _ = g(R, c ?? {}, a), S = g(z, x(d, y), a);
+			return /* @__PURE__ */ n(I, {
+				...m,
 				key: t.id
-			}, /* @__PURE__ */ c(L, {
-				...g,
-				control: /* @__PURE__ */ c(z, { ...S }),
-				label: /* @__PURE__ */ c(R, {
+			}, /* @__PURE__ */ r(L, {
+				...h,
+				control: /* @__PURE__ */ r(z, { ...S }),
+				label: /* @__PURE__ */ r(R, {
 					..._,
-					children: h(t, n)
+					children: u(t, i)
 				}),
 				value: t.id
-			}), m ? /* @__PURE__ */ c(B, {
-				...r(B, {
-					...f,
-					unmountOnExit: f.unmountOnExit ?? !0
-				}, i),
-				in: n,
-				children: /* @__PURE__ */ c(V, {
-					...r(V, e(b?.details, i) ?? {}, i),
-					children: m(t)
+			}), l ? /* @__PURE__ */ r(B, {
+				...g(B, {
+					...p,
+					unmountOnExit: p.unmountOnExit ?? !0
+				}, a),
+				in: i,
+				children: /* @__PURE__ */ r(V, {
+					...g(V, e(b?.details, a) ?? {}, a),
+					children: l(t)
 				})
 			}) : null);
 		})
 	});
 }
-var A = o.forwardRef(k);
+var A = t.forwardRef(k);
 A.displayName = "SSelectList";
 //#endregion
 export { A as SSelectList, A as default };

package/dist/s-skeleton/s-skeleton.js

@@ -1,8 +1,7 @@
-import { t as e } from "../styled-Bog8QCl3.js";
-import { t } from "../Skeleton-iZFynl7z.js";
-import { t as n } from "../useThemeProps-Cr28OQu3.js";
-import * as r from "react";
-import { jsx as i } from "react/jsx-runtime";
+import { styled as e, useThemeProps as t } from "@mui/material/styles";
+import * as n from "react";
+import { jsx as r } from "react/jsx-runtime";
+import i from "@mui/material/Skeleton";
 //#region lib/s-skeleton/s-skeleton.tsx
 var a = {
 	avatar: {
@@ -25,41 +24,41 @@ var a = {
 		variant: "rounded",
 		width: 32
 	}
-}, o = e(t, {
+}, o = e(i, {
 	name: "SSkeleton",
 	slot: "Root"
 })(({ ownerState: e, theme: t }) => ({
 	...e.preset === "checkbox" && { borderRadius: t.radius.sm },
 	...e.variant === "text" && e.fontSize != null && { fontSize: e.fontSize }
-})), s = r.forwardRef(function(e, t) {
-	let r = n({
+})), s = n.forwardRef(function(e, n) {
+	let i = t({
 		props: e,
 		name: "SSkeleton"
 	});
-	if (r.preset) {
-		let { preset: e, ...n } = r, s = a[e], c = {
-			animation: n.animation,
+	if (i.preset) {
+		let { preset: e, ...t } = i, s = a[e], c = {
+			animation: t.animation,
 			preset: e,
 			variant: s.variant
 		};
-		return /* @__PURE__ */ i(o, {
-			...n,
+		return /* @__PURE__ */ r(o, {
+			...t,
 			height: s.height,
 			ownerState: c,
-			ref: t,
+			ref: n,
 			variant: s.variant,
 			width: s.width
 		});
 	}
-	let { fontSize: s, variant: c = "text", ...l } = r, u = {
+	let { fontSize: s, variant: c = "text", ...l } = i, u = {
 		animation: l.animation,
 		fontSize: s,
 		variant: c
 	};
-	return /* @__PURE__ */ i(o, {
+	return /* @__PURE__ */ r(o, {
 		...l,
 		ownerState: u,
-		ref: t,
+		ref: n,
 		variant: c
 	});
 });

package/dist/s-snackbar-message/index.js

@@ -1,2 +1,2 @@
-import { n as e, r as t, t as n } from "../s-snackbar-message-3Z6VySlB.js";
-export { n as SSnackbarMessage, n as default, e as SnackbarMessageProvider, t as useSnackbarMessage };
+import { SSnackbarMessage as e, SnackbarMessageProvider as t, useSnackbarMessage as n } from "./s-snackbar-message.js";
+export { e as SSnackbarMessage, e as default, t as SnackbarMessageProvider, n as useSnackbarMessage };

package/dist/s-snackbar-message/s-snackbar-message.js

@@ -1,2 +1,89 @@
-import { n as e, r as t, t as n } from "../s-snackbar-message-3Z6VySlB.js";
-export { n as SSnackbarMessage, n as default, e as SnackbarMessageProvider, t as useSnackbarMessage };
+import { toSxArray as e } from "../utils/sx.js";
+import { styled as t, useThemeProps as n } from "@mui/material/styles";
+import * as r from "react";
+import { createElement as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import s from "@mui/utils/appendOwnerState";
+import c from "@mui/material/Alert";
+import l from "@mui/material/Snackbar";
+//#region lib/s-snackbar-message/s-snackbar-message.tsx
+var u = t(l, {
+	name: "SSnackbarMessage",
+	slot: "Root",
+	shouldForwardProp: (e) => e !== "ownerState"
+})({});
+function d(e, t) {
+	return typeof e == "function" ? e(t) : e;
+}
+var f = r.forwardRef(function(t, r) {
+	let i = n({
+		props: t,
+		name: "SSnackbarMessage"
+	}), { anchorOrigin: o = {
+		vertical: "top",
+		horizontal: "center"
+	}, autoHideDuration: l = 1e4, message: f, onClose: p, onCloseButtonClick: m, open: h = !1, severity: g = "info", slotProps: _, slots: v, ...y } = i, b = {
+		...i,
+		open: h,
+		severity: g
+	}, { alert: x, ...S } = v ?? {}, { alert: C, ...w } = _ ?? {}, T = x ?? c, { onClose: E, sx: D, ...O } = d(C, b) ?? {}, k = s(x, O, b), A = (e) => {
+		m?.(e), !e.defaultPrevented && E?.(e);
+	};
+	return /* @__PURE__ */ a(u, {
+		...y,
+		anchorOrigin: o,
+		autoHideDuration: l,
+		onClose: p,
+		open: h,
+		ownerState: b,
+		ref: r,
+		slots: S,
+		slotProps: w,
+		children: /* @__PURE__ */ a(T, {
+			...k,
+			onClose: m || E ? A : void 0,
+			severity: g,
+			sx: [{
+				width: "100%",
+				"& .MuiAlert-action": { justifyContent: "center" }
+			}, ...e(D)],
+			children: f
+		})
+	});
+});
+f.displayName = "SSnackbarMessage";
+var p = r.createContext(null);
+function m({ children: e }) {
+	let [t, n] = r.useState(null), [a, s] = r.useState(0), c = r.useCallback(() => n(null), []), l = r.useCallback((e) => {
+		s((e) => e + 1), n(e);
+	}, []), u = r.useMemo(() => ({
+		closeSnackbar: c,
+		open: t != null,
+		showSnackbar: l
+	}), [
+		c,
+		t,
+		l
+	]), { onClose: d, onCloseButtonClick: m, ...h } = t ?? {}, g = h, _ = r.useCallback((e, t) => {
+		d?.(e, t), e?.defaultPrevented || c();
+	}, [c, d]), v = r.useCallback((e) => {
+		m?.(e), e.defaultPrevented || c();
+	}, [c, m]);
+	return /* @__PURE__ */ o(p.Provider, {
+		value: u,
+		children: [t ? /* @__PURE__ */ i(f, {
+			...g,
+			key: a,
+			open: !0,
+			onClose: _,
+			onCloseButtonClick: v
+		}) : null, e]
+	});
+}
+function h() {
+	let e = r.useContext(p);
+	if (!e) throw Error("useSnackbarMessage must be used within a SnackbarMessageProvider");
+	return e;
+}
+//#endregion
+export { f as SSnackbarMessage, f as default, m as SnackbarMessageProvider, h as useSnackbarMessage };

package/dist/s-spotlight-cursor/s-spotlight-cursor.js

@@ -1,47 +1,47 @@
 import { isValidCanvasColor as e, resolveCanvasColor as t } from "../utils/canvas-color.js";
-import { t as n } from "../useForkRef-CKneCEtr.js";
-import * as r from "react";
-import { jsx as i } from "react/jsx-runtime";
-import { styled as a, useColorScheme as o, useMediaQuery as s, useTheme as c, useThemeProps as l } from "@mui/material";
+import * as n from "react";
+import { jsx as r } from "react/jsx-runtime";
+import { styled as i, useColorScheme as a, useMediaQuery as o, useTheme as s, useThemeProps as c } from "@mui/material";
+import { useForkRef as l } from "@mui/material/utils";
 //#region lib/s-spotlight-cursor/s-spotlight-cursor.tsx
-var u = 200, d = .15, f = .1, p = .01, m = ({ brightness: n, color: i, colorScheme: a, followSpeed: o, radius: s, reducedMotion: c, theme: l }) => {
-	let u = r.useRef(null);
-	return r.useEffect(() => {
-		let r = u.current;
-		if (!r) return;
-		let a = r.getContext("2d");
+var u = 200, d = .15, f = .1, p = .01, m = ({ brightness: r, color: i, colorScheme: a, followSpeed: o, radius: s, reducedMotion: c, theme: l }) => {
+	let u = n.useRef(null);
+	return n.useEffect(() => {
+		let n = u.current;
+		if (!n) return;
+		let a = n.getContext("2d");
 		if (!a) return;
-		let d = null, f = 0, p = 0, m = null, h = null, g = null, _ = null, v = r.parentElement ?? r, y = (l.vars ?? l).palette.primary.main, b = t(i, r, l), x = t(y, r), S = e(a, b) ? b : e(a, x) ? x : "#000000", C = () => {
+		let d = null, f = 0, p = 0, m = null, h = null, g = null, _ = null, v = n.parentElement ?? n, y = (l.vars ?? l).palette.primary.main, b = t(i, n, l), x = t(y, n), S = e(a, b) ? b : e(a, x) ? x : "#000000", C = () => {
 			if (d = null, a.clearRect(0, 0, f, p), m == null || h == null) return;
 			g == null || _ == null || c ? (g = m, _ = h) : (g += (m - g) * o, _ += (h - _) * o);
 			let e = a.createRadialGradient(g, _, 0, g, _, s);
-			e.addColorStop(0, S), e.addColorStop(1, "transparent"), a.save(), a.globalAlpha = n, a.fillStyle = e, a.fillRect(0, 0, f, p), a.restore();
-			let t = Math.abs(m - g), r = Math.abs(h - _);
-			!c && (t > .1 || r > .1) && (d = requestAnimationFrame(C));
+			e.addColorStop(0, S), e.addColorStop(1, "transparent"), a.save(), a.globalAlpha = r, a.fillStyle = e, a.fillRect(0, 0, f, p), a.restore();
+			let t = Math.abs(m - g), n = Math.abs(h - _);
+			!c && (t > .1 || n > .1) && (d = requestAnimationFrame(C));
 		}, w = () => {
 			d ??= requestAnimationFrame(C);
 		}, T = () => {
-			let e = r.getBoundingClientRect();
+			let e = n.getBoundingClientRect();
 			if (e.width === 0 || e.height === 0) return;
 			let t = window.devicePixelRatio || 1;
-			f = e.width, p = e.height, r.width = Math.max(1, Math.round(f * t)), r.height = Math.max(1, Math.round(p * t)), a.setTransform(t, 0, 0, t, 0, 0), w();
+			f = e.width, p = e.height, n.width = Math.max(1, Math.round(f * t)), n.height = Math.max(1, Math.round(p * t)), a.setTransform(t, 0, 0, t, 0, 0), w();
 		}, E = (e) => {
-			let t = r.getBoundingClientRect(), n = e.clientX - t.left, i = e.clientY - t.top;
-			if (n < 0 || n > t.width || i < 0 || i > t.height) {
+			let t = n.getBoundingClientRect(), r = e.clientX - t.left, i = e.clientY - t.top;
+			if (r < 0 || r > t.width || i < 0 || i > t.height) {
 				m = null, h = null, g = null, _ = null, w();
 				return;
 			}
-			m = n, h = i, g ??= n, _ ??= i, w();
+			m = r, h = i, g ??= r, _ ??= i, w();
 		}, D = () => {
 			m = null, h = null, g = null, _ = null, w();
 		};
 		T();
 		let O = new ResizeObserver(T);
-		return O.observe(r), v.addEventListener("pointermove", E, { passive: !0 }), v.addEventListener("pointerleave", D), () => {
+		return O.observe(n), v.addEventListener("pointermove", E, { passive: !0 }), v.addEventListener("pointerleave", D), () => {
 			O.disconnect(), v.removeEventListener("pointermove", E), v.removeEventListener("pointerleave", D), d != null && cancelAnimationFrame(d);
 		};
 	}, [
-		n,
+		r,
 		i,
 		a,
 		o,
@@ -49,7 +49,7 @@ var u = 200, d = .15, f = .1, p = .01, m = ({ brightness: n, color: i, colorSche
 		c,
 		l
 	]), u;
-}, h = a("canvas", {
+}, h = i("canvas", {
 	name: "SSpotlightCursor",
 	slot: "Root"
 })({
@@ -60,18 +60,18 @@ var u = 200, d = .15, f = .1, p = .01, m = ({ brightness: n, color: i, colorSche
 	zIndex: 0,
 	width: "100%",
 	height: "100%"
-}), g = r.forwardRef(function(e, t) {
-	let r = l({
+}), g = n.forwardRef(function(e, t) {
+	let n = c({
 		props: e,
 		name: "SSpotlightCursor"
-	}), a = c(), { mode: g, systemMode: _ } = o(), { brightness: v = d, color: y = "primary", followSpeed: b = f, radius: x = u, ...S } = r, C = Number.isFinite(v) ? Math.min(1, Math.max(0, v)) : d, w = Number.isFinite(b) ? Math.min(1, Math.max(p, b)) : f, T = Number.isFinite(x) && x > 0 ? x : u, E = s("(prefers-reduced-motion: reduce)", { noSsr: !0 }), D = n(m({
+	}), i = s(), { mode: g, systemMode: _ } = a(), { brightness: v = d, color: y = "primary", followSpeed: b = f, radius: x = u, ...S } = n, C = Number.isFinite(v) ? Math.min(1, Math.max(0, v)) : d, w = Number.isFinite(b) ? Math.min(1, Math.max(p, b)) : f, T = Number.isFinite(x) && x > 0 ? x : u, E = o("(prefers-reduced-motion: reduce)", { noSsr: !0 }), D = l(m({
 		brightness: C,
 		color: y,
 		colorScheme: g === "system" ? _ : g,
 		followSpeed: w,
 		radius: T,
 		reducedMotion: E,
-		theme: a
+		theme: i
 	}), t), O = {
 		brightness: C,
 		color: y,
@@ -79,7 +79,7 @@ var u = 200, d = .15, f = .1, p = .01, m = ({ brightness: n, color: i, colorSche
 		radius: T,
 		reducedMotion: E
 	};
-	return /* @__PURE__ */ i(h, {
+	return /* @__PURE__ */ r(h, {
 		...S,
 		"aria-hidden": "true",
 		ownerState: O,