@solostylist/ui-kit 1.0.175 → 1.0.176

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

@@ -1,70 +1,62 @@
-import { j as a } from "../jsx-runtime-OVHDjVDe.js";
-import * as m from "react";
-import { createTheme as d, ThemeProvider as u } from "@mui/material";
-import { components as p } from "../theme/components/components.js";
-import { dataDisplayCustomizations as c } from "../theme/customizations/data-display.js";
+import { j as e } from "../jsx-runtime-tc70JA_2.js";
+import * as s from "react";
+import { createTheme as p, ThemeProvider as c } from "@mui/material";
+import { components as f } from "../theme/components/components.js";
+import { dataDisplayCustomizations as u } from "../theme/customizations/data-display.js";
 import { feedbackCustomizations as h } from "../theme/customizations/feedback.js";
-import { inputsCustomizations as f } from "../theme/customizations/inputs.js";
-import { navigationCustomizations as y } from "../theme/customizations/navigation.js";
-import { surfacesCustomizations as v } from "../theme/customizations/surfaces.js";
-import { shape as C, shadows as g, typography as _, colorSchemes as T } from "../theme/theme-primitives.js";
-const o = ({
-  children: e,
-  disableCustomTheme: t,
-  themeComponents: r,
-  defaultMode: s = "system",
+import { inputsCustomizations as d } from "../theme/customizations/inputs.js";
+import { navigationCustomizations as l } from "../theme/customizations/navigation.js";
+import { surfacesCustomizations as x } from "../theme/customizations/surfaces.js";
+import { shape as y, shadows as z, typography as S, colorSchemes as g } from "../theme/theme-primitives.js";
+const j = ({
+  children: r,
+  disableCustomTheme: o,
+  themeComponents: t,
+  defaultMode: m = "system",
   // System preference by default
-  theme: n,
-  ...i
+  theme: i,
+  ...a
 }) => {
-  const l = m.useMemo(() => t ? {} : d({
+  const n = s.useMemo(() => o ? {} : p({
     // CSS variables configuration for dynamic theming
     cssVariables: {
       colorSchemeSelector: "data-mui-color-scheme",
       cssVarPrefix: "s"
       // All CSS vars prefixed with '--s-'
     },
-    colorSchemes: T,
+    colorSchemes: g,
     // Light/dark color schemes
-    typography: _,
+    typography: S,
     // Custom typography scales
-    shadows: g,
+    shadows: z,
     // Custom shadow definitions
-    shape: C,
+    shape: y,
     // Border radius and shape settings
     components: {
       // Merge all component customizations
-      ...f,
-      ...c,
+      ...d,
+      ...u,
       ...h,
-      ...y,
-      ...v,
-      ...p,
-      ...r
+      ...l,
+      ...x,
+      ...f,
+      ...t
       // Allow external overrides
     }
-  }), [t, r]);
-  return t ? /* @__PURE__ */ a.jsx(m.Fragment, { children: e }) : /* @__PURE__ */ a.jsx(
-    u,
+  }), [o, t]);
+  return o ? /* @__PURE__ */ e.jsx(s.Fragment, { children: r }) : /* @__PURE__ */ e.jsx(
+    c,
     {
       disableTransitionOnChange: !0,
-      ...i,
-      theme: { ...l, ...n },
-      defaultMode: s,
-      children: e
+      ...a,
+      theme: { ...n, ...i },
+      defaultMode: m,
+      children: r
     }
   );
 };
-o.displayName = "SThemeProvider";
-try {
-  o.displayName = "SThemeProvider", o.__docgenInfo = { description: "Central theme provider for the design system.", displayName: "SThemeProvider", props: { children: { defaultValue: null, description: "Child components to receive theme context", name: "children", required: !0, type: { name: "ReactNode" } }, disableCustomTheme: { defaultValue: null, description: "Disable custom theme for testing/docs (falls back to no theme)", name: "disableCustomTheme", required: !1, type: { name: "boolean" } }, themeComponents: { defaultValue: null, description: "Additional theme component overrides", name: "themeComponents", required: !1, type: { name: 'Components<Omit<Theme, "components">>' } }, defaultMode: { defaultValue: { value: "system" }, description: "Default color mode (defaults to 'system')", name: "defaultMode", required: !1, type: { name: "enum", value: [{ value: '"light"' }, { value: '"dark"' }, { value: '"system"' }] } }, theme: { defaultValue: null, description: "Custom theme object to merge with internal theme", name: "theme", required: !1, type: { name: "Theme" } } } };
-} catch {
-}
-try {
-  sthemeprovider.displayName = "sthemeprovider", sthemeprovider.__docgenInfo = { description: "Central theme provider for the design system.", displayName: "sthemeprovider", props: { children: { defaultValue: null, description: "Child components to receive theme context", name: "children", required: !0, type: { name: "ReactNode" } }, disableCustomTheme: { defaultValue: null, description: "Disable custom theme for testing/docs (falls back to no theme)", name: "disableCustomTheme", required: !1, type: { name: "boolean" } }, themeComponents: { defaultValue: null, description: "Additional theme component overrides", name: "themeComponents", required: !1, type: { name: 'Components<Omit<Theme, "components">>' } }, defaultMode: { defaultValue: { value: "system" }, description: "Default color mode (defaults to 'system')", name: "defaultMode", required: !1, type: { name: "enum", value: [{ value: '"light"' }, { value: '"dark"' }, { value: '"system"' }] } }, theme: { defaultValue: null, description: "Custom theme object to merge with internal theme", name: "theme", required: !1, type: { name: "Theme" } } } };
-} catch {
-}
+j.displayName = "SThemeProvider";
 export {
-  o as SThemeProvider,
-  o as default
+  j as SThemeProvider,
+  j as default
 };

package/dist/s-theme-switch/package.json

@@ -1,5 +1,5 @@
-{
-  "main": "./index.js",
-  "types": "./index.d.ts",
-  "sideEffects": false
+{
+  "main": "./index.js",
+  "types": "./index.d.ts",
+  "sideEffects": false
 }

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

@@ -1,31 +1,31 @@
-import { j as e } from "../jsx-runtime-OVHDjVDe.js";
-import { useRef as g, useCallback as l } from "react";
-import { IconButton as w } from "@mui/material";
-import { flushSync as y } from "react-dom";
-import { c as m } from "../createSvgIcon-DxwgGAVe.js";
-const M = m(/* @__PURE__ */ e.jsx("path", {
+import { j as t } from "../jsx-runtime-tc70JA_2.js";
+import { useRef as M, useCallback as m } from "react";
+import { IconButton as f } from "@mui/material";
+import { flushSync as w } from "react-dom";
+import { c as d } from "../createSvgIcon-BKymXuBG.js";
+const k = d(/* @__PURE__ */ t.jsx("path", {
   d: "M12 3c-4.97 0-9 4.03-9 9s4.03 9 9 9 9-4.03 9-9c0-.46-.04-.92-.1-1.36-.98 1.37-2.58 2.26-4.4 2.26-2.98 0-5.4-2.42-5.4-5.4 0-1.81.89-3.42 2.26-4.4-.44-.06-.9-.1-1.36-.1"
-}), "DarkMode"), v = m(/* @__PURE__ */ e.jsx("path", {
+}), "DarkMode"), j = d(/* @__PURE__ */ t.jsx("path", {
   d: "M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5M2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1m18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1m0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1M5.99 4.58c-.39-.39-1.03-.39-1.41 0-.39.39-.39 1.03 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41zm12.37 12.37c-.39-.39-1.03-.39-1.41 0-.39.39-.39 1.03 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0 .39-.39.39-1.03 0-1.41zm1.06-10.96c.39-.39.39-1.03 0-1.41-.39-.39-1.03-.39-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0zM7.05 18.36c.39-.39.39-1.03 0-1.41-.39-.39-1.03-.39-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0z"
-}), "LightMode"), V = ({ mode: t, setMode: s, sx: d }) => {
-  const n = g(null), u = t === "dark", a = l(() => {
+}), "LightMode"), z = ({ mode: c, setMode: i, sx: h }) => {
+  const n = M(null), l = c === "dark", e = m(() => {
     setTimeout(() => {
-      s == null || s(t === "dark" ? "light" : "dark");
+      i?.(c === "dark" ? "light" : "dark");
     }, 0);
-  }, [t, s]), h = l(async () => {
+  }, [c, i]), u = m(async () => {
     if (!n.current || !document.startViewTransition) {
-      a();
+      e();
       return;
     }
     await document.startViewTransition(() => {
-      y(() => {
-        a();
+      w(() => {
+        e();
       });
     }).ready;
-    const { top: c, left: o, width: p, height: x } = n.current.getBoundingClientRect(), i = o + p / 2, r = c + x / 2, f = Math.hypot(Math.max(o, window.innerWidth - o), Math.max(c, window.innerHeight - c));
+    const { top: o, left: s, width: p, height: x } = n.current.getBoundingClientRect(), r = s + p / 2, a = o + x / 2, g = Math.hypot(Math.max(s, window.innerWidth - s), Math.max(o, window.innerHeight - o));
     document.documentElement.animate(
       {
-        clipPath: [`circle(0px at ${i}px ${r}px)`, `circle(${f}px at ${i}px ${r}px)`]
+        clipPath: [`circle(0px at ${r}px ${a}px)`, `circle(${g}px at ${r}px ${a}px)`]
       },
       {
         duration: 700,
@@ -33,13 +33,9 @@ const M = m(/* @__PURE__ */ e.jsx("path", {
         pseudoElement: "::view-transition-new(root)"
       }
     );
-  }, [a]);
-  return /* @__PURE__ */ e.jsx(w, { ref: n, onClick: h, sx: d, children: u ? /* @__PURE__ */ e.jsx(v, {}) : /* @__PURE__ */ e.jsx(M, {}) });
+  }, [e]);
+  return /* @__PURE__ */ t.jsx(f, { ref: n, onClick: u, sx: h, children: l ? /* @__PURE__ */ t.jsx(j, {}) : /* @__PURE__ */ t.jsx(k, {}) });
 };
-try {
-  sthemeswitch.displayName = "sthemeswitch", sthemeswitch.__docgenInfo = { description: "", displayName: "sthemeswitch", props: { mode: { defaultValue: null, description: "", name: "mode", required: !1, type: { name: "enum", value: [{ value: '"light"' }, { value: '"dark"' }, { value: '"system"' }] } }, setMode: { defaultValue: null, description: "", name: "setMode", required: !1, type: { name: "((mode: SThemeMode) => void)" } }, sx: { defaultValue: null, description: "", name: "sx", required: !1, type: { name: "SxProps<Theme>" } } } };
-} catch {
-}
 export {
-  V as default
+  z as default
 };

package/dist/s-tip/s-tip.js

@@ -1,11 +1,11 @@
-import { j as e } from "../jsx-runtime-OVHDjVDe.js";
-import { c as a } from "../createSvgIcon-DxwgGAVe.js";
-import { S as r } from "../Stack-Cq2r2NmC.js";
-import { T as s } from "../Typography-C8jwvSWe.js";
-const o = a(/* @__PURE__ */ e.jsx("path", {
+import { j as t } from "../jsx-runtime-tc70JA_2.js";
+import { c as i } from "../createSvgIcon-BKymXuBG.js";
+import { S as s } from "../Stack-BScsuyQy.js";
+import { T as o } from "../Typography-9Kg27dDw.js";
+const c = i(/* @__PURE__ */ t.jsx("path", {
   d: "M9 21c0 .55.45 1 1 1h4c.55 0 1-.45 1-1v-1H9zm3-19C8.14 2 5 5.14 5 9c0 2.38 1.19 4.47 3 5.74V17c0 .55.45 1 1 1h6c.55 0 1-.45 1-1v-2.26c1.81-1.27 3-3.36 3-5.74 0-3.86-3.14-7-7-7m2 11.7V16h-4v-2.3C8.48 12.63 7 11.53 7 9c0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.49-1.51 3.65-3 4.7"
-}), "LightbulbOutline"), i = ({ message: t }) => /* @__PURE__ */ e.jsxs(
-  r,
+}), "LightbulbOutline"), e = ({ message: r }) => /* @__PURE__ */ t.jsxs(
+  s,
   {
     direction: "row",
     spacing: 1,
@@ -18,25 +18,17 @@ const o = a(/* @__PURE__ */ e.jsx("path", {
       color: "text.secondary"
     },
     children: [
-      /* @__PURE__ */ e.jsx(o, { sx: { fontSize: 16 } }),
-      /* @__PURE__ */ e.jsxs(s, { variant: "body2", children: [
-        /* @__PURE__ */ e.jsx(s, { component: "span", sx: { fontWeight: "bold" }, variant: "inherit", children: "Tip." }),
+      /* @__PURE__ */ t.jsx(c, { sx: { fontSize: 16 } }),
+      /* @__PURE__ */ t.jsxs(o, { variant: "body2", children: [
+        /* @__PURE__ */ t.jsx(o, { component: "span", sx: { fontWeight: "bold" }, variant: "inherit", children: "Tip." }),
         " ",
-        t
+        r
       ] })
     ]
   }
 );
-i.displayName = "STip";
-try {
-  i.displayName = "STip", i.__docgenInfo = { description: "A simple tip component that displays helpful information with a lightbulb icon.", displayName: "STip", props: { message: { defaultValue: null, description: "The tip message to display", name: "message", required: !0, type: { name: "string" } } } };
-} catch {
-}
-try {
-  stip.displayName = "stip", stip.__docgenInfo = { description: "A simple tip component that displays helpful information with a lightbulb icon.", displayName: "stip", props: { message: { defaultValue: null, description: "The tip message to display", name: "message", required: !0, type: { name: "string" } } } };
-} catch {
-}
+e.displayName = "STip";
 export {
-  i as STip,
-  i as default
+  e as STip,
+  e as default
 };

package/dist/s-two-pane-layout/index.js

@@ -1,12 +1,4 @@
-import { STwoPaneLayout as n } from "./s-two-pane-layout.js";
-try {
-  stwopanelayout.displayName = "stwopanelayout", stwopanelayout.__docgenInfo = { description: "A flexible two-pane layout component with customizable sidebar and content areas.", displayName: "stwopanelayout", props: { sidebar: { defaultValue: null, description: "Content to display in the sidebar pane", name: "sidebar", required: !0, type: { name: "ReactNode" } }, content: { defaultValue: null, description: "Content to display in the main content pane", name: "content", required: !0, type: { name: "ReactNode" } }, sidebarWidth: { defaultValue: { value: "280" }, description: "Width of the sidebar in pixels. Default: 280", name: "sidebarWidth", required: !1, type: { name: "string | number" } }, height: { defaultValue: { value: "calc(100vh - 65px)" }, description: "Container height. Can be a CSS value or 'auto'. Default: 'calc(100vh - 65px)'", name: "height", required: !1, type: { name: "string | number" } }, containerSx: { defaultValue: null, description: "Custom styles for the main container", name: "containerSx", required: !1, type: { name: "SxProps<Theme>" } }, sidebarSx: { defaultValue: null, description: "Custom styles for the sidebar container", name: "sidebarSx", required: !1, type: { name: "SxProps<Theme>" } }, contentSx: { defaultValue: null, description: "Custom styles for the content container", name: "contentSx", required: !1, type: { name: "SxProps<Theme>" } }, sidebarHeaderSx: { defaultValue: null, description: "Custom styles for the sidebar header", name: "sidebarHeaderSx", required: !1, type: { name: "SxProps<Theme>" } }, contentHeaderSx: { defaultValue: null, description: "Custom styles for the content header", name: "contentHeaderSx", required: !1, type: { name: "SxProps<Theme>" } }, sidebarScrollSx: { defaultValue: null, description: "Custom styles for the sidebar scrollable area", name: "sidebarScrollSx", required: !1, type: { name: "SxProps<Theme>" } }, contentScrollSx: { defaultValue: null, description: "Custom styles for the content scrollable area", name: "contentScrollSx", required: !1, type: { name: "SxProps<Theme>" } }, disableBorder: { defaultValue: { value: "false" }, description: "Hide border between sidebar and content. Default: false", name: "disableBorder", required: !1, type: { name: "boolean" } }, sidebarHeader: { defaultValue: null, description: "Optional header content for the sidebar", name: "sidebarHeader", required: !1, type: { name: "ReactNode" } }, contentHeader: { defaultValue: null, description: "Optional header content for the main content area", name: "contentHeader", required: !1, type: { name: "ReactNode" } }, enableSidebarScroll: { defaultValue: { value: "true" }, description: "Enable scrollbar for sidebar. Default: true", name: "enableSidebarScroll", required: !1, type: { name: "boolean" } }, enableContentScroll: { defaultValue: { value: "false" }, description: "Enable scrollbar for content. Default: false", name: "enableContentScroll", required: !1, type: { name: "boolean" } }, sidebarPosition: { defaultValue: { value: "left" }, description: "Sidebar position. Default: 'left'", name: "sidebarPosition", required: !1, type: { name: "enum", value: [{ value: '"right"' }, { value: '"left"' }] } }, sidebarPadding: { defaultValue: { value: "1" }, description: "Padding for sidebar content. Default: 1", name: "sidebarPadding", required: !1, type: { name: "string | number" } }, contentPadding: { defaultValue: { value: "1" }, description: "Padding for main content. Default: 0", name: "contentPadding", required: !1, type: { name: "string | number" } }, sidebarHeaderPadding: { defaultValue: { value: "2" }, description: "Padding for sidebar header. Default: 2", name: "sidebarHeaderPadding", required: !1, type: { name: "string | number" } }, contentHeaderPadding: { defaultValue: { value: "2" }, description: "Padding for content header. Default: 2", name: "contentHeaderPadding", required: !1, type: { name: "string | number" } } } };
-} catch {
-}
-try {
-  STwoPaneLayoutProps.displayName = "STwoPaneLayoutProps", STwoPaneLayoutProps.__docgenInfo = { description: "Props for the STwoPaneLayout component", displayName: "STwoPaneLayoutProps", props: {} };
-} catch {
-}
+import { STwoPaneLayout as e } from "./s-two-pane-layout.js";
 export {
-  n as default
+  e as default
 };

package/dist/s-two-pane-layout/s-two-pane-layout.js

@@ -1,81 +1,73 @@
-import { j as e } from "../jsx-runtime-OVHDjVDe.js";
-import { Box as a } from "@mui/material";
-import { SFlexBox as D } from "../s-flex-box/s-flex-box.js";
-import { SOverlayScrollbar as h } from "../s-overlay-scrollbar/s-overlay-scrollbar.js";
-const r = ({
-  sidebar: t,
+import { j as e } from "../jsx-runtime-tc70JA_2.js";
+import { Box as r } from "@mui/material";
+import { SOverlayScrollbar as p } from "../s-overlay-scrollbar/s-overlay-scrollbar.js";
+import { SFlexBox as C } from "../s-flex-box/s-flex-box.js";
+const R = ({
+  sidebar: o,
   content: l,
-  sidebarWidth: x = 280,
-  height: y = "calc(100vh - 65px)",
-  containerSx: S,
-  sidebarSx: g,
-  contentSx: P,
-  sidebarHeaderSx: q,
-  contentHeaderSx: V,
-  sidebarScrollSx: d,
-  contentScrollSx: i,
-  disableBorder: o = !1,
-  sidebarHeader: s,
-  contentHeader: u,
-  enableSidebarScroll: v = !0,
-  enableContentScroll: c = !1,
-  sidebarPosition: n = "left",
-  sidebarPadding: f = 1,
-  contentPadding: m = 1,
-  sidebarHeaderPadding: C = 2,
-  contentHeaderPadding: H = 2
+  sidebarWidth: a = 280,
+  height: u = "calc(100vh - 65px)",
+  containerSx: v,
+  sidebarSx: w,
+  contentSx: g,
+  sidebarHeaderSx: y,
+  contentHeaderSx: B,
+  sidebarScrollSx: i,
+  contentScrollSx: s,
+  disableBorder: h = !1,
+  sidebarHeader: d,
+  contentHeader: t,
+  enableSidebarScroll: D = !0,
+  enableContentScroll: f = !1,
+  sidebarPosition: x = "left",
+  sidebarPadding: n = 1,
+  contentPadding: c = 1,
+  sidebarHeaderPadding: F = 2,
+  contentHeaderPadding: L = 2
 }) => {
-  const p = /* @__PURE__ */ e.jsxs(
-    a,
+  const j = /* @__PURE__ */ e.jsxs(
+    r,
     {
       sx: {
-        width: x,
-        borderRight: !o && n === "left" ? 1 : 0,
-        borderLeft: !o && n === "right" ? 1 : 0,
+        width: a,
+        borderRight: !h && x === "left" ? 1 : 0,
+        borderLeft: !h && x === "right" ? 1 : 0,
         borderColor: "divider",
         display: "flex",
         flexDirection: "column",
-        ...g
+        ...w
       },
       children: [
-        s && /* @__PURE__ */ e.jsx(a, { sx: { p: C, borderBottom: 1, borderColor: "divider", ...q }, children: s }),
-        /* @__PURE__ */ e.jsx(a, { sx: { flex: 1, minHeight: 0 }, children: v ? /* @__PURE__ */ e.jsx(h, { children: /* @__PURE__ */ e.jsx(a, { sx: { p: f, ...d }, children: t }) }) : /* @__PURE__ */ e.jsx(a, { sx: { p: f, height: "100%", overflow: "hidden", ...d }, children: t }) })
+        d && /* @__PURE__ */ e.jsx(r, { sx: { p: F, borderBottom: 1, borderColor: "divider", ...y }, children: d }),
+        /* @__PURE__ */ e.jsx(r, { sx: { flex: 1, minHeight: 0 }, children: D ? /* @__PURE__ */ e.jsx(p, { children: /* @__PURE__ */ e.jsx(r, { sx: { p: n, ...i }, children: o }) }) : /* @__PURE__ */ e.jsx(r, { sx: { p: n, height: "100%", overflow: "hidden", ...i }, children: o }) })
       ]
     }
-  ), b = /* @__PURE__ */ e.jsxs(a, { sx: { flex: 1, display: "flex", flexDirection: "column", ...P }, height: "100%", children: [
-    u && /* @__PURE__ */ e.jsx(a, { sx: { p: H, borderBottom: 1, borderColor: "divider", ...V }, children: u }),
-    /* @__PURE__ */ e.jsx(a, { sx: { flex: 1, overflow: c ? "auto" : "hidden" }, children: c ? /* @__PURE__ */ e.jsx(h, { children: /* @__PURE__ */ e.jsx(a, { sx: { p: m, ...i }, children: l }) }) : /* @__PURE__ */ e.jsx(a, { sx: { p: m, height: "100%", ...i }, children: l }) })
+  ), m = /* @__PURE__ */ e.jsxs(r, { sx: { flex: 1, display: "flex", flexDirection: "column", ...g }, height: "100%", children: [
+    t && /* @__PURE__ */ e.jsx(r, { sx: { p: L, borderBottom: 1, borderColor: "divider", ...B }, children: t }),
+    /* @__PURE__ */ e.jsx(r, { sx: { flex: 1, overflow: f ? "auto" : "hidden" }, children: f ? /* @__PURE__ */ e.jsx(p, { children: /* @__PURE__ */ e.jsx(r, { sx: { p: c, ...s }, children: l }) }) : /* @__PURE__ */ e.jsx(r, { sx: { p: c, height: "100%", ...s }, children: l }) })
   ] });
   return /* @__PURE__ */ e.jsx(
-    D,
+    C,
     {
       sx: {
-        height: y,
+        height: u,
         flexDirection: "row",
         width: "100%",
         overflow: "hidden",
-        ...S
+        ...v
       },
-      children: n === "left" ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-        p,
-        b
+      children: x === "left" ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+        j,
+        m
       ] }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-        b,
-        p
+        m,
+        j
       ] })
     }
   );
 };
-r.displayName = "STwoPaneLayout";
-try {
-  r.displayName = "STwoPaneLayout", r.__docgenInfo = { description: "A flexible two-pane layout component with customizable sidebar and content areas.", displayName: "STwoPaneLayout", props: { sidebar: { defaultValue: null, description: "Content to display in the sidebar pane", name: "sidebar", required: !0, type: { name: "ReactNode" } }, content: { defaultValue: null, description: "Content to display in the main content pane", name: "content", required: !0, type: { name: "ReactNode" } }, sidebarWidth: { defaultValue: { value: "280" }, description: "Width of the sidebar in pixels. Default: 280", name: "sidebarWidth", required: !1, type: { name: "string | number" } }, height: { defaultValue: { value: "calc(100vh - 65px)" }, description: "Container height. Can be a CSS value or 'auto'. Default: 'calc(100vh - 65px)'", name: "height", required: !1, type: { name: "string | number" } }, containerSx: { defaultValue: null, description: "Custom styles for the main container", name: "containerSx", required: !1, type: { name: "SxProps<Theme>" } }, sidebarSx: { defaultValue: null, description: "Custom styles for the sidebar container", name: "sidebarSx", required: !1, type: { name: "SxProps<Theme>" } }, contentSx: { defaultValue: null, description: "Custom styles for the content container", name: "contentSx", required: !1, type: { name: "SxProps<Theme>" } }, sidebarHeaderSx: { defaultValue: null, description: "Custom styles for the sidebar header", name: "sidebarHeaderSx", required: !1, type: { name: "SxProps<Theme>" } }, contentHeaderSx: { defaultValue: null, description: "Custom styles for the content header", name: "contentHeaderSx", required: !1, type: { name: "SxProps<Theme>" } }, sidebarScrollSx: { defaultValue: null, description: "Custom styles for the sidebar scrollable area", name: "sidebarScrollSx", required: !1, type: { name: "SxProps<Theme>" } }, contentScrollSx: { defaultValue: null, description: "Custom styles for the content scrollable area", name: "contentScrollSx", required: !1, type: { name: "SxProps<Theme>" } }, disableBorder: { defaultValue: { value: "false" }, description: "Hide border between sidebar and content. Default: false", name: "disableBorder", required: !1, type: { name: "boolean" } }, sidebarHeader: { defaultValue: null, description: "Optional header content for the sidebar", name: "sidebarHeader", required: !1, type: { name: "ReactNode" } }, contentHeader: { defaultValue: null, description: "Optional header content for the main content area", name: "contentHeader", required: !1, type: { name: "ReactNode" } }, enableSidebarScroll: { defaultValue: { value: "true" }, description: "Enable scrollbar for sidebar. Default: true", name: "enableSidebarScroll", required: !1, type: { name: "boolean" } }, enableContentScroll: { defaultValue: { value: "false" }, description: "Enable scrollbar for content. Default: false", name: "enableContentScroll", required: !1, type: { name: "boolean" } }, sidebarPosition: { defaultValue: { value: "left" }, description: "Sidebar position. Default: 'left'", name: "sidebarPosition", required: !1, type: { name: "enum", value: [{ value: '"right"' }, { value: '"left"' }] } }, sidebarPadding: { defaultValue: { value: "1" }, description: "Padding for sidebar content. Default: 1", name: "sidebarPadding", required: !1, type: { name: "string | number" } }, contentPadding: { defaultValue: { value: "1" }, description: "Padding for main content. Default: 0", name: "contentPadding", required: !1, type: { name: "string | number" } }, sidebarHeaderPadding: { defaultValue: { value: "2" }, description: "Padding for sidebar header. Default: 2", name: "sidebarHeaderPadding", required: !1, type: { name: "string | number" } }, contentHeaderPadding: { defaultValue: { value: "2" }, description: "Padding for content header. Default: 2", name: "contentHeaderPadding", required: !1, type: { name: "string | number" } } } };
-} catch {
-}
-try {
-  stwopanelayout.displayName = "stwopanelayout", stwopanelayout.__docgenInfo = { description: "A flexible two-pane layout component with customizable sidebar and content areas.", displayName: "stwopanelayout", props: { sidebar: { defaultValue: null, description: "Content to display in the sidebar pane", name: "sidebar", required: !0, type: { name: "ReactNode" } }, content: { defaultValue: null, description: "Content to display in the main content pane", name: "content", required: !0, type: { name: "ReactNode" } }, sidebarWidth: { defaultValue: { value: "280" }, description: "Width of the sidebar in pixels. Default: 280", name: "sidebarWidth", required: !1, type: { name: "string | number" } }, height: { defaultValue: { value: "calc(100vh - 65px)" }, description: "Container height. Can be a CSS value or 'auto'. Default: 'calc(100vh - 65px)'", name: "height", required: !1, type: { name: "string | number" } }, containerSx: { defaultValue: null, description: "Custom styles for the main container", name: "containerSx", required: !1, type: { name: "SxProps<Theme>" } }, sidebarSx: { defaultValue: null, description: "Custom styles for the sidebar container", name: "sidebarSx", required: !1, type: { name: "SxProps<Theme>" } }, contentSx: { defaultValue: null, description: "Custom styles for the content container", name: "contentSx", required: !1, type: { name: "SxProps<Theme>" } }, sidebarHeaderSx: { defaultValue: null, description: "Custom styles for the sidebar header", name: "sidebarHeaderSx", required: !1, type: { name: "SxProps<Theme>" } }, contentHeaderSx: { defaultValue: null, description: "Custom styles for the content header", name: "contentHeaderSx", required: !1, type: { name: "SxProps<Theme>" } }, sidebarScrollSx: { defaultValue: null, description: "Custom styles for the sidebar scrollable area", name: "sidebarScrollSx", required: !1, type: { name: "SxProps<Theme>" } }, contentScrollSx: { defaultValue: null, description: "Custom styles for the content scrollable area", name: "contentScrollSx", required: !1, type: { name: "SxProps<Theme>" } }, disableBorder: { defaultValue: { value: "false" }, description: "Hide border between sidebar and content. Default: false", name: "disableBorder", required: !1, type: { name: "boolean" } }, sidebarHeader: { defaultValue: null, description: "Optional header content for the sidebar", name: "sidebarHeader", required: !1, type: { name: "ReactNode" } }, contentHeader: { defaultValue: null, description: "Optional header content for the main content area", name: "contentHeader", required: !1, type: { name: "ReactNode" } }, enableSidebarScroll: { defaultValue: { value: "true" }, description: "Enable scrollbar for sidebar. Default: true", name: "enableSidebarScroll", required: !1, type: { name: "boolean" } }, enableContentScroll: { defaultValue: { value: "false" }, description: "Enable scrollbar for content. Default: false", name: "enableContentScroll", required: !1, type: { name: "boolean" } }, sidebarPosition: { defaultValue: { value: "left" }, description: "Sidebar position. Default: 'left'", name: "sidebarPosition", required: !1, type: { name: "enum", value: [{ value: '"right"' }, { value: '"left"' }] } }, sidebarPadding: { defaultValue: { value: "1" }, description: "Padding for sidebar content. Default: 1", name: "sidebarPadding", required: !1, type: { name: "string | number" } }, contentPadding: { defaultValue: { value: "1" }, description: "Padding for main content. Default: 0", name: "contentPadding", required: !1, type: { name: "string | number" } }, sidebarHeaderPadding: { defaultValue: { value: "2" }, description: "Padding for sidebar header. Default: 2", name: "sidebarHeaderPadding", required: !1, type: { name: "string | number" } }, contentHeaderPadding: { defaultValue: { value: "2" }, description: "Padding for content header. Default: 2", name: "contentHeaderPadding", required: !1, type: { name: "string | number" } } } };
-} catch {
-}
+R.displayName = "STwoPaneLayout";
 export {
-  r as STwoPaneLayout,
-  r as default
+  R as STwoPaneLayout,
+  R as default
 };

package/dist/s-typewriter-text/package.json

@@ -1,6 +1,6 @@
-{
-  "name": "@solostylist/ui-kit/s-typewriter-text",
-  "main": "./index.ts",
-  "module": "./index.ts",
-  "types": "./index.ts"
+{
+  "name": "@solostylist/ui-kit/s-typewriter-text",
+  "main": "./index.ts",
+  "module": "./index.ts",
+  "types": "./index.ts"
 }

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

@@ -1,54 +1,46 @@
-import { j as h } from "../jsx-runtime-OVHDjVDe.js";
-import { useState as a, useEffect as _ } from "react";
-import { Typography as V, Box as v } from "@mui/material";
-const o = ({
-  text: t,
-  speed: p = 100,
-  cursor: g = "|",
-  cursorBlinking: x = !0,
-  loop: u = !1,
-  deleteSpeed: d = 50,
-  delay: c = 1500,
-  ...b
+import { j as p } from "../jsx-runtime-tc70JA_2.js";
+import { useState as r, useEffect as j } from "react";
+import { Typography as k, Box as D } from "@mui/material";
+const b = ({
+  text: s,
+  speed: l = 100,
+  cursor: T = "|",
+  cursorBlinking: g = !0,
+  loop: c = !1,
+  deleteSpeed: x = 50,
+  delay: f = 1500,
+  ...h
 }) => {
-  const [n, m] = a(""), [i, y] = a(0), [l, f] = a(!1), [w, T] = a(0), s = Array.isArray(t) ? t : [t], r = s[w] || "";
-  return _(() => {
-    if (!r) return;
-    const q = setTimeout(
+  const [n, u] = r(""), [i, m] = r(0), [o, y] = r(!1), [d, A] = r(0), a = Array.isArray(s) ? s : [s], t = a[d] || "";
+  return j(() => {
+    if (!t) return;
+    const I = setTimeout(
       () => {
-        l ? n.length > 0 ? m((e) => e.slice(0, -1)) : (f(!1), y(0), T((e) => (e + 1) % s.length)) : i < r.length ? (m((e) => e + r[i]), y((e) => e + 1)) : u && setTimeout(() => f(!0), c);
+        o ? n.length > 0 ? u((e) => e.slice(0, -1)) : (y(!1), m(0), A((e) => (e + 1) % a.length)) : i < t.length ? (u((e) => e + t[i]), m((e) => e + 1)) : c && setTimeout(() => y(!0), f);
       },
-      l ? d : p
+      o ? x : l
     );
-    return () => clearTimeout(q);
-  }, [i, l, r, u, p, d, c, n, s.length]), /* @__PURE__ */ h.jsxs(V, { ...b, children: [
+    return () => clearTimeout(I);
+  }, [i, o, t, c, l, x, f, n, a.length]), /* @__PURE__ */ p.jsxs(k, { ...h, children: [
     n,
-    /* @__PURE__ */ h.jsx(
-      v,
+    /* @__PURE__ */ p.jsx(
+      D,
       {
         component: "span",
         sx: {
-          animation: x ? "blink 1s infinite" : "none",
+          animation: g ? "blink 1s infinite" : "none",
           "@keyframes blink": {
             "0%, 50%": { opacity: 1 },
             "51%, 100%": { opacity: 0 }
           }
         },
-        children: g
+        children: T
       }
     )
   ] });
 };
-o.displayName = "STypewriterText";
-try {
-  o.displayName = "STypewriterText", o.__docgenInfo = { description: "An animated text component that creates a typewriter effect with customizable speed and looping.", displayName: "STypewriterText", props: { text: { defaultValue: null, description: "The text to display with typewriter effect. Can be a single string or array of strings for sequential display.", name: "text", required: !0, type: { name: "string | string[]" } }, speed: { defaultValue: { value: "100" }, description: "Speed of typing animation in milliseconds per character", name: "speed", required: !1, type: { name: "number" } }, cursor: { defaultValue: { value: "|" }, description: "Character to display as the typing cursor", name: "cursor", required: !1, type: { name: "string" } }, cursorBlinking: { defaultValue: { value: "true" }, description: "Whether the cursor should blink", name: "cursorBlinking", required: !1, type: { name: "boolean" } }, loop: { defaultValue: { value: "false" }, description: "Whether to loop the animation continuously", name: "loop", required: !1, type: { name: "boolean" } }, deleteSpeed: { defaultValue: { value: "50" }, description: "Speed of deletion animation in milliseconds per character (when looping)", name: "deleteSpeed", required: !1, type: { name: "number" } }, delay: { defaultValue: { value: "1500" }, description: "Delay in milliseconds before deleting text (when looping)", name: "delay", required: !1, type: { name: "number" } } } };
-} catch {
-}
-try {
-  stypewritertext.displayName = "stypewritertext", stypewritertext.__docgenInfo = { description: "An animated text component that creates a typewriter effect with customizable speed and looping.", displayName: "stypewritertext", props: { text: { defaultValue: null, description: "The text to display with typewriter effect. Can be a single string or array of strings for sequential display.", name: "text", required: !0, type: { name: "string | string[]" } }, speed: { defaultValue: { value: "100" }, description: "Speed of typing animation in milliseconds per character", name: "speed", required: !1, type: { name: "number" } }, cursor: { defaultValue: { value: "|" }, description: "Character to display as the typing cursor", name: "cursor", required: !1, type: { name: "string" } }, cursorBlinking: { defaultValue: { value: "true" }, description: "Whether the cursor should blink", name: "cursorBlinking", required: !1, type: { name: "boolean" } }, loop: { defaultValue: { value: "false" }, description: "Whether to loop the animation continuously", name: "loop", required: !1, type: { name: "boolean" } }, deleteSpeed: { defaultValue: { value: "50" }, description: "Speed of deletion animation in milliseconds per character (when looping)", name: "deleteSpeed", required: !1, type: { name: "number" } }, delay: { defaultValue: { value: "1500" }, description: "Delay in milliseconds before deleting text (when looping)", name: "delay", required: !1, type: { name: "number" } } } };
-} catch {
-}
+b.displayName = "STypewriterText";
 export {
-  o as STypewriterText,
-  o as default
+  b as STypewriterText,
+  b as default
 };

package/dist/s-zoom-image/index.js

@@ -1,12 +1,4 @@
-import { SZoomImage as r } from "./s-zoom-image.js";
-try {
-  szoomimage.displayName = "szoomimage", szoomimage.__docgenInfo = { description: "An interactive image component with smooth zoom-on-hover functionality and built-in lazy loading.", displayName: "szoomimage", props: { borderRadius: { defaultValue: { value: "1.5" }, description: "Border radius (number uses theme spacing, string accepts any CSS unit)", name: "borderRadius", required: !1, type: { name: "string | number" } }, width: { defaultValue: { value: "100%" }, description: "Image width for lazy loading skeleton", name: "width", required: !1, type: { name: "string | number" } }, height: { defaultValue: { value: "100%" }, description: "Image height for lazy loading skeleton", name: "height", required: !1, type: { name: "string | number" } }, transitionDuration: { defaultValue: { value: "0.3" }, description: "Duration of the spring animation in seconds", name: "transitionDuration", required: !1, type: { name: "number" } }, src: { defaultValue: null, description: "Image source URL", name: "src", required: !0, type: { name: "string" } }, alt: { defaultValue: null, description: "Alternative text for accessibility", name: "alt", required: !0, type: { name: "string" } }, zoomScale: { defaultValue: { value: "1.2" }, description: "Scale factor to apply on zoom", name: "zoomScale", required: !1, type: { name: "number" } }, imgStyle: { defaultValue: null, description: "Custom styles applied to the image element", name: "imgStyle", required: !1, type: { name: "CSSProperties" } }, imgClassName: { defaultValue: null, description: "Custom class name for the image element", name: "imgClassName", required: !1, type: { name: "string" } }, skeletonVariant: { defaultValue: { value: "rounded" }, description: "Skeleton variant while loading", name: "skeletonVariant", required: !1, type: { name: "enum", value: [{ value: '"text"' }, { value: '"rectangular"' }, { value: '"rounded"' }, { value: '"circular"' }] } } } };
-} catch {
-}
-try {
-  SZoomImageProps.displayName = "SZoomImageProps", SZoomImageProps.__docgenInfo = { description: "Props interface for SZoomImage component", displayName: "SZoomImageProps", props: {} };
-} catch {
-}
+import { SZoomImage as e } from "./s-zoom-image.js";
 export {
-  r as default
+  e as default
 };

package/dist/s-zoom-image/package.json

@@ -1,5 +1,5 @@
-{
-  "main": "./index.js",
-  "types": "./index.d.ts",
-  "sideEffects": false
-}
+{
+  "main": "./index.js",
+  "types": "./index.d.ts",
+  "sideEffects": false
+}