@solostylist/ui-kit 2.0.2 → 2.0.3

package/dist/s-no-ssr/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-no-ssr-DH57_uP_.js";
+import { SNoSsr as e } from "./s-no-ssr.js";
 export { e as SNoSsr, e as default };

package/dist/s-no-ssr/s-no-ssr.js

@@ -1,2 +1,5 @@
-import { t as e } from "../s-no-ssr-DH57_uP_.js";
-export { e as SNoSsr, e as default };
+import e from "@mui/material/NoSsr";
+//#region lib/s-no-ssr/s-no-ssr.tsx
+var t = e;
+//#endregion
+export { t as SNoSsr, t as default };

package/dist/s-number-range/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-number-range-Low5QjuD.js";
+import { SNumberRange as e } from "./s-number-range.js";
 export { e as SNumberRange, e as default };

package/dist/s-number-range/s-number-range.js

@@ -1,2 +1,250 @@
-import { t as e } from "../s-number-range-Low5QjuD.js";
-export { e as SNumberRange, e as default };
+import { toSxArray as e } from "../utils/sx.js";
+import { resolveOwnerStateSlotProps as t } from "../utils/slots.js";
+import { STextField as n } from "../s-text-field/s-text-field.js";
+import * as r from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Box as o, Slider as s, styled as c, useThemeProps as ee } from "@mui/material";
+import { mergeSlotProps as l, useControlled as te, useEventCallback as u, useForkRef as ne } from "@mui/material/utils";
+import d from "@mui/utils/appendOwnerState";
+import { sliderClasses as f } from "@mui/material/Slider";
+//#region lib/s-number-range/s-number-range.tsx
+var p = (e, t, n) => Math.min(Math.max(e, t), n), m = (e, t, n) => {
+	let r = p(e[0], t, n), i = p(e[1], t, n);
+	return r <= i ? [r, i] : [i, r];
+}, h = (e) => {
+	if (e.trim() === "") return null;
+	let t = Number(e);
+	return Number.isFinite(t) ? t : null;
+}, g = (e) => e != null && e !== !1 && e !== "", _ = (e, t, n, r) => e >= n && e <= r && t >= n && t <= r && e <= t, re = (e, t, n) => {
+	if (!Number.isFinite(e) || !Number.isFinite(t) || e >= t) throw RangeError("SNumberRange: `min` and `max` must be finite numbers and `min` must be less than `max`.");
+	if (!Number.isFinite(n) || n <= 0) throw RangeError("SNumberRange: `step` must be a finite number greater than 0.");
+}, ie = c("fieldset", {
+	name: "SNumberRange",
+	slot: "Root",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e }) => ({
+	border: 0,
+	display: "flex",
+	flexDirection: "column",
+	gap: e.spacing(1),
+	margin: 0,
+	minWidth: 0,
+	padding: 0,
+	width: "100%"
+})), ae = c("legend", {
+	name: "SNumberRange",
+	slot: "Label",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e }) => ({
+	...e.typography.body2,
+	color: (e.vars ?? e).palette.text.primary,
+	fontWeight: 600,
+	margin: 0,
+	padding: 0
+})), oe = c(s, {
+	name: "SNumberRange",
+	slot: "Slider",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e, ownerState: t }) => {
+	let n = t.size === "small";
+	return {
+		color: (e.vars ?? e).palette[t.color].main,
+		height: n ? 2 : 3,
+		padding: e.spacing(n ? 1 : 1.5, 0),
+		[`& .${f.rail}`]: {
+			backgroundColor: (e.vars ?? e).palette.action.selected,
+			opacity: 1
+		},
+		[`& .${f.track}`]: { border: 0 },
+		[`& .${f.thumb}`]: {
+			border: `2px solid ${(e.vars ?? e).palette.background.paper}`,
+			boxShadow: `0 0 0 1px ${(e.vars ?? e).palette[t.color].main}`,
+			height: n ? 14 : 18,
+			width: n ? 14 : 18,
+			[`&:hover, &.${f.focusVisible}`]: { boxShadow: `0 0 0 6px ${(e.vars ?? e).palette.action.selected}` }
+		},
+		[`& .${f.mark}`]: {
+			backgroundColor: (e.vars ?? e).palette[t.color].main,
+			borderRadius: e.radius.sm,
+			height: n ? 8 : 10,
+			opacity: 1,
+			width: n ? 3 : 4
+		}
+	};
+}), se = c(o, {
+	name: "SNumberRange",
+	slot: "Inputs",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e }) => ({
+	alignItems: "flex-start",
+	display: "flex",
+	gap: e.spacing(1)
+})), ce = c(n, {
+	name: "SNumberRange",
+	slot: "MinInput",
+	shouldForwardProp: (e) => e !== "ownerState"
+})({
+	flex: "1 1 0",
+	minWidth: 0
+}), le = c(n, {
+	name: "SNumberRange",
+	slot: "MaxInput",
+	shouldForwardProp: (e) => e !== "ownerState"
+})({
+	flex: "1 1 0",
+	minWidth: 0
+}), ue = c(o, {
+	name: "SNumberRange",
+	slot: "Separator",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ theme: e, ownerState: t }) => ({
+	alignItems: "center",
+	color: (e.vars ?? e).palette.text.secondary,
+	display: "inline-flex",
+	flex: "0 0 auto",
+	height: t.size === "small" ? 36 : 40,
+	marginTop: t.hasInputLabel ? "1.4375em" : 0,
+	paddingInline: e.spacing(.5),
+	userSelect: "none"
+})), v = r.forwardRef(function(n, o) {
+	let s = ee({
+		props: n,
+		name: "SNumberRange"
+	}), { color: c = "primary", defaultValue: f, disabled: v = !1, getAriaValueText: de, invalidRangeText: y = "Enter a value inside the allowed range", label: b, max: x = 100, maxLabel: S = "Maximum", min: C = 0, minLabel: w = "Minimum", onChange: fe, onChangeCommitted: T, separator: pe = "–", size: E = "medium", slotProps: D, slots: O, step: k = 1, sx: me, value: he, valueLabelFormat: A, ...ge } = s;
+	re(C, x, k);
+	let [_e, ve] = te({
+		controlled: he,
+		default: f ?? [C, x],
+		name: "SNumberRange",
+		state: "value"
+	}), [ye, j] = r.useState(null), M = m(_e, C, x), N = M[0], P = M[1], F = ye ?? [String(M[0]), String(M[1])], I = h(F[0]), L = h(F[1]), be = I !== null && L !== null && _(I, L, C, x), R = I === null || I < C || I > x || L !== null && I > L, z = L === null || L < C || L > x || I !== null && L < I;
+	r.useEffect(() => {
+		j(null);
+	}, [
+		x,
+		C,
+		P,
+		N
+	]);
+	let B = {
+		...s,
+		color: c,
+		disabled: v,
+		hasInputLabel: !1,
+		max: x,
+		maxInvalid: z,
+		min: C,
+		minInvalid: R,
+		size: E,
+		step: k,
+		value: M
+	}, V = t(D?.minInput, B), H = t(D?.maxInput, B), U = {
+		...B,
+		hasInputLabel: g(V?.label) || g(H?.label)
+	}, W = u((e, t) => {
+		let n = m(t, C, x);
+		return n[0] === M[0] && n[1] === M[1] ? n : (ve(n), fe?.(e, n), n);
+	}), xe = u((e, t) => {
+		Array.isArray(t) && (j(null), W(e, [t[0], t[1]]));
+	}), Se = u((e, t) => {
+		Array.isArray(t) && T?.(e, m([t[0], t[1]], C, x));
+	}), Ce = (e) => (t) => {
+		if (t.defaultPrevented) return;
+		let n = t.target.value, r = e === 0 ? [n, F[1]] : [F[0], n];
+		j(r);
+		let i = h(r[0]), a = h(r[1]);
+		i !== null && a !== null && _(i, a, C, x) && (j(null), W(t, [i, a]));
+	}, we = (e) => (t) => {
+		if (t.defaultPrevented) return;
+		let n = h(F[e]), r = n === null ? M : e === 0 ? [p(n, C, M[1]), M[1]] : [M[0], p(n, M[0], x)];
+		j(null);
+		let i = W(t, r);
+		T?.(t, i);
+	}, Te = (e) => {
+		if (e.defaultPrevented) return;
+		let t = e.target;
+		if (t.tagName === "INPUT") {
+			if (e.key === "Escape") {
+				e.preventDefault(), j(null);
+				return;
+			}
+			e.key === "Enter" && (e.preventDefault(), t.blur());
+		}
+	}, G = O?.root ?? ie, K = O?.label ?? ae, q = O?.slider ?? oe, J = O?.inputs ?? se, Y = O?.minInput ?? ce, X = O?.maxInput ?? le, Z = O?.separator ?? ue, { ref: Ee, sx: De, ...Oe } = d(G, l(t(D?.root, U), {
+		"aria-disabled": v || void 0,
+		...ge
+	}), U), ke = ne(Ee, o), Ae = d(K, t(D?.label, U) ?? {}, U), je = d(q, {
+		...l(t(D?.slider, U), { valueLabelDisplay: "auto" }),
+		color: c,
+		disableSwap: !0,
+		disabled: v,
+		getAriaLabel: (e) => e === 0 ? w : S,
+		getAriaValueText: de,
+		max: x,
+		min: C,
+		size: E,
+		step: k,
+		...A !== void 0 && { valueLabelFormat: A }
+	}, U), Q = d(J, t(D?.inputs, U) ?? {}, U), Me = d(Z, {
+		"aria-hidden": !0,
+		component: "span",
+		...t(D?.separator, U) ?? {}
+	}, U), $ = (e) => {
+		let { slotProps: t, ...n } = (e === 0 ? V : H) ?? {}, r = l(t?.htmlInput, { "aria-label": e === 0 ? w : S }), i = l({
+			inputMode: "decimal",
+			max: x,
+			min: C,
+			step: k
+		}, r), a = l(n, {
+			helperText: (e === 0 ? R : !R && z) ? y : void 0,
+			onBlur: we(e),
+			onChange: Ce(e),
+			onKeyDown: Te
+		});
+		return d(e === 0 ? Y : X, {
+			...a,
+			color: c,
+			disabled: v,
+			error: e === 0 ? R : z,
+			size: E,
+			slotProps: {
+				...t,
+				htmlInput: i
+			},
+			type: "number",
+			value: F[e]
+		}, U);
+	}, Ne = $(0), Pe = $(1);
+	return /* @__PURE__ */ a(G, {
+		...Oe,
+		ref: ke,
+		sx: [...e(me), ...e(De)],
+		"data-invalid": be ? void 0 : "",
+		children: [
+			b != null && /* @__PURE__ */ i(K, {
+				...Ae,
+				children: b
+			}),
+			/* @__PURE__ */ i(q, {
+				...je,
+				onChange: xe,
+				onChangeCommitted: Se,
+				value: [M[0], M[1]]
+			}),
+			/* @__PURE__ */ a(J, {
+				...Q,
+				children: [
+					/* @__PURE__ */ i(Y, { ...Ne }),
+					/* @__PURE__ */ i(Z, {
+						...Me,
+						children: pe
+					}),
+					/* @__PURE__ */ i(X, { ...Pe })
+				]
+			})
+		]
+	});
+});
+v.displayName = "SNumberRange";
+//#endregion
+export { v as SNumberRange, v as default };

package/dist/s-pagination/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-pagination-s46hBifh.js";
+import { SPagination as e } from "./s-pagination.js";
 export { e as SPagination, e as default };

package/dist/s-pagination/s-pagination.js

@@ -1,2 +1,85 @@
-import { t as e } from "../s-pagination-s46hBifh.js";
-export { e as SPagination, e as default };
+import { getPaginationDimensions as e } from "./types.js";
+import { styled as t, useThemeProps as n } from "@mui/material/styles";
+import * as r from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import o from "@mui/material/Stack";
+import s from "@mui/material/Skeleton";
+import c from "@mui/material/Pagination";
+//#region lib/s-pagination/s-pagination.tsx
+var l = 5, u = t(c, {
+	name: "SPagination",
+	slot: "Root",
+	shouldForwardProp: (e) => e !== "ownerState"
+})(({ ownerState: e }) => ({ ...e.loading && { display: "inline-flex" } })), d = r.forwardRef(function(t, c) {
+	let d = n({
+		props: t,
+		name: "SPagination"
+	}), { "aria-label": f = "pagination navigation", "aria-busy": p, className: m, color: h = "primary", count: g = 0, loading: _ = !1, loadingIndicator: v, shape: y = "rounded", size: b = "medium", style: x, sx: S, variant: C = "text", ...w } = d;
+	if (g <= 0) return null;
+	let T = e(b), E = _ || w.disabled, D = {
+		...d,
+		"aria-label": f,
+		color: h,
+		count: g,
+		disabled: E,
+		loading: _,
+		shape: y,
+		size: b,
+		variant: C
+	}, O = /* @__PURE__ */ i(o, {
+		"aria-label": `${f} loading`,
+		direction: "row",
+		role: "progressbar",
+		sx: {
+			alignItems: "center",
+			display: "inline-flex",
+			gap: `${T.gap}px`
+		},
+		children: v ?? (y === "circular" ? Array.from({ length: l }, (e, t) => /* @__PURE__ */ i(s, {
+			variant: "circular",
+			width: T.item,
+			height: T.item
+		}, t)) : /* @__PURE__ */ a(r.Fragment, { children: [
+			/* @__PURE__ */ i(s, {
+				variant: "rounded",
+				width: T.item,
+				height: T.item
+			}),
+			/* @__PURE__ */ i(s, {
+				variant: "rounded",
+				width: T.bar,
+				height: T.item
+			}),
+			/* @__PURE__ */ i(s, {
+				variant: "rounded",
+				width: T.item,
+				height: T.item
+			})
+		] }))
+	});
+	return /* @__PURE__ */ i(u, {
+		...w,
+		"aria-label": f,
+		"aria-busy": p ?? (_ || void 0),
+		className: m,
+		color: h,
+		count: _ ? 1 : g,
+		disabled: E,
+		hideNextButton: _ || w.hideNextButton,
+		hidePrevButton: _ || w.hidePrevButton,
+		ownerState: D,
+		page: w.page,
+		ref: c,
+		renderItem: _ ? () => O : w.renderItem,
+		shape: y,
+		showFirstButton: _ ? !1 : w.showFirstButton,
+		showLastButton: _ ? !1 : w.showLastButton,
+		size: b,
+		style: x,
+		sx: S,
+		variant: C
+	});
+});
+d.displayName = "SPagination";
+//#endregion
+export { d as SPagination, d as default };

package/dist/s-pixel-reveal/s-pixel-reveal.js

@@ -1,9 +1,9 @@
 import { toSxArray as e } from "../utils/sx.js";
 import { resolveCanvasColor as t } from "../utils/canvas-color.js";
-import { t as n } from "../useForkRef-BuNFTXxE.js";
-import { forwardRef as r, useCallback as i, useEffect as a, useRef as o } from "react";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { Box as l, styled as u, useMediaQuery as d, useTheme as f, useThemeProps as p } from "@mui/material";
+import { forwardRef as n, useCallback as r, useEffect as i, useRef as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Box as c, styled as l, useMediaQuery as u, useTheme as d, useThemeProps as f } from "@mui/material";
+import { useForkRef as p } from "@mui/material/utils";
 //#region lib/s-pixel-reveal/s-pixel-reveal.tsx
 var m = class {
 	x;
@@ -44,7 +44,7 @@ var m = class {
 		let n = (t - this.size) * .5;
 		e.fillRect(this.x + n, this.y + n, this.size, this.size);
 	}
-}, h = u(l, {
+}, h = l(c, {
 	name: "SPixelReveal",
 	slot: "Root"
 })({});
@@ -56,12 +56,12 @@ function g({ x: e, y: t, gap: n, logicalWidth: r, logicalHeight: i, instant: a,
 function _(e, t, n) {
 	e.has(t) || e.set(t, []), e.get(t)?.push(n);
 }
-var v = r(function(r, l) {
-	let u = p({
-		props: r,
+var v = n(function(n, c) {
+	let l = f({
+		props: n,
 		name: "SPixelReveal"
-	}), { alt: v = "", children: y, colors: b, gap: x = 5, instant: S = !0, loading: C = !0, speed: w = 100, src: T, style: E, sx: D, ...O } = u, k = Number.isFinite(x) && x > 0 ? x : 5, A = f(), j = o(null), M = o(null), N = o(null), P = o(/* @__PURE__ */ new Map()), F = o(null), I = o(null), L = o(1e3 / 60), R = o(0), z = o(C), B = d("(prefers-reduced-motion: reduce)", { noSsr: !0 }), V = n(M, l), H = {
-		...u,
+	}), { alt: v = "", children: y, colors: b, gap: x = 5, instant: S = !0, loading: C = !0, speed: w = 100, src: T, style: E, sx: D, ...O } = l, k = Number.isFinite(x) && x > 0 ? x : 5, A = d(), j = a(null), M = a(null), N = a(null), P = a(/* @__PURE__ */ new Map()), F = a(null), I = a(null), L = a(1e3 / 60), R = a(0), z = a(C), B = u("(prefers-reduced-motion: reduce)", { noSsr: !0 }), V = p(M, c), H = {
+		...l,
 		alt: v,
 		gap: k,
 		hasImage: !!T,
@@ -71,10 +71,10 @@ var v = r(function(r, l) {
 		src: T
 	};
 	z.current = C;
-	let U = i((e, t, n, r) => {
+	let U = r((e, t, n, r) => {
 		let i = e - n, a = t - r;
 		return i * i + a * a;
-	}, []), W = i((e, t, n) => {
+	}, []), W = r((e, t, n) => {
 		F.current !== null && cancelAnimationFrame(F.current), R.current = performance.now();
 		let r = () => {
 			F.current = requestAnimationFrame(r);
@@ -94,12 +94,12 @@ var v = r(function(r, l) {
 			}), !z.current && !o && F.current !== null && (cancelAnimationFrame(F.current), F.current = null);
 		};
 		r();
-	}, [k]), G = i((e, t, n) => {
+	}, [k]), G = r((e, t, n) => {
 		e.clearRect(0, 0, t, n), z.current && P.current.forEach((t, n) => {
 			e.fillStyle = n;
 			for (let n of t) n.size = n.maxSize, n.draw(e, k);
 		});
-	}, [k]), K = i(() => {
+	}, [k]), K = r(() => {
 		let e = j.current, n = e?.getContext("2d");
 		if (!e || !n) return;
 		P.current = /* @__PURE__ */ new Map();
@@ -136,7 +136,7 @@ var v = r(function(r, l) {
 		U,
 		G,
 		W
-	]), q = i(() => {
+	]), q = r(() => {
 		let e = j.current, t = M.current, n = e?.getContext("2d");
 		if (!e || !t || !n) return;
 		let r = t.getBoundingClientRect();
@@ -144,7 +144,7 @@ var v = r(function(r, l) {
 		let i = Math.floor(r.width), a = Math.floor(r.height), o = window.devicePixelRatio ?? 1;
 		e.width = i * o, e.height = a * o, e.style.width = `${i}px`, e.style.height = `${a}px`, n.setTransform(1, 0, 0, 1, 0, 0), n.scale(o, o), K();
 	}, [K]);
-	return a(() => {
+	return i(() => {
 		q();
 		let e = new ResizeObserver(() => {
 			I.current === null && (I.current = requestAnimationFrame(() => {
@@ -154,7 +154,7 @@ var v = r(function(r, l) {
 		return M.current && e.observe(M.current), () => {
 			e.disconnect(), I.current !== null && (cancelAnimationFrame(I.current), I.current = null), F.current !== null && (cancelAnimationFrame(F.current), F.current = null);
 		};
-	}, [q]), a(() => {
+	}, [q]), i(() => {
 		let e = j.current, t = e?.getContext("2d");
 		if (!e || !t || P.current.size === 0) return;
 		let n = window.devicePixelRatio ?? 1, r = e.width / n, i = e.height / n;
@@ -168,7 +168,7 @@ var v = r(function(r, l) {
 		B,
 		G,
 		W
-	]), /* @__PURE__ */ c(h, {
+	]), /* @__PURE__ */ s(h, {
 		...O,
 		ref: V,
 		ownerState: H,
@@ -180,7 +180,7 @@ var v = r(function(r, l) {
 			width: "100%"
 		}, ...e(D)],
 		children: [
-			T && /* @__PURE__ */ s("img", {
+			T && /* @__PURE__ */ o("img", {
 				ref: N,
 				src: T,
 				alt: v,
@@ -194,7 +194,7 @@ var v = r(function(r, l) {
 				}
 			}),
 			y,
-			/* @__PURE__ */ s("canvas", {
+			/* @__PURE__ */ o("canvas", {
 				ref: j,
 				style: {
 					position: "absolute",

package/dist/s-popover/s-popover-content.js

@@ -1,21 +1,20 @@
-import { t as e } from "../Box-9oeZgA1U.js";
-import { t } from "../styled-Bog8QCl3.js";
-import { t as n } from "../useThemeProps-Dw9dmKyT.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/Box";
 //#region lib/s-popover/s-popover-content.tsx
-var a = t(e, {
+var a = e(i, {
 	name: "SPopoverContent",
 	slot: "Root"
-})(({ theme: e }) => ({ padding: e.spacing(2) })), o = Object.assign(r.forwardRef(function(e, t) {
-	let r = n({
+})(({ theme: e }) => ({ padding: e.spacing(2) })), o = Object.assign(n.forwardRef(function(e, n) {
+	let i = t({
 		props: e,
 		name: "SPopoverContent"
 	});
-	return /* @__PURE__ */ i(a, {
-		...r,
-		ownerState: r,
-		ref: t
+	return /* @__PURE__ */ r(a, {
+		...i,
+		ownerState: i,
+		ref: n
 	});
 }), { displayName: "SPopoverContent" });
 //#endregion

package/dist/s-popover/s-popover.js

@@ -1,20 +1,18 @@
-import { t as e } from "../styled-Bog8QCl3.js";
-import { t } from "../useThemeProps-Dw9dmKyT.js";
-import { toSxArray as n } from "../utils/sx.js";
-import { resolveOwnerStateSlotProps as r } from "../utils/slots.js";
-import { t as i } from "../useForkRef-BuNFTXxE.js";
-import { t as a } from "../appendOwnerState-CFQTq3pb.js";
-import { t as o } from "../mergeSlotProps-DC8r4QzS.js";
-import { n as s, t as c } from "../Popover-BFdKSYI5.js";
-import { placementOrigins as l } from "./placement.js";
-import * as u from "react";
-import { jsx as d } from "react/jsx-runtime";
+import { toSxArray as e } from "../utils/sx.js";
+import { resolveOwnerStateSlotProps as t } from "../utils/slots.js";
+import { placementOrigins as n } from "./placement.js";
+import { styled as r, useThemeProps as i } from "@mui/material/styles";
+import * as a from "react";
+import { jsx as o } from "react/jsx-runtime";
+import { mergeSlotProps as s, useForkRef as c } from "@mui/material/utils";
+import l from "@mui/utils/appendOwnerState";
+import u, { PopoverPaper as d } from "@mui/material/Popover";
 //#region lib/s-popover/s-popover.tsx
-var f = .5, p = e(c, {
+var f = .5, p = r(u, {
 	name: "SPopover",
 	slot: "Root",
 	shouldForwardProp: (e) => e !== "ownerState"
-})(({ theme: e }) => ({ zIndex: e.zIndex.modal })), m = e(s, {
+})(({ theme: e }) => ({ zIndex: e.zIndex.modal })), m = r(d, {
 	name: "SPopover",
 	slot: "Paper",
 	shouldForwardProp: (e) => e !== "ownerState"
@@ -30,15 +28,15 @@ var f = .5, p = e(c, {
 		props: ({ ownerState: e }) => e?.placement?.startsWith("top") ?? !1,
 		style: { marginTop: e.spacing(-f) }
 	}]
-})), h = u.forwardRef(function(e, s) {
-	let c = t({
-		props: e,
+})), h = a.forwardRef(function(r, a) {
+	let u = i({
+		props: r,
 		name: "SPopover"
-	}), { placement: u = "bottom-end", slotProps: f, slots: h, sx: g, zIndex: _, ...v } = c, y = {
-		...c,
-		placement: u
-	}, { anchorOrigin: b, transformOrigin: x } = l[u], S = h?.root ?? p, C = h?.paper ?? m, { ref: w, sx: T, ...E } = a(S, o(r(f?.root, y), v), y), D = i(w, s), { sx: O, ...k } = a(C, r(f?.paper, y) ?? {}, y);
-	return /* @__PURE__ */ d(S, {
+	}), { placement: d = "bottom-end", slotProps: f, slots: h, sx: g, zIndex: _, ...v } = u, y = {
+		...u,
+		placement: d
+	}, { anchorOrigin: b, transformOrigin: x } = n[d], S = h?.root ?? p, C = h?.paper ?? m, { ref: w, sx: T, ...E } = l(S, s(t(f?.root, y), v), y), D = c(w, a), { sx: O, ...k } = l(C, t(f?.paper, y) ?? {}, y);
+	return /* @__PURE__ */ o(S, {
 		...E,
 		ref: D,
 		anchorOrigin: b,
@@ -51,14 +49,14 @@ var f = .5, p = e(c, {
 			backdrop: f?.backdrop,
 			paper: {
 				...k,
-				sx: n(O)
+				sx: e(O)
 			},
 			transition: f?.transition
 		},
 		sx: [
 			..._ === void 0 ? [] : [{ zIndex: _ }],
-			...n(T),
-			...n(g)
+			...e(T),
+			...e(g)
 		],
 		transformOrigin: x
 	});