@solostylist/ui-kit 2.0.0 → 2.0.2

package/dist/s-language-switcher-D-1nywT3.js

@@ -1,251 +0,0 @@
-import { n as e } from "./chunk-C_CI6nMA.js";
-import { t } from "./prop-types-BzYPyWN7.js";
-import { r as n, t as r } from "./DefaultPropsProvider-ebWx4_5E.js";
-import { t as i } from "./clsx-DGZSe4Nt.js";
-import { t as a } from "./styled-Bog8QCl3.js";
-import { t as o } from "./memoTheme-qFyKAk7y.js";
-import { t as s } from "./useThemeProps-Cr28OQu3.js";
-import { t as c } from "./mergeSlotProps-xl1-PgWL.js";
-import { t as l } from "./ListContext-B1HQt3OD.js";
-import { t as u } from "./Menu-C4Zabc9U.js";
-import { t as d } from "./Typography-yXjc7kVP.js";
-import { SIconButton as f } from "./s-icon-button/s-icon-button.js";
-import { r as p, t as m } from "./MenuItem-rXJfQzDC.js";
-import * as h from "react";
-import g, { createElement as _ } from "react";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
-import { useTranslation as b } from "react-i18next";
-//#region ../../node_modules/@mui/material/ListItemIcon/ListItemIcon.mjs
-var x = /* @__PURE__ */ e(t(), 1), S = (e) => {
-	let { alignItems: t, classes: r } = e;
-	return n({ root: ["root", t === "flex-start" && "alignItemsFlexStart"] }, p, r);
-}, C = a("div", {
-	name: "MuiListItemIcon",
-	slot: "Root",
-	overridesResolver: (e, t) => {
-		let { ownerState: n } = e;
-		return [t.root, n.alignItems === "flex-start" && t.alignItemsFlexStart];
-	}
-})(o(({ theme: e }) => ({
-	minWidth: e.spacing(4.5),
-	color: (e.vars || e).palette.action.active,
-	flexShrink: 0,
-	display: "inline-flex",
-	variants: [{
-		props: { alignItems: "flex-start" },
-		style: { marginTop: 8 }
-	}]
-}))), w = /* @__PURE__ */ h.forwardRef(function(e, t) {
-	let n = r({
-		props: e,
-		name: "MuiListItemIcon"
-	}), { className: a, ...o } = n, s = h.useContext(l), c = {
-		...n,
-		alignItems: s.alignItems
-	};
-	return /* @__PURE__ */ v(C, {
-		className: i(S(c).root, a),
-		ownerState: c,
-		ref: t,
-		...o
-	});
-});
-process.env.NODE_ENV !== "production" && (w.propTypes = {
-	children: x.default.node,
-	classes: x.default.object,
-	className: x.default.string,
-	sx: x.default.oneOfType([
-		x.default.arrayOf(x.default.oneOfType([
-			x.default.func,
-			x.default.object,
-			x.default.bool
-		])),
-		x.default.func,
-		x.default.object
-	])
-});
-//#endregion
-//#region ../../node_modules/react-country-flag/dist/react-country-flag.esm.js
-function T() {
-	return T = Object.assign ? Object.assign.bind() : function(e) {
-		for (var t = 1; t < arguments.length; t++) {
-			var n = arguments[t];
-			for (var r in n) Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
-		}
-		return e;
-	}, T.apply(this, arguments);
-}
-function E(e, t) {
-	if (e == null) return {};
-	var n = {}, r = Object.keys(e), i, a;
-	for (a = 0; a < r.length; a++) i = r[a], !(t.indexOf(i) >= 0) && (n[i] = e[i]);
-	return n;
-}
-var D = [
-	"cdnSuffix",
-	"cdnUrl",
-	"countryCode",
-	"style",
-	"svg"
-], O = "https://cdn.jsdelivr.net/gh/lipis/flag-icons/flags/4x3/", k = "svg", A = 127397, j = function(e) {
-	var t = e.cdnSuffix, n = t === void 0 ? k : t, r = e.cdnUrl, i = r === void 0 ? O : r, a = e.countryCode, o = e.style, s = e.svg, c = s === void 0 ? !1 : s, l = E(e, D);
-	if (typeof a != "string") return null;
-	if (c) {
-		var u = "" + i + a.toLowerCase() + "." + n;
-		return _("img", Object.assign({}, l, {
-			src: u,
-			style: T({
-				display: "inline-block",
-				width: "1em",
-				height: "1em",
-				verticalAlign: "middle"
-			}, o)
-		}));
-	}
-	var d = a.toUpperCase().replace(/./g, function(e) {
-		return String.fromCodePoint(e.charCodeAt(0) + A);
-	});
-	return _("span", Object.assign({ role: "img" }, l, { style: T({
-		display: "inline-block",
-		fontSize: "1em",
-		lineHeight: "1em",
-		verticalAlign: "middle"
-	}, o) }), d);
-}, M = 16, N = 20, P = [{
-	code: "en",
-	label: "English",
-	countryCode: "GB"
-}, {
-	code: "vi",
-	label: "Vietnamese",
-	countryCode: "VN"
-}], F = a(u, {
-	name: "SLanguagePopover",
-	slot: "Root"
-})({}), I = g.forwardRef(function(e, t) {
-	let n = s({
-		props: e,
-		name: "SLanguagePopover"
-	}), { anchorOrigin: r = {
-		horizontal: "right",
-		vertical: "bottom"
-	}, currentLanguage: i, languages: a = P, menuId: o, menuLabelledBy: l, menuWidth: u = "220px", onLanguageChange: f, slotProps: p, transformOrigin: h = {
-		horizontal: "right",
-		vertical: "top"
-	}, variant: g = "selectedMenu", ..._ } = n, b = {
-		...n,
-		anchorOrigin: r,
-		currentLanguage: i,
-		languages: a,
-		menuId: o,
-		menuLabelledBy: l,
-		menuWidth: u,
-		onLanguageChange: f,
-		open: _.open,
-		slotProps: p,
-		transformOrigin: h,
-		variant: g
-	};
-	return /* @__PURE__ */ v(F, {
-		..._,
-		ref: t,
-		anchorOrigin: r,
-		ownerState: b,
-		slotProps: {
-			...p,
-			paper: c(p?.paper, { sx: { minWidth: u } }),
-			list: c(p?.list, {
-				id: o,
-				"aria-labelledby": l
-			})
-		},
-		transformOrigin: h,
-		variant: g,
-		children: a.map((e) => /* @__PURE__ */ y(m, {
-			onClick: (t) => {
-				f?.(t, e.code);
-			},
-			selected: i === e.code,
-			children: [/* @__PURE__ */ v(w, { children: /* @__PURE__ */ v(j, {
-				alt: "",
-				"aria-hidden": "true",
-				countryCode: e.countryCode,
-				svg: !0,
-				style: {
-					width: N,
-					height: N
-				}
-			}) }), /* @__PURE__ */ v(d, {
-				variant: "subtitle2",
-				children: e.label
-			})]
-		}, e.code))
-	});
-});
-I.displayName = "SLanguagePopover";
-var L = a(f, {
-	name: "SLanguageSwitcher",
-	slot: "Root"
-})({}), R = g.forwardRef(function(e, t) {
-	let n = s({
-		props: e,
-		name: "SLanguageSwitcher"
-	}), { "aria-label": r, languages: i = P, onLanguageChange: a, currentLanguage: o, tooltip: c, buttonFlagSize: l = M, menuWidth: u = "220px", onClick: d, useI18n: f = !0, ...p } = n, m = b(), h = f ? m.t : null, _ = f ? m.i18n : null, [x, S] = g.useState(null), C = g.useId(), w = g.useId(), T = p.id ?? C, E = !!x, D = o ?? _?.language ?? i[0]?.code ?? "en", O = i.find((e) => e.code === D) || i[0], k = g.useCallback((e) => {
-		d?.(e), e.defaultPrevented || S(e.currentTarget);
-	}, [d]), A = g.useCallback(() => {
-		S(null);
-	}, []), N = g.useCallback((e, t) => {
-		a ? a(e, t) : _ && _.changeLanguage(t), e.defaultPrevented || A();
-	}, [
-		A,
-		_,
-		a
-	]), F = c ?? (h ? h("header:language.tooltip") : "Change language"), R = {
-		...n,
-		"aria-label": r ?? (typeof F == "string" ? F : "Change language"),
-		buttonFlagSize: l,
-		currentLanguage: D,
-		languages: i,
-		menuWidth: u,
-		onClick: d,
-		onLanguageChange: a,
-		open: E,
-		tooltip: F,
-		useI18n: f
-	};
-	return /* @__PURE__ */ y(g.Fragment, { children: [/* @__PURE__ */ v(L, {
-		...p,
-		ref: t,
-		id: T,
-		"aria-controls": E ? w : void 0,
-		"aria-expanded": E || void 0,
-		"aria-haspopup": "menu",
-		"aria-label": r ?? (typeof F == "string" ? F : "Change language"),
-		onClick: k,
-		ownerState: R,
-		tooltip: F,
-		children: /* @__PURE__ */ v(j, {
-			alt: "",
-			"aria-hidden": "true",
-			countryCode: O?.countryCode || "US",
-			svg: !0,
-			style: {
-				width: l,
-				height: l
-			}
-		})
-	}), /* @__PURE__ */ v(I, {
-		anchorEl: x,
-		menuId: w,
-		menuLabelledBy: T,
-		onClose: A,
-		open: E,
-		onLanguageChange: N,
-		languages: i,
-		currentLanguage: D,
-		menuWidth: u
-	})] });
-});
-R.displayName = "SLanguageSwitcher";
-//#endregion
-export { R as n, P as r, I as t };

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

@@ -1,327 +0,0 @@
-import { n as e } from "./chunk-C_CI6nMA.js";
-import { t } from "./prop-types-BzYPyWN7.js";
-import { r as n, t as r } from "./DefaultPropsProvider-ebWx4_5E.js";
-import { t as i } from "./clsx-DGZSe4Nt.js";
-import { t as a } from "./Box-9oeZgA1U.js";
-import { n as o, t as s } from "./styled-Bog8QCl3.js";
-import { t as c } from "./Stack-UMc4dV4G.js";
-import { t as l } from "./memoTheme-qFyKAk7y.js";
-import { t as u } from "./useThemeProps-Cr28OQu3.js";
-import { toSxArray as d } from "./utils/sx.js";
-import { t as f } from "./ButtonBase-DxKtpFYs.js";
-import { t as p } from "./useForkRef-CKneCEtr.js";
-import { t as m } from "./useEnhancedEffect-Bc3gBClC.js";
-import { t as h } from "./ListContext-B1HQt3OD.js";
-import { t as g } from "./ExpandMore-Ba5bg6s-.js";
-import { t as _ } from "./Typography-yXjc7kVP.js";
-import { SNavItem as v } from "./s-nav-item/s-nav-item.js";
-import { t as y } from "./Collapse-zgIFP5Sj.js";
-import { n as b, t as x } from "./listItemButtonClasses-DbL-aTVf.js";
-import * as S from "react";
-import { jsx as C, jsxs as w } from "react/jsx-runtime";
-//#region ../../node_modules/@mui/material/ListItemButton/ListItemButton.mjs
-var T = /* @__PURE__ */ e(t(), 1), E = (e, t) => {
-	let { ownerState: n } = e;
-	return [
-		t.root,
-		n.dense && t.dense,
-		n.alignItems === "flex-start" && t.alignItemsFlexStart,
-		n.divider && t.divider,
-		!n.disableGutters && t.gutters
-	];
-}, D = (e) => {
-	let { alignItems: t, classes: r, dense: i, disabled: a, disableGutters: o, divider: s, selected: c } = e, l = n({ root: [
-		"root",
-		i && "dense",
-		!o && "gutters",
-		s && "divider",
-		a && "disabled",
-		t === "flex-start" && "alignItemsFlexStart",
-		c && "selected"
-	] }, x, r);
-	return {
-		...r,
-		...l
-	};
-}, O = s(f, {
-	shouldForwardProp: (e) => o(e) || e === "classes",
-	name: "MuiListItemButton",
-	slot: "Root",
-	overridesResolver: E
-})(l(({ theme: e }) => ({
-	display: "flex",
-	flexGrow: 1,
-	justifyContent: "flex-start",
-	alignItems: "center",
-	position: "relative",
-	textDecoration: "none",
-	minWidth: 0,
-	boxSizing: "border-box",
-	textAlign: "left",
-	paddingTop: 8,
-	paddingBottom: 8,
-	transition: e.transitions.create("background-color", { duration: e.transitions.duration.shortest }),
-	"&:hover": {
-		textDecoration: "none",
-		backgroundColor: (e.vars || e).palette.action.hover,
-		"@media (hover: none)": { backgroundColor: "transparent" }
-	},
-	[`&.${b.selected}`]: {
-		backgroundColor: e.alpha((e.vars || e).palette.primary.main, (e.vars || e).palette.action.selectedOpacity),
-		[`&.${b.focusVisible}`]: { backgroundColor: e.alpha((e.vars || e).palette.primary.main, `${(e.vars || e).palette.action.selectedOpacity} + ${(e.vars || e).palette.action.focusOpacity}`) }
-	},
-	[`&.${b.selected}:hover`]: {
-		backgroundColor: e.alpha((e.vars || e).palette.primary.main, `${(e.vars || e).palette.action.selectedOpacity} + ${(e.vars || e).palette.action.hoverOpacity}`),
-		"@media (hover: none)": { backgroundColor: e.alpha((e.vars || e).palette.primary.main, (e.vars || e).palette.action.selectedOpacity) }
-	},
-	[`&.${b.focusVisible}`]: { backgroundColor: (e.vars || e).palette.action.focus },
-	[`&.${b.disabled}`]: { opacity: (e.vars || e).palette.action.disabledOpacity },
-	variants: [
-		{
-			props: ({ ownerState: e }) => e.divider,
-			style: {
-				borderBottom: `1px solid ${(e.vars || e).palette.divider}`,
-				backgroundClip: "padding-box"
-			}
-		},
-		{
-			props: { alignItems: "flex-start" },
-			style: { alignItems: "flex-start" }
-		},
-		{
-			props: ({ ownerState: e }) => !e.disableGutters,
-			style: {
-				paddingLeft: 16,
-				paddingRight: 16
-			}
-		},
-		{
-			props: ({ ownerState: e }) => e.dense,
-			style: {
-				paddingTop: 4,
-				paddingBottom: 4
-			}
-		}
-	]
-}))), k = /* @__PURE__ */ S.forwardRef(function(e, t) {
-	let n = r({
-		props: e,
-		name: "MuiListItemButton"
-	}), { alignItems: a = "center", autoFocus: o = !1, component: s = "div", children: c, dense: l = !1, disableGutters: u = !1, divider: d = !1, focusVisibleClassName: f, selected: g = !1, className: _, ...v } = n, y = S.useContext(h), b = S.useMemo(() => ({
-		dense: l || y.dense || !1,
-		alignItems: a,
-		disableGutters: u
-	}), [
-		a,
-		y.dense,
-		l,
-		u
-	]), x = S.useRef(null);
-	m(() => {
-		o && (x.current ? x.current.focus() : process.env.NODE_ENV !== "production" && console.error("MUI: Unable to set focus to a ListItemButton whose component has not been rendered."));
-	}, [o]);
-	let w = {
-		...n,
-		alignItems: a,
-		dense: b.dense,
-		disableGutters: u,
-		divider: d,
-		selected: g
-	}, T = D(w), { root: E, ...k } = T, A = p(x, t);
-	return /* @__PURE__ */ C(h.Provider, {
-		value: b,
-		children: /* @__PURE__ */ C(O, {
-			ref: A,
-			href: v.href || v.to,
-			component: (v.href || v.to) && s === "div" ? "button" : s,
-			internalNativeButton: !1,
-			focusVisibleClassName: i(T.focusVisible, f),
-			ownerState: w,
-			className: i(T.root, _),
-			...v,
-			classes: k,
-			children: c
-		})
-	});
-});
-process.env.NODE_ENV !== "production" && (k.propTypes = {
-	alignItems: T.default.oneOf(["center", "flex-start"]),
-	autoFocus: T.default.bool,
-	children: T.default.node,
-	classes: T.default.object,
-	className: T.default.string,
-	component: T.default.elementType,
-	dense: T.default.bool,
-	disabled: T.default.bool,
-	disableGutters: T.default.bool,
-	divider: T.default.bool,
-	focusVisibleClassName: T.default.string,
-	href: T.default.string,
-	selected: T.default.bool,
-	sx: T.default.oneOfType([
-		T.default.arrayOf(T.default.oneOfType([
-			T.default.func,
-			T.default.object,
-			T.default.bool
-		])),
-		T.default.func,
-		T.default.object
-	])
-});
-//#endregion
-//#region lib/s-nav-items/s-nav-items.tsx
-var A = s(S.forwardRef(function(e, t) {
-	return /* @__PURE__ */ C(c, {
-		component: "ul",
-		...e,
-		ref: t
-	});
-}), {
-	name: "SNavItems",
-	slot: "Root"
-})({});
-function j(e, t) {
-	return e.some((e) => e.href && (t === e.href || t.startsWith(e.href + "/")) ? !0 : e.items ? j(e.items, t) : !1);
-}
-function M(e, t) {
-	return !!(e.href && (t === e.href || t.startsWith(e.href + "/")));
-}
-function N(e, t) {
-	let n = e.items ?? [];
-	return {
-		active: M(e, t),
-		childActive: n.length > 0 && j(n, t)
-	};
-}
-function P({ item: e, pathname: t, depth: n, linkComponent: r }) {
-	let i = !!(e.items && e.items.length > 0), { active: o, childActive: s } = N(e, t), [c, l] = S.useState(e.defaultOpen ?? s);
-	if (S.useEffect(() => {
-		s && l(!0);
-	}, [s]), !i) return /* @__PURE__ */ C(v, {
-		disabled: e.disabled,
-		href: e.href,
-		icon: e.icon ? e.icon(o) : null,
-		primary: e.title,
-		selected: o,
-		slotProps: { button: {
-			component: e.component ?? r,
-			rel: e.rel,
-			target: e.target,
-			sx: n > 0 ? { pl: `${(n - 1) * 12 + 12}px` } : void 0
-		} }
-	});
-	let u = o || s;
-	return /* @__PURE__ */ w(a, {
-		component: "li",
-		sx: {
-			userSelect: "none",
-			display: "block"
-		},
-		children: [/* @__PURE__ */ w(k, {
-			onClick: () => l((e) => !e),
-			disabled: e.disabled,
-			selected: u,
-			sx: {
-				alignItems: "center",
-				borderRadius: 1,
-				color: u ? "text.primary" : "text.secondary",
-				display: "flex",
-				flex: "0 0 auto",
-				gap: 1,
-				justifyContent: "space-between",
-				p: 1.5,
-				pl: n > 0 ? `${n * 12 + 12}px` : "12px",
-				whiteSpace: "nowrap",
-				width: "100%",
-				"&.Mui-disabled": {
-					color: "text.disabled",
-					cursor: "not-allowed"
-				},
-				"@media (hover: hover) and (pointer: fine)": { "&:hover": { ...!u && !e.disabled && {
-					bgcolor: "action.hover",
-					color: "text.primary"
-				} } }
-			},
-			"aria-expanded": c,
-			children: [/* @__PURE__ */ w(a, {
-				sx: {
-					alignItems: "center",
-					display: "flex",
-					gap: 1
-				},
-				children: [e.icon ? /* @__PURE__ */ C(a, {
-					component: "span",
-					sx: {
-						display: "flex",
-						alignItems: "center",
-						justifyContent: "center"
-					},
-					children: e.icon(u)
-				}) : null, /* @__PURE__ */ C(_, {
-					component: "span",
-					variant: "body1",
-					children: e.title
-				})]
-			}), /* @__PURE__ */ C(a, {
-				component: "span",
-				sx: {
-					display: "flex",
-					alignItems: "center",
-					color: "text.secondary",
-					transition: "transform 200ms ease",
-					transform: c ? "rotate(0deg)" : "rotate(-90deg)"
-				},
-				children: /* @__PURE__ */ C(g, {})
-			})]
-		}), /* @__PURE__ */ C(y, {
-			in: c,
-			timeout: 200,
-			unmountOnExit: !0,
-			children: /* @__PURE__ */ C(a, {
-				sx: {
-					ml: n > 0 ? `${n * 16 + 12}px` : "12px",
-					mt: 1,
-					mb: 1,
-					pl: 1
-				},
-				children: /* @__PURE__ */ C(F, {
-					items: e.items,
-					pathname: t,
-					depth: n + 1,
-					linkComponent: r
-				})
-			})
-		})]
-	});
-}
-P.displayName = "SNavGroupItem";
-var F = S.forwardRef(function(e, t) {
-	let n = u({
-		props: e,
-		name: "SNavItems"
-	}), { depth: r = 0, items: i, linkComponent: a, pathname: o = "", sx: s, ...c } = n, l = {
-		...n,
-		depth: r,
-		pathname: o
-	};
-	return /* @__PURE__ */ C(A, {
-		spacing: 1,
-		...c,
-		ref: t,
-		ownerState: l,
-		sx: [{
-			listStyle: "none",
-			m: 0,
-			p: 0
-		}, ...d(s)],
-		children: i.map((e) => /* @__PURE__ */ C(P, {
-			item: e,
-			pathname: o,
-			depth: r,
-			linkComponent: a
-		}, e.key))
-	});
-});
-F.displayName = "SNavItems";
-//#endregion
-export { F as n, P as t };