@solostylist/ui-kit 1.0.172 → 1.0.174

package/dist/s-chat-message/s-chat-message.js

@@ -1,6 +1,6 @@
 import { j as e } from "../jsx-runtime-OVHDjVDe.js";
 import { useState as M } from "react";
-import { Box as s, Typography as n, Paper as L, IconButton as z } from "@mui/material";
+import { Box as s, Typography as r, Paper as L, IconButton as z } from "@mui/material";
 import { SAvatar as W } from "../s-avatar/s-avatar.js";
 import { SImageModal as E } from "../s-image-modal/s-image-modal.js";
 import "../s-lazy-image/index.js";
@@ -19,7 +19,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
   variant: A = "received",
   timestamp: y,
   avatar: w,
-  senderName: r,
+  senderName: n,
   showAvatar: o = !0,
   showTimestamp: b = !1,
   maxWidth: j = "70%",
@@ -33,7 +33,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
   sx: C,
   ...q
 }) => {
-  const [c, k] = M(null), [D, S] = M(!1), t = A === "sent", R = (a) => (typeof a == "string" ? new Date(a) : a).toLocaleTimeString("en-US", {
+  const [c, k] = M(null), [D, I] = M(!1), t = A === "sent", R = (a) => (typeof a == "string" ? new Date(a) : a).toLocaleTimeString("en-US", {
     hour: "2-digit",
     minute: "2-digit",
     hour12: !0
@@ -42,10 +42,10 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
     const u = ["Bytes", "KB", "MB", "GB"], f = Math.floor(Math.log(a) / Math.log(1024));
     return Math.round(a / Math.pow(1024, f) * 100) / 100 + " " + u[f];
   }, N = (a) => {
-    d ? d(a) : (k(a), S(!0));
+    d ? d(a) : (k(a), I(!0));
   }, B = (a) => {
     d ? d(a) : m && m(a);
-  }, p = g.filter((a) => a.type === "image"), I = g.filter((a) => a.type === "file");
+  }, p = g.filter((a) => a.type === "image"), S = g.filter((a) => a.type === "file");
   return _ ? /* @__PURE__ */ e.jsxs(
     s,
     {
@@ -71,7 +71,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
             gap: 0.5,
             sx: { minWidth: 0 },
             children: [
-              r && !t && /* @__PURE__ */ e.jsx(i, { variant: "text", width: 100, height: 12, sx: { ml: 0.5 } }),
+              n && !t && /* @__PURE__ */ e.jsx(i, { variant: "text", width: 100, height: 12, sx: { ml: 0.5 } }),
               /* @__PURE__ */ e.jsxs(
                 s,
                 {
@@ -111,7 +111,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
       },
       ...q,
       children: [
-        o && !t && /* @__PURE__ */ e.jsx(W, { avatar: w, name: r, size: 36 }),
+        o && !t && /* @__PURE__ */ e.jsx(W, { avatar: w, name: n, size: 36 }),
         /* @__PURE__ */ e.jsxs(
           s,
           {
@@ -121,7 +121,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
             gap: 0.5,
             sx: { minWidth: 0 },
             children: [
-              r && !t && /* @__PURE__ */ e.jsx(n, { children: r }),
+              n && !t && /* @__PURE__ */ e.jsx(r, { children: n }),
               /* @__PURE__ */ e.jsxs(
                 s,
                 {
@@ -182,7 +182,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
                         ))
                       }
                     ),
-                    I.length > 0 && /* @__PURE__ */ e.jsx(s, { sx: { p: 1.5 }, children: I.map((a, u) => /* @__PURE__ */ e.jsxs(
+                    S.length > 0 && /* @__PURE__ */ e.jsx(s, { sx: { p: 1.5 }, children: S.map((a, u) => /* @__PURE__ */ e.jsxs(
                       L,
                       {
                         variant: "outlined",
@@ -199,7 +199,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
                           /* @__PURE__ */ e.jsx(G, { sx: { fontSize: 32 } }),
                           /* @__PURE__ */ e.jsxs(s, { sx: { flex: 1, minWidth: 0 }, children: [
                             /* @__PURE__ */ e.jsx(
-                              n,
+                              r,
                               {
                                 variant: "body2",
                                 sx: {
@@ -212,7 +212,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
                                 children: a.name || "Unnamed File"
                               }
                             ),
-                            a.size && /* @__PURE__ */ e.jsx(n, { variant: "caption", children: F(a.size) })
+                            a.size && /* @__PURE__ */ e.jsx(r, { variant: "caption", children: F(a.size) })
                           ] }),
                           m && /* @__PURE__ */ e.jsx(
                             z,
@@ -221,7 +221,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
                               onClick: (f) => {
                                 f.stopPropagation(), m(a);
                               },
-                              children: /* @__PURE__ */ e.jsx(U, { fontSize: "small" })
+                              children: /* @__PURE__ */ e.jsx(U, {})
                             }
                           )
                         ]
@@ -229,7 +229,7 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
                       a.id
                     )) }),
                     l && /* @__PURE__ */ e.jsx(s, { sx: { px: 2, py: 1.5, pt: g.length > 0 ? 0 : 1.5 }, children: /* @__PURE__ */ e.jsx(
-                      n,
+                      r,
                       {
                         variant: "body2",
                         sx: {
@@ -243,22 +243,22 @@ const P = v(/* @__PURE__ */ e.jsx("path", {
                   ]
                 }
               ),
-              b && y && /* @__PURE__ */ e.jsx(n, { variant: "caption", children: R(y) }),
+              b && y && /* @__PURE__ */ e.jsx(r, { variant: "caption", children: R(y) }),
               h && /* @__PURE__ */ e.jsxs(s, { display: "flex", alignItems: "center", gap: 0.5, color: "error.main", children: [
                 /* @__PURE__ */ e.jsx(P, { sx: { fontSize: "1rem" } }),
-                /* @__PURE__ */ e.jsx(n, { color: "inherit", children: T }),
+                /* @__PURE__ */ e.jsx(r, { color: "inherit", children: T }),
                 V && /* @__PURE__ */ e.jsx(z, { size: "small", onClick: V, children: /* @__PURE__ */ e.jsx(H, {}) })
               ] })
             ]
           }
         ),
-        o && t && /* @__PURE__ */ e.jsx(W, { avatar: w, name: r, size: 36 }),
+        o && t && /* @__PURE__ */ e.jsx(W, { avatar: w, name: n, size: 36 }),
         c && /* @__PURE__ */ e.jsx(
           E,
           {
             isOpen: D,
             onClose: () => {
-              S(!1), k(null);
+              I(!1), k(null);
             },
             selectedItem: {
               id: c.id,

package/dist/s-countdown/s-count-box.js

@@ -99,11 +99,11 @@ const r = ({
 };
 r.displayName = "SCountBox";
 try {
-  r.displayName = "SCountBox", r.__docgenInfo = { description: "An individual count box component that displays a single time unit with optional animations.", displayName: "SCountBox", props: { digit: { defaultValue: { value: "0" }, description: "The numeric value to display", name: "digit", required: !1, type: { name: "number" } }, title: { defaultValue: { value: "" }, description: "The label/title for this time unit", name: "title", required: !1, type: { name: "string" } }, size: { defaultValue: { value: "medium" }, description: "Size variant for the count box", name: "size", required: !1, type: { name: "enum", value: [{ value: '"small"' }, { value: '"medium"' }, { value: '"large"' }] } }, color: { defaultValue: { value: "inherit" }, description: "Color variant for the count box", name: "color", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"error"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, animation: { defaultValue: { value: "none" }, description: "Animation type for value changes", name: "animation", required: !1, type: { name: "enum", value: [{ value: '"none"' }, { value: '"fade"' }, { value: '"slide"' }] } }, sx: { defaultValue: null, description: "Custom styling", name: "sx", required: !1, type: { name: "SxProps<Theme>" } }, digitSx: { defaultValue: null, description: "Custom digit styling", name: "digitSx", required: !1, type: { name: "SxProps<Theme>" } }, titleSx: { defaultValue: null, description: "Custom title styling", name: "titleSx", required: !1, type: { name: "SxProps<Theme>" } }, showSeparator: { defaultValue: { value: "false" }, description: "Show separator after this box", name: "showSeparator", required: !1, type: { name: "boolean" } }, separator: { defaultValue: { value: ":" }, description: "Custom separator element", name: "separator", required: !1, type: { name: "ReactNode" } }, digitFormat: { defaultValue: { value: "default" }, description: "Format for displaying the digit (e.g., '00' for zero-padding)", name: "digitFormat", required: !1, type: { name: "enum", value: [{ value: '"default"' }, { value: '"padded"' }] } }, hidden: { defaultValue: { value: "false" }, description: "Whether this count box is hidden", name: "hidden", required: !1, type: { name: "boolean" } } } };
+  r.displayName = "SCountBox", r.__docgenInfo = { description: "An individual count box component that displays a single time unit with optional animations.", displayName: "SCountBox", props: { digit: { defaultValue: { value: "0" }, description: "The numeric value to display", name: "digit", required: !1, type: { name: "number" } }, title: { defaultValue: { value: "" }, description: "The label/title for this time unit", name: "title", required: !1, type: { name: "string" } }, size: { defaultValue: { value: "medium" }, description: "Size variant for the count box", name: "size", required: !1, type: { name: "enum", value: [{ value: '"small"' }, { value: '"medium"' }, { value: '"large"' }] } }, color: { defaultValue: { value: "inherit" }, description: "Color variant for the count box", name: "color", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"error"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, animation: { defaultValue: { value: "none" }, description: "Animation type for value changes", name: "animation", required: !1, type: { name: "enum", value: [{ value: '"none"' }, { value: '"fade"' }, { value: '"slide"' }] } }, sx: { defaultValue: null, description: "Custom styling", name: "sx", required: !1, type: { name: "SxProps<Theme>" } }, digitSx: { defaultValue: null, description: "Custom digit styling", name: "digitSx", required: !1, type: { name: "SxProps<Theme>" } }, titleSx: { defaultValue: null, description: "Custom title styling", name: "titleSx", required: !1, type: { name: "SxProps<Theme>" } }, showSeparator: { defaultValue: { value: "false" }, description: "Show separator after this box", name: "showSeparator", required: !1, type: { name: "boolean" } }, separator: { defaultValue: { value: ":" }, description: "Custom separator element", name: "separator", required: !1, type: { name: "ReactNode" } }, digitFormat: { defaultValue: { value: "default" }, description: "Format for displaying the digit (e.g., '00' for zero-padding)", name: "digitFormat", required: !1, type: { name: "enum", value: [{ value: '"default"' }, { value: '"padded"' }] } }, hidden: { defaultValue: { value: "false" }, description: "Whether this count box is hidden", name: "hidden", required: !1, type: { name: "boolean" } } } };
 } catch {
 }
 try {
-  scountbox.displayName = "scountbox", scountbox.__docgenInfo = { description: "An individual count box component that displays a single time unit with optional animations.", displayName: "scountbox", props: { digit: { defaultValue: { value: "0" }, description: "The numeric value to display", name: "digit", required: !1, type: { name: "number" } }, title: { defaultValue: { value: "" }, description: "The label/title for this time unit", name: "title", required: !1, type: { name: "string" } }, size: { defaultValue: { value: "medium" }, description: "Size variant for the count box", name: "size", required: !1, type: { name: "enum", value: [{ value: '"small"' }, { value: '"medium"' }, { value: '"large"' }] } }, color: { defaultValue: { value: "inherit" }, description: "Color variant for the count box", name: "color", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"error"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, animation: { defaultValue: { value: "none" }, description: "Animation type for value changes", name: "animation", required: !1, type: { name: "enum", value: [{ value: '"none"' }, { value: '"fade"' }, { value: '"slide"' }] } }, sx: { defaultValue: null, description: "Custom styling", name: "sx", required: !1, type: { name: "SxProps<Theme>" } }, digitSx: { defaultValue: null, description: "Custom digit styling", name: "digitSx", required: !1, type: { name: "SxProps<Theme>" } }, titleSx: { defaultValue: null, description: "Custom title styling", name: "titleSx", required: !1, type: { name: "SxProps<Theme>" } }, showSeparator: { defaultValue: { value: "false" }, description: "Show separator after this box", name: "showSeparator", required: !1, type: { name: "boolean" } }, separator: { defaultValue: { value: ":" }, description: "Custom separator element", name: "separator", required: !1, type: { name: "ReactNode" } }, digitFormat: { defaultValue: { value: "default" }, description: "Format for displaying the digit (e.g., '00' for zero-padding)", name: "digitFormat", required: !1, type: { name: "enum", value: [{ value: '"default"' }, { value: '"padded"' }] } }, hidden: { defaultValue: { value: "false" }, description: "Whether this count box is hidden", name: "hidden", required: !1, type: { name: "boolean" } } } };
+  scountbox.displayName = "scountbox", scountbox.__docgenInfo = { description: "An individual count box component that displays a single time unit with optional animations.", displayName: "scountbox", props: { digit: { defaultValue: { value: "0" }, description: "The numeric value to display", name: "digit", required: !1, type: { name: "number" } }, title: { defaultValue: { value: "" }, description: "The label/title for this time unit", name: "title", required: !1, type: { name: "string" } }, size: { defaultValue: { value: "medium" }, description: "Size variant for the count box", name: "size", required: !1, type: { name: "enum", value: [{ value: '"small"' }, { value: '"medium"' }, { value: '"large"' }] } }, color: { defaultValue: { value: "inherit" }, description: "Color variant for the count box", name: "color", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"error"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, animation: { defaultValue: { value: "none" }, description: "Animation type for value changes", name: "animation", required: !1, type: { name: "enum", value: [{ value: '"none"' }, { value: '"fade"' }, { value: '"slide"' }] } }, sx: { defaultValue: null, description: "Custom styling", name: "sx", required: !1, type: { name: "SxProps<Theme>" } }, digitSx: { defaultValue: null, description: "Custom digit styling", name: "digitSx", required: !1, type: { name: "SxProps<Theme>" } }, titleSx: { defaultValue: null, description: "Custom title styling", name: "titleSx", required: !1, type: { name: "SxProps<Theme>" } }, showSeparator: { defaultValue: { value: "false" }, description: "Show separator after this box", name: "showSeparator", required: !1, type: { name: "boolean" } }, separator: { defaultValue: { value: ":" }, description: "Custom separator element", name: "separator", required: !1, type: { name: "ReactNode" } }, digitFormat: { defaultValue: { value: "default" }, description: "Format for displaying the digit (e.g., '00' for zero-padding)", name: "digitFormat", required: !1, type: { name: "enum", value: [{ value: '"default"' }, { value: '"padded"' }] } }, hidden: { defaultValue: { value: "false" }, description: "Whether this count box is hidden", name: "hidden", required: !1, type: { name: "boolean" } } } };
 } catch {
 }
 export {

package/dist/s-countdown/s-count-down.js

@@ -150,7 +150,7 @@ const p = ({
 };
 p.displayName = "SCountdown";
 try {
-  p.displayName = "SCountdown", p.__docgenInfo = { description: "A comprehensive countdown timer component with extensive customization options, animations, and accessibility features.", displayName: "SCountdown", props: { expireDate: { defaultValue: null, description: "Target date timestamp in milliseconds (from Date.getTime())", name: "expireDate", required: !0, type: { name: "number" } }, size: { defaultValue: { value: "medium" }, description: "Size variant for all count boxes", name: "size", required: !1, type: { name: "enum", value: [{ value: '"small"' }, { value: '"medium"' }, { value: '"large"' }] } }, color: { defaultValue: { value: "inherit" }, description: "Color theme for the countdown", name: "color", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"error"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, layout: { defaultValue: { value: "horizontal" }, description: "Layout orientation", name: "layout", required: !1, type: { name: "enum", value: [{ value: '"grid"' }, { value: '"horizontal"' }, { value: '"vertical"' }] } }, animation: { defaultValue: { value: "none" }, description: "Animation type for value changes", name: "animation", required: !1, type: { name: "enum", value: [{ value: '"none"' }, { value: '"fade"' }, { value: '"slide"' }] } }, showSeparators: { defaultValue: { value: "false" }, description: "Whether to show separators between units", name: "showSeparators", required: !1, type: { name: "boolean" } }, separator: { defaultValue: { value: ":" }, description: "Custom separator element", name: "separator", required: !1, type: { name: "ReactNode" } }, units: { defaultValue: { value: `{
+  p.displayName = "SCountdown", p.__docgenInfo = { description: "A comprehensive countdown timer component with extensive customization options, animations, and accessibility features.", displayName: "SCountdown", props: { expireDate: { defaultValue: null, description: "Target date timestamp in milliseconds (from Date.getTime())", name: "expireDate", required: !0, type: { name: "number" } }, size: { defaultValue: { value: "medium" }, description: "Size variant for all count boxes", name: "size", required: !1, type: { name: "enum", value: [{ value: '"small"' }, { value: '"medium"' }, { value: '"large"' }] } }, color: { defaultValue: { value: "inherit" }, description: "Color theme for the countdown", name: "color", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"error"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, layout: { defaultValue: { value: "horizontal" }, description: "Layout orientation", name: "layout", required: !1, type: { name: "enum", value: [{ value: '"grid"' }, { value: '"horizontal"' }, { value: '"vertical"' }] } }, animation: { defaultValue: { value: "none" }, description: "Animation type for value changes", name: "animation", required: !1, type: { name: "enum", value: [{ value: '"none"' }, { value: '"fade"' }, { value: '"slide"' }] } }, showSeparators: { defaultValue: { value: "false" }, description: "Whether to show separators between units", name: "showSeparators", required: !1, type: { name: "boolean" } }, separator: { defaultValue: { value: ":" }, description: "Custom separator element", name: "separator", required: !1, type: { name: "ReactNode" } }, units: { defaultValue: { value: `{
     days: true,
     hours: true,
     minutes: true,
@@ -164,7 +164,7 @@ try {
 } catch {
 }
 try {
-  scountdown.displayName = "scountdown", scountdown.__docgenInfo = { description: "A comprehensive countdown timer component with extensive customization options, animations, and accessibility features.", displayName: "scountdown", props: { expireDate: { defaultValue: null, description: "Target date timestamp in milliseconds (from Date.getTime())", name: "expireDate", required: !0, type: { name: "number" } }, size: { defaultValue: { value: "medium" }, description: "Size variant for all count boxes", name: "size", required: !1, type: { name: "enum", value: [{ value: '"small"' }, { value: '"medium"' }, { value: '"large"' }] } }, color: { defaultValue: { value: "inherit" }, description: "Color theme for the countdown", name: "color", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"error"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, layout: { defaultValue: { value: "horizontal" }, description: "Layout orientation", name: "layout", required: !1, type: { name: "enum", value: [{ value: '"grid"' }, { value: '"horizontal"' }, { value: '"vertical"' }] } }, animation: { defaultValue: { value: "none" }, description: "Animation type for value changes", name: "animation", required: !1, type: { name: "enum", value: [{ value: '"none"' }, { value: '"fade"' }, { value: '"slide"' }] } }, showSeparators: { defaultValue: { value: "false" }, description: "Whether to show separators between units", name: "showSeparators", required: !1, type: { name: "boolean" } }, separator: { defaultValue: { value: ":" }, description: "Custom separator element", name: "separator", required: !1, type: { name: "ReactNode" } }, units: { defaultValue: { value: `{
+  scountdown.displayName = "scountdown", scountdown.__docgenInfo = { description: "A comprehensive countdown timer component with extensive customization options, animations, and accessibility features.", displayName: "scountdown", props: { expireDate: { defaultValue: null, description: "Target date timestamp in milliseconds (from Date.getTime())", name: "expireDate", required: !0, type: { name: "number" } }, size: { defaultValue: { value: "medium" }, description: "Size variant for all count boxes", name: "size", required: !1, type: { name: "enum", value: [{ value: '"small"' }, { value: '"medium"' }, { value: '"large"' }] } }, color: { defaultValue: { value: "inherit" }, description: "Color theme for the countdown", name: "color", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"error"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, layout: { defaultValue: { value: "horizontal" }, description: "Layout orientation", name: "layout", required: !1, type: { name: "enum", value: [{ value: '"grid"' }, { value: '"horizontal"' }, { value: '"vertical"' }] } }, animation: { defaultValue: { value: "none" }, description: "Animation type for value changes", name: "animation", required: !1, type: { name: "enum", value: [{ value: '"none"' }, { value: '"fade"' }, { value: '"slide"' }] } }, showSeparators: { defaultValue: { value: "false" }, description: "Whether to show separators between units", name: "showSeparators", required: !1, type: { name: "boolean" } }, separator: { defaultValue: { value: ":" }, description: "Custom separator element", name: "separator", required: !1, type: { name: "ReactNode" } }, units: { defaultValue: { value: `{
     days: true,
     hours: true,
     minutes: true,

package/dist/s-error-layout/s-error-layout.js

@@ -52,11 +52,11 @@ const n = ({
 );
 n.displayName = "SErrorLayout";
 try {
-  n.displayName = "SErrorLayout", n.__docgenInfo = { description: "A full-screen error layout component for displaying error pages with customizable content and styling.", displayName: "SErrorLayout", props: { imageSrc: { defaultValue: null, description: "Source URL for the error image", name: "imageSrc", required: !0, type: { name: "string" } }, imageAlt: { defaultValue: null, description: "Alt text for the error image", name: "imageAlt", required: !0, type: { name: "string" } }, title: { defaultValue: null, description: "Main error title text", name: "title", required: !0, type: { name: "string" } }, description: { defaultValue: null, description: "Error description text", name: "description", required: !0, type: { name: "ReactNode" } }, buttonText: { defaultValue: null, description: "Text for the action button. If not provided, button will not be shown", name: "buttonText", required: !1, type: { name: "string" } }, imageWidth: { defaultValue: { value: "200px" }, description: "Image width. Default: '200px'", name: "imageWidth", required: !1, type: { name: "string | number" } }, imageHeight: { defaultValue: { value: "auto" }, description: "Image height. Default: 'auto'", name: "imageHeight", required: !1, type: { name: "string | number" } }, maxWidth: { defaultValue: { value: "lg" }, description: "Container max width. Default: 'lg'", name: "maxWidth", required: !1, type: { name: 'false | "xs" | "sm" | "md" | "lg" | "xl"' } }, height: { defaultValue: { value: "100vh" }, description: "Main container height. Default: '100vh'", name: "height", required: !1, type: { name: "string | number" } }, py: { defaultValue: { value: "8" }, description: "Vertical padding. Default: 8 (64px)", name: "py", required: !1, type: { name: "string | number" } }, spacing: { defaultValue: { value: "6" }, description: "Spacing between elements. Default: 6", name: "spacing", required: !1, type: { name: "number" } }, titleVariant: { defaultValue: { value: "h4" }, description: "Title typography variant. Default: 'h4'", name: "titleVariant", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"button"' }, { value: '"caption"' }, { value: '"h1"' }, { value: '"h2"' }, { value: '"h3"' }, { value: '"h4"' }, { value: '"h5"' }, { value: '"h6"' }, { value: '"subtitle1"' }, { value: '"subtitle2"' }, { value: '"body1"' }, { value: '"body2"' }, { value: '"overline"' }] } }, descriptionVariant: { defaultValue: { value: "body1" }, description: "Description typography variant. Default: 'body1'", name: "descriptionVariant", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"button"' }, { value: '"caption"' }, { value: '"h1"' }, { value: '"h2"' }, { value: '"h3"' }, { value: '"h4"' }, { value: '"h5"' }, { value: '"h6"' }, { value: '"subtitle1"' }, { value: '"subtitle2"' }, { value: '"body1"' }, { value: '"body2"' }, { value: '"overline"' }] } }, buttonVariant: { defaultValue: { value: "contained" }, description: "Button variant. Default: 'contained'", name: "buttonVariant", required: !1, type: { name: "enum", value: [{ value: '"text"' }, { value: '"outlined"' }, { value: '"contained"' }] } }, buttonColor: { defaultValue: { value: "primary" }, description: "Button color. Default: 'primary'", name: "buttonColor", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"error"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, containerSx: { defaultValue: null, description: "Custom styles for the main container", name: "containerSx", required: !1, type: { name: "SxProps<Theme>" } }, imageContainerSx: { defaultValue: null, description: "Custom styles for the image container", name: "imageContainerSx", required: !1, type: { name: "SxProps<Theme>" } }, contentSx: { defaultValue: null, description: "Custom styles for the content stack", name: "contentSx", required: !1, type: { name: "SxProps<Theme>" } }, titleSx: { defaultValue: null, description: "Custom styles for the title", name: "titleSx", required: !1, type: { name: "SxProps<Theme>" } }, descriptionSx: { defaultValue: null, description: "Custom styles for the description", name: "descriptionSx", required: !1, type: { name: "SxProps<Theme>" } }, buttonContainerSx: { defaultValue: null, description: "Custom styles for the button container", name: "buttonContainerSx", required: !1, type: { name: "SxProps<Theme>" } }, buttonProps: { defaultValue: null, description: "Additional button props", name: "buttonProps", required: !1, type: { name: "Partial<ButtonProps>" } }, hideImage: { defaultValue: { value: "false" }, description: "Hide image. Default: false", name: "hideImage", required: !1, type: { name: "boolean" } }, customActions: { defaultValue: null, description: "Custom content to render instead of the button", name: "customActions", required: !1, type: { name: "ReactNode" } } } };
+  n.displayName = "SErrorLayout", n.__docgenInfo = { description: "A full-screen error layout component for displaying error pages with customizable content and styling.", displayName: "SErrorLayout", props: { imageSrc: { defaultValue: null, description: "Source URL for the error image", name: "imageSrc", required: !0, type: { name: "string" } }, imageAlt: { defaultValue: null, description: "Alt text for the error image", name: "imageAlt", required: !0, type: { name: "string" } }, title: { defaultValue: null, description: "Main error title text", name: "title", required: !0, type: { name: "string" } }, description: { defaultValue: null, description: "Error description text", name: "description", required: !0, type: { name: "ReactNode" } }, buttonText: { defaultValue: null, description: "Text for the action button. If not provided, button will not be shown", name: "buttonText", required: !1, type: { name: "string" } }, imageWidth: { defaultValue: { value: "200px" }, description: "Image width. Default: '200px'", name: "imageWidth", required: !1, type: { name: "string | number" } }, imageHeight: { defaultValue: { value: "auto" }, description: "Image height. Default: 'auto'", name: "imageHeight", required: !1, type: { name: "string | number" } }, maxWidth: { defaultValue: { value: "lg" }, description: "Container max width. Default: 'lg'", name: "maxWidth", required: !1, type: { name: 'false | "xs" | "sm" | "md" | "lg" | "xl"' } }, height: { defaultValue: { value: "100vh" }, description: "Main container height. Default: '100vh'", name: "height", required: !1, type: { name: "string | number" } }, py: { defaultValue: { value: "8" }, description: "Vertical padding. Default: 8 (64px)", name: "py", required: !1, type: { name: "string | number" } }, spacing: { defaultValue: { value: "6" }, description: "Spacing between elements. Default: 6", name: "spacing", required: !1, type: { name: "number" } }, titleVariant: { defaultValue: { value: "h4" }, description: "Title typography variant. Default: 'h4'", name: "titleVariant", required: !1, type: { name: "enum", value: [{ value: '"button"' }, { value: '"caption"' }, { value: '"h1"' }, { value: '"h2"' }, { value: '"h3"' }, { value: '"h4"' }, { value: '"h5"' }, { value: '"h6"' }, { value: '"inherit"' }, { value: '"body2"' }, { value: '"body1"' }, { value: '"subtitle1"' }, { value: '"subtitle2"' }, { value: '"overline"' }] } }, descriptionVariant: { defaultValue: { value: "body1" }, description: "Description typography variant. Default: 'body1'", name: "descriptionVariant", required: !1, type: { name: "enum", value: [{ value: '"button"' }, { value: '"caption"' }, { value: '"h1"' }, { value: '"h2"' }, { value: '"h3"' }, { value: '"h4"' }, { value: '"h5"' }, { value: '"h6"' }, { value: '"inherit"' }, { value: '"body2"' }, { value: '"body1"' }, { value: '"subtitle1"' }, { value: '"subtitle2"' }, { value: '"overline"' }] } }, buttonVariant: { defaultValue: { value: "contained" }, description: "Button variant. Default: 'contained'", name: "buttonVariant", required: !1, type: { name: "enum", value: [{ value: '"text"' }, { value: '"outlined"' }, { value: '"contained"' }] } }, buttonColor: { defaultValue: { value: "primary" }, description: "Button color. Default: 'primary'", name: "buttonColor", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"error"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, containerSx: { defaultValue: null, description: "Custom styles for the main container", name: "containerSx", required: !1, type: { name: "SxProps<Theme>" } }, imageContainerSx: { defaultValue: null, description: "Custom styles for the image container", name: "imageContainerSx", required: !1, type: { name: "SxProps<Theme>" } }, contentSx: { defaultValue: null, description: "Custom styles for the content stack", name: "contentSx", required: !1, type: { name: "SxProps<Theme>" } }, titleSx: { defaultValue: null, description: "Custom styles for the title", name: "titleSx", required: !1, type: { name: "SxProps<Theme>" } }, descriptionSx: { defaultValue: null, description: "Custom styles for the description", name: "descriptionSx", required: !1, type: { name: "SxProps<Theme>" } }, buttonContainerSx: { defaultValue: null, description: "Custom styles for the button container", name: "buttonContainerSx", required: !1, type: { name: "SxProps<Theme>" } }, buttonProps: { defaultValue: null, description: "Additional button props", name: "buttonProps", required: !1, type: { name: "Partial<ButtonProps>" } }, hideImage: { defaultValue: { value: "false" }, description: "Hide image. Default: false", name: "hideImage", required: !1, type: { name: "boolean" } }, customActions: { defaultValue: null, description: "Custom content to render instead of the button", name: "customActions", required: !1, type: { name: "ReactNode" } } } };
 } catch {
 }
 try {
-  serrorlayout.displayName = "serrorlayout", serrorlayout.__docgenInfo = { description: "A full-screen error layout component for displaying error pages with customizable content and styling.", displayName: "serrorlayout", props: { imageSrc: { defaultValue: null, description: "Source URL for the error image", name: "imageSrc", required: !0, type: { name: "string" } }, imageAlt: { defaultValue: null, description: "Alt text for the error image", name: "imageAlt", required: !0, type: { name: "string" } }, title: { defaultValue: null, description: "Main error title text", name: "title", required: !0, type: { name: "string" } }, description: { defaultValue: null, description: "Error description text", name: "description", required: !0, type: { name: "ReactNode" } }, buttonText: { defaultValue: null, description: "Text for the action button. If not provided, button will not be shown", name: "buttonText", required: !1, type: { name: "string" } }, imageWidth: { defaultValue: { value: "200px" }, description: "Image width. Default: '200px'", name: "imageWidth", required: !1, type: { name: "string | number" } }, imageHeight: { defaultValue: { value: "auto" }, description: "Image height. Default: 'auto'", name: "imageHeight", required: !1, type: { name: "string | number" } }, maxWidth: { defaultValue: { value: "lg" }, description: "Container max width. Default: 'lg'", name: "maxWidth", required: !1, type: { name: 'false | "xs" | "sm" | "md" | "lg" | "xl"' } }, height: { defaultValue: { value: "100vh" }, description: "Main container height. Default: '100vh'", name: "height", required: !1, type: { name: "string | number" } }, py: { defaultValue: { value: "8" }, description: "Vertical padding. Default: 8 (64px)", name: "py", required: !1, type: { name: "string | number" } }, spacing: { defaultValue: { value: "6" }, description: "Spacing between elements. Default: 6", name: "spacing", required: !1, type: { name: "number" } }, titleVariant: { defaultValue: { value: "h4" }, description: "Title typography variant. Default: 'h4'", name: "titleVariant", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"button"' }, { value: '"caption"' }, { value: '"h1"' }, { value: '"h2"' }, { value: '"h3"' }, { value: '"h4"' }, { value: '"h5"' }, { value: '"h6"' }, { value: '"subtitle1"' }, { value: '"subtitle2"' }, { value: '"body1"' }, { value: '"body2"' }, { value: '"overline"' }] } }, descriptionVariant: { defaultValue: { value: "body1" }, description: "Description typography variant. Default: 'body1'", name: "descriptionVariant", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"button"' }, { value: '"caption"' }, { value: '"h1"' }, { value: '"h2"' }, { value: '"h3"' }, { value: '"h4"' }, { value: '"h5"' }, { value: '"h6"' }, { value: '"subtitle1"' }, { value: '"subtitle2"' }, { value: '"body1"' }, { value: '"body2"' }, { value: '"overline"' }] } }, buttonVariant: { defaultValue: { value: "contained" }, description: "Button variant. Default: 'contained'", name: "buttonVariant", required: !1, type: { name: "enum", value: [{ value: '"text"' }, { value: '"outlined"' }, { value: '"contained"' }] } }, buttonColor: { defaultValue: { value: "primary" }, description: "Button color. Default: 'primary'", name: "buttonColor", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"error"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, containerSx: { defaultValue: null, description: "Custom styles for the main container", name: "containerSx", required: !1, type: { name: "SxProps<Theme>" } }, imageContainerSx: { defaultValue: null, description: "Custom styles for the image container", name: "imageContainerSx", required: !1, type: { name: "SxProps<Theme>" } }, contentSx: { defaultValue: null, description: "Custom styles for the content stack", name: "contentSx", required: !1, type: { name: "SxProps<Theme>" } }, titleSx: { defaultValue: null, description: "Custom styles for the title", name: "titleSx", required: !1, type: { name: "SxProps<Theme>" } }, descriptionSx: { defaultValue: null, description: "Custom styles for the description", name: "descriptionSx", required: !1, type: { name: "SxProps<Theme>" } }, buttonContainerSx: { defaultValue: null, description: "Custom styles for the button container", name: "buttonContainerSx", required: !1, type: { name: "SxProps<Theme>" } }, buttonProps: { defaultValue: null, description: "Additional button props", name: "buttonProps", required: !1, type: { name: "Partial<ButtonProps>" } }, hideImage: { defaultValue: { value: "false" }, description: "Hide image. Default: false", name: "hideImage", required: !1, type: { name: "boolean" } }, customActions: { defaultValue: null, description: "Custom content to render instead of the button", name: "customActions", required: !1, type: { name: "ReactNode" } } } };
+  serrorlayout.displayName = "serrorlayout", serrorlayout.__docgenInfo = { description: "A full-screen error layout component for displaying error pages with customizable content and styling.", displayName: "serrorlayout", props: { imageSrc: { defaultValue: null, description: "Source URL for the error image", name: "imageSrc", required: !0, type: { name: "string" } }, imageAlt: { defaultValue: null, description: "Alt text for the error image", name: "imageAlt", required: !0, type: { name: "string" } }, title: { defaultValue: null, description: "Main error title text", name: "title", required: !0, type: { name: "string" } }, description: { defaultValue: null, description: "Error description text", name: "description", required: !0, type: { name: "ReactNode" } }, buttonText: { defaultValue: null, description: "Text for the action button. If not provided, button will not be shown", name: "buttonText", required: !1, type: { name: "string" } }, imageWidth: { defaultValue: { value: "200px" }, description: "Image width. Default: '200px'", name: "imageWidth", required: !1, type: { name: "string | number" } }, imageHeight: { defaultValue: { value: "auto" }, description: "Image height. Default: 'auto'", name: "imageHeight", required: !1, type: { name: "string | number" } }, maxWidth: { defaultValue: { value: "lg" }, description: "Container max width. Default: 'lg'", name: "maxWidth", required: !1, type: { name: 'false | "xs" | "sm" | "md" | "lg" | "xl"' } }, height: { defaultValue: { value: "100vh" }, description: "Main container height. Default: '100vh'", name: "height", required: !1, type: { name: "string | number" } }, py: { defaultValue: { value: "8" }, description: "Vertical padding. Default: 8 (64px)", name: "py", required: !1, type: { name: "string | number" } }, spacing: { defaultValue: { value: "6" }, description: "Spacing between elements. Default: 6", name: "spacing", required: !1, type: { name: "number" } }, titleVariant: { defaultValue: { value: "h4" }, description: "Title typography variant. Default: 'h4'", name: "titleVariant", required: !1, type: { name: "enum", value: [{ value: '"button"' }, { value: '"caption"' }, { value: '"h1"' }, { value: '"h2"' }, { value: '"h3"' }, { value: '"h4"' }, { value: '"h5"' }, { value: '"h6"' }, { value: '"inherit"' }, { value: '"body2"' }, { value: '"body1"' }, { value: '"subtitle1"' }, { value: '"subtitle2"' }, { value: '"overline"' }] } }, descriptionVariant: { defaultValue: { value: "body1" }, description: "Description typography variant. Default: 'body1'", name: "descriptionVariant", required: !1, type: { name: "enum", value: [{ value: '"button"' }, { value: '"caption"' }, { value: '"h1"' }, { value: '"h2"' }, { value: '"h3"' }, { value: '"h4"' }, { value: '"h5"' }, { value: '"h6"' }, { value: '"inherit"' }, { value: '"body2"' }, { value: '"body1"' }, { value: '"subtitle1"' }, { value: '"subtitle2"' }, { value: '"overline"' }] } }, buttonVariant: { defaultValue: { value: "contained" }, description: "Button variant. Default: 'contained'", name: "buttonVariant", required: !1, type: { name: "enum", value: [{ value: '"text"' }, { value: '"outlined"' }, { value: '"contained"' }] } }, buttonColor: { defaultValue: { value: "primary" }, description: "Button color. Default: 'primary'", name: "buttonColor", required: !1, type: { name: "enum", value: [{ value: '"inherit"' }, { value: '"error"' }, { value: '"primary"' }, { value: '"secondary"' }, { value: '"info"' }, { value: '"success"' }, { value: '"warning"' }] } }, containerSx: { defaultValue: null, description: "Custom styles for the main container", name: "containerSx", required: !1, type: { name: "SxProps<Theme>" } }, imageContainerSx: { defaultValue: null, description: "Custom styles for the image container", name: "imageContainerSx", required: !1, type: { name: "SxProps<Theme>" } }, contentSx: { defaultValue: null, description: "Custom styles for the content stack", name: "contentSx", required: !1, type: { name: "SxProps<Theme>" } }, titleSx: { defaultValue: null, description: "Custom styles for the title", name: "titleSx", required: !1, type: { name: "SxProps<Theme>" } }, descriptionSx: { defaultValue: null, description: "Custom styles for the description", name: "descriptionSx", required: !1, type: { name: "SxProps<Theme>" } }, buttonContainerSx: { defaultValue: null, description: "Custom styles for the button container", name: "buttonContainerSx", required: !1, type: { name: "SxProps<Theme>" } }, buttonProps: { defaultValue: null, description: "Additional button props", name: "buttonProps", required: !1, type: { name: "Partial<ButtonProps>" } }, hideImage: { defaultValue: { value: "false" }, description: "Hide image. Default: false", name: "hideImage", required: !1, type: { name: "boolean" } }, customActions: { defaultValue: null, description: "Custom content to render instead of the button", name: "customActions", required: !1, type: { name: "ReactNode" } } } };
 } catch {
 }
 export {

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

@@ -12,6 +12,8 @@ export interface SGlowButtonProps extends ButtonProps {
     duration?: number;
     /** Button width (defaults to 'fit-content') */
     width?: string;
+    /** Button height (defaults to '60px') */
+    height?: string;
     /** Size of the glow effect in pixels (defaults to 60) */
     glowSize?: number;
     /** Color of the glow effect (defaults to blue[500]) */
@@ -21,7 +23,7 @@ export interface SGlowButtonProps extends ButtonProps {
  * A visually striking button with animated glowing border effects and gradient text.
  */
 declare const SGlowButton: {
-    ({ borderRadius, children, duration, width, glowSize, glowColor, ...props }: SGlowButtonProps): React.JSX.Element;
+    ({ borderRadius, children, duration, width, height, glowSize, glowColor, ...props }: SGlowButtonProps): React.JSX.Element;
     displayName: string;
 };
 export default SGlowButton;

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

@@ -1,42 +1,45 @@
-import { j as r } from "../jsx-runtime-OVHDjVDe.js";
-import { hslToRgb as d, Button as s } from "@mui/material";
-import { SMovingBorder as f } from "../s-moving-border/s-moving-border.js";
+import { j as i } from "../jsx-runtime-OVHDjVDe.js";
+import { hslToRgb as s, Button as f } from "@mui/material";
+import { SMovingBorder as p } from "../s-moving-border/s-moving-border.js";
 import { blue as m } from "../theme/theme-primitives.js";
 const t = ({
   borderRadius: e = 12,
-  children: i,
+  children: a,
   duration: n = 3e3,
   width: o = "fit-content",
-  glowSize: a = 60,
-  glowColor: l = d(m[500]),
-  ...u
-}) => /* @__PURE__ */ r.jsx(
-  f,
+  height: r = "60px",
+  glowSize: l = 60,
+  glowColor: u = s(m[500]),
+  ...d
+}) => /* @__PURE__ */ i.jsx(
+  p,
   {
     width: o,
+    height: r,
     duration: n,
     borderRadius: e,
-    glowSize: a,
-    glowColor: l,
+    glowSize: l,
+    glowColor: u,
     padding: 0.3,
-    children: /* @__PURE__ */ r.jsx(
-      s,
+    children: /* @__PURE__ */ i.jsx(
+      f,
       {
         sx: {
           borderRadius: e,
-          width: o
+          width: o,
+          height: r
         },
         disableRipple: !0,
-        ...u,
+        ...d,
         fullWidth: !0,
-        children: i
+        children: a
       }
     )
   }
 );
 t.displayName = "SGlowButton";
 try {
-  t.displayName = "SGlowButton", t.__docgenInfo = { description: "A visually striking button with animated glowing border effects and gradient text.", displayName: "SGlowButton", props: { borderRadius: { defaultValue: { value: "12" }, description: "Border radius for the button (defaults to 12px)", name: "borderRadius", required: !1, type: { name: "string | number" } }, children: { defaultValue: null, description: "Button content", name: "children", required: !0, type: { name: "ReactNode" } }, duration: { defaultValue: { value: "3000" }, description: "Duration of the moving border animation in milliseconds (defaults to 6000ms)", name: "duration", required: !1, type: { name: "number" } }, width: { defaultValue: { value: "fit-content" }, description: "Button width (defaults to 'fit-content')", name: "width", required: !1, type: { name: "string" } }, glowSize: { defaultValue: { value: "60" }, description: "Size of the glow effect in pixels (defaults to 60)", name: "glowSize", required: !1, type: { name: "number" } }, glowColor: { defaultValue: { value: "hslToRgb(blue[500])" }, description: "Color of the glow effect (defaults to blue[500])", name: "glowColor", required: !1, type: { name: "string" } } } };
+  t.displayName = "SGlowButton", t.__docgenInfo = { description: "A visually striking button with animated glowing border effects and gradient text.", displayName: "SGlowButton", props: { borderRadius: { defaultValue: { value: "12" }, description: "Border radius for the button (defaults to 12px)", name: "borderRadius", required: !1, type: { name: "string | number" } }, children: { defaultValue: null, description: "Button content", name: "children", required: !0, type: { name: "ReactNode" } }, duration: { defaultValue: { value: "3000" }, description: "Duration of the moving border animation in milliseconds (defaults to 6000ms)", name: "duration", required: !1, type: { name: "number" } }, width: { defaultValue: { value: "fit-content" }, description: "Button width (defaults to 'fit-content')", name: "width", required: !1, type: { name: "string" } }, height: { defaultValue: { value: "60px" }, description: "Button height (defaults to '60px')", name: "height", required: !1, type: { name: "string" } }, glowSize: { defaultValue: { value: "60" }, description: "Size of the glow effect in pixels (defaults to 60)", name: "glowSize", required: !1, type: { name: "number" } }, glowColor: { defaultValue: { value: "hslToRgb(blue[500])" }, description: "Color of the glow effect (defaults to blue[500])", name: "glowColor", required: !1, type: { name: "string" } } } };
 } catch {
 }
 export {

package/dist/s-gradient-icon/s-gradient-icon.js

@@ -78,11 +78,11 @@ const s = ({
 };
 s.displayName = "SGradientIcon";
 try {
-  s.displayName = "SGradientIcon", s.__docgenInfo = { description: "A customizable icon component that applies gradient effects with multiple themes and animations.", displayName: "SGradientIcon", props: { hovered: { defaultValue: { value: "false" }, description: "Whether the icon should show the gradient fill (hover state)", name: "hovered", required: !1, type: { name: "boolean" } }, IconComponent: { defaultValue: null, description: "The Material-UI icon component to render with gradient effect", name: "IconComponent", required: !0, type: { name: "IconComponent" } }, sx: { defaultValue: null, description: "Additional styling props", name: "sx", required: !1, type: { name: "SxProps" } }, strokeWidth: { defaultValue: { value: "0" }, description: "Stroke width for the icon (default: 0)", name: "strokeWidth", required: !1, type: { name: "number" } }, gradientTheme: { defaultValue: { value: "blue-cyan" }, description: "Predefined gradient theme (default: 'blue-cyan')", name: "gradientTheme", required: !1, type: { name: "enum", value: [{ value: '"custom"' }, { value: '"blue-cyan"' }, { value: '"purple-pink"' }, { value: '"orange-red"' }, { value: '"green-teal"' }, { value: '"indigo-purple"' }] } }, customGradient: { defaultValue: null, description: "Custom gradient colors when theme is 'custom'", name: "customGradient", required: !1, type: { name: "CustomGradient" } }, gradientDirection: { defaultValue: { value: "diagonal" }, description: "Direction of the gradient (default: 'diagonal')", name: "gradientDirection", required: !1, type: { name: "enum", value: [{ value: '"horizontal"' }, { value: '"vertical"' }, { value: '"diagonal"' }, { value: '"radial"' }] } }, animationDuration: { defaultValue: { value: "300" }, description: "Animation duration in milliseconds (default: 300)", name: "animationDuration", required: !1, type: { name: "number" } }, animationEasing: { defaultValue: { value: "ease" }, description: "Animation easing function (default: 'ease')", name: "animationEasing", required: !1, type: { name: "enum", value: [{ value: '"linear"' }, { value: '"ease"' }, { value: '"ease-in"' }, { value: '"ease-in-out"' }, { value: '"ease-out"' }] } }, autoHover: { defaultValue: { value: "false" }, description: "Whether to automatically detect hover state (default: false)", name: "autoHover", required: !1, type: { name: "boolean" } }, gradientId: { defaultValue: null, description: "Unique identifier for the gradient (auto-generated if not provided)", name: "gradientId", required: !1, type: { name: "string" } }, alwaysGradient: { defaultValue: { value: "false" }, description: "Whether to always show gradient (overrides hovered state)", name: "alwaysGradient", required: !1, type: { name: "boolean" } }, fallbackColor: { defaultValue: null, description: "Fallback color when gradient is not shown", name: "fallbackColor", required: !1, type: { name: "string" } } } };
+  s.displayName = "SGradientIcon", s.__docgenInfo = { description: "A customizable icon component that applies gradient effects with multiple themes and animations.", displayName: "SGradientIcon", props: { hovered: { defaultValue: { value: "false" }, description: "Whether the icon should show the gradient fill (hover state)", name: "hovered", required: !1, type: { name: "boolean" } }, IconComponent: { defaultValue: null, description: "The Material-UI icon component to render with gradient effect", name: "IconComponent", required: !0, type: { name: "IconComponent" } }, sx: { defaultValue: null, description: "Additional styling props", name: "sx", required: !1, type: { name: "SxProps" } }, strokeWidth: { defaultValue: { value: "0" }, description: "Stroke width for the icon (default: 0)", name: "strokeWidth", required: !1, type: { name: "number" } }, gradientTheme: { defaultValue: { value: "blue-cyan" }, description: "Predefined gradient theme (default: 'blue-cyan')", name: "gradientTheme", required: !1, type: { name: "enum", value: [{ value: '"custom"' }, { value: '"blue-cyan"' }, { value: '"purple-pink"' }, { value: '"orange-red"' }, { value: '"green-teal"' }, { value: '"indigo-purple"' }] } }, customGradient: { defaultValue: null, description: "Custom gradient colors when theme is 'custom'", name: "customGradient", required: !1, type: { name: "CustomGradient" } }, gradientDirection: { defaultValue: { value: "diagonal" }, description: "Direction of the gradient (default: 'diagonal')", name: "gradientDirection", required: !1, type: { name: "enum", value: [{ value: '"horizontal"' }, { value: '"vertical"' }, { value: '"diagonal"' }, { value: '"radial"' }] } }, animationDuration: { defaultValue: { value: "300" }, description: "Animation duration in milliseconds (default: 300)", name: "animationDuration", required: !1, type: { name: "number" } }, animationEasing: { defaultValue: { value: "ease" }, description: "Animation easing function (default: 'ease')", name: "animationEasing", required: !1, type: { name: "enum", value: [{ value: '"linear"' }, { value: '"ease"' }, { value: '"ease-in"' }, { value: '"ease-out"' }, { value: '"ease-in-out"' }] } }, autoHover: { defaultValue: { value: "false" }, description: "Whether to automatically detect hover state (default: false)", name: "autoHover", required: !1, type: { name: "boolean" } }, gradientId: { defaultValue: null, description: "Unique identifier for the gradient (auto-generated if not provided)", name: "gradientId", required: !1, type: { name: "string" } }, alwaysGradient: { defaultValue: { value: "false" }, description: "Whether to always show gradient (overrides hovered state)", name: "alwaysGradient", required: !1, type: { name: "boolean" } }, fallbackColor: { defaultValue: null, description: "Fallback color when gradient is not shown", name: "fallbackColor", required: !1, type: { name: "string" } } } };
 } catch {
 }
 try {
-  sgradienticon.displayName = "sgradienticon", sgradienticon.__docgenInfo = { description: "A customizable icon component that applies gradient effects with multiple themes and animations.", displayName: "sgradienticon", props: { hovered: { defaultValue: { value: "false" }, description: "Whether the icon should show the gradient fill (hover state)", name: "hovered", required: !1, type: { name: "boolean" } }, IconComponent: { defaultValue: null, description: "The Material-UI icon component to render with gradient effect", name: "IconComponent", required: !0, type: { name: "IconComponent" } }, sx: { defaultValue: null, description: "Additional styling props", name: "sx", required: !1, type: { name: "SxProps" } }, strokeWidth: { defaultValue: { value: "0" }, description: "Stroke width for the icon (default: 0)", name: "strokeWidth", required: !1, type: { name: "number" } }, gradientTheme: { defaultValue: { value: "blue-cyan" }, description: "Predefined gradient theme (default: 'blue-cyan')", name: "gradientTheme", required: !1, type: { name: "enum", value: [{ value: '"custom"' }, { value: '"blue-cyan"' }, { value: '"purple-pink"' }, { value: '"orange-red"' }, { value: '"green-teal"' }, { value: '"indigo-purple"' }] } }, customGradient: { defaultValue: null, description: "Custom gradient colors when theme is 'custom'", name: "customGradient", required: !1, type: { name: "CustomGradient" } }, gradientDirection: { defaultValue: { value: "diagonal" }, description: "Direction of the gradient (default: 'diagonal')", name: "gradientDirection", required: !1, type: { name: "enum", value: [{ value: '"horizontal"' }, { value: '"vertical"' }, { value: '"diagonal"' }, { value: '"radial"' }] } }, animationDuration: { defaultValue: { value: "300" }, description: "Animation duration in milliseconds (default: 300)", name: "animationDuration", required: !1, type: { name: "number" } }, animationEasing: { defaultValue: { value: "ease" }, description: "Animation easing function (default: 'ease')", name: "animationEasing", required: !1, type: { name: "enum", value: [{ value: '"linear"' }, { value: '"ease"' }, { value: '"ease-in"' }, { value: '"ease-in-out"' }, { value: '"ease-out"' }] } }, autoHover: { defaultValue: { value: "false" }, description: "Whether to automatically detect hover state (default: false)", name: "autoHover", required: !1, type: { name: "boolean" } }, gradientId: { defaultValue: null, description: "Unique identifier for the gradient (auto-generated if not provided)", name: "gradientId", required: !1, type: { name: "string" } }, alwaysGradient: { defaultValue: { value: "false" }, description: "Whether to always show gradient (overrides hovered state)", name: "alwaysGradient", required: !1, type: { name: "boolean" } }, fallbackColor: { defaultValue: null, description: "Fallback color when gradient is not shown", name: "fallbackColor", required: !1, type: { name: "string" } } } };
+  sgradienticon.displayName = "sgradienticon", sgradienticon.__docgenInfo = { description: "A customizable icon component that applies gradient effects with multiple themes and animations.", displayName: "sgradienticon", props: { hovered: { defaultValue: { value: "false" }, description: "Whether the icon should show the gradient fill (hover state)", name: "hovered", required: !1, type: { name: "boolean" } }, IconComponent: { defaultValue: null, description: "The Material-UI icon component to render with gradient effect", name: "IconComponent", required: !0, type: { name: "IconComponent" } }, sx: { defaultValue: null, description: "Additional styling props", name: "sx", required: !1, type: { name: "SxProps" } }, strokeWidth: { defaultValue: { value: "0" }, description: "Stroke width for the icon (default: 0)", name: "strokeWidth", required: !1, type: { name: "number" } }, gradientTheme: { defaultValue: { value: "blue-cyan" }, description: "Predefined gradient theme (default: 'blue-cyan')", name: "gradientTheme", required: !1, type: { name: "enum", value: [{ value: '"custom"' }, { value: '"blue-cyan"' }, { value: '"purple-pink"' }, { value: '"orange-red"' }, { value: '"green-teal"' }, { value: '"indigo-purple"' }] } }, customGradient: { defaultValue: null, description: "Custom gradient colors when theme is 'custom'", name: "customGradient", required: !1, type: { name: "CustomGradient" } }, gradientDirection: { defaultValue: { value: "diagonal" }, description: "Direction of the gradient (default: 'diagonal')", name: "gradientDirection", required: !1, type: { name: "enum", value: [{ value: '"horizontal"' }, { value: '"vertical"' }, { value: '"diagonal"' }, { value: '"radial"' }] } }, animationDuration: { defaultValue: { value: "300" }, description: "Animation duration in milliseconds (default: 300)", name: "animationDuration", required: !1, type: { name: "number" } }, animationEasing: { defaultValue: { value: "ease" }, description: "Animation easing function (default: 'ease')", name: "animationEasing", required: !1, type: { name: "enum", value: [{ value: '"linear"' }, { value: '"ease"' }, { value: '"ease-in"' }, { value: '"ease-out"' }, { value: '"ease-in-out"' }] } }, autoHover: { defaultValue: { value: "false" }, description: "Whether to automatically detect hover state (default: false)", name: "autoHover", required: !1, type: { name: "boolean" } }, gradientId: { defaultValue: null, description: "Unique identifier for the gradient (auto-generated if not provided)", name: "gradientId", required: !1, type: { name: "string" } }, alwaysGradient: { defaultValue: { value: "false" }, description: "Whether to always show gradient (overrides hovered state)", name: "alwaysGradient", required: !1, type: { name: "boolean" } }, fallbackColor: { defaultValue: null, description: "Fallback color when gradient is not shown", name: "fallbackColor", required: !1, type: { name: "string" } } } };
 } catch {
 }
 export {

package/dist/s-select/s-select.js

@@ -1,11 +1,11 @@
 import { j as t } from "../jsx-runtime-OVHDjVDe.js";
-import { forwardRef as A, useState as f } from "react";
+import { forwardRef as z, useState as f } from "react";
 import { c as O } from "../createSvgIcon-DxwgGAVe.js";
 import { Select as E, ListSubheader as F, TextField as M, InputAdornment as T, MenuItem as p, Box as h } from "@mui/material";
 import { SForm as B } from "../s-form/s-form.js";
 const D = O(/* @__PURE__ */ t.jsx("path", {
   d: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14"
-}), "Search"), x = A(
+}), "Search"), x = z(
   ({
     options: r = [],
     optionLabel: _ = "name",
@@ -16,24 +16,24 @@ const D = O(/* @__PURE__ */ t.jsx("path", {
     required: I = !1,
     variant: K = "outlined",
     simple: w = !1,
-    htmlFor: y,
+    htmlFor: v,
     searchable: o = !1,
     searchPlaceholder: P = "",
     ...a
   }, N) => {
-    const S = a.value !== void 0, [V, $] = f(a.multiple ? [] : null), L = S ? a.value : V, [d, v] = f(""), [k, j] = f(!1), s = (e) => String(typeof e == "string" || typeof e == "number" ? e : e[_]), l = (e) => typeof e == "string" || typeof e == "number" ? e : e[b], i = o && d ? r.filter((e) => s(e).toLowerCase().includes(d.toLowerCase())) : r;
-    return /* @__PURE__ */ t.jsx(B, { error: C, label: m, required: I, htmlFor: y, children: /* @__PURE__ */ t.jsxs(
+    const y = a.value !== void 0, [V, $] = f(a.multiple ? [] : null), A = y ? a.value : V, [c, S] = f(""), [L, j] = f(!1), s = (e) => String(typeof e == "string" || typeof e == "number" ? e : e[_]), l = (e) => typeof e == "string" || typeof e == "number" ? e : e[b], i = o && c ? r.filter((e) => s(e).toLowerCase().includes(c.toLowerCase())) : r;
+    return /* @__PURE__ */ t.jsx(B, { error: C, label: m, required: I, htmlFor: v, children: /* @__PURE__ */ t.jsxs(
       E,
       {
-        id: y,
+        id: v,
         displayEmpty: !0,
         fullWidth: !0,
         defaultValue: "",
         ref: N,
-        open: o ? k : void 0,
+        open: o ? L : void 0,
         onOpen: o ? () => j(!0) : void 0,
         onClose: o ? () => {
-          j(!1), v("");
+          j(!1), S("");
         } : void 0,
         MenuProps: o ? {
           autoFocus: !1,
@@ -45,27 +45,27 @@ const D = O(/* @__PURE__ */ t.jsx("path", {
         } : void 0,
         renderValue: a.multiple ? (e) => {
           const n = e;
-          return n.length === 0 ? /* @__PURE__ */ t.jsx(h, { component: "span", sx: { color: "text.secondary" }, children: g }) : n == null ? void 0 : n.map((c) => {
-            const u = r.find((z) => l(z) === l(c));
+          return n.length === 0 ? /* @__PURE__ */ t.jsx(h, { component: "span", sx: { color: "divider" }, children: g }) : n == null ? void 0 : n.map((d) => {
+            const u = r.find((k) => l(k) === l(d));
             return u ? s(u) : "";
           }).filter(Boolean).join(", ");
         } : (e) => {
           const n = e;
           if (n == null || n === "")
-            return /* @__PURE__ */ t.jsx(h, { component: "span", sx: { color: "text.secondary" }, children: g });
+            return /* @__PURE__ */ t.jsx(h, { component: "span", sx: { color: "divider" }, children: g });
           if (w)
             return s(n);
-          const c = r.find((u) => l(u) === l(n));
-          return c ? s(c) : "";
+          const d = r.find((u) => l(u) === l(n));
+          return d ? s(d) : "";
         },
         ...a,
-        value: r.length ? L ?? "" : "",
+        value: r.length ? A ?? "" : "",
         onChange: (e, n) => {
           if (a.onChange)
             a.onChange(e, n);
-          else if (!S) {
-            const c = e.target.value;
-            $(c);
+          else if (!y) {
+            const d = e.target.value;
+            $(d);
           }
         },
         children: [
@@ -76,8 +76,8 @@ const D = O(/* @__PURE__ */ t.jsx("path", {
               fullWidth: !0,
               autoFocus: !0,
               placeholder: P,
-              value: d,
-              onChange: (e) => v(e.target.value),
+              value: c,
+              onChange: (e) => S(e.target.value),
               onKeyDown: (e) => {
                 e.key !== "Escape" && e.stopPropagation();
               },
@@ -97,7 +97,7 @@ const D = O(/* @__PURE__ */ t.jsx("path", {
               children: s(e)
             },
             `${l(e)}-${n}`
-          )) : d ? /* @__PURE__ */ t.jsx(p, { disabled: !0, children: /* @__PURE__ */ t.jsx(h, { sx: { color: "text.secondary", fontStyle: "italic" }, children: "No results found" }) }) : r == null ? void 0 : r.map((e, n) => /* @__PURE__ */ t.jsx(
+          )) : c ? /* @__PURE__ */ t.jsx(p, { disabled: !0, children: /* @__PURE__ */ t.jsx(h, { sx: { color: "text.secondary", textAlign: "center", width: "100%" }, children: "No results found" }) }) : r == null ? void 0 : r.map((e, n) => /* @__PURE__ */ t.jsx(
             p,
             {
               disabled: (e == null ? void 0 : e.disabled) ?? !1,

package/dist/s-skeleton/s-skeleton.js

@@ -31,11 +31,11 @@ const o = ({
 };
 o.displayName = "SSkeleton";
 try {
-  o.displayName = "SSkeleton", o.__docgenInfo = { description: "An enhanced skeleton loading component with pre-defined component presets for consistent loading states.", displayName: "SSkeleton", props: { variant: { defaultValue: { value: "text" }, description: "Visual variant of the skeleton", name: "variant", required: !1, type: { name: "enum", value: [{ value: '"text"' }, { value: '"rectangular"' }, { value: '"rounded"' }, { value: '"circular"' }] } }, height: { defaultValue: { value: "32" }, description: "Height of the skeleton (number for px, string for CSS units)", name: "height", required: !1, type: { name: "string | number" } }, width: { defaultValue: { value: "100%" }, description: "Width of the skeleton (number for px, string for CSS units)", name: "width", required: !1, type: { name: "string | number" } }, fontSize: { defaultValue: { value: "16px" }, description: "Font size for text variant skeletons", name: "fontSize", required: !1, type: { name: "string | number" } }, component: { defaultValue: null, description: "Pre-defined component preset for common UI elements", name: "component", required: !1, type: { name: "enum", value: [{ value: '"button"' }, { value: '"checkbox"' }, { value: '"typography"' }, { value: '"radio-button"' }, { value: '"avatar"' }, { value: '"rounded-avatar"' }, { value: '"icon-button"' }, { value: '"title-typography"' }] } } } };
+  o.displayName = "SSkeleton", o.__docgenInfo = { description: "An enhanced skeleton loading component with pre-defined component presets for consistent loading states.", displayName: "SSkeleton", props: { variant: { defaultValue: { value: "text" }, description: "Visual variant of the skeleton", name: "variant", required: !1, type: { name: "enum", value: [{ value: '"text"' }, { value: '"rectangular"' }, { value: '"rounded"' }, { value: '"circular"' }] } }, height: { defaultValue: { value: "32" }, description: "Height of the skeleton (number for px, string for CSS units)", name: "height", required: !1, type: { name: "string | number" } }, width: { defaultValue: { value: "100%" }, description: "Width of the skeleton (number for px, string for CSS units)", name: "width", required: !1, type: { name: "string | number" } }, fontSize: { defaultValue: { value: "16px" }, description: "Font size for text variant skeletons", name: "fontSize", required: !1, type: { name: "string | number" } }, component: { defaultValue: null, description: "Pre-defined component preset for common UI elements", name: "component", required: !1, type: { name: "enum", value: [{ value: '"typography"' }, { value: '"button"' }, { value: '"checkbox"' }, { value: '"radio-button"' }, { value: '"avatar"' }, { value: '"rounded-avatar"' }, { value: '"icon-button"' }, { value: '"title-typography"' }] } } } };
 } catch {
 }
 try {
-  sskeleton.displayName = "sskeleton", sskeleton.__docgenInfo = { description: "An enhanced skeleton loading component with pre-defined component presets for consistent loading states.", displayName: "sskeleton", props: { variant: { defaultValue: { value: "text" }, description: "Visual variant of the skeleton", name: "variant", required: !1, type: { name: "enum", value: [{ value: '"text"' }, { value: '"rectangular"' }, { value: '"rounded"' }, { value: '"circular"' }] } }, height: { defaultValue: { value: "32" }, description: "Height of the skeleton (number for px, string for CSS units)", name: "height", required: !1, type: { name: "string | number" } }, width: { defaultValue: { value: "100%" }, description: "Width of the skeleton (number for px, string for CSS units)", name: "width", required: !1, type: { name: "string | number" } }, fontSize: { defaultValue: { value: "16px" }, description: "Font size for text variant skeletons", name: "fontSize", required: !1, type: { name: "string | number" } }, component: { defaultValue: null, description: "Pre-defined component preset for common UI elements", name: "component", required: !1, type: { name: "enum", value: [{ value: '"button"' }, { value: '"checkbox"' }, { value: '"typography"' }, { value: '"radio-button"' }, { value: '"avatar"' }, { value: '"rounded-avatar"' }, { value: '"icon-button"' }, { value: '"title-typography"' }] } } } };
+  sskeleton.displayName = "sskeleton", sskeleton.__docgenInfo = { description: "An enhanced skeleton loading component with pre-defined component presets for consistent loading states.", displayName: "sskeleton", props: { variant: { defaultValue: { value: "text" }, description: "Visual variant of the skeleton", name: "variant", required: !1, type: { name: "enum", value: [{ value: '"text"' }, { value: '"rectangular"' }, { value: '"rounded"' }, { value: '"circular"' }] } }, height: { defaultValue: { value: "32" }, description: "Height of the skeleton (number for px, string for CSS units)", name: "height", required: !1, type: { name: "string | number" } }, width: { defaultValue: { value: "100%" }, description: "Width of the skeleton (number for px, string for CSS units)", name: "width", required: !1, type: { name: "string | number" } }, fontSize: { defaultValue: { value: "16px" }, description: "Font size for text variant skeletons", name: "fontSize", required: !1, type: { name: "string | number" } }, component: { defaultValue: null, description: "Pre-defined component preset for common UI elements", name: "component", required: !1, type: { name: "enum", value: [{ value: '"typography"' }, { value: '"button"' }, { value: '"checkbox"' }, { value: '"radio-button"' }, { value: '"avatar"' }, { value: '"rounded-avatar"' }, { value: '"icon-button"' }, { value: '"title-typography"' }] } } } };
 } catch {
 }
 export {

package/dist/s-stripe/s-stripe.js

@@ -34,11 +34,11 @@ const r = (t) => {
 };
 r.displayName = "StripeTextField";
 try {
-  r.displayName = "StripeTextField", r.__docgenInfo = { description: "Generic Stripe text field component that integrates Stripe Elements with Material-UI styling.", displayName: "StripeTextField", props: { inputProps: { defaultValue: null, description: "Props passed directly to the Stripe Element", name: "inputProps", required: !1, type: { name: "CardNumberElementProps | CardExpiryElementProps | AuBankAccountElementProps | CardCvcElementProps | FpxBankElementProps | IbanElementProps | IdealBankElementProps" } }, labelErrorMessage: { defaultValue: null, description: "Custom error message to display when validation fails", name: "labelErrorMessage", required: !1, type: { name: "string" } }, onChange: { defaultValue: null, description: "Change handler for Stripe Element events", name: "onChange", required: !1, type: { name: "((event: StripeCardNumberElementChangeEvent) => any) | ((event: StripeCardExpiryElementChangeEvent) => any) | ... 5 more ..." } }, stripeElement: { defaultValue: null, description: "The Stripe Element component to render", name: "stripeElement", required: !1, type: { name: "StripeElement" } } } };
+  r.displayName = "StripeTextField", r.__docgenInfo = { description: "Generic Stripe text field component that integrates Stripe Elements with Material-UI styling.", displayName: "StripeTextField", props: { inputProps: { defaultValue: null, description: "Props passed directly to the Stripe Element", name: "inputProps", required: !1, type: { name: "CardExpiryElementProps | AuBankAccountElementProps | CardCvcElementProps | CardNumberElementProps | FpxBankElementProps | IbanElementProps | IdealBankElementProps" } }, labelErrorMessage: { defaultValue: null, description: "Custom error message to display when validation fails", name: "labelErrorMessage", required: !1, type: { name: "string" } }, onChange: { defaultValue: null, description: "Change handler for Stripe Element events", name: "onChange", required: !1, type: { name: "((event: StripeCardExpiryElementChangeEvent) => any) | ((event: StripeAuBankAccountElementChangeEvent) => any) | ... 5 more ..." } }, stripeElement: { defaultValue: null, description: "The Stripe Element component to render", name: "stripeElement", required: !1, type: { name: "StripeElement" } } } };
 } catch {
 }
 try {
-  sstripe.displayName = "sstripe", sstripe.__docgenInfo = { description: "Generic Stripe text field component that integrates Stripe Elements with Material-UI styling.", displayName: "sstripe", props: { inputProps: { defaultValue: null, description: "Props passed directly to the Stripe Element", name: "inputProps", required: !1, type: { name: "CardNumberElementProps | CardExpiryElementProps | AuBankAccountElementProps | CardCvcElementProps | FpxBankElementProps | IbanElementProps | IdealBankElementProps" } }, labelErrorMessage: { defaultValue: null, description: "Custom error message to display when validation fails", name: "labelErrorMessage", required: !1, type: { name: "string" } }, onChange: { defaultValue: null, description: "Change handler for Stripe Element events", name: "onChange", required: !1, type: { name: "((event: StripeCardNumberElementChangeEvent) => any) | ((event: StripeCardExpiryElementChangeEvent) => any) | ... 5 more ..." } }, stripeElement: { defaultValue: null, description: "The Stripe Element component to render", name: "stripeElement", required: !1, type: { name: "StripeElement" } } } };
+  sstripe.displayName = "sstripe", sstripe.__docgenInfo = { description: "Generic Stripe text field component that integrates Stripe Elements with Material-UI styling.", displayName: "sstripe", props: { inputProps: { defaultValue: null, description: "Props passed directly to the Stripe Element", name: "inputProps", required: !1, type: { name: "CardExpiryElementProps | AuBankAccountElementProps | CardCvcElementProps | CardNumberElementProps | FpxBankElementProps | IbanElementProps | IdealBankElementProps" } }, labelErrorMessage: { defaultValue: null, description: "Custom error message to display when validation fails", name: "labelErrorMessage", required: !1, type: { name: "string" } }, onChange: { defaultValue: null, description: "Change handler for Stripe Element events", name: "onChange", required: !1, type: { name: "((event: StripeCardExpiryElementChangeEvent) => any) | ((event: StripeAuBankAccountElementChangeEvent) => any) | ... 5 more ..." } }, stripeElement: { defaultValue: null, description: "The Stripe Element component to render", name: "stripeElement", required: !1, type: { name: "StripeElement" } } } };
 } catch {
 }
 export {

package/dist/s-stripe/stripe-input.d.ts

@@ -1,21 +1,5 @@
 import { InputBaseComponentProps } from '@mui/material/InputBase';
 import * as React from 'react';
-/**
- * Stripe input component with Material-UI theme integration
- *
- * A wrapper component that adapts Stripe Elements to work seamlessly with
- * Material-UI's input styling system. Handles theme-aware styling and
- * provides proper focus management integration.
- *
- * Features:
- * - Automatic theme-based text coloring (dark/light mode support)
- * - Focus management through imperative handle
- * - Seamless integration with Material-UI form components
- * - Stripe Elements styling customization
- *
- * This component is typically used internally by SStripe components
- * rather than directly in application code.
- */
 /**
  * Forward ref component for Stripe Elements integration with Material-UI
  *