asheeui 0.6.12 → 0.6.13

package/dist/components/autocomplete/Autocomplete.js

@@ -58,7 +58,7 @@ const me = se(
     re(() => {
       i ? u(i.label) : s != null && u(String(s));
     }, [i, s]);
-    const { refs: x, floatingStyles: q, context: d, isPositioned: H } = fe({
+    const { refs: x, context: d, isPositioned: q, floatingStyles: H } = fe({
       isOpen: S,
       onOpenChange: m,
       disabled: O
@@ -112,11 +112,11 @@ const me = se(
         ce,
         {
           isOpen: S,
+          floatingStyles: H,
           context: d,
-          floatingStyles: q,
           getFloatingProps: Y,
           setFloatingRef: x.setFloating,
-          isPositioned: H,
+          isPositioned: q,
           options: Z,
           selectedValues: h,
           onSelectMenuOption: k,

package/dist/components/date-picker/Calendar.d.ts

@@ -51,7 +51,12 @@ interface CalendarProps {
 }
 /**
  * Calendar popover component with month navigation and date selection.
+ *
+ * Memoized so parent-driven renders (the DatePicker popover's one-time
+ * `isPositioned` flip, input typing, open/close) do not rebuild the month
+ * grid. Every prop is a primitive or a stable callback, so React.memo can
+ * skip those renders.
  */
-export declare function Calendar({ selected, mode, isClearable, resolvedSizeKey, resolvedColor, radiusClass, onSelect, onClose, disableFuture, }: CalendarProps): import("react").JSX.Element;
+export declare const Calendar: import('react').NamedExoticComponent<CalendarProps>;
 export {};
 //# sourceMappingURL=Calendar.d.ts.map

package/dist/components/date-picker/Calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/Calendar.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAKH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE1D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AASvD,UAAU,aAAa;IACrB;;;OAGG;IACH,QAAQ,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAClC;;;OAGG;IACH,IAAI,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,WAAW,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,eAAe,EAAE,YAAY,CAAC;IAC9B;;;OAGG;IACH,aAAa,EAAE,KAAK,CAAC;IACrB;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACtC;;;OAGG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,eAAe,EACf,aAAa,EACb,WAAW,EACX,QAAQ,EACR,OAAO,EACP,aAAqB,GACtB,EAAE,aAAa,+BAgQf"}
+{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/Calendar.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAKH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE1D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AASvD,UAAU,aAAa;IACrB;;;OAGG;IACH,QAAQ,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAClC;;;OAGG;IACH,IAAI,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,WAAW,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,eAAe,EAAE,YAAY,CAAC;IAC9B;;;OAGG;IACH,aAAa,EAAE,KAAK,CAAC;IACrB;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACtC;;;OAGG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,QAAQ,qDA0QnB,CAAC"}

package/dist/components/date-picker/Calendar.js

@@ -1,26 +1,26 @@
 "use client";
 import { jsxs as c, jsx as o } from "react/jsx-runtime";
-import { useState as f, useMemo as q } from "react";
-import { ChevronLeftIcon as B } from "../../icons/ChevronLeftIcon.js";
-import { ChevronRightIcon as J } from "../../icons/ChevronRightIcon.js";
-import { buildDayCells as Q, MONTHS as U, DAYS_OF_WEEK as X } from "./date-picker.helpers.js";
-import { CALENDAR_COLOR_CLASSES as L, DATE_PICKER_CELL_SIZE_CLASS as tt } from "./date-picker-styles.js";
+import { memo as q, useState as f, useMemo as B } from "react";
+import { ChevronLeftIcon as J } from "../../icons/ChevronLeftIcon.js";
+import { ChevronRightIcon as Q } from "../../icons/ChevronRightIcon.js";
+import { buildDayCells as U, MONTHS as X, DAYS_OF_WEEK as tt } from "./date-picker.helpers.js";
+import { CALENDAR_COLOR_CLASSES as L, DATE_PICKER_CELL_SIZE_CLASS as nt } from "./date-picker-styles.js";
 import { TimeSpinner as y } from "./TimeSpinner.js";
 import { cn as u } from "../../utils/cn.js";
-function ut({
+const mt = q(function({
   selected: n,
   mode: s,
   isClearable: C,
   resolvedSizeKey: j,
   resolvedColor: h,
-  radiusClass: a,
+  radiusClass: i,
   onSelect: v,
   onClose: w,
   disableFuture: Y = !1
 }) {
   const r = /* @__PURE__ */ new Date(), [l, k] = f(
     (n == null ? void 0 : n.getFullYear()) ?? r.getFullYear()
-  ), [i, g] = f(
+  ), [a, g] = f(
     (n == null ? void 0 : n.getMonth()) ?? r.getMonth()
   ), [b, A] = f((n == null ? void 0 : n.getHours()) ?? 0), [p, H] = f((n == null ? void 0 : n.getMinutes()) ?? 0), [x, T] = f((n == null ? void 0 : n.getSeconds()) ?? 0), m = L[h] ?? L.primary;
   function M(t, e, Z) {
@@ -39,19 +39,19 @@ function ut({
     T(t), M(b, p, t);
   }
   function K(t) {
-    v(new Date(l, i, t, b, p, x, 0)), s === "date" && w();
+    v(new Date(l, a, t, b, p, x, 0)), s === "date" && w();
   }
   function P() {
-    i === 0 ? (g(11), k((t) => t - 1)) : g((t) => t - 1);
+    a === 0 ? (g(11), k((t) => t - 1)) : g((t) => t - 1);
   }
   function V() {
-    i === 11 ? (g(0), k((t) => t + 1)) : g((t) => t + 1);
+    a === 11 ? (g(0), k((t) => t + 1)) : g((t) => t + 1);
   }
   function d(t) {
-    return !!n && n.getFullYear() === l && n.getMonth() === i && n.getDate() === t;
+    return !!n && n.getFullYear() === l && n.getMonth() === a && n.getDate() === t;
   }
   function N(t) {
-    return r.getFullYear() === l && r.getMonth() === i && r.getDate() === t;
+    return r.getFullYear() === l && r.getMonth() === a && r.getDate() === t;
   }
   const $ = new Date(
     r.getFullYear(),
@@ -59,9 +59,9 @@ function ut({
     r.getDate()
   );
   function D(t) {
-    return Y ? new Date(l, i, t) > $ : !1;
+    return Y ? new Date(l, a, t) > $ : !1;
   }
-  const F = !Y || l < r.getFullYear() || l === r.getFullYear() && i < r.getMonth(), E = s === "date" || s === "datetime", z = s === "time" || s === "datetime", G = s !== "date" || C && !!n, _ = Q(l, i), W = q(() => _.map((t, e) => ({
+  const F = !Y || l < r.getFullYear() || l === r.getFullYear() && a < r.getMonth(), E = s === "date" || s === "datetime", z = s === "time" || s === "datetime", G = s !== "date" || C && !!n, _ = U(l, a), W = B(() => _.map((t, e) => ({
     key: t !== null ? `day-${t}` : `empty-slot-${e}`,
     day: t
   })), [_]);
@@ -70,7 +70,7 @@ function ut({
     {
       className: u(
         "bg-background border border-border/70 shadow-xl select-none p-4 w-max",
-        a
+        i
       ),
       children: [
         /* @__PURE__ */ c("div", { className: "flex flex-row", children: [
@@ -85,13 +85,13 @@ function ut({
                   className: u(
                     "p-1.5 text-foreground/70 transition-all active:scale-95",
                     "hover:text-foreground hover:bg-secondary",
-                    a
+                    i
                   ),
-                  children: /* @__PURE__ */ o(B, {})
+                  children: /* @__PURE__ */ o(J, {})
                 }
               ),
               /* @__PURE__ */ c("span", { className: "font-semibold text-sm text-foreground tracking-wide", children: [
-                U[i],
+                X[a],
                 " ",
                 l
               ] }),
@@ -105,14 +105,14 @@ function ut({
                   className: u(
                     "p-1.5 text-foreground/70 transition-all",
                     F ? "hover:text-foreground hover:bg-secondary active:scale-95" : "opacity-30 cursor-not-allowed",
-                    a
+                    i
                   ),
-                  children: /* @__PURE__ */ o(J, {})
+                  children: /* @__PURE__ */ o(Q, {})
                 }
               )
             ] }),
             /* @__PURE__ */ c("div", { className: "grid grid-cols-7 gap-1 text-center", children: [
-              X.map((t) => /* @__PURE__ */ o(
+              tt.map((t) => /* @__PURE__ */ o(
                 "div",
                 {
                   className: "text-[11px] font-bold tracking-wider text-foreground/50 uppercase py-1 mb-1",
@@ -129,8 +129,8 @@ function ut({
                     disabled: D(e),
                     className: u(
                       "w-full flex items-center justify-center font-medium transition-all duration-200",
-                      tt[j],
-                      a,
+                      nt[j],
+                      i,
                       D(e) ? "opacity-30 cursor-not-allowed text-foreground/50" : "active:scale-90",
                       !D(e) && !d(e) && !N(e) && m.hover,
                       d(e) && u(m.bg, "font-semibold shadow-sm"),
@@ -160,7 +160,7 @@ function ut({
                     label: "HH",
                     onChange: I,
                     resolvedColor: h,
-                    radiusClass: a
+                    radiusClass: i
                   }
                 ),
                 /* @__PURE__ */ o(
@@ -171,7 +171,7 @@ function ut({
                     label: "MM",
                     onChange: O,
                     resolvedColor: h,
-                    radiusClass: a
+                    radiusClass: i
                   }
                 ),
                 /* @__PURE__ */ o(
@@ -182,7 +182,7 @@ function ut({
                     label: "SS",
                     onChange: R,
                     resolvedColor: h,
-                    radiusClass: a
+                    radiusClass: i
                   }
                 )
               ]
@@ -208,7 +208,7 @@ function ut({
               onClick: w,
               className: u(
                 "ml-auto text-xs font-semibold px-4 py-2 transition-all hover:opacity-90 active:scale-95 shadow-sm",
-                a,
+                i,
                 m.bg
               ),
               children: "Done"
@@ -218,7 +218,7 @@ function ut({
       ]
     }
   );
-}
+});
 export {
-  ut as Calendar
+  mt as Calendar
 };

package/dist/components/date-picker/DatePicker.d.ts

@@ -78,7 +78,7 @@ export interface DatePickerProps extends BaseDatePickerProps {
  * @param props.radius - Corner rounding. Defaults to "md".
  * @param props.color - Theme accent color. Defaults to "primary".
  * @param props.disabled - Whether the input is disabled. Defaults to false.
- * @param props.picker - Picker configuration overrides including className, portal, and portalTarget.
+ * @param props.picker - Picker configuration overrides including className, portal, portalTarget, and lockScroll.
  * @param props.label - Field label text.
  * @param props.description - Description text.
  * @param props.message - Validation message.

package/dist/components/date-picker/DatePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/DatePicker.tsx"],"names":[],"mappings":"AAqCA,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,gBAAgB,CAAC;AASxD,OAAO,EACL,KAAK,gBAAgB,EAErB,KAAK,YAAY,EAElB,MAAM,sBAAsB,CAAC;AAE9B;;;GAGG;AACH,MAAM,WAAW,UAAW,SAAQ,YAAY;IAC9C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID;;;GAGG;AACH,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,gBAAgB,EAAE,QAAQ,CAAC,GAChE,IAAI,CACF,UAAU,EACV,UAAU,GAAG,OAAO,GAAG,cAAc,GAAG,YAAY,GAAG,cAAc,CACtE,CAAC;AAEJ;;;;GAIG;AACH,MAAM,WAAW,eAAgB,SAAQ,mBAAmB;IAC1D;;;OAGG;IACH,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAEvB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IAEvC;;;OAGG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AACH,eAAO,MAAM,UAAU,8GAwTtB,CAAC"}
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/DatePicker.tsx"],"names":[],"mappings":"AA8BA,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,gBAAgB,CAAC;AASxD,OAAO,EACL,KAAK,gBAAgB,EAErB,KAAK,YAAY,EAElB,MAAM,sBAAsB,CAAC;AAE9B;;;GAGG;AACH,MAAM,WAAW,UAAW,SAAQ,YAAY;IAC9C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID;;;GAGG;AACH,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,gBAAgB,EAAE,QAAQ,CAAC,GAChE,IAAI,CACF,UAAU,EACV,UAAU,GAAG,OAAO,GAAG,cAAc,GAAG,YAAY,GAAG,cAAc,CACtE,CAAC;AAEJ;;;;GAIG;AACH,MAAM,WAAW,eAAgB,SAAQ,mBAAmB;IAC1D;;;OAGG;IACH,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAEvB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IAEvC;;;OAGG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AACH,eAAO,MAAM,UAAU,8GA8VtB,CAAC"}

package/dist/components/date-picker/DatePicker.js

@@ -1,210 +1,221 @@
 "use client";
-import { jsx as r, jsxs as h, Fragment as me } from "react/jsx-runtime";
-import { useClick as fe, useDismiss as pe, useRole as ve, useInteractions as ye, FloatingFocusManager as Ie, FloatingPortal as Pe } from "@floating-ui/react";
-import { forwardRef as Re, useId as Se, useState as M, useRef as Fe, useEffect as Ne, useCallback as d } from "react";
-import { CalendarIcon as xe } from "../../icons/CalendarIcon.js";
-import { ClearIcon as Ae } from "../../icons/ClearIcon.js";
-import { ClockIcon as De } from "../../icons/ClockIcon.js";
-import { useAsheeConfig as Ke } from "../../libs/context.js";
-import { resolveCascade as m, resolveRadiusKey as we, resolveClassKey as Ee } from "../../utils/resolve-token.js";
-import { Input as _e } from "../input/Input.js";
-import { Calendar as Le } from "./Calendar.js";
-import { formatDisplay as I, parseDateString as Te, getNewCursorPosition as ze, getDefaultPlaceholder as Oe } from "./date-picker.helpers.js";
-import { FALLBACK_DATE_PICKER_CONFIG as f } from "./date-picker-config.js";
-import { RADIUS_CLASS as be } from "../../shared/radius.js";
-import { useSelectFloating as ge } from "../select-menu/use-select-floating.js";
-import { cn as he } from "../../utils/cn.js";
-import { FALLBACK_SELECT_MENU_CONFIG as Me } from "../select-menu/select-menu-config.js";
-const Ve = Re(
+import { jsx as r, jsxs as B, Fragment as fo } from "react/jsx-runtime";
+import { FloatingFocusManager as yo, FloatingPortal as po } from "@floating-ui/react";
+import { forwardRef as vo, useId as bo, useState as G, useRef as So, useEffect as U, useCallback as f } from "react";
+import { CalendarIcon as wo } from "../../icons/CalendarIcon.js";
+import { ClearIcon as Io } from "../../icons/ClearIcon.js";
+import { ClockIcon as Po } from "../../icons/ClockIcon.js";
+import { useAsheeConfig as Ro } from "../../libs/context.js";
+import { resolveCascade as c, resolveRadiusKey as Fo, resolveClassKey as xo } from "../../utils/resolve-token.js";
+import { Input as go } from "../input/Input.js";
+import { Calendar as No } from "./Calendar.js";
+import { formatDisplay as b, parseDateString as ho, getNewCursorPosition as Ao, getDefaultPlaceholder as Do } from "./date-picker.helpers.js";
+import { FALLBACK_DATE_PICKER_CONFIG as y } from "./date-picker-config.js";
+import { RADIUS_CLASS as Lo } from "../../shared/radius.js";
+import { useSelectFloating as To } from "../select-menu/use-select-floating.js";
+import { cn as Ko } from "../../utils/cn.js";
+import { FALLBACK_SELECT_MENU_CONFIG as _o } from "../select-menu/select-menu-config.js";
+const Eo = vo(
   ({
-    selected: l,
-    onChange: t,
-    mode: V,
-    isClearable: x = !1,
-    disableFuture: j = !1,
-    placeholder: B,
-    size: A,
-    radius: P,
-    color: D,
-    disabled: u,
-    picker: a,
-    ...K
-  }, c) => {
-    var L, T, z;
-    const R = Ke(), e = (L = R.components) == null ? void 0 : L.datePicker, G = Se(), U = K.id ?? G, [p, v] = M(!1), [S, n] = M(""), w = Fe(null), s = m(
-      V,
-      e == null ? void 0 : e.mode,
+    selected: n,
+    onChange: e,
+    mode: W,
+    isClearable: N = !1,
+    disableFuture: Y = !1,
+    placeholder: q,
+    size: h,
+    radius: S,
+    color: A,
+    disabled: w,
+    picker: l,
+    ...D
+  }, u) => {
+    var E, O, z, M;
+    const I = Ro(), o = (E = I.components) == null ? void 0 : E.datePicker, $ = bo(), H = D.id ?? $, [i, p] = G(!1), [P, a] = G(""), L = So(null), s = c(
+      W,
+      o == null ? void 0 : o.mode,
       void 0,
-      f.mode
-    ), W = m(
-      a == null ? void 0 : a.portal,
-      (T = e == null ? void 0 : e.picker) == null ? void 0 : T.portal,
+      y.mode
+    ), J = c(
+      l == null ? void 0 : l.portal,
+      (O = o == null ? void 0 : o.picker) == null ? void 0 : O.portal,
       void 0,
-      Me.portal
-    ), q = m(
-      a == null ? void 0 : a.portalTarget,
-      (z = e == null ? void 0 : e.picker) == null ? void 0 : z.portalTarget,
+      _o.portal
+    ), Q = c(
+      l == null ? void 0 : l.portalTarget,
+      (z = o == null ? void 0 : o.picker) == null ? void 0 : z.portalTarget,
       void 0,
       null
-    ), H = m(
-      A,
-      e == null ? void 0 : e.size,
+    ), T = c(
+      l == null ? void 0 : l.lockScroll,
+      (M = o == null ? void 0 : o.picker) == null ? void 0 : M.lockScroll,
+      void 0,
+      !0
+    ), X = c(
+      h,
+      o == null ? void 0 : o.size,
       void 0,
-      f.size
-    ), J = m(
-      D,
-      e == null ? void 0 : e.color,
-      R.defaultColor,
-      f.color
-    ), E = we(
-      typeof P == "string" ? P : void 0,
-      typeof (e == null ? void 0 : e.radius) == "string" ? e.radius : void 0,
-      R.defaultRadius,
-      f.radius
-    ), Q = Ee(
-      E === "full" ? "xl" : E,
-      be,
-      f.radius
-    ), { refs: F, floatingStyles: X, context: y, isPositioned: Y } = ge({
-      isOpen: p,
-      onOpenChange: v,
-      disabled: u,
-      matchReferenceWidth: !1
+      y.size
+    ), Z = c(
+      A,
+      o == null ? void 0 : o.color,
+      I.defaultColor,
+      y.color
+    ), K = Fo(
+      typeof S == "string" ? S : void 0,
+      typeof (o == null ? void 0 : o.radius) == "string" ? o.radius : void 0,
+      I.defaultRadius,
+      y.radius
+    ), C = xo(
+      K === "full" ? "xl" : K,
+      Lo,
+      y.radius
+    ), {
+      refs: R,
+      context: k,
+      floatingStyles: oo,
+      isPositioned: to,
+      getReferenceProps: eo,
+      getFloatingProps: lo
+    } = To({
+      isOpen: i,
+      onOpenChange: p,
+      disabled: w,
+      matchReferenceWidth: !1,
       // Allow calendar to size naturally side-by-side
-    }), Z = fe(y, { enabled: !u }), $ = pe(y, {
-      enabled: !u,
-      outsidePress: !0,
-      outsidePressEvent: "mousedown",
-      escapeKey: !0
-    }), C = ve(y, { role: "dialog" }), { getReferenceProps: k, getFloatingProps: ee } = ye([
-      Z,
-      $,
-      C
-    ]);
-    Ne(() => {
-      n(l ? I(l, s) : "");
-    }, [l, s]);
-    const te = d(
-      (o) => {
-        t == null || t(o), n(o ? I(o, s) : ""), (s === "date" || o === null) && v(!1);
+      role: "dialog"
+    });
+    U(() => {
+      if (!i || !T) return;
+      const t = window.scrollY, d = document.body.style.position, F = document.body.style.top, x = document.body.style.left, g = document.body.style.right, v = document.body.style.width, m = document.body.style.overflow;
+      return document.body.style.position = "fixed", document.body.style.top = `-${t}px`, document.body.style.left = "0", document.body.style.right = "0", document.body.style.width = "100%", document.body.style.overflow = "hidden", () => {
+        document.body.style.position = d, document.body.style.top = F, document.body.style.left = x, document.body.style.right = g, document.body.style.width = v, document.body.style.overflow = m, window.scrollTo(0, t);
+      };
+    }, [i, T]), U(() => {
+      a(n ? b(n, s) : "");
+    }, [n, s]);
+    const so = f(
+      (t) => {
+        e == null || e(t), a(t ? b(t, s) : ""), (s === "date" || t === null) && p(!1);
       },
-      [t, s]
-    ), oe = d(() => v(!1), []), se = d(
-      (o) => {
-        var i;
-        o.stopPropagation(), t == null || t(null), n(""), v(!1), (i = w.current) == null || i.focus();
+      [e, s]
+    ), ro = f(() => p(!1), []), no = f(
+      (t) => {
+        var d;
+        t.stopPropagation(), e == null || e(null), a(""), p(!1), (d = L.current) == null || d.focus();
       },
-      [t]
-    ), re = d(
-      (o) => {
-        const i = o.target, ue = i.value, ce = S, de = i.selectionStart ?? 0, O = ue.replace(/\D/g, "");
-        if (O.length === 0) {
-          n(""), t == null || t(null);
+      [e]
+    ), ao = f(
+      (t) => {
+        const d = t.target, F = d.value, x = P, g = d.selectionStart ?? 0, v = F.replace(/\D/g, "");
+        if (v.length === 0) {
+          a(""), e == null || e(null);
           return;
         }
-        const N = Te(
-          O,
+        const m = ho(
+          v,
           s,
-          l ?? void 0
+          n ?? void 0
         );
-        if (N) {
-          t == null || t(N);
-          const b = I(N, s);
-          n(b);
-          const g = ze(
-            ce,
-            b,
-            de
+        if (m) {
+          e == null || e(m);
+          const V = b(m, s);
+          a(V);
+          const j = Ao(
+            x,
+            V,
+            g
           );
           requestAnimationFrame(() => {
-            i.setSelectionRange(g, g);
+            d.setSelectionRange(j, j);
           });
         } else
-          n(l ? I(l, s) : "");
+          a(n ? b(n, s) : "");
       },
-      [s, l, t, S]
-    ), le = B ?? Oe(s), ae = /* @__PURE__ */ h(me, { children: [
-      x && l && !u && /* @__PURE__ */ r(
+      [s, n, e, P]
+    ), io = q ?? Do(s), co = /* @__PURE__ */ B(fo, { children: [
+      N && n && !w && /* @__PURE__ */ r(
         "button",
         {
           type: "button",
-          onClick: se,
+          onClick: no,
           "aria-label": "Clear selection",
           className: "p-0.5 rounded text-foreground/70 hover:text-foreground transition-colors",
-          children: /* @__PURE__ */ r(Ae, { className: "size-3.5" })
+          children: /* @__PURE__ */ r(Io, { className: "size-3.5" })
         }
       ),
-      /* @__PURE__ */ r("span", { className: "text-foreground/70 pointer-events-none", children: s === "time" ? /* @__PURE__ */ r(De, {}) : /* @__PURE__ */ r(xe, {}) })
-    ] }), _ = p ? /* @__PURE__ */ r(
-      Ie,
+      /* @__PURE__ */ r("span", { className: "text-foreground/70 pointer-events-none", children: s === "time" ? /* @__PURE__ */ r(Po, {}) : /* @__PURE__ */ r(wo, {}) })
+    ] }), _ = i ? /* @__PURE__ */ r(
+      yo,
       {
-        context: y,
+        context: k,
         modal: !1,
         initialFocus: -1,
         returnFocus: !1,
         children: /* @__PURE__ */ r(
           "div",
           {
-            ref: F.setFloating,
-            style: {
-              ...X,
-              width: "max-content",
-              minWidth: "fit-content"
-            },
-            className: he(
-              "z-100 outline-none",
-              Y ? "animate-in fade-in-0 zoom-in-95 duration-150 ease-out" : "invisible opacity-0 pointer-events-none",
-              a == null ? void 0 : a.className
+            ref: R.setFloating,
+            style: { ...oo },
+            className: Ko(
+              "z-100 outline-none w-max",
+              // Disable transitions on the floating node. Floating UI applies
+              // position via `transform` on every scroll tick, and any inherited
+              // transform transition would ease toward each new position instead
+              // of snapping, producing a spring/bounce effect.
+              "transition-none",
+              to ? "animate-in fade-in-0 zoom-in-95 duration-150 ease-out" : "invisible opacity-0 pointer-events-none",
+              l == null ? void 0 : l.className
             ),
-            ...ee(),
+            ...lo(),
             children: /* @__PURE__ */ r(
-              Le,
+              No,
               {
-                selected: l,
+                selected: n,
                 mode: s,
-                isClearable: x,
-                resolvedSizeKey: H,
-                onSelect: te,
-                onClose: oe,
-                disableFuture: j,
-                resolvedColor: J,
-                radiusClass: Q
+                isClearable: N,
+                resolvedSizeKey: X,
+                onSelect: so,
+                onClose: ro,
+                disableFuture: Y,
+                resolvedColor: Z,
+                radiusClass: C
               }
             )
           }
         )
       }
-    ) : null, ne = q ?? (typeof document < "u" ? document.body : null), ie = d(
-      (o) => {
-        o && (F.setReference(o), w.current = o, typeof c == "function" ? c(o) : c && (c.current = o));
+    ) : null, uo = Q ?? (typeof document < "u" ? document.body : null), mo = f(
+      (t) => {
+        t && (R.setReference(t), L.current = t, typeof u == "function" ? u(t) : u && (u.current = t));
       },
-      [F, c]
+      [R, u]
     );
-    return /* @__PURE__ */ h("div", { className: "w-full relative inline-block", children: [
+    return /* @__PURE__ */ B("div", { className: "w-full relative inline-block", children: [
       /* @__PURE__ */ r(
-        _e,
+        go,
         {
-          ...K,
-          ref: ie,
-          id: U,
-          size: A,
-          radius: P,
-          color: D,
-          placeholder: le,
-          value: S,
-          onChange: re,
-          endContent: ae,
-          disabled: u,
-          "aria-expanded": p,
+          ...D,
+          ref: mo,
+          id: H,
+          size: h,
+          radius: S,
+          color: A,
+          placeholder: io,
+          value: P,
+          onChange: ao,
+          endContent: co,
+          disabled: w,
+          "aria-expanded": i,
           "aria-haspopup": "dialog",
-          ...k()
+          ...eo()
         }
       ),
-      p && (W ? /* @__PURE__ */ r(Pe, { root: ne, children: _ }) : _)
+      i && (J ? /* @__PURE__ */ r(po, { root: uo, children: _ }) : _)
     ] });
   }
 );
-Ve.displayName = "DatePicker";
+Eo.displayName = "DatePicker";
 export {
-  Ve as DatePicker
+  Eo as DatePicker
 };

package/dist/components/date-picker/date-picker-config.d.ts

@@ -38,13 +38,15 @@ export interface DatePickerConfig extends InputConfig {
  */
 export interface PickerConfig {
     /**
-     * Whether to render the calendar popover in a React portal.
+     * Whether to render the calendar popover through Floating UI's
+     * `FloatingPortal`.
      * When true, the popover is rendered at the document body level,
      * escaping any parent DOM hierarchy. This prevents CSS containment
      * and stacking context issues. Defaults to true because popovers
      * should always appear above other content.
      *
      * @default true
+     * @see FloatingPortal - https://floating-ui.com/docs/FloatingPortal
      */
     portal?: boolean;
     /**
@@ -53,6 +55,15 @@ export interface PickerConfig {
      * Defaults to document.body.
      */
     portalTarget?: HTMLElement | null;
+    /**
+     * Whether to lock page scroll while the calendar popover is open.
+     * When true, the page behind the popover cannot scroll. Uses
+     * scroll-position-compensated `position: fixed` on `<body>` so locking
+     * does not jump the page back to the top.
+     *
+     * @default true
+     */
+    lockScroll?: boolean;
 }
 /**
  * Default config values registered for the DatePicker component.