@solostylist/ui-kit 1.0.167 → 1.0.168

package/dist/s-countdown/index.js

@@ -1,5 +1,6 @@
-import { SCountBox as n, default as u } from "./s-count-down.js";
+import { SCountdown as t } from "./s-count-down.js";
+import { SCountBox as x } from "./s-count-box.js";
 export {
-  n as SCountBox,
-  u as SCountdown
+  x as SCountBox,
+  t as SCountdown
 };

package/dist/s-countdown/s-count-box.d.ts

@@ -0,0 +1,39 @@
+import { default as React } from 'react';
+import { SxProps, Theme } from '@mui/material';
+/**
+ * Props interface for SCountBox component
+ */
+export interface SCountBoxProps {
+    /** The numeric value to display */
+    digit: number;
+    /** The label/title for this time unit */
+    title: string;
+    /** Size variant for the count box */
+    size?: 'small' | 'medium' | 'large';
+    /** Color variant for the count box */
+    color?: 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'info' | 'inherit';
+    /** Animation type for value changes */
+    animation?: 'none' | 'fade' | 'slide';
+    /** Custom styling */
+    sx?: SxProps<Theme>;
+    /** Custom digit styling */
+    digitSx?: SxProps<Theme>;
+    /** Custom title styling */
+    titleSx?: SxProps<Theme>;
+    /** Show separator after this box */
+    showSeparator?: boolean;
+    /** Custom separator element */
+    separator?: React.ReactNode;
+    /** Format for displaying the digit (e.g., '00' for zero-padding) */
+    digitFormat?: 'default' | 'padded';
+    /** Whether this count box is hidden */
+    hidden?: boolean;
+}
+/**
+ * An individual count box component that displays a single time unit with optional animations.
+ */
+export declare const SCountBox: {
+    ({ digit, title, size, color, animation, sx, digitSx, titleSx, showSeparator, separator, digitFormat, hidden, }: SCountBoxProps): import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+export default SCountBox;

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

@@ -0,0 +1,112 @@
+import { j as e } from "../jsx-runtime-OVHDjVDe.js";
+import { Typography as l, Fade as b, Slide as z } from "@mui/material";
+import { SFlexBox as m } from "../s-flex-box/s-flex-box.js";
+const r = ({
+  digit: t = 0,
+  title: p = "",
+  size: c = "medium",
+  color: o = "inherit",
+  animation: u = "none",
+  sx: f,
+  digitSx: h,
+  titleSx: v,
+  showSeparator: g = !1,
+  separator: x = ":",
+  digitFormat: y = "default",
+  hidden: S = !1
+}) => {
+  if (S) return null;
+  const V = (d) => y === "padded" ? d.toString().padStart(2, "0") : d.toString(), a = (() => {
+    switch (c) {
+      case "small":
+        return {
+          digit: { fontSize: "1.5rem", lineHeight: 1.2 },
+          title: { fontSize: "0.75rem", letterSpacing: "0.05em" }
+        };
+      case "large":
+        return {
+          digit: { fontSize: "3.5rem", lineHeight: 1.1 },
+          title: { fontSize: "1rem", letterSpacing: "0.1em" }
+        };
+      default:
+        return {
+          digit: { fontSize: "2.5rem", lineHeight: 1.15 },
+          title: { fontSize: "0.875rem", letterSpacing: "0.08em" }
+        };
+    }
+  })(), i = V(t), n = /* @__PURE__ */ e.jsx(
+    l,
+    {
+      variant: "h3",
+      component: "span",
+      sx: {
+        fontWeight: 700,
+        color: o === "inherit" ? "text.primary" : `${o}.main`,
+        width: "70px",
+        ...a.digit,
+        ...h
+      },
+      children: i
+    }
+  ), q = /* @__PURE__ */ e.jsx(
+    l,
+    {
+      component: "span",
+      sx: {
+        color: "text.secondary",
+        fontWeight: 600,
+        textTransform: "uppercase",
+        display: "block",
+        mt: 0.5,
+        ...a.title,
+        ...v
+      },
+      children: p
+    }
+  ), s = /* @__PURE__ */ e.jsxs(
+    m,
+    {
+      flexDirection: "column",
+      alignItems: "center",
+      sx: {
+        textAlign: "center",
+        minWidth: "fit-content",
+        ...f
+      },
+      children: [
+        u === "fade" ? /* @__PURE__ */ e.jsx(b, { in: !0, timeout: 300, children: /* @__PURE__ */ e.jsx("div", { children: n }) }, i) : u === "slide" ? /* @__PURE__ */ e.jsx(z, { in: !0, direction: "up", timeout: 300, children: /* @__PURE__ */ e.jsx("div", { children: n }) }, i) : n,
+        q
+      ]
+    }
+  );
+  return g ? /* @__PURE__ */ e.jsxs(m, { alignItems: "center", children: [
+    s,
+    /* @__PURE__ */ e.jsx(
+      l,
+      {
+        variant: "h3",
+        sx: {
+          color: "text.secondary",
+          ...a.digit,
+          lineHeight: 1,
+          alignSelf: "flex-start",
+          mt: 0.5
+        },
+        children: x
+      }
+    )
+  ] }) : s;
+};
+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: '"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: '"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 {
+  r as SCountBox,
+  r as default
+};

package/dist/s-countdown/s-count-down.d.ts

@@ -1,40 +1,7 @@
 import { default as React } from 'react';
 import { SxProps, Theme } from '@mui/material';
 /**
- * Props for individual count box component
- */
-export interface SCountBoxProps {
-    /** The numeric value to display */
-    digit: number;
-    /** The label/title for this time unit */
-    title: string;
-    /** Size variant for the count box */
-    size?: 'small' | 'medium' | 'large';
-    /** Color variant for the count box */
-    color?: 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'info' | 'inherit';
-    /** Animation type for value changes */
-    animation?: 'none' | 'fade' | 'slide';
-    /** Custom styling */
-    sx?: SxProps<Theme>;
-    /** Custom digit styling */
-    digitSx?: SxProps<Theme>;
-    /** Custom title styling */
-    titleSx?: SxProps<Theme>;
-    /** Show separator after this box */
-    showSeparator?: boolean;
-    /** Custom separator element */
-    separator?: React.ReactNode;
-    /** Format for displaying the digit (e.g., '00' for zero-padding) */
-    digitFormat?: 'default' | 'padded';
-    /** Whether this count box is hidden */
-    hidden?: boolean;
-}
-/**
- * Individual count box component that displays a single time unit
- */
-export declare const SCountBox: ({ digit, title, size, color, animation, sx, digitSx, titleSx, showSeparator, separator, digitFormat, hidden, }: SCountBoxProps) => import("react/jsx-runtime").JSX.Element | null;
-/**
- * Props for the main countdown component
+ * Props interface for SCountdown component
  */
 export interface SCountDownProps {
     /** Target date timestamp in milliseconds (from Date.getTime()) */
@@ -98,21 +65,10 @@ export interface SCountDownProps {
     };
 }
 /**
- * SCountdown - A comprehensive countdown timer component with extensive customization options
- *
- * Features:
- * - Multiple size variants and color themes
- * - Flexible layout options (horizontal, vertical, grid)
- * - Animation support for value changes
- * - Customizable time units and labels
- * - Auto-hide zero units option
- * - Accessibility support with ARIA labels
- * - Responsive design capabilities
- * - Event callbacks for interaction
- * - Pause/resume functionality
- *
- * @param props - SCountDownProps
- * @returns JSX.Element - Countdown timer component
+ * A comprehensive countdown timer component with extensive customization options, animations, and accessibility features.
  */
-declare const SCountdown: ({ expireDate, size, color, layout, animation, showSeparators, separator, units, labels, digitFormat, onComplete, onTick, onStart, completedText, autoHideZeroUnits, sx, "aria-label": ariaLabel, paused, responsive, }: SCountDownProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SCountdown: {
+    ({ expireDate, size, color, layout, animation, showSeparators, separator, units, labels, digitFormat, onComplete, onTick, onStart, completedText, autoHideZeroUnits, sx, "aria-label": ariaLabel, paused, responsive, }: SCountDownProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export default SCountdown;

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

@@ -1,191 +1,97 @@
-import { j as e } from "../jsx-runtime-OVHDjVDe.js";
-import { Typography as x, Fade as A, Slide as B } from "@mui/material";
-import M from "../hooks/use-count-down.js";
-import p from "../s-flex-box/s-flex-box.js";
-const T = ({
-  digit: y = 0,
-  title: i = "",
-  size: m = "medium",
-  color: u = "inherit",
-  animation: h = "none",
-  sx: g,
-  digitSx: S,
-  titleSx: f,
-  showSeparator: r = !1,
-  separator: j = ":",
-  digitFormat: w = "default",
-  hidden: k = !1
-}) => {
-  if (k) return null;
-  const v = (t) => w === "padded" ? t.toString().padStart(2, "0") : t.toString(), s = (() => {
-    switch (m) {
-      case "small":
-        return {
-          digit: { fontSize: "1.5rem", lineHeight: 1.2 },
-          title: { fontSize: "0.75rem", letterSpacing: "0.05em" }
-        };
-      case "large":
-        return {
-          digit: { fontSize: "3.5rem", lineHeight: 1.1 },
-          title: { fontSize: "1rem", letterSpacing: "0.1em" }
-        };
-      default:
-        return {
-          digit: { fontSize: "2.5rem", lineHeight: 1.15 },
-          title: { fontSize: "0.875rem", letterSpacing: "0.08em" }
-        };
-    }
-  })(), l = v(y), o = /* @__PURE__ */ e.jsx(
-    x,
-    {
-      variant: "h3",
-      component: "span",
-      sx: {
-        fontWeight: 700,
-        color: u === "inherit" ? "text.primary" : `${u}.main`,
-        width: "70px",
-        ...s.digit,
-        ...S
-      },
-      children: l
-    }
-  ), $ = /* @__PURE__ */ e.jsx(
-    x,
-    {
-      component: "span",
-      sx: {
-        color: "text.secondary",
-        fontWeight: 600,
-        textTransform: "uppercase",
-        display: "block",
-        mt: 0.5,
-        ...s.title,
-        ...f
-      },
-      children: i
-    }
-  ), n = /* @__PURE__ */ e.jsxs(
-    p,
-    {
-      flexDirection: "column",
-      alignItems: "center",
-      sx: {
-        textAlign: "center",
-        minWidth: "fit-content",
-        ...g
-      },
-      children: [
-        h === "fade" ? /* @__PURE__ */ e.jsx(A, { in: !0, timeout: 300, children: /* @__PURE__ */ e.jsx("div", { children: o }) }, l) : h === "slide" ? /* @__PURE__ */ e.jsx(B, { in: !0, direction: "up", timeout: 300, children: /* @__PURE__ */ e.jsx("div", { children: o }) }, l) : o,
-        $
-      ]
-    }
-  );
-  return r ? /* @__PURE__ */ e.jsxs(p, { alignItems: "center", children: [
-    n,
-    /* @__PURE__ */ e.jsx(
-      x,
-      {
-        variant: "h3",
-        sx: {
-          color: "text.secondary",
-          ...s.digit,
-          lineHeight: 1,
-          alignSelf: "flex-start",
-          mt: 0.5
-        },
-        children: j
-      }
-    )
-  ] }) : n;
-}, V = ({
-  expireDate: y,
-  size: i = "medium",
-  color: m = "inherit",
-  layout: u = "horizontal",
-  animation: h = "none",
-  showSeparators: g = !1,
-  separator: S = ":",
-  units: f = {
+import { j as u } from "../jsx-runtime-OVHDjVDe.js";
+import { Typography as R } from "@mui/material";
+import W from "../hooks/use-count-down.js";
+import { SFlexBox as w } from "../s-flex-box/s-flex-box.js";
+import { SCountBox as I } from "./s-count-box.js";
+const p = ({
+  expireDate: o,
+  size: e = "medium",
+  color: s = "inherit",
+  layout: x = "horizontal",
+  animation: S = "none",
+  showSeparators: f = !1,
+  separator: q = ":",
+  units: h = {
     days: !0,
     hours: !0,
     minutes: !0,
     seconds: !0
   },
-  labels: r = {
+  labels: i = {
     days: "DAYS",
     hours: "HOURS",
     minutes: "MINS",
     seconds: "SECS"
   },
-  digitFormat: j = "default",
-  onComplete: w,
+  digitFormat: V = "default",
+  onComplete: C,
   onTick: k,
-  onStart: v,
-  completedText: c = "Time is up!",
-  autoHideZeroUnits: s = !1,
-  sx: l,
-  "aria-label": o = "Countdown timer",
-  paused: $ = !1,
+  onStart: T,
+  completedText: r = "Time is up!",
+  autoHideZeroUnits: y = !1,
+  sx: v,
+  "aria-label": g = "Countdown timer",
+  paused: _ = !1,
   responsive: n
 }) => {
-  const { timeLeft: t, isExpired: E } = M({
-    expireDate: y,
-    onComplete: w,
+  const { timeLeft: a, isExpired: z } = W({
+    expireDate: o,
+    onComplete: C,
     onTick: k,
-    onStart: v,
-    paused: $
+    onStart: T,
+    paused: _
   });
-  if (E && c)
-    return /* @__PURE__ */ e.jsx(
-      p,
+  if (z && r)
+    return /* @__PURE__ */ u.jsx(
+      w,
       {
         justifyContent: "center",
         alignItems: "center",
-        sx: { textAlign: "center", ...l },
+        sx: { textAlign: "center", ...v },
         role: "timer",
-        "aria-label": `${o} - completed`,
-        children: typeof c == "string" ? /* @__PURE__ */ e.jsx(
-          x,
+        "aria-label": `${g} - completed`,
+        children: typeof r == "string" ? /* @__PURE__ */ u.jsx(
+          R,
           {
-            variant: i === "large" ? "h4" : i === "small" ? "h6" : "h5",
-            color: m === "inherit" ? "text.primary" : `${m}.main`,
+            variant: e === "large" ? "h4" : e === "small" ? "h6" : "h5",
+            color: s === "inherit" ? "text.primary" : `${s}.main`,
             sx: { fontWeight: 600 },
-            children: c
+            children: r
           }
-        ) : c
+        ) : r
       }
     );
-  const C = [], I = [
-    { key: "days", value: t.days, label: r.days },
-    { key: "hours", value: t.hours, label: r.hours },
-    { key: "minutes", value: t.minutes, label: r.minutes },
-    { key: "seconds", value: t.seconds, label: r.seconds }
+  const d = [], m = [
+    { key: "days", value: a.days, label: i.days },
+    { key: "hours", value: a.hours, label: i.hours },
+    { key: "minutes", value: a.minutes, label: i.minutes },
+    { key: "seconds", value: a.seconds, label: i.seconds }
   ];
-  I.forEach((a, D) => {
-    if (f[a.key] && (!s || a.value > 0 || a.key === "seconds")) {
-      const W = D === I.length - 1, H = g && !W && I.slice(D + 1).some(
-        (z) => f[z.key] && (!s || z.value > 0 || z.key === "seconds")
+  m.forEach((t, b) => {
+    if (h[t.key] && (!y || t.value > 0 || t.key === "seconds")) {
+      const D = b === m.length - 1, N = f && !D && m.slice(b + 1).some(
+        (c) => h[c.key] && (!y || c.value > 0 || c.key === "seconds")
       );
-      C.push(
-        /* @__PURE__ */ e.jsx(
-          T,
+      d.push(
+        /* @__PURE__ */ u.jsx(
+          I,
           {
-            digit: a.value,
-            title: a.label || "",
-            size: i,
-            color: m,
-            animation: h,
-            digitFormat: j,
-            showSeparator: H,
-            separator: S
+            digit: t.value,
+            title: t.label || "",
+            size: e,
+            color: s,
+            animation: S,
+            digitFormat: V,
+            showSeparator: N,
+            separator: q
           },
-          a.key
+          t.key
         )
       );
     }
   });
-  const b = () => {
-    switch (u) {
+  const A = () => {
+    switch (x) {
       case "vertical":
         return {
           flexDirection: "column",
@@ -195,54 +101,83 @@ const T = ({
       case "grid":
         return {
           display: "grid",
-          gridTemplateColumns: `repeat(${C.length}, 1fr)`,
+          gridTemplateColumns: `repeat(${d.length}, 1fr)`,
           gap: 2,
           justifyItems: "center"
         };
       default:
         return {
           flexDirection: "row",
-          gap: g ? 0 : 2,
+          gap: f ? 0 : 2,
           alignItems: "center",
           justifyContent: "center",
           flexWrap: "wrap"
         };
     }
-  }, d = n ? {
-    xs: n.xs || i,
-    sm: n.sm || i,
-    md: n.md || i,
-    lg: n.lg || i,
-    xl: n.xl || i
+  }, l = n ? {
+    xs: n.xs || e,
+    sm: n.sm || e,
+    md: n.md || e,
+    lg: n.lg || e,
+    xl: n.xl || e
   } : void 0;
-  return /* @__PURE__ */ e.jsx(
-    p,
+  return /* @__PURE__ */ u.jsx(
+    w,
     {
       sx: {
         width: "fit-content",
-        ...b(),
-        ...l,
-        ...d && {
+        ...A(),
+        ...v,
+        ...l && {
           // Apply responsive sizing if provided
           "@media (max-width: 600px)": {
             "& .MuiTypography-h3": {
-              fontSize: d.xs === "small" ? "1.5rem" : d.xs === "large" ? "3.5rem" : "2.5rem"
+              fontSize: l.xs === "small" ? "1.5rem" : l.xs === "large" ? "3.5rem" : "2.5rem"
             }
           },
           "@media (min-width: 600px) and (max-width: 960px)": {
             "& .MuiTypography-h3": {
-              fontSize: d.sm === "small" ? "1.5rem" : d.sm === "large" ? "3.5rem" : "2.5rem"
+              fontSize: l.sm === "small" ? "1.5rem" : l.sm === "large" ? "3.5rem" : "2.5rem"
             }
           }
         }
       },
       role: "timer",
-      "aria-label": `${o} - ${t.days} days, ${t.hours} hours, ${t.minutes} minutes, ${t.seconds} seconds remaining`,
-      children: C
+      "aria-label": `${g} - ${a.days} days, ${a.hours} hours, ${a.minutes} minutes, ${a.seconds} seconds remaining`,
+      children: d
     }
   );
 };
+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: '"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,
+    seconds: true,
+  }` }, description: "Which time units to display", name: "units", required: !1, type: { name: "{ days?: boolean; hours?: boolean; minutes?: boolean | undefined; seconds?: boolean | undefined; } | undefined" } }, labels: { defaultValue: { value: `{
+    days: 'DAYS',
+    hours: 'HOURS',
+    minutes: 'MINS',
+    seconds: 'SECS',
+  }` }, description: "Custom labels for time units", name: "labels", required: !1, type: { name: "{ days?: string; hours?: string; minutes?: string | undefined; seconds?: string | undefined; } | undefined" } }, digitFormat: { defaultValue: { value: "default" }, description: "Format for displaying digits", name: "digitFormat", required: !1, type: { name: "enum", value: [{ value: '"default"' }, { value: '"padded"' }] } }, onComplete: { defaultValue: null, description: "Callback fired when countdown reaches zero", name: "onComplete", required: !1, type: { name: "(() => void)" } }, onTick: { defaultValue: null, description: "Callback fired on each tick (every second)", name: "onTick", required: !1, type: { name: "((timeLeft: { days: number; hours: number; minutes: number; seconds: number; }) => void)" } }, onStart: { defaultValue: null, description: "Callback fired when countdown starts", name: "onStart", required: !1, type: { name: "(() => void)" } }, completedText: { defaultValue: { value: "Time is up!" }, description: "What to display when countdown is complete", name: "completedText", required: !1, type: { name: "ReactNode" } }, autoHideZeroUnits: { defaultValue: { value: "false" }, description: "Whether to auto-hide completed units (e.g., hide days when 0)", name: "autoHideZeroUnits", required: !1, type: { name: "boolean" } }, sx: { defaultValue: null, description: "Custom styling for the container", name: "sx", required: !1, type: { name: "SxProps<Theme>" } }, "aria-label": { defaultValue: { value: "Countdown timer" }, description: "ARIA label for accessibility", name: "aria-label", required: !1, type: { name: "string" } }, paused: { defaultValue: { value: "false" }, description: "Whether the countdown is paused", name: "paused", required: !1, type: { name: "boolean" } }, responsive: { defaultValue: null, description: "Responsive breakpoints for size changes", name: "responsive", required: !1, type: { name: '{ xs?: "small" | "medium" | "large"; sm?: "small" | "medium" | "large"; md?: "small" | "medium" | "large" | undefined; lg?: "small" | "medium" | "large" | undefined; xl?: "small" | ... 2 more ... | undefined; } | undefined' } } } };
+} 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: '"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,
+    seconds: true,
+  }` }, description: "Which time units to display", name: "units", required: !1, type: { name: "{ days?: boolean; hours?: boolean; minutes?: boolean | undefined; seconds?: boolean | undefined; } | undefined" } }, labels: { defaultValue: { value: `{
+    days: 'DAYS',
+    hours: 'HOURS',
+    minutes: 'MINS',
+    seconds: 'SECS',
+  }` }, description: "Custom labels for time units", name: "labels", required: !1, type: { name: "{ days?: string; hours?: string; minutes?: string | undefined; seconds?: string | undefined; } | undefined" } }, digitFormat: { defaultValue: { value: "default" }, description: "Format for displaying digits", name: "digitFormat", required: !1, type: { name: "enum", value: [{ value: '"default"' }, { value: '"padded"' }] } }, onComplete: { defaultValue: null, description: "Callback fired when countdown reaches zero", name: "onComplete", required: !1, type: { name: "(() => void)" } }, onTick: { defaultValue: null, description: "Callback fired on each tick (every second)", name: "onTick", required: !1, type: { name: "((timeLeft: { days: number; hours: number; minutes: number; seconds: number; }) => void)" } }, onStart: { defaultValue: null, description: "Callback fired when countdown starts", name: "onStart", required: !1, type: { name: "(() => void)" } }, completedText: { defaultValue: { value: "Time is up!" }, description: "What to display when countdown is complete", name: "completedText", required: !1, type: { name: "ReactNode" } }, autoHideZeroUnits: { defaultValue: { value: "false" }, description: "Whether to auto-hide completed units (e.g., hide days when 0)", name: "autoHideZeroUnits", required: !1, type: { name: "boolean" } }, sx: { defaultValue: null, description: "Custom styling for the container", name: "sx", required: !1, type: { name: "SxProps<Theme>" } }, "aria-label": { defaultValue: { value: "Countdown timer" }, description: "ARIA label for accessibility", name: "aria-label", required: !1, type: { name: "string" } }, paused: { defaultValue: { value: "false" }, description: "Whether the countdown is paused", name: "paused", required: !1, type: { name: "boolean" } }, responsive: { defaultValue: null, description: "Responsive breakpoints for size changes", name: "responsive", required: !1, type: { name: '{ xs?: "small" | "medium" | "large"; sm?: "small" | "medium" | "large"; md?: "small" | "medium" | "large" | undefined; lg?: "small" | "medium" | "large" | undefined; xl?: "small" | ... 2 more ... | undefined; } | undefined' } } } };
+} catch {
+}
 export {
-  T as SCountBox,
-  V as default
+  p as SCountdown,
+  p as default
 };

package/dist/s-data-table/index.js

@@ -1,4 +1,4 @@
-import { default as o } from "./s-data-table.js";
+import { SDataTable as t } from "./s-data-table.js";
 export {
-  o as default
+  t as default
 };