@solostylist/ui-kit 1.0.201 → 1.0.202

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

@@ -1,10 +1,10 @@
 import { j as c } from "../jsx-runtime-tc70JA_2.js";
 import { useTheme as I, TextField as z } from "@mui/material";
 import { SForm as L } from "../s-form/s-form.js";
-import { _ as P, a as s } from "../objectWithoutPropertiesLoose-DiWPeE4c.js";
+import { _ as D, a as s } from "../objectWithoutPropertiesLoose-DiWPeE4c.js";
 import * as f from "react";
 import { P as e } from "../createTheme-DgoJyWM-.js";
-import { g as U, a as Y, u as O, b as q, c as Q, d as B, r as T, e as H, P as $, f as K, h as Z, i as G, j as J, k as X, l as ee, m as oe, C as te, n as m, o as p, p as M, q as F, s as se, v as R, t as N, w as ae, D as ne, x as re } from "../useMobilePicker-B-bNHHXB.js";
+import { g as U, a as Y, u as O, b as q, c as B, d as Q, r as T, e as H, P as $, f as K, h as Z, i as G, j as J, k as X, l as ee, m as oe, C as te, n as m, o as p, p as M, q as F, s as se, v as R, t as N, w as ae, D as ne, x as re } from "../useMobilePicker-B-bNHHXB.js";
 import { u as y } from "../warning-Ba-7BBAN.js";
 import { c as le } from "../clsx-OuTLNxxd.js";
 import { s as C } from "../styled-8Y5KoVix.js";
@@ -40,19 +40,19 @@ const de = ["toolbarFormat", "toolbarPlaceholder", "className", "classes"], ue =
     toolbarPlaceholder: r = "––",
     className: i,
     classes: d
-  } = n, u = P(n, de), b = O(), {
-    value: D,
+  } = n, u = D(n, de), b = O(), {
+    value: P,
     views: v,
     orientation: E
-  } = q(), V = Q(), _ = B(), w = ue(d), A = f.useMemo(() => {
-    if (!b.isValid(D))
+  } = q(), V = B(), _ = Q(), w = ue(d), A = f.useMemo(() => {
+    if (!b.isValid(P))
       return r;
     const W = T(b, {
       format: o,
       views: v
     }, !0);
-    return b.formatByString(D, W);
-  }, [D, o, r, b, v]);
+    return b.formatByString(P, W);
+  }, [P, o, r, b, v]);
   return /* @__PURE__ */ c.jsx(fe, s({
     ref: t,
     toolbarTitle: V.datePickerToolbarTitle,
@@ -131,7 +131,7 @@ const be = (l) => {
   }), {
     slots: o,
     slotProps: r
-  } = n, i = P(n, me), d = X({
+  } = n, i = D(n, me), d = X({
     slotProps: r,
     ref: t,
     externalForwardedProps: i
@@ -1136,7 +1136,7 @@ const ye = ["desktopModeMediaQuery"], x = /* @__PURE__ */ f.forwardRef(function(
     name: "MuiDatePicker"
   }), {
     desktopModeMediaQuery: o = ne
-  } = n, r = P(n, ye);
+  } = n, r = D(n, ye);
   return re(o, {
     defaultMatches: !0
   }) ? /* @__PURE__ */ c.jsx(k, s({
@@ -1492,6 +1492,10 @@ const he = ({
         // Allow user to override slots if needed
       },
       slotProps: {
+        openPickerButton: {
+          edge: "end",
+          sx: { my: -1 }
+        },
         popper: {
           sx: {
             "& .MuiPaper-root": {

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

@@ -18,8 +18,8 @@ import { g as it } from "../generateUtilityClasses-E9gROIFd.js";
 import { g as lt } from "../generateUtilityClass-BhfUaMgk.js";
 import { c as ct } from "../createSvgIcon-BkbeLOhM.js";
 import { T as ws } from "../Typography-PcmlIqm1.js";
-import { a as Ss, M as ut } from "../MenuItem-2wG8I2HO.js";
-const xs = (o) => {
+import { a as xs, M as ut } from "../MenuItem-2wG8I2HO.js";
+const Ss = (o) => {
   const {
     absolute: t,
     children: n,
@@ -33,7 +33,7 @@ const xs = (o) => {
   return no({
     root: ["root", t && "absolute", u, a && "light", i === "vertical" && "vertical", r && "flexItem", n && "withChildren", n && i === "vertical" && "withChildrenVertical", l === "right" && i !== "vertical" && "textAlignRight", l === "left" && i !== "vertical" && "textAlignLeft"],
     wrapper: ["wrapper", i === "vertical" && "wrapperVertical"]
-  }, Ss, s);
+  }, xs, s);
 }, Cs = A("div", {
   name: "MuiDivider",
   slot: "Root",
@@ -216,7 +216,7 @@ const xs = (o) => {
     textAlign: f = "center",
     variant: v = "fullWidth",
     ...P
-  } = s, S = {
+  } = s, x = {
     ...s,
     absolute: r,
     component: u,
@@ -226,18 +226,18 @@ const xs = (o) => {
     role: g,
     textAlign: f,
     variant: v
-  }, M = xs(S);
+  }, M = Ss(x);
   return /* @__PURE__ */ d.jsx(Cs, {
     as: u,
     className: q(M.root, i),
     role: g,
     ref: n,
-    ownerState: S,
+    ownerState: x,
     "aria-orientation": g === "separator" && (u !== "hr" || l === "vertical") ? l : void 0,
     ...P,
     children: a ? /* @__PURE__ */ d.jsx(ks, {
       className: M.wrapper,
-      ownerState: S,
+      ownerState: x,
       children: a
     }) : null
   });
@@ -489,7 +489,7 @@ const Ps = (o) => {
     onClick: v,
     onFocus: P,
     // eslint-disable-next-line react/prop-types
-    selected: S,
+    selected: x,
     // eslint-disable-next-line react/prop-types
     selectionFollowsFocus: M,
     // eslint-disable-next-line react/prop-types
@@ -501,7 +501,7 @@ const Ps = (o) => {
     ...s,
     disabled: a,
     disableFocusRipple: i,
-    selected: S,
+    selected: x,
     icon: !!u,
     iconPosition: p,
     label: !!g,
@@ -511,21 +511,21 @@ const Ps = (o) => {
   }, E = Ps(N), I = u && g && /* @__PURE__ */ c.isValidElement(u) ? /* @__PURE__ */ c.cloneElement(u, {
     className: q(E.icon, u.props.className)
   }) : u, $ = (C) => {
-    !S && f && f(C, j), v && v(C);
+    !x && f && f(C, j), v && v(C);
   }, w = (C) => {
-    M && !S && f && f(C, j), P && P(C);
+    M && !x && f && f(C, j), P && P(C);
   };
   return /* @__PURE__ */ d.jsxs(Os, {
     focusRipple: !i,
     className: q(E.root, r),
     ref: n,
     role: "tab",
-    "aria-selected": S,
+    "aria-selected": x,
     disabled: a,
     onClick: $,
     onFocus: w,
     ownerState: N,
-    tabIndex: S ? 0 : -1,
+    tabIndex: x ? 0 : -1,
     ...k,
     children: [p === "top" || p === "start" ? /* @__PURE__ */ d.jsxs(c.Fragment, {
       children: [I, g]
@@ -1186,7 +1186,7 @@ const $s = it("MuiTabScrollButton", ["root", "vertical", "horizontal", "disabled
   } = s, g = yo(), f = {
     isRtl: g,
     ...s
-  }, v = _s(f), P = a.StartScrollButtonIcon ?? Bs, S = a.EndScrollButtonIcon ?? Ls, M = Je({
+  }, v = _s(f), P = a.StartScrollButtonIcon ?? Bs, x = a.EndScrollButtonIcon ?? Ls, M = Je({
     elementType: P,
     externalSlotProps: i.startScrollButtonIcon,
     additionalProps: {
@@ -1194,7 +1194,7 @@ const $s = it("MuiTabScrollButton", ["root", "vertical", "horizontal", "disabled
     },
     ownerState: f
   }), K = Je({
-    elementType: S,
+    elementType: x,
     externalSlotProps: i.endScrollButtonIcon,
     additionalProps: {
       fontSize: "small"
@@ -1217,7 +1217,7 @@ const $s = it("MuiTabScrollButton", ["root", "vertical", "horizontal", "disabled
     },
     children: l === "left" ? /* @__PURE__ */ d.jsx(P, {
       ...M
-    }) : /* @__PURE__ */ d.jsx(S, {
+    }) : /* @__PURE__ */ d.jsx(x, {
       ...K
     })
   });
@@ -1496,7 +1496,7 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
     component: f = "div",
     allowScrollButtonsMobile: v = !1,
     indicatorColor: P = "primary",
-    onChange: S,
+    onChange: x,
     orientation: M = "horizontal",
     ScrollButtonComponent: K,
     // TODO: remove in v7 (deprecated in v6)
@@ -1543,7 +1543,7 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
   const [ie, W] = c.useState(!1), [le, Z] = c.useState(Wo), [ye, de] = c.useState(!1), [Oe, De] = c.useState(!1), [te, Me] = c.useState(!1), [he, Ie] = c.useState({
     overflow: "hidden",
     scrollbarWidth: 0
-  }), ge = /* @__PURE__ */ new Map(), J = c.useRef(null), ce = c.useRef(null), x = {
+  }), ge = /* @__PURE__ */ new Map(), J = c.useRef(null), ce = c.useRef(null), S = {
     slots: k,
     slotProps: {
       indicator: E,
@@ -1608,7 +1608,7 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
   }, oe = (m) => {
     let h = J.current[_];
     B ? h += m : h += m * (a ? -1 : 1), L(h);
-  }, Se = () => {
+  }, xe = () => {
     const m = J.current[be];
     let h = 0;
     const O = Array.from(ce.current.children);
@@ -1621,10 +1621,10 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
       h += z[be];
     }
     return h;
-  }, xe = () => {
-    oe(-1 * Se());
+  }, Se = () => {
+    oe(-1 * xe());
   }, Y = () => {
-    oe(Se());
+    oe(xe());
   }, [se, {
     onChange: Ce,
     ...io
@@ -1632,9 +1632,9 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
     className: q(Q.scrollableX, Q.hideScrollbar),
     elementType: Xs,
     shouldForwardComponentProp: !0,
-    externalForwardedProps: x,
+    externalForwardedProps: S,
     ownerState: G
-  }), St = c.useCallback((m) => {
+  }), xt = c.useCallback((m) => {
     Ce?.(m), Ie({
       overflow: null,
       scrollbarWidth: m
@@ -1642,7 +1642,7 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
   }, [Ce]), [Io, Vo] = Ve("scrollButtons", {
     className: q(Q.scrollButtons, I.className),
     elementType: ft,
-    externalForwardedProps: x,
+    externalForwardedProps: S,
     ownerState: G,
     additionalProps: {
       orientation: M,
@@ -1655,16 +1655,16 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
         endScrollButtonIcon: ne
       }
     }
-  }), xt = () => {
+  }), St = () => {
     const m = {};
     m.scrollbarSizeListener = R ? /* @__PURE__ */ d.jsx(se, {
       ...io,
-      onChange: St
+      onChange: xt
     }) : null;
     const O = R && (j === "auto" && (ye || Oe) || j === !0);
     return m.scrollButtonStart = O ? /* @__PURE__ */ d.jsx(Io, {
       direction: a ? "right" : "left",
-      onClick: xe,
+      onClick: Se,
       disabled: !ye,
       ...Vo
     }) : null, m.scrollButtonEnd = O ? /* @__PURE__ */ d.jsx(Io, {
@@ -1747,7 +1747,7 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
   const [Ct, kt] = Ve("indicator", {
     className: q(Q.indicator, E.className),
     elementType: qs,
-    externalForwardedProps: x,
+    externalForwardedProps: S,
     ownerState: G,
     additionalProps: {
       style: le
@@ -1769,7 +1769,7 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
       indicator: O && !ie && Ro,
       selected: O,
       selectionFollowsFocus: X,
-      onChange: S,
+      onChange: x,
       textColor: $,
       value: h,
       ...ze === 1 && w === !1 && !m.props.tabIndex ? {
@@ -1797,12 +1797,12 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
         m.preventDefault(), Ye(h, null, _o);
         break;
     }
-  }, lo = xt(), [Mt, It] = Ve("root", {
+  }, lo = St(), [Mt, It] = Ve("root", {
     ref: n,
     className: q(Q.root, g),
     elementType: Us,
     externalForwardedProps: {
-      ...x,
+      ...S,
       ...H,
       component: f
     },
@@ -1811,7 +1811,7 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
     ref: J,
     className: Q.scroller,
     elementType: Ys,
-    externalForwardedProps: x,
+    externalForwardedProps: S,
     ownerState: G,
     additionalProps: {
       style: {
@@ -1823,7 +1823,7 @@ const bt = /* @__PURE__ */ c.forwardRef(function(t, n) {
     ref: ce,
     className: q(Q.list, Q.flexContainer),
     elementType: Ks,
-    externalForwardedProps: x,
+    externalForwardedProps: S,
     ownerState: G,
     getSlotProps: (m) => ({
       ...m,
@@ -2048,7 +2048,7 @@ const Qs = (o) => Xe(o) ? "date" : "time", Zs = (o) => o === "date" ? "day" : "h
   } = oo(), {
     view: g,
     setView: f
-  } = vo(), v = Js(l), P = (S, M) => {
+  } = vo(), v = Js(l), P = (x, M) => {
     f(Zs(M));
   };
   return a ? null : /* @__PURE__ */ d.jsxs(en, {
@@ -2374,7 +2374,7 @@ function gt(o) {
     disabled: f,
     readOnly: v,
     variant: P,
-    orientation: S,
+    orientation: x,
     view: M,
     setView: K,
     views: j
@@ -2418,7 +2418,7 @@ function gt(o) {
         children: [j.includes("hours") && /* @__PURE__ */ d.jsxs(c.Fragment, {
           children: [/* @__PURE__ */ d.jsx(Te, {
             variant: _ ? "h5" : "h3",
-            width: _ && S === "portrait" ? Be : void 0,
+            width: _ && x === "portrait" ? Be : void 0,
             onClick: () => F("hours"),
             selected: C === "hours",
             value: U(n ? "hours12h" : "hours24h", "--")
@@ -2430,7 +2430,7 @@ function gt(o) {
             toolbarVariant: B
           }), /* @__PURE__ */ d.jsx(Te, {
             variant: _ ? "h5" : "h3",
-            width: _ && S === "portrait" ? Be : void 0,
+            width: _ && x === "portrait" ? Be : void 0,
             onClick: () => F("minutes"),
             selected: C === "minutes" || !j.includes("minutes") && C === "hours",
             value: U("minutes", "--"),
@@ -2445,7 +2445,7 @@ function gt(o) {
             toolbarVariant: B
           }), /* @__PURE__ */ d.jsx(Te, {
             variant: _ ? "h5" : "h3",
-            width: _ && S === "portrait" ? Be : void 0,
+            width: _ && x === "portrait" ? Be : void 0,
             onClick: () => F("seconds"),
             selected: C === "seconds",
             value: U("seconds", "--")
@@ -2630,7 +2630,7 @@ const yt = ({
 function wn(o) {
   return Ne("MuiDigitalClock", o);
 }
-const bo = Fe("MuiDigitalClock", ["root", "list", "item"]), Sn = ["ampm", "timeStep", "autoFocus", "slots", "slotProps", "value", "defaultValue", "referenceDate", "disableIgnoringDatePartForTimeValidation", "maxTime", "minTime", "disableFuture", "disablePast", "minutesStep", "shouldDisableTime", "onChange", "view", "openTo", "onViewChange", "focusedView", "onFocusedViewChange", "className", "classes", "disabled", "readOnly", "views", "skipDisabled", "timezone"], xn = (o) => Pe({
+const bo = Fe("MuiDigitalClock", ["root", "list", "item"]), xn = ["ampm", "timeStep", "autoFocus", "slots", "slotProps", "value", "defaultValue", "referenceDate", "disableIgnoringDatePartForTimeValidation", "maxTime", "minTime", "disableFuture", "disablePast", "minutesStep", "shouldDisableTime", "onChange", "view", "openTo", "onViewChange", "focusedView", "onFocusedViewChange", "className", "classes", "disabled", "readOnly", "views", "skipDisabled", "timezone"], Sn = (o) => Pe({
   root: ["root"],
   list: ["list"],
   item: ["item"]
@@ -2685,7 +2685,7 @@ const bo = Fe("MuiDigitalClock", ["root", "list", "item"]), Sn = ["ampm", "timeS
   "&.Mui-focusVisible": {
     backgroundColor: o.vars ? `rgba(${o.vars.palette.primary.mainChannel} / ${o.vars.palette.action.focusOpacity})` : qe(o.palette.primary.main, o.palette.action.focusOpacity)
   }
-})), So = /* @__PURE__ */ c.forwardRef(function(t, n) {
+})), xo = /* @__PURE__ */ c.forwardRef(function(t, n) {
   const s = ve(), r = c.useRef(null), a = qo(n, r), i = c.useRef(null), l = fe({
     props: t,
     name: "MuiDigitalClock"
@@ -2697,7 +2697,7 @@ const bo = Fe("MuiDigitalClock", ["root", "list", "item"]), Sn = ["ampm", "timeS
     slotProps: f,
     value: v,
     defaultValue: P,
-    referenceDate: S,
+    referenceDate: x,
     disableIgnoringDatePartForTimeValidation: M = !1,
     maxTime: K,
     minTime: j,
@@ -2718,7 +2718,7 @@ const bo = Fe("MuiDigitalClock", ["root", "list", "item"]), Sn = ["ampm", "timeS
     views: ue = ["hours"],
     skipDisabled: be = !1,
     timezone: U
-  } = l, G = pe(l, Sn), {
+  } = l, G = pe(l, xn), {
     value: Q,
     handleValueChange: ae,
     timezone: ne
@@ -2727,25 +2727,25 @@ const bo = Fe("MuiDigitalClock", ["root", "list", "item"]), Sn = ["ampm", "timeS
     timezone: U,
     value: v,
     defaultValue: P,
-    referenceDate: S,
+    referenceDate: x,
     onChange: I,
     valueManager: we
   }), ie = _e(), W = Go(ne), {
     ownerState: le
   } = oo(), Z = y({}, le, {
     hasDigitalClockAlreadyBeenRendered: !!r.current
-  }), ye = xn(B), de = g?.digitalClockItem ?? Pn, Oe = ns({
+  }), ye = Sn(B), de = g?.digitalClockItem ?? Pn, Oe = ns({
     elementType: de,
     externalSlotProps: f?.digitalClockItem,
     ownerState: Z,
     className: ye.item
   }), De = yt({
     value: Q,
-    referenceDate: S,
+    referenceDate: x,
     adapter: s,
     props: l,
     timezone: ne
-  }), te = Qe((x) => ae(x, "finish", "hours")), {
+  }), te = Qe((S) => ae(S, "finish", "hours")), {
     setValueAndGoToNextView: Me
   } = Qo({
     view: $,
@@ -2755,37 +2755,37 @@ const bo = Fe("MuiDigitalClock", ["root", "list", "item"]), Sn = ["ampm", "timeS
     onChange: te,
     focusedView: F,
     onFocusedViewChange: H
-  }), he = Qe((x) => {
-    Me(x, "finish");
+  }), he = Qe((S) => {
+    Me(S, "finish");
   });
   Zo(() => {
     if (r.current === null)
       return;
-    const x = r.current.querySelector('[role="listbox"] [role="option"][tabindex="0"], [role="listbox"] [role="option"][aria-selected="true"]');
-    if (!x)
+    const S = r.current.querySelector('[role="listbox"] [role="option"][tabindex="0"], [role="listbox"] [role="option"][aria-selected="true"]');
+    if (!S)
       return;
-    const D = x.offsetTop;
-    (b || F) && x.focus(), r.current.scrollTop = D - 4;
+    const D = S.offsetTop;
+    (b || F) && S.focus(), r.current.scrollTop = D - 4;
   });
-  const Ie = c.useCallback((x) => {
-    const D = To(M, s), T = () => !(j && D(j, x) || K && D(x, K) || X && D(x, W) || k && D(W, x)), L = () => s.getMinutes(x) % N !== 0 ? !1 : E ? !E(x, "hours") : !0;
+  const Ie = c.useCallback((S) => {
+    const D = To(M, s), T = () => !(j && D(j, S) || K && D(S, K) || X && D(S, W) || k && D(W, S)), L = () => s.getMinutes(S) % N !== 0 ? !1 : E ? !E(S, "hours") : !0;
     return !T() || !L();
   }, [M, s, j, K, X, W, k, N, E]), ge = c.useMemo(() => {
-    const x = [];
+    const S = [];
     let T = s.startOfDay(De);
     for (; s.isSameDay(De, T); )
-      x.push(T), T = s.addMinutes(T, p);
-    return x;
-  }, [De, p, s]), J = ge.findIndex((x) => s.isEqual(x, De)), ce = (x) => {
-    switch (x.key) {
+      S.push(T), T = s.addMinutes(T, p);
+    return S;
+  }, [De, p, s]), J = ge.findIndex((S) => s.isEqual(S, De)), ce = (S) => {
+    switch (S.key) {
       case "PageUp": {
         const D = Ze(i.current) - 5, T = i.current.children, L = Math.max(0, D), oe = T[L];
-        oe && oe.focus(), x.preventDefault();
+        oe && oe.focus(), S.preventDefault();
         break;
       }
       case "PageDown": {
         const D = Ze(i.current) + 5, T = i.current.children, L = Math.min(T.length - 1, D), oe = T[L];
-        oe && oe.focus(), x.preventDefault();
+        oe && oe.focus(), S.preventDefault();
         break;
       }
     }
@@ -2801,31 +2801,31 @@ const bo = Fe("MuiDigitalClock", ["root", "list", "item"]), Sn = ["ampm", "timeS
       "aria-label": ie.timePickerToolbarTitle,
       className: ye.list,
       onKeyDown: ce,
-      children: ge.map((x, D) => {
-        const T = Ie(x);
+      children: ge.map((S, D) => {
+        const T = Ie(S);
         if (be && T)
           return null;
-        const L = s.isEqual(x, Q), oe = s.format(x, u ? "fullTime12h" : "fullTime24h"), xe = J === D || J === -1 && D === 0 ? 0 : -1;
+        const L = s.isEqual(S, Q), oe = s.format(S, u ? "fullTime12h" : "fullTime24h"), Se = J === D || J === -1 && D === 0 ? 0 : -1;
         return /* @__PURE__ */ d.jsx(de, y({
-          onClick: () => !ee && he(x),
+          onClick: () => !ee && he(S),
           selected: L,
           disabled: _ || T,
           disableRipple: ee,
           role: "option",
           "aria-disabled": ee,
           "aria-selected": L,
-          tabIndex: xe,
-          itemValue: x,
+          tabIndex: Se,
+          itemValue: S,
           formattedValue: oe
         }, Oe, {
           children: oe
-        }), `${x.valueOf()}-${oe}`);
+        }), `${S.valueOf()}-${oe}`);
       })
     })
   }));
 });
-process.env.NODE_ENV !== "production" && (So.displayName = "DigitalClock");
-process.env.NODE_ENV !== "production" && (So.propTypes = {
+process.env.NODE_ENV !== "production" && (xo.displayName = "DigitalClock");
+process.env.NODE_ENV !== "production" && (xo.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |
@@ -3072,14 +3072,14 @@ const go = Fe("MuiMultiSectionDigitalClockSection", ["root", "item"]), In = ["au
     readOnly: f,
     items: v,
     active: P,
-    slots: S,
+    slots: x,
     slotProps: M,
     skipDisabled: K
   } = i, j = pe(i, In), {
     ownerState: X
   } = oo(), k = y({}, X, {
     hasDigitalClockAlreadyBeenRendered: !!s.current
-  }), N = Vn(b), E = S?.digitalClockSectionItem ?? Rn;
+  }), N = Vn(b), E = x?.digitalClockSectionItem ?? Rn;
   Zo(() => {
     if (s.current === null)
       return;
@@ -3146,19 +3146,19 @@ const Nn = ({
   valueOrReferenceDate: l
 }) => {
   const u = t ? n.getHours(t) : null, p = [], b = (v, P) => {
-    const S = P ?? u;
-    return S === null ? !1 : s ? v === 12 ? S === 12 || S === 0 : S === v || S - 12 === v : S === v;
+    const x = P ?? u;
+    return x === null ? !1 : s ? v === 12 ? x === 12 || x === 0 : x === v || x - 12 === v : x === v;
   }, g = (v) => b(v, n.getHours(l)), f = s ? 11 : 23;
   for (let v = 0; v <= f; v += i) {
     let P = n.format(n.setHours(o, v), s ? "hours12h" : "hours24h");
-    const S = a(parseInt(P, 10).toString());
+    const x = a(parseInt(P, 10).toString());
     P = n.formatNumber(P), p.push({
       value: v,
       label: P,
       isSelected: b,
       isDisabled: r,
       isFocused: g,
-      ariaLabel: S
+      ariaLabel: x
     });
   }
   return p;
@@ -3196,7 +3196,7 @@ const Nn = ({
   flexDirection: "row",
   width: "100%",
   borderBottom: `1px solid ${(o.vars || o).palette.divider}`
-})), xo = /* @__PURE__ */ c.forwardRef(function(t, n) {
+})), So = /* @__PURE__ */ c.forwardRef(function(t, n) {
   const s = ve(), r = yo(), a = fe({
     props: t,
     name: "MuiMultiSectionDigitalClock"
@@ -3210,7 +3210,7 @@ const Nn = ({
     defaultValue: f,
     referenceDate: v,
     disableIgnoringDatePartForTimeValidation: P = !1,
-    maxTime: S,
+    maxTime: x,
     minTime: M,
     disableFuture: K,
     disablePast: j,
@@ -3269,10 +3269,10 @@ const Nn = ({
     meridiemMode: te,
     handleMeridiemChange: Me
   } = Ko(W, i, De, "finish"), he = c.useCallback((D, T) => {
-    const L = To(P, s), oe = T === "hours" || T === "minutes" && Z.includes("seconds"), Se = ({
+    const L = To(P, s), oe = T === "hours" || T === "minutes" && Z.includes("seconds"), xe = ({
       start: Y,
       end: se
-    }) => !(M && L(M, se) || S && L(Y, S) || K && L(Y, ne) || j && L(ne, oe ? se : Y)), xe = (Y, se = 1) => {
+    }) => !(M && L(M, se) || x && L(Y, x) || K && L(Y, ne) || j && L(ne, oe ? se : Y)), Se = (Y, se = 1) => {
       if (Y % se !== 0)
         return !1;
       if (k)
@@ -3294,29 +3294,29 @@ const Nn = ({
         if (s.getHours(se) !== Y)
           return !0;
         const Ce = s.setSeconds(s.setMinutes(se, 0), 0), io = s.setSeconds(s.setMinutes(se, 59), 59);
-        return !Se({
+        return !xe({
           start: Ce,
           end: io
-        }) || !xe(Y);
+        }) || !Se(Y);
       }
       case "minutes": {
         const Y = s.setMinutes(W, D), se = s.setSeconds(Y, 0), Ce = s.setSeconds(Y, 59);
-        return !Se({
+        return !xe({
           start: se,
           end: Ce
-        }) || !xe(D, X);
+        }) || !Se(D, X);
       }
       case "seconds": {
         const Y = s.setSeconds(W, D);
-        return !Se({
+        return !xe({
           start: Y,
           end: Y
-        }) || !xe(D);
+        }) || !Se(D);
       }
       default:
         throw new Error("not supported");
     }
-  }, [i, W, P, S, te, M, X, k, s, K, j, ne, Z]), Ie = c.useCallback((D) => {
+  }, [i, W, P, x, te, M, X, k, s, K, j, ne, Z]), Ie = c.useCallback((D) => {
     switch (D) {
       case "hours":
         return {
@@ -3396,10 +3396,10 @@ const Nn = ({
     [T]: Ie(T)
   }), {}), [Z, Ie]), {
     ownerState: ce
-  } = oo(), x = En(R);
+  } = oo(), S = En(R);
   return /* @__PURE__ */ d.jsx(Bn, y({
     ref: n,
-    className: q(x.root, H),
+    className: q(S.root, H),
     ownerState: ce,
     role: "group"
   }, be, {
@@ -3417,8 +3417,8 @@ const Nn = ({
     }, D))
   }));
 });
-process.env.NODE_ENV !== "production" && (xo.displayName = "MultiSectionDigitalClock");
-process.env.NODE_ENV !== "production" && (xo.propTypes = {
+process.env.NODE_ENV !== "production" && (So.displayName = "MultiSectionDigitalClock");
+process.env.NODE_ENV !== "production" && (So.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |
@@ -3602,7 +3602,7 @@ const Co = ({
   disablePast: f,
   minTime: v,
   maxTime: P,
-  shouldDisableTime: S,
+  shouldDisableTime: x,
   minutesStep: M,
   ampm: K,
   slots: j,
@@ -3615,7 +3615,7 @@ const Co = ({
   timeSteps: w,
   skipDisabled: C,
   timezone: F
-}) => /* @__PURE__ */ d.jsx(So, {
+}) => /* @__PURE__ */ d.jsx(xo, {
   view: o,
   onViewChange: t,
   focusedView: n && Ge(n) ? n : null,
@@ -3631,7 +3631,7 @@ const Co = ({
   disablePast: f,
   minTime: v,
   maxTime: P,
-  shouldDisableTime: S,
+  shouldDisableTime: x,
   minutesStep: M,
   ampm: K,
   slots: j,
@@ -3662,7 +3662,7 @@ const $e = ({
   disablePast: f,
   minTime: v,
   maxTime: P,
-  shouldDisableTime: S,
+  shouldDisableTime: x,
   minutesStep: M,
   ampm: K,
   slots: j,
@@ -3675,7 +3675,7 @@ const $e = ({
   timeSteps: w,
   skipDisabled: C,
   timezone: F
-}) => /* @__PURE__ */ d.jsx(xo, {
+}) => /* @__PURE__ */ d.jsx(So, {
   view: o,
   onViewChange: t,
   focusedView: n && je(n) ? n : null,
@@ -3691,7 +3691,7 @@ const $e = ({
   disablePast: f,
   minTime: v,
   maxTime: P,
-  shouldDisableTime: S,
+  shouldDisableTime: x,
   minutesStep: M,
   ampm: K,
   slots: j,
@@ -5151,6 +5151,10 @@ const _n = ({
         // Allow user to override slots if needed
       },
       slotProps: {
+        openPickerButton: {
+          edge: "end",
+          sx: { my: -1 }
+        },
         popper: {
           sx: {
             "& .MuiPaper-root": {

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
-  "version": "1.0.201",
+  "version": "1.0.202",
   "description": "advanced ui kit for solostylist",
   "type": "module",
   "main": "dist/main.js",