@solostylist/ui-kit 1.0.167 → 1.0.169

package/dist/s-date-picker/index.js

@@ -1,4 +1,4 @@
-import { default as o } from "./s-date-picker.js";
+import { SDatePicker as r } from "./s-date-picker.js";
 export {
-  o as default
+  r as default
 };

package/dist/s-date-picker/s-date-picker.d.ts

@@ -1,8 +1,7 @@
 import { DatePickerProps } from '@mui/x-date-pickers/DatePicker';
 import * as React from 'react';
 /**
- * Props interface for SDatePicker component - extends Material-UI X DatePickerProps
- * with form integration capabilities
+ * Props interface for SDatePicker component
  */
 export interface SDatePickerProps extends DatePickerProps {
     /** Field label displayed above the date picker */
@@ -17,20 +16,10 @@ export interface SDatePickerProps extends DatePickerProps {
     hint?: string;
 }
 /**
- * SDatePicker - A standardized date picker component that wraps Material-UI X DatePicker
- * with consistent form labeling, validation, and help text patterns.
- *
- * Key features:
- * - Integrates with SForm for consistent label and error handling
- * - Uses Material-UI TextField as the default input component
- * - Maintains full Material-UI X DatePicker API compatibility
- * - Provides accessible form labeling with htmlFor/id association
- * - Includes help text tooltip functionality
- * - Disables accessible field DOM structure for better styling control
- * - Allows slot overrides for advanced customization
- *
- * @param props - SDatePickerProps with form integration and Material-UI X DatePicker props
- * @returns JSX.Element - Wrapped DatePicker with form labeling and validation
+ * A standardized date picker component that wraps Material-UI X DatePicker with consistent form labeling.
  */
-declare function SDatePicker({ label, required, error, htmlFor, hint, ...props }: SDatePickerProps): React.JSX.Element;
+export declare const SDatePicker: {
+    ({ label, required, error, htmlFor, hint, ...props }: SDatePickerProps): React.JSX.Element;
+    displayName: string;
+};
 export default SDatePicker;

package/dist/s-date-picker/s-date-picker.js

@@ -1,28 +1,28 @@
-import { j as f } from "../jsx-runtime-OVHDjVDe.js";
-import { useTheme as I, TextField as z } from "@mui/material";
-import L from "../s-form/s-form.js";
-import { _ as P, a } from "../objectWithoutPropertiesLoose-DiWPeE4c.js";
+import { j as p } from "../jsx-runtime-OVHDjVDe.js";
+import { useTheme as W, TextField as z } from "@mui/material";
+import { SForm as L } from "../s-form/s-form.js";
+import { _ as O, a as r } from "../objectWithoutPropertiesLoose-DiWPeE4c.js";
 import * as b from "react";
 import { P as e } from "../createTheme-3Wd3hHrj.js";
-import { u as O, a as U, b as Y, c as Q, r as T, d as q, P as B, e as H, f as $, g as K, h as Z, i as G, j as J, k as X, C as ee, l as m, m as M, n as oe, v as F, s as R, o as te, D as se, p as ae } from "../useMobilePicker-DgxcRrRB.js";
+import { u as g, a as U, b as H, c as Y, r as k, d as Q, P as B, e as X, f as $, g as K, h as Z, i as G, j as J, k as ee, C as oe, l as m, m as F, n as te, v as N, s as R, o as ae, D as re, p as ne } from "../useMobilePicker-C1RZZUWr.js";
 import { u as y } from "../warning-BCwEnWrE.js";
-import { g as ne } from "../colorManipulator-ep5lERxB.js";
-import { g as re } from "../generateUtilityClasses-BtVDwGrk.js";
+import { g as se } from "../colorManipulator-ep5lERxB.js";
+import { g as le } from "../generateUtilityClasses-BtVDwGrk.js";
 import { s as C } from "../styled-B0Z4EDy9.js";
-import { a as le } from "../DefaultPropsProvider-CaCsvQaq.js";
-import { T as ie } from "../Typography-B7LOtCzI.js";
-import { r as h, a as N } from "../ButtonBase-DfTfJ_ou.js";
-function ce(l) {
-  return ne("MuiDatePickerToolbar", l);
+import { a as ie } from "../DefaultPropsProvider-CaCsvQaq.js";
+import { T as ce } from "../Typography-C8jwvSWe.js";
+import { r as h, a as V } from "../ButtonBase-DfTfJ_ou.js";
+function de(n) {
+  return se("MuiDatePickerToolbar", n);
 }
-re("MuiDatePickerToolbar", ["root", "title"]);
-const de = ["toolbarFormat", "toolbarPlaceholder", "className", "classes"], ue = (l) => le({
+le("MuiDatePickerToolbar", ["root", "title"]);
+const ue = ["toolbarFormat", "toolbarPlaceholder", "className", "classes"], pe = (n) => ie({
   root: ["root"],
   title: ["title"]
-}, ce, l), fe = C(B, {
+}, de, n), fe = C(B, {
   name: "MuiDatePickerToolbar",
   slot: "Root"
-})({}), pe = C(ie, {
+})({}), be = C(ce, {
   name: "MuiDatePickerToolbar",
   slot: "Title"
 })({
@@ -34,44 +34,44 @@ const de = ["toolbarFormat", "toolbarPlaceholder", "className", "classes"], ue =
       margin: "auto 16px auto auto"
     }
   }]
-}), g = /* @__PURE__ */ b.forwardRef(function(n, t) {
-  const r = y({
-    props: n,
+}), T = /* @__PURE__ */ b.forwardRef(function(s, t) {
+  const l = y({
+    props: s,
     name: "MuiDatePickerToolbar"
   }), {
     toolbarFormat: o,
-    toolbarPlaceholder: s = "––",
+    toolbarPlaceholder: a = "––",
     className: i,
-    classes: p
-  } = r, c = P(r, de), u = O(), {
+    classes: f
+  } = l, c = O(l, ue), u = g(), {
     value: d,
     views: v,
-    orientation: E
-  } = U(), V = Y(), _ = Q(), w = ue(p), A = b.useMemo(() => {
+    orientation: S
+  } = U(), E = H(), q = Y(), M = pe(f), A = b.useMemo(() => {
     if (!u.isValid(d))
-      return s;
-    const W = T(u, {
+      return a;
+    const I = k(u, {
       format: o,
       views: v
     }, !0);
-    return u.formatByString(d, W);
-  }, [d, o, s, u, v]);
-  return /* @__PURE__ */ f.jsx(fe, a({
+    return u.formatByString(d, I);
+  }, [d, o, a, u, v]);
+  return /* @__PURE__ */ p.jsx(fe, r({
     ref: t,
-    toolbarTitle: V.datePickerToolbarTitle,
-    className: q(w.root, i)
+    toolbarTitle: E.datePickerToolbarTitle,
+    className: Q(M.root, i)
   }, c, {
-    children: /* @__PURE__ */ f.jsx(pe, {
+    children: /* @__PURE__ */ p.jsx(be, {
       variant: "h4",
-      align: E === "landscape" ? "left" : "center",
-      ownerState: _,
-      className: w.title,
+      align: S === "landscape" ? "left" : "center",
+      ownerState: q,
+      className: M.title,
       children: A
     })
   }));
 });
-process.env.NODE_ENV !== "production" && (g.displayName = "DatePickerToolbar");
-process.env.NODE_ENV !== "production" && (g.propTypes = {
+process.env.NODE_ENV !== "production" && (T.displayName = "DatePickerToolbar");
+process.env.NODE_ENV !== "production" && (T.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |
@@ -101,17 +101,17 @@ process.env.NODE_ENV !== "production" && (g.propTypes = {
    */
   toolbarPlaceholder: e.node
 });
-function S(l, n) {
+function _(n, s) {
   const t = y({
-    props: l,
-    name: n
-  }), r = H(t), o = b.useMemo(() => {
-    var s;
-    return ((s = t.localeText) == null ? void 0 : s.toolbarTitle) == null ? t.localeText : a({}, t.localeText, {
+    props: n,
+    name: s
+  }), l = X(t), o = b.useMemo(() => {
+    var a;
+    return ((a = t.localeText) == null ? void 0 : a.toolbarTitle) == null ? t.localeText : r({}, t.localeText, {
       datePickerToolbarTitle: t.localeText.toolbarTitle
     });
   }, [t.localeText]);
-  return a({}, t, r, {
+  return r({}, t, l, {
     localeText: o
   }, $({
     views: t.views,
@@ -119,36 +119,36 @@ function S(l, n) {
     defaultViews: ["year", "day"],
     defaultOpenTo: "day"
   }), {
-    slots: a({
-      toolbar: g
+    slots: r({
+      toolbar: T
     }, t.slots)
   });
 }
-const be = (l) => {
-  const n = K(l);
+const me = (n) => {
+  const s = K(n);
   return Z({
-    manager: n,
-    props: l
+    manager: s,
+    props: n
   });
-}, me = ["slots", "slotProps"], D = /* @__PURE__ */ b.forwardRef(function(n, t) {
-  const r = y({
-    props: n,
+}, ye = ["slots", "slotProps"], D = /* @__PURE__ */ b.forwardRef(function(s, t) {
+  const l = y({
+    props: s,
     name: "MuiDateField"
   }), {
     slots: o,
-    slotProps: s
-  } = r, i = P(r, me), p = G({
-    slotProps: s,
+    slotProps: a
+  } = l, i = O(l, ye), f = G({
+    slotProps: a,
     ref: t,
     externalForwardedProps: i
-  }), c = be(p);
-  return /* @__PURE__ */ f.jsx(J, {
+  }), c = me(f);
+  return /* @__PURE__ */ p.jsx(J, {
     slots: o,
-    slotProps: s,
+    slotProps: a,
     inputRef: i.inputRef,
-    children: /* @__PURE__ */ f.jsx(X, {
+    children: /* @__PURE__ */ p.jsx(ee, {
       fieldResponse: c,
-      defaultOpenPickerIcon: ee
+      defaultOpenPickerIcon: oe
     })
   });
 });
@@ -434,43 +434,43 @@ process.env.NODE_ENV !== "production" && (D.propTypes = {
    */
   variant: e.oneOf(["filled", "outlined", "standard"])
 });
-const k = /* @__PURE__ */ b.forwardRef(function(n, t) {
+const j = /* @__PURE__ */ b.forwardRef(function(s, t) {
   var c;
-  const r = O(), o = S(n, "MuiDesktopDatePicker"), s = a({
+  const l = g(), o = _(s, "MuiDesktopDatePicker"), a = r({
     day: m,
     month: m,
     year: m
-  }, o.viewRenderers), i = a({}, o, {
+  }, o.viewRenderers), i = r({}, o, {
     closeOnSelect: o.closeOnSelect ?? !0,
-    viewRenderers: s,
-    format: T(r, o, !1),
+    viewRenderers: a,
+    format: k(l, o, !1),
     yearsPerRow: o.yearsPerRow ?? 4,
-    slots: a({
+    slots: r({
       field: D
     }, o.slots),
-    slotProps: a({}, o.slotProps, {
+    slotProps: r({}, o.slotProps, {
       field: (u) => {
         var d;
-        return a({}, N((d = o.slotProps) == null ? void 0 : d.field, u), M(o));
+        return r({}, V((d = o.slotProps) == null ? void 0 : d.field, u), F(o));
       },
-      toolbar: a({
+      toolbar: r({
         hidden: !0
       }, (c = o.slotProps) == null ? void 0 : c.toolbar)
     })
   }), {
-    renderPicker: p
-  } = oe({
+    renderPicker: f
+  } = te({
     ref: t,
     props: i,
     valueManager: R,
     valueType: "date",
-    validator: F,
+    validator: N,
     steps: null
   });
-  return p();
+  return f();
 });
-process.env.NODE_ENV !== "production" && (k.displayName = "DesktopDatePicker");
-k.propTypes = {
+process.env.NODE_ENV !== "production" && (j.displayName = "DesktopDatePicker");
+j.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |
@@ -784,41 +784,41 @@ k.propTypes = {
    */
   yearsPerRow: e.oneOf([3, 4])
 };
-const j = /* @__PURE__ */ b.forwardRef(function(n, t) {
+const w = /* @__PURE__ */ b.forwardRef(function(s, t) {
   var c;
-  const r = O(), o = S(n, "MuiMobileDatePicker"), s = a({
+  const l = g(), o = _(s, "MuiMobileDatePicker"), a = r({
     day: m,
     month: m,
     year: m
-  }, o.viewRenderers), i = a({}, o, {
-    viewRenderers: s,
-    format: T(r, o, !1),
-    slots: a({
+  }, o.viewRenderers), i = r({}, o, {
+    viewRenderers: a,
+    format: k(l, o, !1),
+    slots: r({
       field: D
     }, o.slots),
-    slotProps: a({}, o.slotProps, {
+    slotProps: r({}, o.slotProps, {
       field: (u) => {
         var d;
-        return a({}, N((d = o.slotProps) == null ? void 0 : d.field, u), M(o));
+        return r({}, V((d = o.slotProps) == null ? void 0 : d.field, u), F(o));
       },
-      toolbar: a({
+      toolbar: r({
         hidden: !1
       }, (c = o.slotProps) == null ? void 0 : c.toolbar)
     })
   }), {
-    renderPicker: p
-  } = te({
+    renderPicker: f
+  } = ae({
     ref: t,
     props: i,
     valueManager: R,
     valueType: "date",
-    validator: F,
+    validator: N,
     steps: null
   });
-  return p();
+  return f();
 });
-process.env.NODE_ENV !== "production" && (j.displayName = "MobileDatePicker");
-j.propTypes = {
+process.env.NODE_ENV !== "production" && (w.displayName = "MobileDatePicker");
+w.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |
@@ -1132,20 +1132,20 @@ j.propTypes = {
    */
   yearsPerRow: e.oneOf([3, 4])
 };
-const ye = ["desktopModeMediaQuery"], x = /* @__PURE__ */ b.forwardRef(function(n, t) {
-  const r = y({
-    props: n,
+const he = ["desktopModeMediaQuery"], x = /* @__PURE__ */ b.forwardRef(function(s, t) {
+  const l = y({
+    props: s,
     name: "MuiDatePicker"
   }), {
-    desktopModeMediaQuery: o = se
-  } = r, s = P(r, ye);
-  return ae(o, {
+    desktopModeMediaQuery: o = re
+  } = l, a = O(l, he);
+  return ne(o, {
     defaultMatches: !0
-  }) ? /* @__PURE__ */ f.jsx(k, a({
+  }) ? /* @__PURE__ */ p.jsx(j, r({
     ref: t
-  }, s)) : /* @__PURE__ */ f.jsx(j, a({
+  }, a)) : /* @__PURE__ */ p.jsx(w, r({
     ref: t
-  }, s));
+  }, a));
 });
 process.env.NODE_ENV !== "production" && (x.displayName = "DatePicker");
 process.env.NODE_ENV !== "production" && (x.propTypes = {
@@ -1468,16 +1468,23 @@ process.env.NODE_ENV !== "production" && (x.propTypes = {
    */
   yearsPerRow: e.oneOf([3, 4])
 });
-function Re({ label: l, required: n = !1, error: t, htmlFor: r, hint: o, ...s }) {
-  const i = I();
-  return /* @__PURE__ */ f.jsx(L, { label: l, required: n, error: t, htmlFor: r, hint: o, children: /* @__PURE__ */ f.jsx(
+const P = ({
+  label: n,
+  required: s = !1,
+  error: t,
+  htmlFor: l,
+  hint: o,
+  ...a
+}) => {
+  const i = W();
+  return /* @__PURE__ */ p.jsx(L, { label: n, required: s, error: t, htmlFor: l, hint: o, children: /* @__PURE__ */ p.jsx(
     x,
     {
       enableAccessibleFieldDOMStructure: !1,
       slots: {
         textField: z,
         // Use Material-UI TextField as input
-        ...s.slots || {}
+        ...a.slots || {}
         // Allow user to override slots if needed
       },
       slotProps: {
@@ -1492,13 +1499,23 @@ function Re({ label: l, required: n = !1, error: t, htmlFor: r, hint: o, ...s })
             }
           }
         },
-        ...s.slotProps || {}
+        ...a.slotProps || {}
         // Allow user to override slotProps if needed
       },
-      ...s
+      ...a
     }
   ) });
+};
+P.displayName = "SDatePicker";
+try {
+  P.displayName = "SDatePicker", P.__docgenInfo = { description: "A standardized date picker component that wraps Material-UI X DatePicker with consistent form labeling.", displayName: "SDatePicker", props: { label: { defaultValue: null, description: "Field label displayed above the date picker", name: "label", required: !1, type: { name: "ReactNode" } }, required: { defaultValue: { value: "false" }, description: "Whether the field is required (shows asterisk in label)", name: "required", required: !1, type: { name: "boolean" } }, error: { defaultValue: null, description: "Error message to display below the field", name: "error", required: !1, type: { name: "string" } }, htmlFor: { defaultValue: null, description: "HTML id attribute for the input element", name: "htmlFor", required: !1, type: { name: "string" } }, hint: { defaultValue: null, description: "Help text shown in tooltip next to the label", name: "hint", required: !1, type: { name: "string" } } } };
+} catch {
+}
+try {
+  sdatepicker.displayName = "sdatepicker", sdatepicker.__docgenInfo = { description: "A standardized date picker component that wraps Material-UI X DatePicker with consistent form labeling.", displayName: "sdatepicker", props: { label: { defaultValue: null, description: "Field label displayed above the date picker", name: "label", required: !1, type: { name: "ReactNode" } }, required: { defaultValue: { value: "false" }, description: "Whether the field is required (shows asterisk in label)", name: "required", required: !1, type: { name: "boolean" } }, error: { defaultValue: null, description: "Error message to display below the field", name: "error", required: !1, type: { name: "string" } }, htmlFor: { defaultValue: null, description: "HTML id attribute for the input element", name: "htmlFor", required: !1, type: { name: "string" } }, hint: { defaultValue: null, description: "Help text shown in tooltip next to the label", name: "hint", required: !1, type: { name: "string" } } } };
+} catch {
 }
 export {
-  Re as default
+  P as SDatePicker,
+  P as default
 };

package/dist/s-datetime-picker/index.js

@@ -1,4 +1,4 @@
-import { default as o } from "./s-datetime-picker.js";
+import { SDateTimePicker as r } from "./s-datetime-picker.js";
 export {
-  o as default
+  r as default
 };

package/dist/s-datetime-picker/s-datetime-picker.d.ts

@@ -17,21 +17,10 @@ export interface SDateTimePickerProps extends DateTimePickerProps {
     hint?: string;
 }
 /**
- * SDateTimePicker - A standardized date and time picker component that wraps Material-UI X DateTimePicker
- * with consistent form labeling, validation, and help text patterns.
- *
- * Key features:
- * - Integrates with SForm for consistent label and error handling
- * - Uses Material-UI TextField as the default input component
- * - Maintains full Material-UI X DateTimePicker API compatibility
- * - Provides accessible form labeling with htmlFor/id association
- * - Includes help text tooltip functionality
- * - Disables accessible field DOM structure for better styling control
- * - Allows slot overrides for advanced customization
- * - Combines both date and time selection in a single input
- *
- * @param props - SDateTimePickerProps with form integration and Material-UI X DateTimePicker props
- * @returns JSX.Element - Wrapped DateTimePicker with form labeling and validation
+ * A standardized date and time picker component that wraps Material-UI X DateTimePicker with consistent form labeling.
  */
-declare function SDateTimePicker({ label, required, error, htmlFor, hint, ...props }: SDateTimePickerProps): React.JSX.Element;
+export declare const SDateTimePicker: {
+    ({ label, required, error, htmlFor, hint, ...props }: SDateTimePickerProps): React.JSX.Element;
+    displayName: string;
+};
 export default SDateTimePicker;