@solostylist/ui-kit 1.0.202 → 1.0.204

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

@@ -20,8 +20,5 @@ export interface SPixelRevealProps extends Omit<React.HTMLAttributes<HTMLDivElem
     /** If true, all pixels appear immediately without wave/delay effect */
     instant?: boolean;
 }
-/**
- * An animated pixel effect component that creates a dynamic canvas overlay with customizable pixel animations.
- */
 export declare const SPixelReveal: React.ForwardRefExoticComponent<SPixelRevealProps & React.RefAttributes<HTMLDivElement>>;
 export default SPixelReveal;

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

@@ -1,156 +1,138 @@
-import { j as q } from "../jsx-runtime-tc70JA_2.js";
-import { forwardRef as Q, useRef as u, useEffect as N, useCallback as y } from "react";
-import { brand as E } from "../theme/theme-primitives.js";
-class U {
-  x;
-  y;
-  color;
-  speed;
-  size;
-  sizeStep;
-  minSize;
-  maxSize;
-  delay;
-  counter;
-  counterStep;
-  isReverse;
-  isShimmer;
-  constructor(a, f, h, d, M, b, g) {
-    this.x = a, this.y = f, this.color = h, this.speed = (Math.random() * 0.8 + 0.1) * d, this.size = 0, this.sizeStep = Math.random() * 0.4, this.minSize = 0.5, this.maxSize = g, this.delay = M, this.counter = 0, this.counterStep = b, this.isReverse = !1, this.isShimmer = !1;
-  }
-  update(a) {
-    return a ? this.counter < this.delay ? (this.counter += this.counterStep, !0) : (this.isShimmer ? this.isReverse ? (this.size -= this.speed, this.size <= this.minSize && (this.size = this.minSize, this.isReverse = !1)) : (this.size += this.speed, this.size >= this.maxSize && (this.size = this.maxSize, this.isReverse = !0)) : this.size < this.maxSize ? this.size += this.sizeStep : this.isShimmer = !0, !0) : (this.isShimmer = !1, this.counter = 0, this.size > 0 ? (this.size -= 0.1, !0) : !1);
-  }
-  draw(a, f) {
-    const h = (f - this.size) * 0.5;
-    a.fillRect(this.x + h, this.y + h, this.size, this.size);
-  }
-}
-const Z = Q(
-  ({
-    gap: n = 5,
-    speed: a = 100,
-    colors: f = [E[400], E[500], E[600]],
-    loading: h = !0,
-    src: d,
-    alt: M = "",
-    style: b,
-    children: g,
-    instant: k = !0,
-    ...$
-  }, p) => {
-    const C = u(null), z = u(null), D = u(null), m = u(/* @__PURE__ */ new Map()), l = u(null), I = u(1e3 / 60), P = u(0), j = u(!1);
-    N(() => {
-      j.current = typeof window < "u" ? window.matchMedia("(prefers-reduced-motion: reduce)").matches : !1;
-    }, []);
-    const O = y((e, r, c, s) => {
-      const t = e - c, i = r - s;
-      return t * t + i * i;
-    }, []), V = y(
-      (e, r, c) => {
-        l.current && cancelAnimationFrame(l.current), P.current = performance.now();
-        const s = () => {
-          l.current = requestAnimationFrame(s);
-          const t = performance.now(), i = t - P.current;
-          if (i < I.current) return;
-          P.current = t - i % I.current, e.clearRect(0, 0, r, c);
-          let o = !1;
-          m.current.forEach((x, F) => {
-            e.fillStyle = F;
-            for (const S of x)
-              S.update(h) && (S.draw(e, n), o = !0);
-          }), !h && !o && l.current && (cancelAnimationFrame(l.current), l.current = null);
-        };
-        s();
-      },
-      [h, n]
-    ), X = y(() => {
-      const e = C.current, r = e?.getContext("2d");
-      if (!e || !r) return;
-      m.current = /* @__PURE__ */ new Map();
-      const c = j.current ? 0 : Math.max(0, Math.min(100, a)) * 1e-3, s = window.devicePixelRatio ?? 1, t = e.width / s, i = e.height / s, o = 2, x = 0.5, F = (t + i) * 0.01, S = t % n / 2, Y = i % n / 2;
-      for (let w = S; w < t; w += n)
-        for (let v = Y; v < i; v += n) {
-          const R = f[Math.floor(Math.random() * f.length)];
-          let B = 0;
-          if (!k && !j.current) {
-            const W = w + n / 2, G = v + n / 2, J = t / 2, K = i / 2;
-            B = Math.sqrt(O(W, G, J, K));
-          }
-          const H = Math.random() * 4 + F, L = Math.random() * (o - x) + x, T = new U(w, v, R, c, B, H, L);
-          m.current.has(R) || m.current.set(R, []), m.current.get(R).push(T);
-        }
-      V(r, t, i);
-    }, [n, a, f, k, O, V]), A = y(() => {
-      const e = C.current, r = z.current, c = e?.getContext("2d");
-      if (!e || !r || !c) return;
-      const s = r.getBoundingClientRect();
-      if (s.width === 0 || s.height === 0) return;
-      const t = Math.floor(s.width), i = Math.floor(s.height), o = window.devicePixelRatio ?? 1;
-      e.width = t * o, e.height = i * o, e.style.width = `${t}px`, e.style.height = `${i}px`, c.setTransform(1, 0, 0, 1, 0, 0), c.scale(o, o), X();
-    }, [X]);
-    return N(() => {
-      A();
-      const e = new ResizeObserver(() => {
-        requestAnimationFrame(() => A());
-      });
-      return z.current && e.observe(z.current), () => {
-        e.disconnect(), l.current && cancelAnimationFrame(l.current);
-      };
-    }, [A]), /* @__PURE__ */ q.jsxs(
-      "div",
-      {
-        ref: (e) => {
-          z.current = e, typeof p == "function" ? p(e) : p && (p.current = e);
-        },
-        style: {
-          position: "relative",
-          width: "100%",
-          height: "100%",
-          overflow: "hidden",
-          ...b
-        },
-        ...$,
-        children: [
-          d && /* @__PURE__ */ q.jsx(
-            "img",
-            {
-              ref: D,
-              src: d,
-              alt: M,
-              style: {
-                position: "absolute",
-                inset: 0,
-                width: "100%",
-                height: "100%",
-                objectFit: "cover",
-                display: "block"
-              }
-            }
-          ),
-          g,
-          /* @__PURE__ */ q.jsx(
-            "canvas",
-            {
-              ref: C,
-              style: {
-                position: "absolute",
-                inset: 0,
-                display: "block",
-                width: "100%",
-                height: "100%",
-                pointerEvents: "none",
-                zIndex: 1
-              }
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-Z.displayName = "SPixelReveal";
-export {
-  Z as SPixelReveal,
-  Z as default
-};
+import "../createTheme-CMuiGmV-.js";
+import { t as e } from "../jsx-runtime-V-UOMaX1.js";
+import { o as t } from "../theme-primitives-Csxbv-2Y.js";
+import { forwardRef as n, useCallback as r, useEffect as i, useRef as a } from "react";
+//#region lib/s-pixel-reveal/s-pixel-reveal.tsx
+var o = e(), s = class {
+	x;
+	y;
+	color;
+	speed;
+	size;
+	sizeStep;
+	minSize;
+	maxSize;
+	delay;
+	counter;
+	counterStep;
+	isReverse;
+	isShimmer;
+	constructor(e, t, n, r, i, a, o) {
+		this.x = e, this.y = t, this.color = n, this.speed = (Math.random() * .8 + .1) * r, this.size = 0, this.sizeStep = Math.random() * .4, this.minSize = .5, this.maxSize = o, this.delay = i, this.counter = 0, this.counterStep = a, this.isReverse = !1, this.isShimmer = !1;
+	}
+	update(e) {
+		return e ? this.counter < this.delay ? (this.counter += this.counterStep, !0) : (this.isShimmer ? this.isReverse ? (this.size -= this.speed, this.size <= this.minSize && (this.size = this.minSize, this.isReverse = !1)) : (this.size += this.speed, this.size >= this.maxSize && (this.size = this.maxSize, this.isReverse = !0)) : this.size < this.maxSize ? this.size += this.sizeStep : this.isShimmer = !0, !0) : (this.isShimmer = !1, this.counter = 0, this.size > 0 ? (this.size -= .1, !0) : !1);
+	}
+	draw(e, t) {
+		let n = (t - this.size) * .5;
+		e.fillRect(this.x + n, this.y + n, this.size, this.size);
+	}
+}, c = n(({ gap: e = 5, speed: n = 100, colors: c = [
+	t[400],
+	t[500],
+	t[600]
+], loading: l = !0, src: u, alt: d = "", style: f, children: p, instant: m = !0, ...h }, g) => {
+	let _ = a(null), v = a(null), y = a(null), b = a(/* @__PURE__ */ new Map()), x = a(null), S = a(1e3 / 60), C = a(0), w = a(!1);
+	i(() => {
+		w.current = typeof window < "u" ? window.matchMedia("(prefers-reduced-motion: reduce)").matches : !1;
+	}, []);
+	let T = r((e, t, n, r) => {
+		let i = e - n, a = t - r;
+		return i * i + a * a;
+	}, []), E = r((t, n, r) => {
+		x.current && cancelAnimationFrame(x.current), C.current = performance.now();
+		let i = () => {
+			x.current = requestAnimationFrame(i);
+			let a = performance.now(), o = a - C.current;
+			if (o < S.current) return;
+			C.current = a - o % S.current, t.clearRect(0, 0, n, r);
+			let s = !1;
+			b.current.forEach((n, r) => {
+				t.fillStyle = r;
+				for (let r of n) r.update(l) && (r.draw(t, e), s = !0);
+			}), !l && !s && x.current && (cancelAnimationFrame(x.current), x.current = null);
+		};
+		i();
+	}, [l, e]), D = r(() => {
+		let t = _.current, r = t?.getContext("2d");
+		if (!t || !r) return;
+		b.current = /* @__PURE__ */ new Map();
+		let i = w.current ? 0 : Math.max(0, Math.min(100, n)) * .001, a = window.devicePixelRatio ?? 1, o = t.width / a, l = t.height / a, u = .5, d = (o + l) * .01, f = o % e / 2, p = l % e / 2;
+		for (let t = f; t < o; t += e) for (let n = p; n < l; n += e) {
+			let r = c[Math.floor(Math.random() * c.length)], a = 0;
+			if (!m && !w.current) {
+				let r = t + e / 2, i = n + e / 2, s = o / 2, c = l / 2;
+				a = Math.sqrt(T(r, i, s, c));
+			}
+			let f = Math.random() * 4 + d, p = Math.random() * (2 - u) + u, h = new s(t, n, r, i, a, f, p);
+			b.current.has(r) || b.current.set(r, []), b.current.get(r).push(h);
+		}
+		E(r, o, l);
+	}, [
+		e,
+		n,
+		c,
+		m,
+		T,
+		E
+	]), O = r(() => {
+		let e = _.current, t = v.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), D();
+	}, [D]);
+	return i(() => {
+		O();
+		let e = new ResizeObserver(() => {
+			requestAnimationFrame(() => O());
+		});
+		return v.current && e.observe(v.current), () => {
+			e.disconnect(), x.current && cancelAnimationFrame(x.current);
+		};
+	}, [O]), /* @__PURE__ */ (0, o.jsxs)("div", {
+		ref: (e) => {
+			v.current = e, typeof g == "function" ? g(e) : g && (g.current = e);
+		},
+		style: {
+			position: "relative",
+			width: "100%",
+			height: "100%",
+			overflow: "hidden",
+			...f
+		},
+		...h,
+		children: [
+			u && /* @__PURE__ */ (0, o.jsx)("img", {
+				ref: y,
+				src: u,
+				alt: d,
+				style: {
+					position: "absolute",
+					inset: 0,
+					width: "100%",
+					height: "100%",
+					objectFit: "cover",
+					display: "block"
+				}
+			}),
+			p,
+			/* @__PURE__ */ (0, o.jsx)("canvas", {
+				ref: _,
+				style: {
+					position: "absolute",
+					inset: 0,
+					display: "block",
+					width: "100%",
+					height: "100%",
+					pointerEvents: "none",
+					zIndex: 1
+				}
+			})
+		]
+	});
+});
+c.displayName = "SPixelReveal";
+//#endregion
+export { c as SPixelReveal, c as default };

package/dist/s-radial-pulse-animate/index.js

@@ -1,4 +1,4 @@
-import { SRadialPulseAnimate as l } from "./s-radial-pulse-animate.js";
-export {
-  l as default
-};
+import "../createTheme-CMuiGmV-.js";
+import "../jsx-runtime-V-UOMaX1.js";
+import { SRadialPulseAnimate as e } from "./s-radial-pulse-animate.js";
+export { e as default };

package/dist/s-radial-pulse-animate/s-radial-pulse-animate.d.ts

@@ -17,8 +17,5 @@ export interface SRadialPulseAnimateProps {
         max: number;
     };
 }
-/**
- * A loading animation component that creates a pulsing radial effect with expanding ripples and floating particles.
- */
 export declare const SRadialPulseAnimate: React.FC<SRadialPulseAnimateProps>;
 export default SRadialPulseAnimate;

package/dist/s-radial-pulse-animate/s-radial-pulse-animate.js

@@ -1,8 +1,10 @@
-import { j as n } from "../jsx-runtime-tc70JA_2.js";
-import { useRef as x, useEffect as y } from "react";
-import { keyframes as h, styled as l, Box as d } from "@mui/material";
-import { STextShimmer as v } from "../s-text-shimmer/s-text-shimmer.js";
-const b = h`
+import "../createTheme-CMuiGmV-.js";
+import { t as e } from "../jsx-runtime-V-UOMaX1.js";
+import { STextShimmer as t } from "../s-text-shimmer/s-text-shimmer.js";
+import { useEffect as n, useRef as r } from "react";
+import { Box as i, keyframes as a, styled as o } from "@mui/material";
+//#region lib/s-radial-pulse-animate/s-radial-pulse-animate.tsx
+var s = e(), c = a`
   0% {
     width: 20%;
     height: 20%;
@@ -13,121 +15,77 @@ const b = h`
     height: 100%;
     opacity: 0;
   }
-`, j = l(d)(({ theme: e }) => ({
-  position: "relative",
-  display: "flex",
-  justifyContent: "center",
-  alignItems: "center",
-  borderRadius: e.shape.borderRadius,
-  border: "1px solid",
-  borderColor: (e.vars ?? e).palette.divider
-})), R = l(d)(() => ({
-  position: "absolute",
-  pointerEvents: "none"
-})), s = l(d)(({ theme: e }) => ({
-  position: "absolute",
-  top: "50%",
-  left: "50%",
-  transform: "translate(-50%, -50%)",
-  width: "60px",
-  height: "60px",
-  background: (e.vars ?? e).palette.ui.pulse.radialGradient,
-  borderRadius: "50%",
-  animation: `${b} 3s ease-out infinite`,
-  "&:nth-of-type(2)": {
-    animationDelay: "1s"
-  },
-  "&:nth-of-type(3)": {
-    animationDelay: "2s"
-  },
-  "@media (prefers-reduced-motion: reduce)": {
-    animation: "none !important"
-  }
-})), C = () => {
-  const e = "s-radial-pulse-particles";
-  if (document.getElementById(e)) return;
-  const a = document.createElement("style");
-  a.id = e, a.textContent = `
-    .s-radial-pulse-particle {
-      position: absolute;
-      background: var(--s-palette-text-primary);
-      border-radius: 50%;
-      animation: s-radial-pulse-float 4s ease-in-out infinite;
-    }
-    
-    .s-radial-pulse-particle:nth-child(odd) {
-      animation-direction: reverse;
-    }
-    
-    @keyframes s-radial-pulse-float {
-      0%, 100% {
-        transform: translateY(0px) rotate(0deg);
-        opacity: 0.5;
-      }
-      50% {
-        transform: translateY(-20px) rotate(180deg);
-        opacity: 1;
-      }
-    }
-    
-    @media (prefers-reduced-motion: reduce) {
-      .s-radial-pulse-particle {
-        animation: none !important;
-      }
-    }
-  `, document.head.appendChild(a);
-}, g = ({
-  width: e = 300,
-  height: a = 300,
-  className: c,
-  text: u = "Generating...",
-  particleSize: r = { min: 2, max: 6 }
-}) => {
-  const o = x(null);
-  return y(() => {
-    C();
-    const p = () => {
-      if (!o.current) return;
-      const i = o.current, t = document.createElement("div");
-      t.className = "s-radial-pulse-particle";
-      const m = Math.random() * (r.max - r.min) + r.min;
-      t.style.width = `${m}px`, t.style.height = `${m}px`, t.style.left = `${Math.random() * e}px`, t.style.top = `${Math.random() * a}px`, t.style.animationDelay = `${Math.random() * 4}s`, t.style.animationDuration = `${Math.random() * 3 + 2}s`, i.appendChild(t), setTimeout(() => {
-        t.parentNode && t.parentNode.removeChild(t);
-      }, 6e3);
-    }, f = setInterval(p, 500);
-    for (let i = 0; i < 4; i++) setTimeout(p, i * 100);
-    return () => clearInterval(f);
-  }, [e, a, r]), /* @__PURE__ */ n.jsxs(
-    j,
-    {
-      ref: o,
-      className: c,
-      sx: {
-        width: e,
-        height: a
-      },
-      children: [
-        /* @__PURE__ */ n.jsxs(
-          R,
-          {
-            sx: {
-              width: Math.min(e, a),
-              height: Math.min(e, a)
-            },
-            children: [
-              /* @__PURE__ */ n.jsx(s, {}),
-              /* @__PURE__ */ n.jsx(s, {}),
-              /* @__PURE__ */ n.jsx(s, {})
-            ]
-          }
-        ),
-        /* @__PURE__ */ n.jsx(v, { children: u })
-      ]
-    }
-  );
-};
-g.displayName = "SRadialPulseAnimate";
-export {
-  g as SRadialPulseAnimate,
-  g as default
+`, l = o(i)(({ theme: e }) => ({
+	position: "relative",
+	display: "flex",
+	justifyContent: "center",
+	alignItems: "center",
+	borderRadius: e.shape.borderRadius,
+	border: "1px solid",
+	borderColor: (e.vars ?? e).palette.divider
+})), u = o(i)(() => ({
+	position: "absolute",
+	pointerEvents: "none"
+})), d = o(i)(({ theme: e }) => ({
+	position: "absolute",
+	top: "50%",
+	left: "50%",
+	transform: "translate(-50%, -50%)",
+	width: "60px",
+	height: "60px",
+	background: (e.vars ?? e).palette.ui.pulse.radialGradient,
+	borderRadius: "50%",
+	animation: `${c} 3s ease-out infinite`,
+	"&:nth-of-type(2)": { animationDelay: "1s" },
+	"&:nth-of-type(3)": { animationDelay: "2s" },
+	"@media (prefers-reduced-motion: reduce)": { animation: "none !important" }
+})), f = () => {
+	let e = "s-radial-pulse-particles";
+	if (document.getElementById(e)) return;
+	let t = document.createElement("style");
+	t.id = e, t.textContent = "\n    .s-radial-pulse-particle {\n      position: absolute;\n      background: var(--s-palette-text-primary);\n      border-radius: 50%;\n      animation: s-radial-pulse-float 4s ease-in-out infinite;\n    }\n    \n    .s-radial-pulse-particle:nth-child(odd) {\n      animation-direction: reverse;\n    }\n    \n    @keyframes s-radial-pulse-float {\n      0%, 100% {\n        transform: translateY(0px) rotate(0deg);\n        opacity: 0.5;\n      }\n      50% {\n        transform: translateY(-20px) rotate(180deg);\n        opacity: 1;\n      }\n    }\n    \n    @media (prefers-reduced-motion: reduce) {\n      .s-radial-pulse-particle {\n        animation: none !important;\n      }\n    }\n  ", document.head.appendChild(t);
+}, p = ({ width: e = 300, height: i = 300, className: a, text: o = "Generating...", particleSize: c = {
+	min: 2,
+	max: 6
+} }) => {
+	let p = r(null);
+	return n(() => {
+		f();
+		let t = () => {
+			if (!p.current) return;
+			let t = p.current, n = document.createElement("div");
+			n.className = "s-radial-pulse-particle";
+			let r = Math.random() * (c.max - c.min) + c.min;
+			n.style.width = `${r}px`, n.style.height = `${r}px`, n.style.left = `${Math.random() * e}px`, n.style.top = `${Math.random() * i}px`, n.style.animationDelay = `${Math.random() * 4}s`, n.style.animationDuration = `${Math.random() * 3 + 2}s`, t.appendChild(n), setTimeout(() => {
+				n.parentNode && n.parentNode.removeChild(n);
+			}, 6e3);
+		}, n = setInterval(t, 500);
+		for (let e = 0; e < 4; e++) setTimeout(t, e * 100);
+		return () => clearInterval(n);
+	}, [
+		e,
+		i,
+		c
+	]), /* @__PURE__ */ (0, s.jsxs)(l, {
+		ref: p,
+		className: a,
+		sx: {
+			width: e,
+			height: i
+		},
+		children: [/* @__PURE__ */ (0, s.jsxs)(u, {
+			sx: {
+				width: Math.min(e, i),
+				height: Math.min(e, i)
+			},
+			children: [
+				/* @__PURE__ */ (0, s.jsx)(d, {}),
+				/* @__PURE__ */ (0, s.jsx)(d, {}),
+				/* @__PURE__ */ (0, s.jsx)(d, {})
+			]
+		}), /* @__PURE__ */ (0, s.jsx)(t, { children: o })]
+	});
 };
+p.displayName = "SRadialPulseAnimate";
+//#endregion
+export { p as SRadialPulseAnimate, p as default };

package/dist/s-rating/index.js

@@ -1,4 +1,3 @@
+import "../jsx-runtime-V-UOMaX1.js";
 import { SRating as e } from "./s-rating.js";
-export {
-  e as default
-};
+export { e as default };

package/dist/s-rating/s-rating.d.ts

@@ -4,8 +4,5 @@ import { RatingProps } from '@mui/material';
  * Props interface for SRating component
  */
 export type SRatingProps = RatingProps;
-/**
- * A star rating component that allows users to provide feedback and ratings.
- */
 export declare const SRating: React.ForwardRefExoticComponent<Omit<SRatingProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 export default SRating;

package/dist/s-rating/s-rating.js

@@ -1,9 +1,11 @@
-import { j as o } from "../jsx-runtime-tc70JA_2.js";
-import { forwardRef as a } from "react";
-import { Rating as i } from "@mui/material";
-const m = a((r, t) => /* @__PURE__ */ o.jsx(i, { ref: t, ...r }));
-m.displayName = "SRating";
-export {
-  m as SRating,
-  m as default
-};
+import { t as e } from "../jsx-runtime-V-UOMaX1.js";
+import { forwardRef as t } from "react";
+import { Rating as n } from "@mui/material";
+//#region lib/s-rating/s-rating.tsx
+var r = e(), i = t((e, t) => /* @__PURE__ */ (0, r.jsx)(n, {
+	ref: t,
+	...e
+}));
+i.displayName = "SRating";
+//#endregion
+export { i as SRating, i as default };

package/dist/s-review/index.js

@@ -1,4 +1,4 @@
-import { SReview as f } from "./s-review.js";
-export {
-  f as default
-};
+import "../createTheme-CMuiGmV-.js";
+import "../jsx-runtime-V-UOMaX1.js";
+import { t as e } from "../s-review-C1E6ASin.js";
+export { e as default };

package/dist/s-review/s-review.d.ts

@@ -42,8 +42,5 @@ export interface SReviewProps {
     /** MUI sx prop for custom styling */
     sx?: SxProps;
 }
-/**
- * A comprehensive review component that displays user reviews with avatar, name, rating, content, and helpful voting system.
- */
 export declare const SReview: React.FC<SReviewProps>;
 export default SReview;