@new-black/lyra 1.0.29 → 1.0.31

package/dist/lyra25.js

@@ -1,171 +1,183 @@
 import { j as e } from "./lyra90.js";
-import { useContext as v, useCallback as N, useRef as T } from "react";
-import { useContextProps as Y, DateRangePickerContext as O, DateRangePicker as q, Group as B, RangeCalendar as K, RangeCalendarStateContext as _, Button as C, CalendarGrid as F, DateRangePickerStateContext as z, DateInput as S, DateSegment as k, CalendarGridBody as A, CalendarCell as J } from "./lyra89.js";
-import { fixedForwardRef as L } from "./lyra93.js";
-import { useDictionary as Q } from "./lyra95.js";
-import { Popover as U } from "./lyra53.js";
+import { useMemo as R, useContext as T, useCallback as D, useRef as _ } from "react";
+import { useContextProps as z, DateRangePickerContext as A, DateRangePicker as J, Group as Y, RangeCalendar as Q, RangeCalendarStateContext as U, Button as C, CalendarGrid as S, DateRangePickerStateContext as W, DateInput as v, DateSegment as I, CalendarGridBody as X, CalendarCell as Z } from "./lyra89.js";
+import { fixedForwardRef as H } from "./lyra93.js";
+import { useDictionary as L } from "./lyra95.js";
+import { Popover as ee } from "./lyra53.js";
 import "./lyra54.js";
 import "./lyra55.js";
 import "./lyra56.js";
-import { Separator as R } from "./lyra57.js";
+import { Separator as M } from "./lyra57.js";
 import "./lyra58.js";
 import { SvgIcon as P } from "./lyra65.js";
-import { Tooltip as X } from "./lyra75.js";
-import { InputHeader as Z } from "./lyra38.js";
-import { InputFooter as W } from "./lyra39.js";
-import { sharedInputStyles as V } from "./lyra40.js";
-import { datePickerHeaderStyles as ee, dateFieldStyles as se, dataPickerCalendarGridStyles as te } from "./lyra24.js";
-import { MonthPicker as M, YearPicker as E, DatePickerCalendarGridHeader as G } from "./lyra610.js";
-const ae = ({
+import { Tooltip as se } from "./lyra75.js";
+import { InputHeader as te } from "./lyra38.js";
+import { InputFooter as ae } from "./lyra39.js";
+import { sharedInputStyles as O } from "./lyra40.js";
+import { shouldRenderInputHeader as q, shouldRenderInputFooter as ne } from "./lyra610.js";
+import { datePickerHeaderStyles as re, dateFieldStyles as oe, dataPickerCalendarGridStyles as de } from "./lyra24.js";
+import { MonthPicker as G, YearPicker as E, DatePickerCalendarGridHeader as B } from "./lyra611.js";
+const ce = ({
   className: h,
-  description: l,
-  errorMessage: n,
-  fullWidth: i = !0,
+  description: m,
+  errorMessage: d,
+  fullWidth: c = !0,
   granularity: f = "day",
-  hideHintLabel: o,
+  hideHintLabel: a,
   hideInputFooter: s,
   hideInputHeader: p,
-  label: y,
-  startSlot: j,
-  ...m
-}, u) => {
-  [m, u] = Y(m, u, O);
-  const { isInvalid: g, isRequired: t } = m, { wrapper: a } = V({
-    fullWidth: i,
-    hasStartSlot: !!j,
-    hasEndSlot: !0
+  label: l,
+  outerEndSlot: j,
+  outerStartSlot: y,
+  startSlot: g,
+  ...$
+}, t) => {
+  [$, t] = z($, t, A);
+  const { isInvalid: r, isRequired: x } = $, w = R(
+    () => q({ hideHintLabel: a, hideInputHeader: p, label: l }),
+    [a, p, l]
+  ), { outerSlot: b, outerSlotsWrapper: F, wrapper: k } = O({
+    fullWidth: c,
+    hasStartSlot: !!g,
+    hasEndSlot: !0,
+    hasInputHeader: w,
+    hasLabel: !!l
   });
-  return /* @__PURE__ */ e.jsx(
-    q,
-    {
-      ...m,
-      granularity: f,
-      className: (c) => a({
-        className: h,
-        isDisabled: c.isDisabled
-      }),
-      isInvalid: g,
-      ref: u,
-      children: ({ isDisabled: c, state: $ }) => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-        /* @__PURE__ */ e.jsx(B, { children: /* @__PURE__ */ e.jsx(
-          oe,
-          {
-            description: l,
-            fullWidth: i,
-            errorMessage: n,
-            hideHintLabel: o,
-            hideInputFooter: s,
-            hideInputHeader: p,
-            isDisabled: c,
-            isRequired: t,
-            label: y,
-            startSlot: j,
-            onKeyDown: (D) => {
-              var r, b;
-              D.key === "Escape" && ((r = $.value) != null && r.end) && ((b = $.value) != null && b.start) && !c && (D.preventDefault(), $.setValue(null));
+  return /* @__PURE__ */ e.jsxs("div", { className: F(), children: [
+    y ? /* @__PURE__ */ e.jsx("div", { className: b(), children: y }) : null,
+    /* @__PURE__ */ e.jsx(
+      J,
+      {
+        ...$,
+        granularity: f,
+        className: (n) => k({
+          className: h,
+          isDisabled: n.isDisabled
+        }),
+        isInvalid: r,
+        ref: t,
+        children: ({ isDisabled: n, state: u }) => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+          /* @__PURE__ */ e.jsx(Y, { children: /* @__PURE__ */ e.jsx(
+            me,
+            {
+              description: m,
+              fullWidth: c,
+              errorMessage: d,
+              hideHintLabel: a,
+              hideInputFooter: s,
+              hideInputHeader: p,
+              isDisabled: n,
+              isRequired: x,
+              label: l,
+              startSlot: g,
+              onKeyDown: (o) => {
+                var i, N;
+                o.key === "Escape" && ((i = u.value) != null && i.end) && ((N = u.value) != null && N.start) && !n && (o.preventDefault(), u.setValue(null));
+              }
             }
-          }
-        ) }),
-        /* @__PURE__ */ e.jsx(U, { disablePadding: !0, className: "group", children: /* @__PURE__ */ e.jsx(K, { visibleDuration: { months: 2 }, pageBehavior: "single", children: /* @__PURE__ */ e.jsx(re, {}) }) })
-      ] })
-    }
-  );
-}, re = () => {
-  const { buttons: h } = ee(), {
-    anchorDate: l,
-    focusedDate: n,
-    focusNextPage: i,
+          ) }),
+          /* @__PURE__ */ e.jsx(ee, { disablePadding: !0, className: "group", children: /* @__PURE__ */ e.jsx(Q, { visibleDuration: { months: 2 }, pageBehavior: "single", children: /* @__PURE__ */ e.jsx(le, {}) }) })
+        ] })
+      }
+    ),
+    j ? /* @__PURE__ */ e.jsx("div", { className: b(), children: j }) : null
+  ] });
+}, le = () => {
+  const { buttons: h } = re(), {
+    anchorDate: m,
+    focusedDate: d,
+    focusNextPage: c,
     focusPreviousPage: f,
-    setFocusedDate: o,
+    setFocusedDate: a,
     visibleRange: s
-  } = v(_), p = (t) => t === 12 ? 1 : t + 1, y = (t) => t === 1 ? 12 : t - 1, j = N(
+  } = T(U), p = (t) => t === 12 ? 1 : t + 1, l = (t) => t === 1 ? 12 : t - 1, j = D(
     (t) => {
       if (t === s.start.month - 1)
         f();
       else if (t === s.start.month + 1)
-        i();
+        c();
       else {
-        const a = t < s.start.month ? p(t) : t, c = s.start.copy().set({
-          month: a,
-          day: n.day
+        const r = t < s.start.month ? p(t) : t, x = s.start.copy().set({
+          month: r,
+          day: d.day
         });
-        o(c);
+        a(x);
       }
     },
-    [i, f, n.day, o, s.start]
-  ), m = N(
+    [c, f, d.day, a, s.start]
+  ), y = D(
     (t) => {
       if (s.start.year !== s.end.year) {
         if (t < s.start.year) {
-          const a = s.start.copy().set({
+          const r = s.start.copy().set({
             year: t + 1,
-            day: n.day,
+            day: d.day,
             month: 1
           });
-          o(a);
+          a(r);
         }
         if (t > s.start.year) {
-          const a = s.start.copy().set({
+          const r = s.start.copy().set({
             year: t,
-            day: n.day,
+            day: d.day,
             month: 12
           });
-          o(a);
+          a(r);
         }
       } else {
-        const a = t < s.start.year ? p(s.start.month) : s.start.month, c = s.start.copy().set({
+        const r = t < s.start.year ? p(s.start.month) : s.start.month, x = s.start.copy().set({
           year: t,
-          day: n.day,
-          month: a
+          day: d.day,
+          month: r
         });
-        o(c);
+        a(x);
       }
     },
-    [n.day, o, s.end.year, s.start]
-  ), u = N(
+    [d.day, a, s.end.year, s.start]
+  ), g = D(
     (t) => {
       if (t === s.end.month - 1)
         f();
       else if (t === s.end.month + 1)
-        i();
+        c();
       else {
-        const a = t > s.end.month ? y(t) : t, c = s.end.copy().set({
-          month: a,
-          day: n.day
+        const r = t > s.end.month ? l(t) : t, x = s.end.copy().set({
+          month: r,
+          day: d.day
         });
-        o(c);
+        a(x);
       }
     },
-    [i, f, n.day, o, s.end]
-  ), g = N(
+    [c, f, d.day, a, s.end]
+  ), $ = D(
     (t) => {
       if (s.start.year !== s.end.year) {
         if (t < s.end.year) {
-          const a = s.end.copy().set({
+          const r = s.end.copy().set({
             year: t,
-            day: n.day,
+            day: d.day,
             month: 1
           });
-          o(a);
+          a(r);
         }
         if (t > s.end.year) {
-          const a = s.end.copy().set({
+          const r = s.end.copy().set({
             year: t - 1,
-            day: n.day,
+            day: d.day,
             month: 12
           });
-          o(a);
+          a(r);
         }
       } else {
-        const a = t > s.end.year ? y(s.end.month) : s.end.month, c = s.end.copy().set({
+        const r = t > s.end.year ? l(s.end.month) : s.end.month, x = s.end.copy().set({
           year: t,
-          day: n.day,
-          month: a
+          day: d.day,
+          month: r
         });
-        o(c);
+        a(x);
       }
     },
-    [n.day, o, s.end, s.start.year]
+    [d.day, a, s.end, s.start.year]
   );
   return /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-3 p-3 sm:flex-row", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-3", children: [
@@ -173,10 +185,10 @@ const ae = ({
         /* @__PURE__ */ e.jsx(C, { slot: "previous", className: h(), children: /* @__PURE__ */ e.jsx(P, { name: "chevron-left" }) }),
         /* @__PURE__ */ e.jsxs("div", { className: "flex gap-1", children: [
           /* @__PURE__ */ e.jsx(
-            M,
+            G,
             {
               value: s.start.month,
-              isDisabled: !!l,
+              isDisabled: !!m,
               onChange: j
             }
           ),
@@ -184,121 +196,120 @@ const ae = ({
             E,
             {
               value: s.start.year,
-              isDisabled: !!l,
-              onChange: m
+              isDisabled: !!m,
+              onChange: y
             }
           )
         ] }),
         /* @__PURE__ */ e.jsx("div", { className: "w-6" })
       ] }),
-      /* @__PURE__ */ e.jsxs(F, { className: "w-full text-center", children: [
-        /* @__PURE__ */ e.jsx(G, {}),
-        /* @__PURE__ */ e.jsx(I, {})
+      /* @__PURE__ */ e.jsxs(S, { className: "w-full text-center", children: [
+        /* @__PURE__ */ e.jsx(B, {}),
+        /* @__PURE__ */ e.jsx(V, {})
       ] })
     ] }),
-    /* @__PURE__ */ e.jsx(R, { orientation: "vertical", className: "hidden h-[unset] self-stretch sm:block" }),
-    /* @__PURE__ */ e.jsx(R, { className: "sm:hidden" }),
+    /* @__PURE__ */ e.jsx(M, { orientation: "vertical", className: "hidden h-[unset] self-stretch sm:block" }),
+    /* @__PURE__ */ e.jsx(M, { className: "sm:hidden" }),
     /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-3", children: [
       /* @__PURE__ */ e.jsxs("div", { className: "flex justify-between gap-1", children: [
         /* @__PURE__ */ e.jsx("div", { className: "w-6" }),
         /* @__PURE__ */ e.jsxs("div", { className: "flex gap-1", children: [
           /* @__PURE__ */ e.jsx(
-            M,
+            G,
             {
               value: s.end.month,
-              isDisabled: !!l,
-              onChange: u
+              isDisabled: !!m,
+              onChange: g
             }
           ),
           /* @__PURE__ */ e.jsx(
             E,
             {
               value: s.end.year,
-              isDisabled: !!l,
-              onChange: g
+              isDisabled: !!m,
+              onChange: $
             }
           )
         ] }),
         /* @__PURE__ */ e.jsx(C, { slot: "next", className: h(), children: /* @__PURE__ */ e.jsx(P, { name: "chevron-right" }) })
       ] }),
-      /* @__PURE__ */ e.jsxs(F, { className: "w-full text-center", offset: { months: 1 }, children: [
-        /* @__PURE__ */ e.jsx(G, {}),
-        /* @__PURE__ */ e.jsx(I, {})
+      /* @__PURE__ */ e.jsxs(S, { className: "w-full text-center", offset: { months: 1 }, children: [
+        /* @__PURE__ */ e.jsx(B, {}),
+        /* @__PURE__ */ e.jsx(V, {})
       ] })
     ] })
   ] }) });
-}, ne = L(ae);
-ne.displayName = "DateRangePicker";
-const oe = ({
+}, ie = H(ce);
+ie.displayName = "DateRangePicker";
+const me = ({
   description: h,
-  errorMessage: l,
-  fullWidth: n,
-  hideHintLabel: i,
+  errorMessage: m,
+  fullWidth: d,
+  hideHintLabel: c,
   hideInputFooter: f,
-  hideInputHeader: o,
+  hideInputHeader: a,
   isDisabled: s,
   isRequired: p,
-  label: y,
+  label: l,
   onKeyDown: j,
-  startSlot: m
+  startSlot: y
 }) => {
-  const { input: u, segment: g } = se(), { button: t, buttonExcludedFromTabOrder: a, inputField: c } = V({
-    fullWidth: n,
-    hasStartSlot: !!m,
+  const g = R(
+    () => q({ hideHintLabel: c, hideInputHeader: a, label: l }),
+    [c, a, l]
+  ), $ = R(
+    () => ne({ description: h, errorMessage: m, hideInputFooter: f }),
+    [h, m, f]
+  ), { input: t, segment: r } = oe(), { button: x, buttonExcludedFromTabOrder: w, inputField: b } = O({
+    fullWidth: d,
+    hasStartSlot: !!y,
     hasEndSlot: !0
-  }), { clear: $ } = Q(), { setValue: D, value: r } = v(z), b = T(null);
+  }), { clear: F } = L(), { setValue: k, value: n } = T(W), u = _(null);
   return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    /* @__PURE__ */ e.jsx(
-      Z,
-      {
-        label: y,
-        hideHintLabel: i,
-        hideInputHeader: o,
-        isRequired: p
-      }
-    ),
+    g ? /* @__PURE__ */ e.jsx(te, { label: l, hideHintLabel: c, isRequired: p }) : null,
     /* @__PURE__ */ e.jsxs(
-      B,
+      Y,
       {
-        className: ({ isDisabled: d, isFocusWithin: x, isHovered: w, isInvalid: H }) => c({
-          isDisabled: d,
-          isFocused: x,
-          isHovered: w,
-          isInvalid: H,
+        className: ({ isDisabled: o, isFocusWithin: i, isHovered: N, isInvalid: K }) => b({
+          isDisabled: o,
+          isFocused: i,
+          isHovered: N,
+          isInvalid: K,
           className: "min-h-8"
         }),
         onKeyDown: j,
         children: [
-          /* @__PURE__ */ e.jsx(S, { className: u(), slot: "start", children: (d) => /* @__PURE__ */ e.jsx(
-            k,
+          y,
+          /* @__PURE__ */ e.jsx(v, { className: t(), slot: "start", children: (o) => /* @__PURE__ */ e.jsx(
+            I,
             {
-              className: ({ isFocused: x }) => g({
-                isFocused: x,
+              className: ({ isFocused: i }) => r({
+                isFocused: i,
                 isDisabled: s,
                 // consider literals (separators between segments) to have a value when a full date is entered
-                hasValue: d.type === "literal" ? !!(r != null && r.start) : !d.isPlaceholder
+                hasValue: o.type === "literal" ? !!(n != null && n.start) : !o.isPlaceholder
               }),
-              segment: d
+              segment: o
             }
           ) }),
           /* @__PURE__ */ e.jsx(
             "span",
             {
               "aria-hidden": "true",
-              className: r != null && r.start && r.end && !s ? "text-primary" : "text-tertiary",
+              className: n != null && n.start && n.end && !s ? "text-primary" : "text-tertiary",
               children: " – "
             }
           ),
-          /* @__PURE__ */ e.jsx(S, { className: u(), slot: "end", children: (d) => /* @__PURE__ */ e.jsx(
-            k,
+          /* @__PURE__ */ e.jsx(v, { className: t(), slot: "end", children: (o) => /* @__PURE__ */ e.jsx(
+            I,
             {
-              className: ({ isFocused: x }) => g({
-                isFocused: x,
+              className: ({ isFocused: i }) => r({
+                isFocused: i,
                 isDisabled: s,
                 // consider literals (separators between segments) to have a value when a full date is entered
-                hasValue: d.type === "literal" ? !!(r != null && r.end) : !d.isPlaceholder
+                hasValue: o.type === "literal" ? !!(n != null && n.end) : !o.isPlaceholder
               }),
-              segment: d
+              segment: o
             }
           ) }),
           /* @__PURE__ */ e.jsxs("div", { className: "ms-auto flex flex-row-reverse gap-2", children: [
@@ -306,24 +317,24 @@ const oe = ({
               C,
               {
                 isDisabled: s,
-                className: ({ isDisabled: d, isFocusVisible: x, isHovered: w }) => t({ isDisabled: d, isFocused: x, isHovered: w }),
-                ref: b,
+                className: ({ isDisabled: o, isFocusVisible: i, isHovered: N }) => x({ isDisabled: o, isFocused: i, isHovered: N }),
+                ref: u,
                 children: /* @__PURE__ */ e.jsx(P, { name: "calendar" })
               }
             ),
-            !s && (r != null && r.end) && (r != null && r.start) ? /* @__PURE__ */ e.jsx(X, { tooltip: $, children: /* @__PURE__ */ e.jsx(
+            !s && (n != null && n.end) && (n != null && n.start) ? /* @__PURE__ */ e.jsx(se, { tooltip: F, children: /* @__PURE__ */ e.jsx(
               C,
               {
                 slot: null,
-                onFocus: (d) => {
-                  var x;
-                  d.preventDefault(), (x = b == null ? void 0 : b.current) == null || x.focus();
+                onFocus: (o) => {
+                  var i;
+                  o.preventDefault(), (i = u == null ? void 0 : u.current) == null || i.focus();
                 },
                 excludeFromTabOrder: !0,
-                className: a(),
+                className: w(),
                 onPress: () => {
-                  var d;
-                  D(null), (d = b.current) == null || d.focus();
+                  var o;
+                  k(null), (o = u.current) == null || o.focus();
                 },
                 children: /* @__PURE__ */ e.jsx(P, { name: "clear" })
               }
@@ -332,45 +343,38 @@ const oe = ({
         ]
       }
     ),
-    /* @__PURE__ */ e.jsx(
-      W,
-      {
-        description: h,
-        errorMessage: l,
-        hideInputFooter: f
-      }
-    )
+    $ ? /* @__PURE__ */ e.jsx(ae, { description: h, errorMessage: m }) : null
   ] });
-}, I = () => {
-  const { rangeBodyCell: h } = te();
-  return /* @__PURE__ */ e.jsx(A, { children: (l) => /* @__PURE__ */ e.jsx(
-    J,
+}, V = () => {
+  const { rangeBodyCell: h } = de();
+  return /* @__PURE__ */ e.jsx(X, { children: (m) => /* @__PURE__ */ e.jsx(
+    Z,
     {
-      date: l,
+      date: m,
       className: ({
-        isDisabled: n,
-        isFocusVisible: i,
+        isDisabled: d,
+        isFocusVisible: c,
         isHovered: f,
-        isOutsideMonth: o,
+        isOutsideMonth: a,
         isPressed: s,
         isSelected: p,
-        isSelectionEnd: y,
+        isSelectionEnd: l,
         isSelectionStart: j,
-        isUnavailable: m
+        isUnavailable: y
       }) => h({
         isSelected: p,
         isSelectionStart: j,
-        isSelectionEnd: y,
-        isFocusVisible: i,
+        isSelectionEnd: l,
+        isFocusVisible: c,
         isHovered: f,
-        isUnavailable: m,
-        isDisabled: n,
-        isOutsideMonth: o,
+        isUnavailable: y,
+        isDisabled: d,
+        isOutsideMonth: a,
         isPressed: s
       })
     }
   ) });
 };
 export {
-  ne as DateRangePicker
+  ie as DateRangePicker
 };