@solostylist/ui-kit 1.0.223 → 1.0.224

package/dist/s-dialog-confirm/s-dialog-confirm.js

@@ -20,7 +20,6 @@ var m = ({ title: n, content: r, onConfirm: m = () => {}, onClose: h = () => {},
 			},
 			children: [typeof n == "string" ? /* @__PURE__ */ a(e, {
 				variant: "h5",
-				sx: { textTransform: "capitalize" },
 				children: n
 			}) : /* @__PURE__ */ a("div", { children: n }), v && /* @__PURE__ */ a(f, {
 				onClick: h,

package/dist/s-glow-button/s-glow-button.d.ts

@@ -16,7 +16,7 @@ export interface SGlowButtonProps extends ButtonProps {
     height?: string;
     /** Size of the glow effect in pixels (defaults to 60) */
     glowSize?: number;
-    /** Color of the glow effect (defaults to blue[500]) */
+    /** Color of the glow effect (defaults to the theme info color) */
     glowColor?: string;
 }
 /**

package/dist/s-glow-button/s-glow-button.js

@@ -1,29 +1,28 @@
-import { a as e } from "../theme-primitives-OrQ-xFJR.js";
-import { SMovingBorder as t } from "../s-moving-border/s-moving-border.js";
+import { SMovingBorder as e } from "../s-moving-border/s-moving-border.js";
 import "react";
-import { jsx as n } from "react/jsx-runtime";
-import { Button as r, hslToRgb as i } from "@mui/material";
+import { jsx as t } from "react/jsx-runtime";
+import { Button as n } from "@mui/material";
 //#region lib/s-glow-button/s-glow-button.tsx
-var a = ({ borderRadius: a = 12, children: o, duration: s = 3e3, width: c = "fit-content", height: l = "60px", glowSize: u = 60, glowColor: d = i(e[500]), ...f }) => /* @__PURE__ */ n(t, {
-	width: c,
-	height: l,
-	duration: s,
-	borderRadius: a,
-	glowSize: u,
-	glowColor: d,
+var r = ({ borderRadius: r = 12, children: i, duration: a = 3e3, width: o = "fit-content", height: s = "60px", glowSize: c = 60, glowColor: l = "var(--s-palette-info-main)", ...u }) => /* @__PURE__ */ t(e, {
+	width: o,
+	height: s,
+	duration: a,
+	borderRadius: r,
+	glowSize: c,
+	glowColor: l,
 	padding: .3,
-	children: /* @__PURE__ */ n(r, {
+	children: /* @__PURE__ */ t(n, {
 		sx: {
-			borderRadius: a,
-			width: c,
-			height: l
+			borderRadius: r,
+			width: o,
+			height: s
 		},
 		disableRipple: !0,
-		...f,
+		...u,
 		fullWidth: !0,
-		children: o
+		children: i
 	})
 });
-a.displayName = "SGlowButton";
+r.displayName = "SGlowButton";
 //#endregion
-export { a as default };
+export { r as default };

package/dist/s-nav-item/index.d.ts

@@ -1,3 +1,2 @@
 export { SNavItem, type SNavItemProps } from './s-nav-item';
-export { SNavItems, SNavGroupItem, type SNavItemConfig, type SNavItemsProps } from './s-nav-items';
 export { default } from './s-nav-item';

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

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

package/dist/s-nav-items/index.d.ts

@@ -0,0 +1,2 @@
+export { SNavItems, SNavGroupItem, type SNavItemConfig, type SNavItemsProps } from './s-nav-items';
+export { default } from './s-nav-items';

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

@@ -0,0 +1,2 @@
+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-item → s-nav-items}/s-nav-items.d.ts

@@ -59,4 +59,4 @@ export declare function SNavItems({ items, pathname, depth, component }: Readonl
 export declare namespace SNavItems {
     var displayName: string;
 }
-export {};
+export default SNavItems;

package/dist/{s-nav-item → s-nav-items}/s-nav-items.js

@@ -2,11 +2,11 @@ import { t as e } from "../Box-BlmynALm.js";
 import { t } from "../Stack-BQkLmLFp.js";
 import { t as n } from "../Typography-EsraKPZO.js";
 import { t as r } from "../ExpandMore-Bu7_1g6Q.js";
-import { SNavItem as i } from "./s-nav-item.js";
+import { SNavItem as i } from "../s-nav-item/s-nav-item.js";
 import { t as a } from "../Collapse-CnXmaDqT.js";
 import * as o from "react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
-//#region lib/s-nav-item/s-nav-items.tsx
+//#region lib/s-nav-items/s-nav-items.tsx
 function l(e, t) {
 	return e.some((e) => e.href && (t === e.href || t.startsWith(e.href + "/")) ? !0 : e.items ? l(e.items, t) : !1);
 }
@@ -151,4 +151,4 @@ function p({ items: e, pathname: n = "", depth: r = 0, component: i }) {
 }
 p.displayName = "SNavItems";
 //#endregion
-export { f as SNavGroupItem, p as SNavItems };
+export { f as SNavGroupItem, p as SNavItems, p as default };

package/dist/s-pixel-reveal/s-pixel-reveal.d.ts

@@ -7,7 +7,7 @@ export interface SPixelRevealProps extends Omit<React.HTMLAttributes<HTMLDivElem
     gap?: number;
     /** Animation speed multiplier (0-100) */
     speed?: number;
-    /** Array of color values randomly assigned to pixels */
+    /** Array of color values randomly assigned to pixels (defaults to theme primary shades) */
     colors?: string[];
     /** Controls pixel animation state */
     loading?: boolean;

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

@@ -1,6 +1,6 @@
-import { o as e } from "../theme-primitives-OrQ-xFJR.js";
-import { forwardRef as t, useCallback as n, useEffect as r, useRef as i } from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { forwardRef as e, useCallback as t, useEffect as n, useRef as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { useTheme as o } from "@mui/material";
 //#region lib/s-pixel-reveal/s-pixel-reveal.tsx
 var s = class {
 	x;
@@ -47,100 +47,105 @@ function c({ x: e, y: t, gap: n, logicalWidth: r, logicalHeight: i, instant: a,
 	let c = e + n / 2, l = t + n / 2, u = r / 2, d = i / 2;
 	return Math.sqrt(s(c, l, u, d));
 }
-function l(e, t, n) {
+function l(e, t) {
+	let n = /^var\((--[^),\s]+)\s*(?:,\s*([^)]+))?\)$/.exec(e.trim());
+	return n && (getComputedStyle(t).getPropertyValue(n[1]).trim() || n[2]?.trim()) || e;
+}
+function u(e, t, n) {
 	e.has(t) || e.set(t, []), e.get(t)?.push(n);
 }
-var u = t(({ gap: t = 5, speed: u = 100, colors: d = [
-	e[400],
-	e[500],
-	e[600]
-], loading: f = !0, src: p, alt: m = "", style: h, children: g, instant: _ = !0, ...v }, y) => {
-	let b = i(null), x = i(null), S = i(null), C = i(/* @__PURE__ */ new Map()), w = i(null), T = i(1e3 / 60), E = i(0), D = i(!1);
-	r(() => {
-		D.current = typeof window < "u" ? window.matchMedia("(prefers-reduced-motion: reduce)").matches : !1;
+var d = e(({ gap: e = 5, speed: d = 100, colors: f, loading: p = !0, src: m, alt: h = "", style: g, children: _, instant: v = !0, ...y }, b) => {
+	let x = o(), S = r(null), C = r(null), w = r(null), T = r(/* @__PURE__ */ new Map()), E = r(null), D = r(1e3 / 60), O = r(0), k = r(!1);
+	n(() => {
+		k.current = typeof window < "u" ? window.matchMedia("(prefers-reduced-motion: reduce)").matches : !1;
 	}, []);
-	let O = n((e, t, n, r) => {
+	let A = t((e, t, n, r) => {
 		let i = e - n, a = t - r;
 		return i * i + a * a;
-	}, []), k = n((e, n, r) => {
-		w.current && cancelAnimationFrame(w.current), E.current = performance.now();
+	}, []), j = t((t, n, r) => {
+		E.current && cancelAnimationFrame(E.current), O.current = performance.now();
 		let i = () => {
-			w.current = requestAnimationFrame(i);
-			let a = performance.now(), o = a - E.current;
-			if (o < T.current) return;
-			E.current = a - o % T.current, e.clearRect(0, 0, n, r);
+			E.current = requestAnimationFrame(i);
+			let a = performance.now(), o = a - O.current;
+			if (o < D.current) return;
+			O.current = a - o % D.current, t.clearRect(0, 0, n, r);
 			let s = !1;
-			C.current.forEach((n, r) => {
-				e.fillStyle = r;
+			T.current.forEach((n, r) => {
+				t.fillStyle = r;
 				for (let r of n) {
-					if (f) {
-						r.updateWhileLoading(), r.draw(e, t), s = !0;
+					if (p) {
+						r.updateWhileLoading(), r.draw(t, e), s = !0;
 						continue;
 					}
-					r.updateWhileIdle() && (r.draw(e, t), s = !0);
+					r.updateWhileIdle() && (r.draw(t, e), s = !0);
 				}
-			}), !f && !s && w.current && (cancelAnimationFrame(w.current), w.current = null);
+			}), !p && !s && E.current && (cancelAnimationFrame(E.current), E.current = null);
 		};
 		i();
-	}, [f, t]), A = n(() => {
-		let e = b.current, n = e?.getContext("2d");
-		if (!e || !n) return;
-		C.current = /* @__PURE__ */ new Map();
-		let r = D.current ? 0 : Math.max(0, Math.min(100, u)) * .001, i = window.devicePixelRatio ?? 1, a = e.width / i, o = e.height / i, f = .5, p = (a + o) * .01, m = a % t / 2, h = o % t / 2;
-		for (let e = m; e < a; e += t) for (let n = h; n < o; n += t) {
-			let i = d[Math.floor(Math.random() * d.length)], u = c({
-				x: e,
+	}, [p, e]), M = t(() => {
+		let t = S.current, n = t?.getContext("2d");
+		if (!t || !n) return;
+		T.current = /* @__PURE__ */ new Map();
+		let r = k.current ? 0 : Math.max(0, Math.min(100, d)) * .001, i = (x.vars ?? x).palette, a = (f ?? [
+			i.primary[400],
+			i.primary[500],
+			i.primary[600]
+		]).map((e) => l(e, t)), o = window.devicePixelRatio ?? 1, p = t.width / o, m = t.height / o, h = .5, g = (p + m) * .01, _ = p % e / 2, y = m % e / 2;
+		for (let t = _; t < p; t += e) for (let n = y; n < m; n += e) {
+			let i = a[Math.floor(Math.random() * a.length)], o = c({
+				x: t,
 				y: n,
-				gap: t,
-				logicalWidth: a,
-				logicalHeight: o,
-				instant: _,
-				reducedMotion: D.current,
-				getDistanceSq: O
-			}), m = Math.random() * 4 + p, h = Math.random() * (2 - f) + f;
-			l(C.current, i, new s(e, n, i, r, u, m, h));
+				gap: e,
+				logicalWidth: p,
+				logicalHeight: m,
+				instant: v,
+				reducedMotion: k.current,
+				getDistanceSq: A
+			}), l = Math.random() * 4 + g, d = Math.random() * (2 - h) + h;
+			u(T.current, i, new s(t, n, i, r, o, l, d));
 		}
-		k(n, a, o);
+		j(n, p, m);
 	}, [
-		t,
-		u,
+		e,
 		d,
-		_,
-		O,
-		k
-	]), j = n(() => {
-		let e = b.current, t = x.current, n = e?.getContext("2d");
+		f,
+		x,
+		v,
+		A,
+		j
+	]), N = t(() => {
+		let e = S.current, t = C.current, n = e?.getContext("2d");
 		if (!e || !t || !n) return;
 		let r = t.getBoundingClientRect();
 		if (r.width === 0 || r.height === 0) return;
 		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), A();
-	}, [A]);
-	return r(() => {
-		j();
+		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), M();
+	}, [M]);
+	return n(() => {
+		N();
 		let e = new ResizeObserver(() => {
-			requestAnimationFrame(() => j());
+			requestAnimationFrame(() => N());
 		});
-		return x.current && e.observe(x.current), () => {
-			e.disconnect(), w.current && cancelAnimationFrame(w.current);
+		return C.current && e.observe(C.current), () => {
+			e.disconnect(), E.current && cancelAnimationFrame(E.current);
 		};
-	}, [j]), /* @__PURE__ */ o("div", {
+	}, [N]), /* @__PURE__ */ a("div", {
 		ref: (e) => {
-			x.current = e, typeof y == "function" ? y(e) : y && (y.current = e);
+			C.current = e, typeof b == "function" ? b(e) : b && (b.current = e);
 		},
 		style: {
 			position: "relative",
 			width: "100%",
 			height: "100%",
 			overflow: "hidden",
-			...h
+			...g
 		},
-		...v,
+		...y,
 		children: [
-			p && /* @__PURE__ */ a("img", {
-				ref: S,
-				src: p,
-				alt: m,
+			m && /* @__PURE__ */ i("img", {
+				ref: w,
+				src: m,
+				alt: h,
 				style: {
 					position: "absolute",
 					inset: 0,
@@ -150,9 +155,9 @@ var u = t(({ gap: t = 5, speed: u = 100, colors: d = [
 					display: "block"
 				}
 			}),
-			g,
-			/* @__PURE__ */ a("canvas", {
-				ref: b,
+			_,
+			/* @__PURE__ */ i("canvas", {
+				ref: S,
 				style: {
 					position: "absolute",
 					inset: 0,
@@ -166,6 +171,6 @@ var u = t(({ gap: t = 5, speed: u = 100, colors: d = [
 		]
 	});
 });
-u.displayName = "SPixelReveal";
+d.displayName = "SPixelReveal";
 //#endregion
-export { u as SPixelReveal, u as default };
+export { d as SPixelReveal, d as default };

package/dist/s-text-editor/s-text-editor.js

@@ -1,48 +1,47 @@
-import { i as e } from "../createTheme-Bnw5w28O.js";
+import { tint as e } from "../theme/utils.js";
 import { t } from "../Box-BlmynALm.js";
-import { o as n, s as r } from "../theme-primitives-OrQ-xFJR.js";
-import { t as i } from "../s-text-editor-toolbar-CCK7yyNS.js";
-import * as a from "react";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Link as c } from "@tiptap/extension-link";
-import { Placeholder as l } from "@tiptap/extension-placeholder";
-import { EditorContent as u, useEditor as d } from "@tiptap/react";
-import { StarterKit as f } from "@tiptap/starter-kit";
+import { t as n } from "../s-text-editor-toolbar-CCK7yyNS.js";
+import * as r from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Link as o } from "@tiptap/extension-link";
+import { Placeholder as s } from "@tiptap/extension-placeholder";
+import { EditorContent as c, useEditor as l } from "@tiptap/react";
+import { StarterKit as u } from "@tiptap/starter-kit";
 //#region lib/s-text-editor/s-text-editor.tsx
-var p = ({ content: p, editable: m = !0, hideToolbar: h, onUpdate: g = () => {}, placeholder: _ }) => {
-	let v = d({
+var d = ({ content: d, editable: f = !0, hideToolbar: p, onUpdate: m = () => {}, placeholder: h }) => {
+	let g = l({
 		extensions: [
-			f,
-			l.configure({
+			u,
+			s.configure({
 				emptyEditorClass: "is-editor-empty",
-				placeholder: _
+				placeholder: h
 			}),
-			c.configure({
+			o.configure({
 				openOnClick: !1,
 				autolink: !0
 			})
 		],
-		content: p,
-		editable: m,
-		onUpdate: g,
+		content: d,
+		editable: f,
+		onUpdate: m,
 		parseOptions: { preserveWhitespace: "full" }
 	});
-	return a.useEffect(() => {
-		!v || v.isDestroyed || v.getHTML() !== p && v.commands.setContent(p);
-	}, [p, v]), /* @__PURE__ */ s(t, {
+	return r.useEffect(() => {
+		!g || g.isDestroyed || g.getHTML() !== d && g.commands.setContent(d);
+	}, [d, g]), /* @__PURE__ */ a(t, {
 		className: "tiptap-root",
-		sx: {
+		sx: (t) => ({
 			display: "flex",
 			flexDirection: "column",
-			...m && {
+			...f && {
 				border: "1px solid",
 				borderColor: "divider",
 				borderRadius: 1,
 				transition: "border 120ms ease-in",
-				"&:hover": { borderColor: r[500] },
+				"&:hover": { borderColor: (t.vars ?? t).palette.grey[500] },
 				"&:focus-within": {
-					outline: `3px solid ${e(n[500], .5)}`,
-					borderColor: n[400]
+					outline: `3px solid ${e((t.vars ?? t).palette.primary[500], 50)}`,
+					borderColor: (t.vars ?? t).palette.primary[400]
 				}
 			},
 			"& .tiptap-container": {
@@ -71,13 +70,13 @@ var p = ({ content: p, editable: m = !0, hideToolbar: h, onUpdate: g = () => {},
 					pointerEvents: "none"
 				}
 			}
-		},
-		children: [h ? /* @__PURE__ */ o("div", {}) : /* @__PURE__ */ o(i, { editor: v }), /* @__PURE__ */ o(u, {
+		}),
+		children: [p ? /* @__PURE__ */ i("div", {}) : /* @__PURE__ */ i(n, { editor: g }), /* @__PURE__ */ i(c, {
 			className: "tiptap-container",
-			editor: v
+			editor: g
 		})]
 	});
 };
-p.displayName = "STextEditor";
+d.displayName = "STextEditor";
 //#endregion
-export { p as STextEditor, p as default };
+export { d as STextEditor, d as default };

package/dist/s-theme-provider/s-theme-provider.d.ts

@@ -1,4 +1,4 @@
-import { Theme, ThemeOptions, ThemeProviderProps } from '@mui/material';
+import { ThemeOptions, ThemeProviderProps } from '@mui/material';
 import * as React from 'react';
 /**
  * Props interface for SThemeProvider component
@@ -14,8 +14,8 @@ export interface SThemeProviderProps extends Omit<ThemeProviderProps, 'defaultMo
     themeComponents?: ThemeOptions['components'];
     /** Default color mode (defaults to 'system') */
     defaultMode?: 'light' | 'dark' | 'system';
-    /** Custom theme object to merge with internal theme */
-    theme?: Theme;
+    /** Theme options deep-merged into the internal theme before createTheme */
+    theme?: ThemeOptions;
 }
 export declare const SThemeProvider: {
     ({ children, disableCssBaseline, disableCustomTheme, themeComponents, defaultMode, theme, ...themeProviderProps }: SThemeProviderProps): React.JSX.Element;

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

@@ -1,35 +1,41 @@
-import { i as e, n as t, r as n, t as r } from "../theme-primitives-OrQ-xFJR.js";
+import { i as e, n as t, r as n, t as r } from "../theme-primitives-D2vHHGiX.js";
 import { components as i } from "../theme/components/components.js";
 import * as a from "react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
 import { CssBaseline as c, ThemeProvider as l, createTheme as u } from "@mui/material";
+import { deepmerge as d } from "@mui/utils";
 //#region lib/s-theme-provider/s-theme-provider.tsx
-var d = ({ children: d, disableCssBaseline: f = !1, disableCustomTheme: p, themeComponents: m, defaultMode: h = "system", theme: g, ..._ }) => {
-	let v = a.useMemo(() => p ? {} : u({
-		cssVariables: {
-			colorSchemeSelector: "data-mui-color-scheme",
-			cssVarPrefix: "s"
-		},
-		colorSchemes: r,
-		typography: e,
-		shadows: t,
-		shape: n,
-		components: {
-			...i,
-			...m
-		}
-	}), [p, m]);
-	return p ? /* @__PURE__ */ o(a.Fragment, { children: d }) : /* @__PURE__ */ s(l, {
+var f = ({ children: f, disableCssBaseline: p = !1, disableCustomTheme: m, themeComponents: h, defaultMode: g = "system", theme: _, ...v }) => {
+	let y = a.useMemo(() => {
+		if (m) return {};
+		let a = {
+			cssVariables: {
+				colorSchemeSelector: "data-mui-color-scheme",
+				cssVarPrefix: "s"
+			},
+			colorSchemes: r,
+			typography: e,
+			shadows: t,
+			shape: n,
+			components: {
+				...i,
+				...h
+			}
+		};
+		return u(_ ? d(a, _) : a);
+	}, [
+		m,
+		h,
+		_
+	]);
+	return m ? /* @__PURE__ */ o(a.Fragment, { children: f }) : /* @__PURE__ */ s(l, {
 		disableTransitionOnChange: !0,
-		..._,
-		theme: {
-			...v,
-			...g
-		},
-		defaultMode: h,
-		children: [!f && /* @__PURE__ */ o(c, {}), d]
+		...v,
+		theme: y,
+		defaultMode: g,
+		children: [!p && /* @__PURE__ */ o(c, {}), f]
 	});
 };
-d.displayName = "SThemeProvider";
+f.displayName = "SThemeProvider";
 //#endregion
-export { d as SThemeProvider, d as default };
+export { f as SThemeProvider, f as default };

package/dist/s-tool-bar/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-tool-bar-B-v1I_Hy.js";
+import { t as e } from "../s-tool-bar-DGfyNoYW.js";
 export { e as SToolBar, e as default };

package/dist/s-tool-bar/s-tool-bar.js

@@ -1,2 +1,2 @@
-import { t as e } from "../s-tool-bar-B-v1I_Hy.js";
+import { t as e } from "../s-tool-bar-DGfyNoYW.js";
 export { e as SToolBar, e as default };