@solostylist/ui-kit 2.0.0 → 2.0.1

package/dist/s-image-viewer/use-image-viewer-navigation.js

@@ -1,5 +1,5 @@
-import { t as e } from "../useControlled-BeB0W_Ui.js";
-import { useCallback as t } from "react";
+import { useCallback as e } from "react";
+import { useControlled as t } from "@mui/material/utils";
 //#region lib/s-image-viewer/use-image-viewer-navigation.ts
 var n = [
 	"a[href]",
@@ -28,21 +28,21 @@ var n = [
 	"[role=\"textbox\"]"
 ].join(", ");
 function r({ selectedItem: r, defaultSelectedItem: i, onItemChange: a, mediaItems: o, showNavigation: s }) {
-	let [c, l] = e({
+	let [c, l] = t({
 		controlled: r,
 		default: i ?? null,
 		name: "SImageViewer",
 		state: "selectedItem"
-	}), u = c ? o.findIndex((e) => e.id === c.id) : -1, d = !!(s && o.length > 1 && u >= 0), f = o.length, p = t((e, t, n) => {
+	}), u = c ? o.findIndex((e) => e.id === c.id) : -1, d = !!(s && o.length > 1 && u >= 0), f = o.length, p = e((e, t, n) => {
 		l(t), a?.(e, t, n);
-	}, [a, l]), m = t((e) => {
+	}, [a, l]), m = e((e) => {
 		d && u > 0 && p(e, o[u - 1], "previous");
 	}, [
 		d,
 		u,
 		o,
 		p
-	]), h = t((e) => {
+	]), h = e((e) => {
 		d && u < f - 1 && p(e, o[u + 1], "next");
 	}, [
 		d,
@@ -59,7 +59,7 @@ function r({ selectedItem: r, defaultSelectedItem: i, onItemChange: a, mediaItem
 		selectItem: p,
 		goToPrevious: m,
 		goToNext: h,
-		handleKeyDown: t((e) => {
+		handleKeyDown: e((e) => {
 			let t = e.target;
 			t instanceof Element && t.closest(n) || (e.key === "ArrowLeft" && d && u > 0 ? (e.preventDefault(), m(e)) : e.key === "ArrowRight" && d && u < f - 1 && (e.preventDefault(), h(e)));
 		}, [

package/dist/s-label/s-label.js

@@ -1,62 +1,61 @@
-import { t as e } from "../styled-Bog8QCl3.js";
-import { t } from "../Stack-UMc4dV4G.js";
-import { r as n } from "../elementAcceptingRef-DhkNAkFH.js";
-import { t as r } from "../useThemeProps-Cr28OQu3.js";
-import { toSxArray as i } from "../utils/sx.js";
-import { t as a } from "../appendOwnerState-CELpvdMz.js";
-import { t as o } from "../Typography-yXjc7kVP.js";
-import { t as s } from "../InfoOutlined-VC7X46pc.js";
-import { t as c } from "../Tooltip-DbCd6rgF.js";
-import * as l from "react";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { toSxArray as e } from "../utils/sx.js";
+import { styled as t, useThemeProps as n } from "@mui/material/styles";
+import r from "@mui/material/IconButton";
+import * as i from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import s from "@mui/material/Typography";
+import c from "@mui/utils/appendOwnerState";
+import l from "@mui/material/Tooltip";
+import u from "@mui/icons-material/InfoOutlined";
+import d from "@mui/material/Stack";
 //#region lib/s-label/s-label.tsx
-var f = e(t, {
+var f = t(d, {
 	name: "SLabel",
 	slot: "Root"
 })({});
 function p(e, t) {
 	return typeof e == "function" ? e(t) : e;
 }
-var m = (e, t) => !t && !(l.isValidElement(e) && e.type === o), h = l.forwardRef(function(e, l) {
-	let h = r({
-		props: e,
+var m = (e, t) => !t && !(i.isValidElement(e) && e.type === s), h = i.forwardRef(function(t, i) {
+	let h = n({
+		props: t,
 		name: "SLabel"
 	}), { children: g, disableLabelTypography: _ = !1, disableValueTypography: v = !1, hint: y, label: b, slotProps: x, slots: S, sx: C, ...w } = h, T = typeof y == "string" ? y.trim().length > 0 : !!y, E = {
 		...h,
 		disableLabelTypography: _,
 		disableValueTypography: v,
 		hasHint: T
-	}, D = S?.labelRow ?? t, O = S?.label ?? o, k = S?.value ?? o, A = S?.tooltip ?? c, j = S?.hintButton ?? n, M = a(S?.labelRow, p(x?.labelRow, E) ?? {}, E), N = a(S?.label, p(x?.label, E) ?? {}, E), P = a(S?.value, p(x?.value, E) ?? {}, E), F = a(S?.tooltip, p(x?.tooltip, E) ?? {}, E), I = a(S?.hintButton, p(x?.hintButton, E) ?? {}, E), L = m(b, _), R = m(g, v);
-	return /* @__PURE__ */ d(f, {
+	}, D = S?.labelRow ?? d, O = S?.label ?? s, k = S?.value ?? s, A = S?.tooltip ?? l, j = S?.hintButton ?? r, M = c(S?.labelRow, p(x?.labelRow, E) ?? {}, E), N = c(S?.label, p(x?.label, E) ?? {}, E), P = c(S?.value, p(x?.value, E) ?? {}, E), F = c(S?.tooltip, p(x?.tooltip, E) ?? {}, E), I = c(S?.hintButton, p(x?.hintButton, E) ?? {}, E), L = m(b, _), R = m(g, v);
+	return /* @__PURE__ */ o(f, {
 		...w,
-		ref: l,
+		ref: i,
 		ownerState: E,
-		sx: [{ width: "100%" }, ...i(C)],
-		children: [/* @__PURE__ */ d(D, {
+		sx: [{ width: "100%" }, ...e(C)],
+		children: [/* @__PURE__ */ o(D, {
 			direction: "row",
 			...M,
-			sx: [{ alignItems: "center" }, ...i(M?.sx)],
-			children: [L ? /* @__PURE__ */ u(O, {
+			sx: [{ alignItems: "center" }, ...e(M?.sx)],
+			children: [L ? /* @__PURE__ */ a(O, {
 				component: "span",
 				color: "text.secondary",
 				...N,
 				children: b
-			}) : b, E.hasHint ? /* @__PURE__ */ u(A, {
+			}) : b, E.hasHint ? /* @__PURE__ */ a(A, {
 				title: y,
 				placement: "top",
 				...F,
-				children: /* @__PURE__ */ u(j, {
+				children: /* @__PURE__ */ a(j, {
 					"aria-label": typeof y == "string" ? y : "More information",
 					size: "small",
 					...I,
 					sx: [{
 						ml: 1,
 						p: 0
-					}, ...i(I?.sx)],
-					children: /* @__PURE__ */ u(s, { fontSize: "inherit" })
+					}, ...e(I?.sx)],
+					children: /* @__PURE__ */ a(u, { fontSize: "inherit" })
 				})
 			}) : null]
-		}), R ? /* @__PURE__ */ u(k, {
+		}), R ? /* @__PURE__ */ a(k, {
 			component: "div",
 			...P,
 			children: g

package/dist/s-language-switcher/index.js

@@ -1,2 +1,2 @@
-import { n as e, r as t, t as n } from "../s-language-switcher-D-1nywT3.js";
-export { n as SLanguagePopover, e as SLanguageSwitcher, e as default, t as defaultLanguageOptions };
+import { SLanguagePopover as e, SLanguageSwitcher as t, defaultLanguageOptions as n } from "./s-language-switcher.js";
+export { e as SLanguagePopover, t as SLanguageSwitcher, t as default, n as defaultLanguageOptions };

package/dist/s-language-switcher/s-language-switcher.js

@@ -1,2 +1,150 @@
-import { n as e, r as t, t as n } from "../s-language-switcher-D-1nywT3.js";
-export { n as SLanguagePopover, e as SLanguageSwitcher, e as default, t as defaultLanguageOptions };
+import { SIconButton as e } from "../s-icon-button/s-icon-button.js";
+import { styled as t, useThemeProps as n } from "@mui/material/styles";
+import r from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import o from "@mui/material/Typography";
+import { mergeSlotProps as s } from "@mui/material/utils";
+import c from "@mui/material/ListItemIcon";
+import l from "@mui/material/Menu";
+import u from "@mui/material/MenuItem";
+import d from "react-country-flag";
+import { useTranslation as f } from "react-i18next";
+//#region lib/s-language-switcher/s-language-switcher.tsx
+var p = 16, m = 20, h = [{
+	code: "en",
+	label: "English",
+	countryCode: "GB"
+}, {
+	code: "vi",
+	label: "Vietnamese",
+	countryCode: "VN"
+}], g = t(l, {
+	name: "SLanguagePopover",
+	slot: "Root"
+})({}), _ = r.forwardRef(function(e, t) {
+	let r = n({
+		props: e,
+		name: "SLanguagePopover"
+	}), { anchorOrigin: l = {
+		horizontal: "right",
+		vertical: "bottom"
+	}, currentLanguage: f, languages: p = h, menuId: _, menuLabelledBy: v, menuWidth: y = "220px", onLanguageChange: b, slotProps: x, transformOrigin: S = {
+		horizontal: "right",
+		vertical: "top"
+	}, variant: C = "selectedMenu", ...w } = r, T = {
+		...r,
+		anchorOrigin: l,
+		currentLanguage: f,
+		languages: p,
+		menuId: _,
+		menuLabelledBy: v,
+		menuWidth: y,
+		onLanguageChange: b,
+		open: w.open,
+		slotProps: x,
+		transformOrigin: S,
+		variant: C
+	};
+	return /* @__PURE__ */ i(g, {
+		...w,
+		ref: t,
+		anchorOrigin: l,
+		ownerState: T,
+		slotProps: {
+			...x,
+			paper: s(x?.paper, { sx: { minWidth: y } }),
+			list: s(x?.list, {
+				id: _,
+				"aria-labelledby": v
+			})
+		},
+		transformOrigin: S,
+		variant: C,
+		children: p.map((e) => /* @__PURE__ */ a(u, {
+			onClick: (t) => {
+				b?.(t, e.code);
+			},
+			selected: f === e.code,
+			children: [/* @__PURE__ */ i(c, { children: /* @__PURE__ */ i(d, {
+				alt: "",
+				"aria-hidden": "true",
+				countryCode: e.countryCode,
+				svg: !0,
+				style: {
+					width: m,
+					height: m
+				}
+			}) }), /* @__PURE__ */ i(o, {
+				variant: "subtitle2",
+				children: e.label
+			})]
+		}, e.code))
+	});
+});
+_.displayName = "SLanguagePopover";
+var v = t(e, {
+	name: "SLanguageSwitcher",
+	slot: "Root"
+})({}), y = r.forwardRef(function(e, t) {
+	let o = n({
+		props: e,
+		name: "SLanguageSwitcher"
+	}), { "aria-label": s, languages: c = h, onLanguageChange: l, currentLanguage: u, tooltip: m, buttonFlagSize: g = p, menuWidth: y = "220px", onClick: b, useI18n: x = !0, ...S } = o, C = f(), w = x ? C.t : null, T = x ? C.i18n : null, [E, D] = r.useState(null), O = r.useId(), k = r.useId(), A = S.id ?? O, j = !!E, M = u ?? T?.language ?? c[0]?.code ?? "en", N = c.find((e) => e.code === M) || c[0], P = r.useCallback((e) => {
+		b?.(e), e.defaultPrevented || D(e.currentTarget);
+	}, [b]), F = r.useCallback(() => {
+		D(null);
+	}, []), I = r.useCallback((e, t) => {
+		l ? l(e, t) : T && T.changeLanguage(t), e.defaultPrevented || F();
+	}, [
+		F,
+		T,
+		l
+	]), L = m ?? (w ? w("header:language.tooltip") : "Change language"), R = {
+		...o,
+		"aria-label": s ?? (typeof L == "string" ? L : "Change language"),
+		buttonFlagSize: g,
+		currentLanguage: M,
+		languages: c,
+		menuWidth: y,
+		onClick: b,
+		onLanguageChange: l,
+		open: j,
+		tooltip: L,
+		useI18n: x
+	};
+	return /* @__PURE__ */ a(r.Fragment, { children: [/* @__PURE__ */ i(v, {
+		...S,
+		ref: t,
+		id: A,
+		"aria-controls": j ? k : void 0,
+		"aria-expanded": j || void 0,
+		"aria-haspopup": "menu",
+		"aria-label": s ?? (typeof L == "string" ? L : "Change language"),
+		onClick: P,
+		ownerState: R,
+		tooltip: L,
+		children: /* @__PURE__ */ i(d, {
+			alt: "",
+			"aria-hidden": "true",
+			countryCode: N?.countryCode || "US",
+			svg: !0,
+			style: {
+				width: g,
+				height: g
+			}
+		})
+	}), /* @__PURE__ */ i(_, {
+		anchorEl: E,
+		menuId: k,
+		menuLabelledBy: A,
+		onClose: F,
+		open: j,
+		onLanguageChange: I,
+		languages: c,
+		currentLanguage: M,
+		menuWidth: y
+	})] });
+});
+y.displayName = "SLanguageSwitcher";
+//#endregion
+export { _ as SLanguagePopover, y as SLanguageSwitcher, y as default, h as defaultLanguageOptions };

package/dist/s-lazy-image/s-lazy-image.js

@@ -1,17 +1,16 @@
 import { toSxArray as e } from "../utils/sx.js";
-import { t } from "../useForkRef-CKneCEtr.js";
-import { t as n } from "../mergeSlotProps-xl1-PgWL.js";
-import * as r from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-import { Box as o, Skeleton as s, styled as c, useTheme as l, useThemeProps as u } from "@mui/material";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Box as i, Skeleton as a, styled as o, useTheme as s, useThemeProps as c } from "@mui/material";
+import { mergeSlotProps as l, useForkRef as u } from "@mui/material/utils";
 //#region lib/s-lazy-image/s-lazy-image.tsx
-var d = c(o, {
+var d = o(i, {
 	name: "SLazyImage",
 	slot: "Root"
-})({}), f = c("img", {
+})({}), f = o("img", {
 	name: "SLazyImage",
 	slot: "Image"
-})({}), p = c(s, {
+})({}), p = o(a, {
 	name: "SLazyImage",
 	slot: "Skeleton"
 })({});
@@ -21,12 +20,12 @@ function m(e, t) {
 function h(e, t) {
 	return e === "circular" ? "50%" : e === "rounded" ? typeof t == "number" ? `${t}px` : t : 0;
 }
-var g = r.forwardRef(function(o, s) {
-	let c = u({
-		props: o,
+var g = t.forwardRef(function(i, a) {
+	let o = c({
+		props: i,
 		name: "SLazyImage"
-	}), { alt: g, height: _ = "100%", minHeight: v = "auto", minWidth: y = "auto", slotProps: b, slots: x, src: S, sx: C, variant: w = "rounded", width: T = "100%", ...E } = c, D = l(), [O, k] = r.useState(null), A = O === S, j = {
-		...c,
+	}), { alt: g, height: _ = "100%", minHeight: v = "auto", minWidth: y = "auto", slotProps: b, slots: x, src: S, sx: C, variant: w = "rounded", width: T = "100%", ...E } = o, D = s(), [O, k] = t.useState(null), A = O === S, j = {
+		...o,
 		alt: g,
 		height: _,
 		loaded: A,
@@ -35,13 +34,13 @@ var g = r.forwardRef(function(o, s) {
 		src: S,
 		variant: w,
 		width: T
-	}, M = x?.root ?? d, N = x?.image ?? f, P = x?.skeleton ?? p, F = m(b?.root, j), I = m(b?.image, j), L = m(b?.skeleton, j), { ref: R, sx: z, ...B } = n(F, {
+	}, M = x?.root ?? d, N = x?.image ?? f, P = x?.skeleton ?? p, F = m(b?.root, j), I = m(b?.image, j), L = m(b?.skeleton, j), { ref: R, sx: z, ...B } = l(F, {
 		...E,
 		sx: C
-	}), { onLoad: V, sx: H, ...U } = I ?? {}, { sx: W, ...G } = L ?? {}, K = h(w, D.shape.borderRadius), q = t(R, s), J = (e) => {
+	}), { onLoad: V, sx: H, ...U } = I ?? {}, { sx: W, ...G } = L ?? {}, K = h(w, D.shape.borderRadius), q = u(R, a), J = (e) => {
 		k(S), V?.(e);
 	}, Y = { ownerState: j }, X = { ownerState: j }, Z = { ownerState: j };
-	return /* @__PURE__ */ a(M, {
+	return /* @__PURE__ */ r(M, {
 		...B,
 		...Y,
 		ref: q,
@@ -52,7 +51,7 @@ var g = r.forwardRef(function(o, s) {
 			position: "relative",
 			width: T
 		}, ...e(z)],
-		children: [A ? null : /* @__PURE__ */ i(P, {
+		children: [A ? null : /* @__PURE__ */ n(P, {
 			animation: "wave",
 			variant: w,
 			...G,
@@ -63,7 +62,7 @@ var g = r.forwardRef(function(o, s) {
 				minWidth: y,
 				width: "100%"
 			}, ...e(W)]
-		}), /* @__PURE__ */ i(N, {
+		}), /* @__PURE__ */ n(N, {
 			...U,
 			...X,
 			alt: g,

package/dist/s-link/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-link-CAMTGfd9.js";
+import { SLink as e } from "./s-link.js";
 export { e as SLink, e as default };

package/dist/s-link/s-link.js

@@ -1,2 +1,5 @@
-import { t as e } from "../s-link-CAMTGfd9.js";
-export { e as SLink, e as default };
+import e from "@mui/material/Link";
+//#region lib/s-link/s-link.tsx
+var t = e;
+//#endregion
+export { t as SLink, t as default };

package/dist/s-localization-provider/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-localization-provider-Xw3NO2uP.js";
+import { SLocalizationProvider as e } from "./s-localization-provider.js";
 export { e as SLocalizationProvider, e as default };

package/dist/s-localization-provider/s-localization-provider.js

@@ -1,2 +1,12 @@
-import { t as e } from "../s-localization-provider-Xw3NO2uP.js";
-export { e as SLocalizationProvider, e as default };
+import "react";
+import { jsx as e } from "react/jsx-runtime";
+import { AdapterDayjs as t } from "@mui/x-date-pickers/AdapterDayjs";
+import { LocalizationProvider as n } from "@mui/x-date-pickers/LocalizationProvider";
+//#region lib/s-localization-provider/s-localization-provider.tsx
+var r = (r) => /* @__PURE__ */ e(n, {
+	...r,
+	dateAdapter: t
+});
+r.displayName = "SLocalizationProvider";
+//#endregion
+export { r as SLocalizationProvider, r as default };

package/dist/s-nav-item/s-nav-item.js

@@ -1,36 +1,36 @@
 import { toSxArray as e } from "../utils/sx.js";
-import { t } from "../appendOwnerState-CELpvdMz.js";
-import * as n from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Box as a, ListItemButton as o, Typography as s, styled as c, useThemeProps as l } from "@mui/material";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Box as i, ListItemButton as a, Typography as o, styled as s, useThemeProps as c } from "@mui/material";
+import l from "@mui/utils/appendOwnerState";
 //#region lib/s-nav-item/s-nav-item.tsx
-var u = c("li", {
+var u = s("li", {
 	name: "SNavItem",
 	slot: "Root"
 })({});
 function d(e, t) {
 	return typeof e == "function" ? e(t) : e;
 }
-var f = n.forwardRef(function(n, c) {
-	let f = l({
-		props: n,
+var f = t.forwardRef(function(t, s) {
+	let f = c({
+		props: t,
 		name: "SNavItem"
 	}), { action: p, disabled: m = !1, href: h, icon: g, onClick: _, primary: v, selected: y = !1, slotProps: b, slots: x, sx: S, ...C } = f, w = {
 		...f,
 		disabled: m,
 		selected: y
-	}, T = x?.button ?? o, E = x?.icon ?? a, D = x?.primary ?? s, O = x?.action ?? a, k = d(b?.button, w), A = d(b?.icon, w), j = d(b?.primary, w), M = d(b?.action, w), N = t(x?.button, k ?? {}, w), P = t(x?.icon, A ?? {}, w), F = t(x?.primary, j ?? {}, w), I = t(x?.action, M ?? {}, w), { onClick: L, sx: R, ...z } = N, { sx: B, ...V } = P, { sx: H, ...U } = I, W = L || _ ? (e) => {
+	}, T = x?.button ?? a, E = x?.icon ?? i, D = x?.primary ?? o, O = x?.action ?? i, k = d(b?.button, w), A = d(b?.icon, w), j = d(b?.primary, w), M = d(b?.action, w), N = l(x?.button, k ?? {}, w), P = l(x?.icon, A ?? {}, w), F = l(x?.primary, j ?? {}, w), I = l(x?.action, M ?? {}, w), { onClick: L, sx: R, ...z } = N, { sx: B, ...V } = P, { sx: H, ...U } = I, W = L || _ ? (e) => {
 		L?.(e), e.defaultPrevented || _?.(e);
 	} : void 0;
-	return /* @__PURE__ */ r(u, {
+	return /* @__PURE__ */ n(u, {
 		...C,
-		ref: c,
+		ref: s,
 		ownerState: w,
 		sx: [{
 			display: "block",
 			userSelect: "none"
 		}, ...e(S)],
-		children: /* @__PURE__ */ i(T, {
+		children: /* @__PURE__ */ r(T, {
 			component: h ? "a" : "div",
 			...z,
 			"aria-current": y ? "page" : void 0,
@@ -49,14 +49,14 @@ var f = n.forwardRef(function(n, c) {
 				"&.Mui-disabled": { cursor: "not-allowed" },
 				"@media (hover: hover) and (pointer: fine)": { "&:hover": { color: "text.primary" } }
 			}, ...e(R)],
-			children: [/* @__PURE__ */ i(a, {
+			children: [/* @__PURE__ */ r(i, {
 				sx: {
 					alignItems: "center",
 					display: "flex",
 					gap: 1,
 					minWidth: 0
 				},
-				children: [g == null ? null : /* @__PURE__ */ r(E, {
+				children: [g == null ? null : /* @__PURE__ */ n(E, {
 					component: "span",
 					...V,
 					sx: [{
@@ -65,12 +65,12 @@ var f = n.forwardRef(function(n, c) {
 						justifyContent: "center"
 					}, ...e(B)],
 					children: g
-				}), /* @__PURE__ */ r(D, {
+				}), /* @__PURE__ */ n(D, {
 					component: "span",
 					...F,
 					children: v
 				})]
-			}), p == null ? null : /* @__PURE__ */ r(O, {
+			}), p == null ? null : /* @__PURE__ */ n(O, {
 				component: "span",
 				...U,
 				sx: [{

package/dist/s-nav-items/index.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "../s-nav-items-BUp7DddG.js";
-export { t as SNavGroupItem, e as SNavItems, e as default };
+import { SNavGroupItem as e, SNavItems as t } from "./s-nav-items.js";
+export { e as SNavGroupItem, t as SNavItems, t as default };

package/dist/s-nav-items/s-nav-items.js

@@ -1,2 +1,167 @@
-import { n as e, t } from "../s-nav-items-BUp7DddG.js";
-export { t as SNavGroupItem, e as SNavItems, e as default };
+import { toSxArray as e } from "../utils/sx.js";
+import { SNavItem as t } from "../s-nav-item/s-nav-item.js";
+import { styled as n, useThemeProps as r } from "@mui/material/styles";
+import * as i from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import s from "@mui/icons-material/ExpandMore";
+import c from "@mui/material/Typography";
+import l from "@mui/material/Stack";
+import u from "@mui/material/Box";
+import d from "@mui/material/Collapse";
+import f from "@mui/material/ListItemButton";
+//#region lib/s-nav-items/s-nav-items.tsx
+var p = n(i.forwardRef(function(e, t) {
+	return /* @__PURE__ */ a(l, {
+		component: "ul",
+		...e,
+		ref: t
+	});
+}), {
+	name: "SNavItems",
+	slot: "Root"
+})({});
+function m(e, t) {
+	return e.some((e) => e.href && (t === e.href || t.startsWith(e.href + "/")) ? !0 : e.items ? m(e.items, t) : !1);
+}
+function h(e, t) {
+	return !!(e.href && (t === e.href || t.startsWith(e.href + "/")));
+}
+function g(e, t) {
+	let n = e.items ?? [];
+	return {
+		active: h(e, t),
+		childActive: n.length > 0 && m(n, t)
+	};
+}
+function _({ item: e, pathname: n, depth: r, linkComponent: l }) {
+	let p = !!(e.items && e.items.length > 0), { active: m, childActive: h } = g(e, n), [_, y] = i.useState(e.defaultOpen ?? h);
+	if (i.useEffect(() => {
+		h && y(!0);
+	}, [h]), !p) return /* @__PURE__ */ a(t, {
+		disabled: e.disabled,
+		href: e.href,
+		icon: e.icon ? e.icon(m) : null,
+		primary: e.title,
+		selected: m,
+		slotProps: { button: {
+			component: e.component ?? l,
+			rel: e.rel,
+			target: e.target,
+			sx: r > 0 ? { pl: `${(r - 1) * 12 + 12}px` } : void 0
+		} }
+	});
+	let b = m || h;
+	return /* @__PURE__ */ o(u, {
+		component: "li",
+		sx: {
+			userSelect: "none",
+			display: "block"
+		},
+		children: [/* @__PURE__ */ o(f, {
+			onClick: () => y((e) => !e),
+			disabled: e.disabled,
+			selected: b,
+			sx: {
+				alignItems: "center",
+				borderRadius: 1,
+				color: b ? "text.primary" : "text.secondary",
+				display: "flex",
+				flex: "0 0 auto",
+				gap: 1,
+				justifyContent: "space-between",
+				p: 1.5,
+				pl: r > 0 ? `${r * 12 + 12}px` : "12px",
+				whiteSpace: "nowrap",
+				width: "100%",
+				"&.Mui-disabled": {
+					color: "text.disabled",
+					cursor: "not-allowed"
+				},
+				"@media (hover: hover) and (pointer: fine)": { "&:hover": { ...!b && !e.disabled && {
+					bgcolor: "action.hover",
+					color: "text.primary"
+				} } }
+			},
+			"aria-expanded": _,
+			children: [/* @__PURE__ */ o(u, {
+				sx: {
+					alignItems: "center",
+					display: "flex",
+					gap: 1
+				},
+				children: [e.icon ? /* @__PURE__ */ a(u, {
+					component: "span",
+					sx: {
+						display: "flex",
+						alignItems: "center",
+						justifyContent: "center"
+					},
+					children: e.icon(b)
+				}) : null, /* @__PURE__ */ a(c, {
+					component: "span",
+					variant: "body1",
+					children: e.title
+				})]
+			}), /* @__PURE__ */ a(u, {
+				component: "span",
+				sx: {
+					display: "flex",
+					alignItems: "center",
+					color: "text.secondary",
+					transition: "transform 200ms ease",
+					transform: _ ? "rotate(0deg)" : "rotate(-90deg)"
+				},
+				children: /* @__PURE__ */ a(s, {})
+			})]
+		}), /* @__PURE__ */ a(d, {
+			in: _,
+			timeout: 200,
+			unmountOnExit: !0,
+			children: /* @__PURE__ */ a(u, {
+				sx: {
+					ml: r > 0 ? `${r * 16 + 12}px` : "12px",
+					mt: 1,
+					mb: 1,
+					pl: 1
+				},
+				children: /* @__PURE__ */ a(v, {
+					items: e.items,
+					pathname: n,
+					depth: r + 1,
+					linkComponent: l
+				})
+			})
+		})]
+	});
+}
+_.displayName = "SNavGroupItem";
+var v = i.forwardRef(function(t, n) {
+	let i = r({
+		props: t,
+		name: "SNavItems"
+	}), { depth: o = 0, items: s, linkComponent: c, pathname: l = "", sx: u, ...d } = i, f = {
+		...i,
+		depth: o,
+		pathname: l
+	};
+	return /* @__PURE__ */ a(p, {
+		spacing: 1,
+		...d,
+		ref: n,
+		ownerState: f,
+		sx: [{
+			listStyle: "none",
+			m: 0,
+			p: 0
+		}, ...e(u)],
+		children: s.map((e) => /* @__PURE__ */ a(_, {
+			item: e,
+			pathname: l,
+			depth: o,
+			linkComponent: c
+		}, e.key))
+	});
+});
+v.displayName = "SNavItems";
+//#endregion
+export { _ as SNavGroupItem, v as SNavItems, v as default };

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

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