@konstructio/ui 0.1.2-alpha.101 → 0.1.2-alpha.104

package/dist/components/DateRangePicker/components/CalendarPanel/components/CalendarMonth/CalendarMonth.js

@@ -1,8 +1,8 @@
 import { t as n } from "../../../../../../utils-Cx-WzRZF.js";
-import { t as c } from "../../../../../../DayPicker-CwO8Zff5.js";
+import { t as c } from "../../../../../../DayPicker-kweJz134.js";
 import { getMonthName as d } from "../../../../utils/validation.js";
 import { calendarMonthTitleVariants as f } from "../../CalendarPanel.variants.js";
-import { s as h } from "../../../../../../constants-DXrF9vV4.js";
+import { s as h } from "../../../../../../constants-CxJJRVK3.js";
 import { useMemo as p } from "react";
 import { jsx as r, jsxs as M } from "react/jsx-runtime";
 var y = (e) => `${d(e.getMonth())} ${e.getFullYear()}`, N = ({ month: e, range: a, onRangeSelect: i, disabled: o, disabledMatcher: s, showOutsideDays: m, classNames: t }) => {

package/dist/components/DateRangePicker/components/CalendarPanel/components/IndependentModeCalendar/IndependentModeCalendar.js

@@ -1,34 +1,33 @@
 import { t as a } from "../../../../../../utils-Cx-WzRZF.js";
-import { t as X } from "../../../../../../react-CvUtBTMg.js";
-import { CalendarDivider as Y } from "../CalendarDivider/CalendarDivider.js";
-import { calendarGridContainerVariants as Z, calendarPanelVariants as O } from "../../CalendarPanel.variants.js";
-import "../../../../../../constants-DXrF9vV4.js";
+import { t as Q } from "../../../../../../react-CvUtBTMg.js";
+import { CalendarDivider as U } from "../CalendarDivider/CalendarDivider.js";
+import { calendarGridContainerVariants as X, calendarPanelVariants as Y } from "../../CalendarPanel.variants.js";
+import "../../../../../../constants-CxJJRVK3.js";
 import { CalendarMonth as s } from "../CalendarMonth/CalendarMonth.js";
-import { useIndependentCarousel as tt } from "../../hooks/useIndependentCarousel.js";
+import { useIndependentCarousel as Z } from "../../hooks/useIndependentCarousel.js";
 import { NavigationButton as c } from "../NavigationButton/NavigationButton.js";
-import { useCallback as nt, useMemo as N } from "react";
-import { jsx as n, jsxs as d } from "react/jsx-runtime";
-var et = ({ className: k, calendarWidth: b = 550, ariaLabelCalendar: x = "Date range picker calendar", ariaLabelPrevMonthStart: T = "Previous month for start date", ariaLabelNextMonthStart: B = "Next month for start date", ariaLabelPrevMonthEnd: R = "Previous month for end date", ariaLabelNextMonthEnd: w = "Next month for end date", classNames: t, range: i, onRangeSelect: v, disabled: e, disabledMatcher: r, showOutsideDays: o, hideDisabledNavigation: h, canLeftNavigatePrev: z, canLeftNavigateNext: A, canRightNavigatePrev: L, canRightNavigateNext: I, navigateLeftPrev: S, navigateLeftNext: D, navigateRightPrev: M, navigateRightNext: P, carouselProps: f }) => {
-  const { calendarHeight: y, enableLeftTransition: W, enableRightTransition: H, isLeftAnimating: p, isRightAnimating: u, leftAnimateTransform: j, leftCarouselRef: G, leftInternalMonth: V, leftNextMonth: _, leftPrevMonth: $, rightAnimateTransform: E, rightCarouselRef: q, rightInternalMonth: F, rightNextMonth: J, rightPrevMonth: K, getLeftTransform: Q, getRightTransform: U } = tt(f), l = nt((g) => {
-    g && v({
+import { jsx as n, jsxs as h } from "react/jsx-runtime";
+var O = ({ className: u, calendarWidth: C = 550, ariaLabelCalendar: N = "Date range picker calendar", ariaLabelPrevMonthStart: k = "Previous month for start date", ariaLabelNextMonthStart: b = "Next month for start date", ariaLabelPrevMonthEnd: x = "Previous month for end date", ariaLabelNextMonthEnd: R = "Next month for end date", classNames: t, range: i, onRangeSelect: T, disabled: e, disabledMatcher: r, showOutsideDays: o, hideDisabledNavigation: d, canLeftNavigatePrev: B, canLeftNavigateNext: w, canRightNavigatePrev: z, canRightNavigateNext: A, navigateLeftPrev: L, navigateLeftNext: S, navigateRightPrev: I, navigateRightNext: D, carouselProps: f }) => {
+  const { calendarHeight: M, enableLeftTransition: W, enableRightTransition: P, isLeftAnimating: v, isRightAnimating: p, leftAnimateTransform: y, leftCarouselRef: H, leftInternalMonth: j, leftNextMonth: G, leftPrevMonth: V, rightAnimateTransform: _, rightCarouselRef: $, rightInternalMonth: E, rightNextMonth: q, rightPrevMonth: F, getLeftTransform: J, getRightTransform: K } = Z(f), l = (g) => {
+    g && T({
       from: g.from,
       to: g.to
     });
-  }, [v]), C = N(() => t?.dayPicker, [t?.dayPicker]), m = N(() => ({
+  }, m = {
     monthTitle: t?.monthTitle,
-    dayPicker: C
-  }), [t?.monthTitle, C]);
+    dayPicker: t?.dayPicker
+  };
   return /* @__PURE__ */ n("div", {
-    className: a(O({ className: k }), t?.root),
-    children: /* @__PURE__ */ d("div", {
-      className: a(Z(), "relative", t?.gridContainer),
-      style: { width: b },
-      children: [/* @__PURE__ */ n(Y, { className: t?.divider }), /* @__PURE__ */ d(X.div, {
+    className: a(Y({ className: u }), t?.root),
+    children: /* @__PURE__ */ h("div", {
+      className: a(X(), "relative", t?.gridContainer),
+      style: { width: C },
+      children: [/* @__PURE__ */ n(U, { className: t?.divider }), /* @__PURE__ */ h(Q.div, {
         className: "flex gap-8",
         role: "application",
-        "aria-label": x,
+        "aria-label": N,
         initial: !1,
-        animate: { height: y },
+        animate: { height: M },
         transition: {
           duration: f.animationDuration / 1e3,
           ease: [
@@ -38,46 +37,46 @@ var et = ({ className: k, calendarWidth: b = 550, ariaLabelCalendar: x = "Date r
             1
           ]
         },
-        children: [/* @__PURE__ */ d("div", {
+        children: [/* @__PURE__ */ h("div", {
           style: { width: 259 },
           className: "relative overflow-hidden",
           children: [
             /* @__PURE__ */ n(c, {
               direction: "prev",
-              onClick: S,
+              onClick: L,
               disabled: e,
-              isAnimating: p,
-              canNavigate: z,
-              hideWhenDisabled: h,
+              isAnimating: v,
+              canNavigate: B,
+              hideWhenDisabled: d,
               className: a("absolute left-0 top-0 z-10 p-1", "bg-white dark:bg-metal-800", t?.navButton),
               disabledClassName: t?.navButtonDisabled,
-              ariaLabel: T,
+              ariaLabel: k,
               size: "small"
             }),
             /* @__PURE__ */ n(c, {
               direction: "next",
-              onClick: D,
+              onClick: S,
               disabled: e,
-              isAnimating: p,
-              canNavigate: A,
-              hideWhenDisabled: h,
+              isAnimating: v,
+              canNavigate: w,
+              hideWhenDisabled: d,
               className: a("absolute right-0 top-0 z-10 p-1", "bg-white dark:bg-metal-800", t?.navButton),
               disabledClassName: t?.navButtonDisabled,
-              ariaLabel: B,
+              ariaLabel: b,
               size: "small"
             }),
-            /* @__PURE__ */ d("div", {
-              ref: G,
-              className: a("flex", W && j && "konstruct-drp-carousel-transition"),
+            /* @__PURE__ */ h("div", {
+              ref: H,
+              className: a("flex", W && y && "konstruct-drp-carousel-transition"),
               style: {
                 "--konstruct-drp-animation-duration": `${f.animationDuration}ms`,
                 width: 3 * 259,
-                transform: Q(),
+                transform: J(),
                 willChange: "transform"
               },
               children: [
                 /* @__PURE__ */ n(s, {
-                  month: $,
+                  month: V,
                   range: i,
                   onRangeSelect: l,
                   disabled: e,
@@ -86,7 +85,7 @@ var et = ({ className: k, calendarWidth: b = 550, ariaLabelCalendar: x = "Date r
                   classNames: m
                 }),
                 /* @__PURE__ */ n(s, {
-                  month: V,
+                  month: j,
                   range: i,
                   onRangeSelect: l,
                   disabled: e,
@@ -95,7 +94,7 @@ var et = ({ className: k, calendarWidth: b = 550, ariaLabelCalendar: x = "Date r
                   classNames: m
                 }),
                 /* @__PURE__ */ n(s, {
-                  month: _,
+                  month: G,
                   range: i,
                   onRangeSelect: l,
                   disabled: e,
@@ -106,46 +105,46 @@ var et = ({ className: k, calendarWidth: b = 550, ariaLabelCalendar: x = "Date r
               ]
             })
           ]
-        }), /* @__PURE__ */ d("div", {
+        }), /* @__PURE__ */ h("div", {
           style: { width: 259 },
           className: "relative overflow-hidden",
           children: [
             /* @__PURE__ */ n(c, {
               direction: "prev",
-              onClick: M,
+              onClick: I,
               disabled: e,
-              isAnimating: u,
-              canNavigate: L,
-              hideWhenDisabled: h,
+              isAnimating: p,
+              canNavigate: z,
+              hideWhenDisabled: d,
               className: a("absolute left-0 top-0 z-10 p-1", "bg-white dark:bg-metal-800", t?.navButton),
               disabledClassName: t?.navButtonDisabled,
-              ariaLabel: R,
+              ariaLabel: x,
               size: "small"
             }),
             /* @__PURE__ */ n(c, {
               direction: "next",
-              onClick: P,
+              onClick: D,
               disabled: e,
-              isAnimating: u,
-              canNavigate: I,
-              hideWhenDisabled: h,
+              isAnimating: p,
+              canNavigate: A,
+              hideWhenDisabled: d,
               className: a("absolute right-0 top-0 z-10 p-1", "bg-white dark:bg-metal-800", t?.navButton),
               disabledClassName: t?.navButtonDisabled,
-              ariaLabel: w,
+              ariaLabel: R,
               size: "small"
             }),
-            /* @__PURE__ */ d("div", {
-              ref: q,
-              className: a("flex", H && E && "konstruct-drp-carousel-transition"),
+            /* @__PURE__ */ h("div", {
+              ref: $,
+              className: a("flex", P && _ && "konstruct-drp-carousel-transition"),
               style: {
                 "--konstruct-drp-animation-duration": `${f.animationDuration}ms`,
                 width: 3 * 259,
-                transform: U(),
+                transform: K(),
                 willChange: "transform"
               },
               children: [
                 /* @__PURE__ */ n(s, {
-                  month: K,
+                  month: F,
                   range: i,
                   onRangeSelect: l,
                   disabled: e,
@@ -154,7 +153,7 @@ var et = ({ className: k, calendarWidth: b = 550, ariaLabelCalendar: x = "Date r
                   classNames: m
                 }),
                 /* @__PURE__ */ n(s, {
-                  month: F,
+                  month: E,
                   range: i,
                   onRangeSelect: l,
                   disabled: e,
@@ -163,7 +162,7 @@ var et = ({ className: k, calendarWidth: b = 550, ariaLabelCalendar: x = "Date r
                   classNames: m
                 }),
                 /* @__PURE__ */ n(s, {
-                  month: J,
+                  month: q,
                   range: i,
                   onRangeSelect: l,
                   disabled: e,
@@ -179,7 +178,7 @@ var et = ({ className: k, calendarWidth: b = 550, ariaLabelCalendar: x = "Date r
     })
   });
 };
-et.displayName = "IndependentModeCalendar";
+O.displayName = "IndependentModeCalendar";
 export {
-  et as IndependentModeCalendar
+  O as IndependentModeCalendar
 };

package/dist/components/DateRangePicker/components/CalendarPanel/components/TogetherModeCalendar/TogetherModeCalendar.js

@@ -1,57 +1,56 @@
-import { t as r } from "../../../../../../utils-Cx-WzRZF.js";
-import { t as W } from "../../../../../../react-CvUtBTMg.js";
-import { CalendarDivider as z } from "../CalendarDivider/CalendarDivider.js";
-import { calendarGridContainerVariants as L, calendarPanelVariants as V } from "../../CalendarPanel.variants.js";
-import { CalendarMonth as A } from "../CalendarMonth/CalendarMonth.js";
-import { useTogetherCarousel as F } from "../../hooks/useTogetherCarousel.js";
-import { NavigationButton as m } from "../NavigationButton/NavigationButton.js";
-import { useCallback as G, useMemo as H } from "react";
-import { jsx as e, jsxs as R } from "react/jsx-runtime";
-var S = ({ className: s, calendarWidth: h = 550, ariaLabelCalendar: c = "Date range picker calendar", ariaLabelPrevMonth: f = "Previous month", ariaLabelNextMonth: u = "Next month", classNames: a, range: p, onRangeSelect: o, disabled: i, disabledMatcher: v, showOutsideDays: g, hideDisabledNavigation: l, canNavigatePrev: C, canNavigateNext: b, carouselProps: n }) => {
-  const { carouselRef: k, isAnimating: d, enableTransition: T, animateTransform: y, calendarHeight: x, carouselTotalWidth: D, monthsToRender: M, handlePrevMonth: N, handleNextMonth: B, getTransform: P } = F(n), w = G((t) => {
-    t && o({
+import { t as n } from "../../../../../../utils-Cx-WzRZF.js";
+import { t as P } from "../../../../../../react-CvUtBTMg.js";
+import { CalendarDivider as W } from "../CalendarDivider/CalendarDivider.js";
+import { calendarGridContainerVariants as z, calendarPanelVariants as L } from "../../CalendarPanel.variants.js";
+import { CalendarMonth as R } from "../CalendarMonth/CalendarMonth.js";
+import { useTogetherCarousel as S } from "../../hooks/useTogetherCarousel.js";
+import { NavigationButton as d } from "../NavigationButton/NavigationButton.js";
+import { jsx as e, jsxs as V } from "react/jsx-runtime";
+var A = ({ className: m, calendarWidth: h = 550, ariaLabelCalendar: s = "Date range picker calendar", ariaLabelPrevMonth: c = "Previous month", ariaLabelNextMonth: f = "Next month", classNames: a, range: u, onRangeSelect: p, disabled: i, disabledMatcher: v, showOutsideDays: g, hideDisabledNavigation: o, canNavigatePrev: C, canNavigateNext: T, carouselProps: r }) => {
+  const { carouselRef: b, isAnimating: l, enableTransition: k, animateTransform: x, calendarHeight: D, carouselTotalWidth: y, monthsToRender: M, handlePrevMonth: N, handleNextMonth: B, getTransform: w } = S(r), $ = (t) => {
+    t && p({
       from: t.from,
       to: t.to
     });
-  }, [o]), $ = H(() => a?.dayPicker, [a?.dayPicker]);
+  };
   return /* @__PURE__ */ e("div", {
-    className: r(V({ className: s }), a?.root),
-    children: /* @__PURE__ */ R("div", {
-      className: r(L(), "overflow-hidden relative justify-start!", a?.gridContainer),
+    className: n(L({ className: m }), a?.root),
+    children: /* @__PURE__ */ V("div", {
+      className: n(z(), "overflow-hidden relative justify-start!", a?.gridContainer),
       style: { width: h },
       children: [
-        /* @__PURE__ */ e(m, {
+        /* @__PURE__ */ e(d, {
           direction: "prev",
           onClick: N,
           disabled: i,
-          isAnimating: d,
+          isAnimating: l,
           canNavigate: C,
-          hideWhenDisabled: l,
-          className: r("absolute left-0 top-3 z-10", a?.navButton),
+          hideWhenDisabled: o,
+          className: n("absolute left-0 top-3 z-10", a?.navButton),
           disabledClassName: a?.navButtonDisabled,
-          ariaLabel: f
+          ariaLabel: c
         }),
-        /* @__PURE__ */ e(m, {
+        /* @__PURE__ */ e(d, {
           direction: "next",
           onClick: B,
           disabled: i,
-          isAnimating: d,
-          canNavigate: b,
-          hideWhenDisabled: l,
-          className: r("absolute right-0 top-3 z-10", a?.navButton),
+          isAnimating: l,
+          canNavigate: T,
+          hideWhenDisabled: o,
+          className: n("absolute right-0 top-3 z-10", a?.navButton),
           disabledClassName: a?.navButtonDisabled,
-          ariaLabel: u
+          ariaLabel: f
         }),
-        /* @__PURE__ */ e(z, { className: a?.divider }),
-        /* @__PURE__ */ e(W.div, {
-          ref: k,
-          className: r("flex gap-8", T && y && "konstruct-drp-carousel-transition"),
+        /* @__PURE__ */ e(W, { className: a?.divider }),
+        /* @__PURE__ */ e(P.div, {
+          ref: b,
+          className: n("flex gap-8", k && x && "konstruct-drp-carousel-transition"),
           role: "application",
-          "aria-label": c,
+          "aria-label": s,
           initial: !1,
-          animate: { height: x },
+          animate: { height: D },
           transition: {
-            duration: n.animationDuration / 1e3,
+            duration: r.animationDuration / 1e3,
             ease: [
               0.25,
               0.1,
@@ -60,21 +59,21 @@ var S = ({ className: s, calendarWidth: h = 550, ariaLabelCalendar: c = "Date ra
             ]
           },
           style: {
-            "--konstruct-drp-animation-duration": `${n.animationDuration}ms`,
-            width: D,
-            transform: P(),
+            "--konstruct-drp-animation-duration": `${r.animationDuration}ms`,
+            width: y,
+            transform: w(),
             willChange: "transform"
           },
-          children: M.map((t, j) => /* @__PURE__ */ e(A, {
+          children: M.map((t, j) => /* @__PURE__ */ e(R, {
             month: t,
-            range: p,
-            onRangeSelect: w,
+            range: u,
+            onRangeSelect: $,
             disabled: i,
             disabledMatcher: v,
             showOutsideDays: g,
             classNames: {
               monthTitle: a?.monthTitle,
-              dayPicker: $
+              dayPicker: a?.dayPicker
             }
           }, `${t.getFullYear()}-${t.getMonth()}-${j}`))
         })
@@ -82,7 +81,7 @@ var S = ({ className: s, calendarWidth: h = 550, ariaLabelCalendar: c = "Date ra
     })
   });
 };
-S.displayName = "TogetherModeCalendar";
+A.displayName = "TogetherModeCalendar";
 export {
-  S as TogetherModeCalendar
+  A as TogetherModeCalendar
 };

package/dist/components/DateRangePicker/components/CalendarPanel/constants/dayPickerClassNames.js

@@ -1,4 +1,4 @@
-import { s as e } from "../../../../../constants-DXrF9vV4.js";
+import { s as e } from "../../../../../constants-CxJJRVK3.js";
 export {
   e as createDayPickerClassNames
 };

package/dist/components/DateRangePicker/components/CalendarPanel/constants/index.js

@@ -1,5 +1,5 @@
 import { getMonthName as E } from "../../../utils/validation.js";
-import { a as s, i as _, n as r, o as T, r as e, s as o, t } from "../../../../../constants-DXrF9vV4.js";
+import { a as s, i as _, n as r, o as T, r as e, s as o, t } from "../../../../../constants-CxJJRVK3.js";
 export {
   t as GAP_WIDTH,
   r as MONTH_HEADER_HEIGHT,

package/dist/components/DateRangePicker/components/CalendarPanel/hooks/index.js

@@ -1,5 +1,5 @@
 import { getMonthName as t } from "../../../utils/validation.js";
-import { a as o, i as r, n as s, o as H, r as E, s as m, t as _ } from "../../../../../constants-DXrF9vV4.js";
+import { a as o, i as r, n as s, o as H, r as E, s as m, t as _ } from "../../../../../constants-CxJJRVK3.js";
 import { calculateCalendarHeight as T, getNextMonth as i, getPrevMonth as I, getWeeksInMonth as M } from "../utils/index.js";
 import { useTogetherCarousel as N } from "./useTogetherCarousel.js";
 import { useIndependentCarousel as h } from "./useIndependentCarousel.js";

package/dist/components/DateRangePicker/components/CalendarPanel/hooks/useIndependentCarousel.js

@@ -1,8 +1,8 @@
-import { r as k } from "../../../../../constants-DXrF9vV4.js";
-import { calculateCalendarHeight as p, getNextMonth as m, getPrevMonth as h, getWeeksInMonth as w } from "../utils/index.js";
-import { useCallback as O, useEffect as g, useMemo as z, useRef as I, useState as s } from "react";
-var U = ({ displayedMonths: u, animationDuration: M, navigationMode: F }) => {
-  const [o, b] = s(u[0]), [i, x] = s(null), [r, C] = s(!1), [a, L] = s(!1), [W, S] = s(!0), T = I(null), N = I(!0), [l, E] = s(u[1]), [f, D] = s(null), [n, P] = s(!1), [c, H] = s(!1), [X, _] = s(!0), A = I(null), d = I(!0);
+import { r as w } from "../../../../../constants-CxJJRVK3.js";
+import { calculateCalendarHeight as j, getNextMonth as m, getPrevMonth as h, getWeeksInMonth as O } from "../utils/index.js";
+import { useEffect as g, useMemo as p, useRef as I, useState as i } from "react";
+var Q = ({ displayedMonths: u, animationDuration: M, navigationMode: F }) => {
+  const [f, x] = i(u[0]), [s, S] = i(null), [r, b] = i(!1), [a, L] = i(!1), [W, C] = i(!0), T = I(null), N = I(!0), [o, E] = i(u[1]), [l, D] = i(null), [n, P] = i(!1), [c, H] = i(!1), [X, _] = i(!0), A = I(null), d = I(!0);
   g(() => {
     if (F === "independent") {
       if (N.current) {
@@ -10,16 +10,16 @@ var U = ({ displayedMonths: u, animationDuration: M, navigationMode: F }) => {
         return;
       }
       if (!r) {
-        const e = o.getTime(), t = u[0].getTime();
+        const e = f.getTime(), t = u[0].getTime();
         if (e !== t) {
-          const q = t - e, R = Math.round(q / k);
-          Math.abs(R) === 1 ? (x(R > 0 ? "left" : "right"), C(!0), L(!1)) : b(u[0]);
+          const q = t - e, R = Math.round(q / w);
+          Math.abs(R) === 1 ? (S(R > 0 ? "left" : "right"), b(!0), L(!1)) : x(u[0]);
         }
       }
     }
   }, [
     u,
-    o,
+    f,
     r,
     F
   ]), g(() => {
@@ -29,41 +29,41 @@ var U = ({ displayedMonths: u, animationDuration: M, navigationMode: F }) => {
         return;
       }
       if (!n) {
-        const e = l.getTime(), t = u[1].getTime();
+        const e = o.getTime(), t = u[1].getTime();
         if (e !== t) {
-          const q = t - e, R = Math.round(q / k);
+          const q = t - e, R = Math.round(q / w);
           Math.abs(R) === 1 ? (D(R > 0 ? "left" : "right"), P(!0), H(!1)) : E(u[1]);
         }
       }
     }
   }, [
     u,
-    l,
+    o,
     n,
     F
   ]), g(() => {
-    r && !a && i && (T.current && T.current.offsetHeight, requestAnimationFrame(() => {
+    r && !a && s && (T.current && T.current.offsetHeight, requestAnimationFrame(() => {
       L(!0);
     }));
   }, [
     r,
     a,
-    i
+    s
   ]), g(() => {
-    n && !c && f && (A.current && A.current.offsetHeight, requestAnimationFrame(() => {
+    n && !c && l && (A.current && A.current.offsetHeight, requestAnimationFrame(() => {
       H(!0);
     }));
   }, [
     n,
     c,
-    f
+    l
   ]), g(() => {
     if (r && a) {
       const e = setTimeout(() => {
-        S(!1), requestAnimationFrame(() => {
-          T.current && T.current.offsetHeight, b((t) => i === "left" ? m(t) : h(t)), C(!1), x(null), L(!1), requestAnimationFrame(() => {
+        C(!1), requestAnimationFrame(() => {
+          T.current && T.current.offsetHeight, x((t) => s === "left" ? m(t) : h(t)), b(!1), S(null), L(!1), requestAnimationFrame(() => {
             requestAnimationFrame(() => {
-              S(!0);
+              C(!0);
             });
           });
         });
@@ -74,12 +74,12 @@ var U = ({ displayedMonths: u, animationDuration: M, navigationMode: F }) => {
     r,
     a,
     M,
-    i
+    s
   ]), g(() => {
     if (n && c) {
       const e = setTimeout(() => {
         _(!1), requestAnimationFrame(() => {
-          A.current && A.current.offsetHeight, E((t) => f === "left" ? m(t) : h(t)), P(!1), D(null), H(!1), requestAnimationFrame(() => {
+          A.current && A.current.offsetHeight, E((t) => l === "left" ? m(t) : h(t)), P(!1), D(null), H(!1), requestAnimationFrame(() => {
             requestAnimationFrame(() => {
               _(!0);
             });
@@ -92,53 +92,45 @@ var U = ({ displayedMonths: u, animationDuration: M, navigationMode: F }) => {
     n,
     c,
     M,
-    f
+    l
   ]);
-  const $ = z(() => {
-    let e = o, t = l;
-    return r && i === "left" ? e = m(o) : r && i === "right" && (e = h(o)), n && f === "left" ? t = m(l) : n && f === "right" && (t = h(l)), p(Math.max(w(e), w(t)));
+  const $ = p(() => {
+    let e = f, t = o;
+    return r && s === "left" ? e = m(f) : r && s === "right" && (e = h(f)), n && l === "left" ? t = m(o) : n && l === "right" && (t = h(o)), j(Math.max(O(e), O(t)));
   }, [
+    f,
     o,
-    l,
     r,
     n,
-    i,
-    f
-  ]), G = O(() => {
+    s,
+    l
+  ]), k = () => {
     let e = -259;
-    return r && a && (i === "left" ? e = -2 * 259 : i === "right" && (e = 0)), `translateX(${e}px)`;
-  }, [
-    r,
-    a,
-    i
-  ]), j = O(() => {
+    return r && a && (s === "left" ? e = -2 * 259 : s === "right" && (e = 0)), `translateX(${e}px)`;
+  }, G = () => {
     let e = -259;
-    return n && c && (f === "left" ? e = -2 * 259 : f === "right" && (e = 0)), `translateX(${e}px)`;
-  }, [
-    n,
-    c,
-    f
-  ]);
+    return n && c && (l === "left" ? e = -2 * 259 : l === "right" && (e = 0)), `translateX(${e}px)`;
+  };
   return {
-    leftInternalMonth: o,
-    leftPrevMonth: h(o),
-    leftNextMonth: m(o),
+    leftInternalMonth: f,
+    leftPrevMonth: h(f),
+    leftNextMonth: m(f),
     leftCarouselRef: T,
     isLeftAnimating: r,
     enableLeftTransition: W,
     leftAnimateTransform: a,
-    getLeftTransform: G,
-    rightInternalMonth: l,
-    rightPrevMonth: h(l),
-    rightNextMonth: m(l),
+    getLeftTransform: k,
+    rightInternalMonth: o,
+    rightPrevMonth: h(o),
+    rightNextMonth: m(o),
     rightCarouselRef: A,
     isRightAnimating: n,
     enableRightTransition: X,
     rightAnimateTransform: c,
-    getRightTransform: j,
+    getRightTransform: G,
     calendarHeight: $
   };
 };
 export {
-  U as useIndependentCarousel
+  Q as useIndependentCarousel
 };