@tedi-design-system/react 19.0.0-rc.9 → 19.0.0

package/src/tedi/components/form/date-field/date-field.es.js

@@ -1,93 +1,94 @@
-import { jsxs as At, Fragment as vt, jsx as D } from "react/jsx-runtime";
-import { useFloating as Ft, useClick as wt, useInteractions as Nt, useDismiss as kt, useRole as Pt, FloatingPortal as Et, FloatingFocusManager as Ot } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
+import { jsxs as vt, Fragment as Ft, jsx as D } from "react/jsx-runtime";
+import { useFloating as wt, useClick as Nt, useInteractions as kt, useDismiss as Pt, useRole as Et, FloatingPortal as Ot, FloatingFocusManager as Rt } from "../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
 import B from "../../../../../external/classnames/index.es.js";
 import F, { useState as _, useCallback as ue, useEffect as T, useMemo as me } from "react";
-import { Calendar as Rt } from "../../content/calendar/calendar.es.js";
-import { MultiValueField as It } from "../multi-value-field/multi-value-field.es.js";
-import { TextField as Vt } from "../textfield/textfield.es.js";
+import { Calendar as It } from "../../content/calendar/calendar.es.js";
+import { MultiValueField as Vt } from "../multi-value-field/multi-value-field.es.js";
+import { TextField as Bt } from "../textfield/textfield.es.js";
 import y from "./date-field.module.scss.es.js";
-import { getLocaleDateParts as Bt, buildDateRegexSource as Tt, resolveRangeSelection as $t, CALENDAR_POPOVER_OFFSET as Lt, CALENDAR_POPOVER_PADDING as je } from "./date-field-helpers.es.js";
-import { DatePickerModal as Yt } from "./date-picker-modal/date-picker-modal.es.js";
-import { useBreakpointProps as jt } from "../../../helpers/hooks/use-breakpoint-props.es.js";
-import { useLabels as Ht } from "../../../providers/label-provider/use-labels.es.js";
-import { et as Wt } from "../../../../../external/react-day-picker/dist/esm/locale/et.es.js";
-import St, { isBreakpointBelow as He } from "../../../helpers/hooks/use-breakpoint.es.js";
-import { autoUpdate as Ut } from "../../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
-import { offset as qt, flip as zt, shift as Gt, size as Xt } from "../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
-import { dateMatchModifiers as Jt } from "../../../../../external/react-day-picker/dist/esm/utils/dateMatchModifiers.es.js";
-const Kt = F.forwardRef((w, N) => {
-  const { getCurrentBreakpointProps: We } = jt(w.defaultServerBreakpoint), { getLabel: z } = Ht(), {
-    useNativePicker: Se = !1,
+import { getLocaleDateParts as Tt, buildDateRegexSource as $t, resolveRangeSelection as Lt, CALENDAR_POPOVER_OFFSET as Yt, CALENDAR_POPOVER_PADDING as He } from "./date-field-helpers.es.js";
+import { DatePickerModal as jt } from "./date-picker-modal/date-picker-modal.es.js";
+import { useBreakpointProps as Ht } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+import { useLabels as Wt } from "../../../providers/label-provider/use-labels.es.js";
+import { et as St } from "../../../../../external/react-day-picker/dist/esm/locale/et.es.js";
+import Ut, { isBreakpointBelow as We } from "../../../helpers/hooks/use-breakpoint.es.js";
+import { autoUpdate as qt } from "../../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
+import { offset as zt, flip as Gt, shift as Xt, size as Jt } from "../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
+import { dateMatchModifiers as Kt } from "../../../../../external/react-day-picker/dist/esm/utils/dateMatchModifiers.es.js";
+const Qt = F.forwardRef((w, N) => {
+  const { getCurrentBreakpointProps: Se } = Ht(w.defaultServerBreakpoint), { getLabel: z } = Wt(), {
+    useNativePicker: Ue = !1,
     enableCalendar: m = !0,
     calendarTrigger: $ = "button",
-    numberOfMonths: G
-  } = We(w), {
-    id: pe,
+    numberOfMonths: G,
+    clearable: pe = !0
+  } = Se(w), {
+    id: he,
     mode: s = "single",
-    label: he,
+    label: ge,
     selected: L,
     onSelect: a,
     disabled: k,
     disabledMatchers: P,
-    placeholder: Ue,
-    className: qe,
+    placeholder: qe,
+    className: ze,
     formatDate: d,
     required: Y,
-    showOutsideDays: ge = !0,
-    parseDate: ze,
-    monthYearSelectType: ye,
-    minYear: be,
-    maxYear: De,
-    dayStatus: _e,
-    tagsDirection: Ge,
-    showNavigation: Ce = !0,
+    showOutsideDays: ye = !0,
+    parseDate: Ge,
+    monthYearSelectType: be,
+    minYear: De,
+    maxYear: _e,
+    dayStatus: Ce,
+    tagsDirection: Xe,
+    showNavigation: Me = !0,
     selectionLevel: E = "days",
     initialView: j,
-    locale: Me = Wt,
+    locale: xe = St,
     localeCode: H = "et-EE",
     initialMonth: W,
-    closeOnSelect: Xe,
-    footer: xe,
+    closeOnSelect: Je,
+    footer: Ae,
     defaultValue: S,
     minDate: X,
     maxDate: J,
-    disablePast: Ae,
-    disableFuture: ve,
+    disablePast: ve,
+    disableFuture: Fe,
     shouldDisableMonth: K,
     shouldDisableYear: Q,
     readOnly: O,
-    availableDays: Fe,
+    availableDays: we,
     inputProps: i,
     modal: Z = !1,
-    modalProps: Je,
-    modalTitle: Ke,
-    disabledDateErrorMessage: Qe = z("dateField.disabledDateError"),
-    invalidDateErrorMessage: Ze = z("dateField.invalidDateError"),
-    useNativePicker: Qt,
-    enableCalendar: Zt,
-    calendarTrigger: er,
-    numberOfMonths: tr,
-    defaultServerBreakpoint: rr,
-    sm: ar,
-    md: ir,
-    lg: or,
-    xl: nr,
-    xxl: sr,
-    ...we
-  } = w, c = Se && s === "single", Ne = St(w.defaultServerBreakpoint), A = He(Ne, "md"), [et, p] = _(L ?? S), [h, R] = _(!1), [ee, ke] = _(!1), [tt, Pe] = _(j ?? E), [te, b] = _(""), [Ee, u] = _(!1), [Oe, re] = _(!1), g = m && !c && !O && (Z === !0 || typeof Z == "string" && He(Ne, Z)), Re = A && !g && typeof G == "number" && G > 1 ? 1 : G, { current: f } = F.useRef("selected" in w), o = f ? L : et, ae = F.useRef(null), Ie = F.useRef(null), rt = F.useCallback(
+    modalProps: Ke,
+    modalTitle: Qe,
+    disabledDateErrorMessage: Ze = z("dateField.disabledDateError"),
+    invalidDateErrorMessage: et = z("dateField.invalidDateError"),
+    useNativePicker: Zt,
+    enableCalendar: er,
+    calendarTrigger: tr,
+    numberOfMonths: rr,
+    defaultServerBreakpoint: ar,
+    sm: ir,
+    md: or,
+    lg: nr,
+    xl: sr,
+    xxl: lr,
+    ...Ne
+  } = w, c = Ue && s === "single", ke = Ut(w.defaultServerBreakpoint), A = We(ke, "md"), [tt, p] = _(L ?? S), [h, R] = _(!1), [ee, Pe] = _(!1), [rt, Ee] = _(j ?? E), [te, b] = _(""), [Oe, u] = _(!1), [Re, re] = _(!1), g = m && !c && !O && (Z === !0 || typeof Z == "string" && We(ke, Z)), Ie = A && !g && typeof G == "number" && G > 1 ? 1 : G, { current: f } = F.useRef("selected" in w), o = f ? L : tt, ae = F.useRef(null), Ve = F.useRef(null), at = F.useCallback(
     (e) => {
       ae.current = e, typeof N == "function" ? N(e) : N && (N.current = e);
     },
     [N]
-  ), at = (e) => {
+  ), it = (e) => {
     if (!e) return "";
     const t = e.getFullYear(), r = String(e.getMonth() + 1).padStart(2, "0"), n = String(e.getDate()).padStart(2, "0");
     return `${t}-${r}-${n}`;
-  }, it = c && o instanceof Date ? at(o) : "", ie = ue((e, t) => e instanceof Date ? e : Array.isArray(e) && e.length > 0 ? [...e].sort((r, n) => r.getTime() - n.getTime())[0] : e && typeof e == "object" && "from" in e && e.from instanceof Date ? e.from : e && typeof e == "object" && "to" in e && e.to instanceof Date ? e.to : t ?? /* @__PURE__ */ new Date(), []), [ot, oe] = _(() => ie(o, W));
+  }, ot = c && o instanceof Date ? it(o) : "", ie = ue((e, t) => e instanceof Date ? e : Array.isArray(e) && e.length > 0 ? [...e].sort((r, n) => r.getTime() - n.getTime())[0] : e && typeof e == "object" && "from" in e && e.from instanceof Date ? e.from : e && typeof e == "object" && "to" in e && e.to instanceof Date ? e.to : t ?? /* @__PURE__ */ new Date(), []), [nt, oe] = _(() => ie(o, W));
   T(() => {
     h || oe(ie(o, W));
   }, [o, W, h, ie]), T(() => {
-    h && Pe(j ?? E);
+    h && Ee(j ?? E);
   }, [h, E, j]), T(() => {
     f && p(L);
   }, [L, f]);
@@ -110,47 +111,47 @@ const Kt = F.forwardRef((w, N) => {
       return "";
     },
     [C]
-  ), ne = Xe ?? s === "single", Ve = s === "multiple" && Array.isArray(o) ? o.map((e, t) => ({
+  ), ne = Je ?? s === "single", Be = s === "multiple" && Array.isArray(o) ? o.map((e, t) => ({
     id: t,
     label: d ? d(e) : M(e),
     date: e
   })) : [], U = me(() => {
     const e = [];
-    return k && (Array.isArray(k) ? e.push(...k) : e.push(k)), P && (Array.isArray(P) ? e.push(...P) : e.push(P)), X && e.push({ before: X }), J && e.push({ after: J }), Ae && e.push({ before: /* @__PURE__ */ new Date() }), ve && e.push({ after: /* @__PURE__ */ new Date() }), K && e.push((t) => K(t)), Q && e.push((t) => Q(t)), e;
+    return k && (Array.isArray(k) ? e.push(...k) : e.push(k)), P && (Array.isArray(P) ? e.push(...P) : e.push(P)), X && e.push({ before: X }), J && e.push({ after: J }), ve && e.push({ before: /* @__PURE__ */ new Date() }), Fe && e.push({ after: /* @__PURE__ */ new Date() }), K && e.push((t) => K(t)), Q && e.push((t) => Q(t)), e;
   }, [
     k,
     P,
     X,
     J,
-    Ae,
     ve,
+    Fe,
     K,
     Q
   ]), v = ue(
-    (e) => Jt(e, U),
+    (e) => Kt(e, U),
     [U]
-  ), nt = (e, t, r, n) => {
-    const l = s === "range" ? $t(e, o, t) : e;
+  ), st = (e, t, r, n) => {
+    const l = s === "range" ? Lt(e, o, t) : e;
     if (u(!1), f || p(l), a == null || a(l, t, r, n), l) {
       const x = d ? d(l) : M(l);
       b(x);
     } else
       b("");
     ne && R(!1);
-  }, st = (e) => {
+  }, lt = (e) => {
     if (v(e)) return;
     const t = s === "range" ? { from: e, to: void 0 } : s === "multiple" ? [...Array.isArray(o) ? o : [], e] : e;
     u(!1), f || p(t), a == null || a(t, e, {}, {});
     const r = d ? d(t) : M(t);
     b(r), ne && R(!1);
-  }, lt = me(() => {
-    const e = Bt(C), t = new RegExp(`^${Tt(e)}$`), { fieldOrder: r } = e;
+  }, ft = me(() => {
+    const e = Tt(C), t = new RegExp(`^${$t(e)}$`), { fieldOrder: r } = e;
     return (n) => {
       const l = n.match(t);
       if (!l) return;
       const x = {};
-      r.forEach((Mt, xt) => {
-        x[Mt] = Number(l[xt + 1]);
+      r.forEach((xt, At) => {
+        x[xt] = Number(l[At + 1]);
       });
       const { day: fe, month: de, year: ce } = x;
       if (fe === void 0 || de === void 0 || ce === void 0) return;
@@ -158,14 +159,14 @@ const Kt = F.forwardRef((w, N) => {
       if (!(isNaN(V.getTime()) || V.getFullYear() !== ce || V.getMonth() !== de - 1 || V.getDate() !== fe))
         return V;
     };
-  }, [C]), Be = (e) => (ze ?? (s === "single" ? lt : () => {
-  }))(e), Te = (e) => s === "single" && e instanceof Date || s === "multiple" && Array.isArray(e) || s === "range" && !!e && !Array.isArray(e) && "from" in e, ft = (e) => {
+  }, [C]), Te = (e) => (Ge ?? (s === "single" ? ft : () => {
+  }))(e), $e = (e) => s === "single" && e instanceof Date || s === "multiple" && Array.isArray(e) || s === "range" && !!e && !Array.isArray(e) && "from" in e, dt = (e) => {
     if (b(e), re(!1), e.trim() === "") {
       u(!1), o !== void 0 && (f || p(void 0), a == null || a(void 0, void 0, {}, {}));
       return;
     }
-    const t = Be(e);
-    if (!Te(t)) {
+    const t = Te(e);
+    if (!$e(t)) {
       u(!1);
       return;
     }
@@ -175,12 +176,12 @@ const Kt = F.forwardRef((w, N) => {
       return;
     }
     u(!1), f || p(t), a == null || a(t, t, {}, {}), t instanceof Date && oe(t), ne && R(!1);
-  }, dt = () => {
+  }, ct = () => {
     if (te.trim() === "") {
       re(!1);
       return;
     }
-    re(!Te(Be(te)));
+    re(!$e(Te(te)));
   };
   T(() => {
     if (f) {
@@ -193,16 +194,16 @@ const Kt = F.forwardRef((w, N) => {
       b(e);
     }
   }, []);
-  const ct = Ft({
+  const ut = wt({
     open: h,
     onOpenChange: R,
     placement: $ === "input" ? "bottom-start" : "bottom-end",
     middleware: [
-      qt(Lt),
-      zt(),
-      Gt({ padding: je }),
-      Xt({
-        padding: je,
+      zt(Yt),
+      Gt(),
+      Xt({ padding: He }),
+      Jt({
+        padding: He,
         apply({ availableWidth: e, elements: t }) {
           const r = t.floating;
           if (r.style.width = "", r.style.maxWidth = "", r.style.overflowX = "", A) return;
@@ -210,23 +211,23 @@ const Kt = F.forwardRef((w, N) => {
         }
       })
     ],
-    whileElementsMounted: Ut
-  }), { refs: I, context: q, x: ut, y: mt, strategy: pt } = ct, ht = wt(q), $e = Nt([
-    ...m && !c && $ === "input" && !g ? [ht] : [],
-    kt(q, {
+    whileElementsMounted: qt
+  }), { refs: I, context: q, x: mt, y: pt, strategy: ht } = ut, gt = Nt(q), Le = kt([
+    ...m && !c && $ === "input" && !g ? [gt] : [],
+    Pt(q, {
       outsidePress: (e) => {
         const t = e.target;
         return !(t != null && t.closest('[role="menu"], [role="listbox"]'));
       }
     }),
-    Pt(q, { role: "dialog" })
+    Et(q, { role: "dialog" })
   ]);
   F.useEffect(() => {
     var t, r;
-    const e = s === "multiple" ? ((t = Ie.current) == null ? void 0 : t.wrapper) ?? null : ((r = ae.current) == null ? void 0 : r.input) ?? null;
+    const e = s === "multiple" ? ((t = Ve.current) == null ? void 0 : t.wrapper) ?? null : ((r = ae.current) == null ? void 0 : r.input) ?? null;
     I.setPositionReference(e ?? I.reference.current);
   }, [s, h, I]);
-  const gt = () => {
+  const yt = () => {
     var t;
     const e = (t = ae.current) == null ? void 0 : t.input;
     if (e) {
@@ -239,14 +240,14 @@ const Kt = F.forwardRef((w, N) => {
       e.focus();
     }
   }, se = () => {
-    !m || O || (c ? gt() : g ? ke(!0) : R((e) => !e));
-  }, yt = (e) => {
+    !m || O || (c ? yt() : g ? Pe(!0) : R((e) => !e));
+  }, bt = (e) => {
     if (u(!1), f || p(e), a == null || a(e, e, {}, {}), e) {
       const t = d ? d(e) : M(e);
       b(t);
     } else
       b("");
-  }, bt = (e) => {
+  }, Dt = (e) => {
     if (!e) {
       u(!1), f || p(void 0), a == null || a(void 0, void 0, {}, {});
       return;
@@ -261,44 +262,44 @@ const Kt = F.forwardRef((w, N) => {
       }
       u(!1), f || p(l), a == null || a(l, l, {}, {});
     }
-  }, Dt = $e.getReferenceProps(
+  }, _t = Le.getReferenceProps(
     g && $ === "input" ? { onClick: () => se() } : void 0
   ), {
-    role: lr,
-    "aria-expanded": fr,
-    "aria-haspopup": dr,
-    "aria-controls": _t,
-    ...Ct
-  } = Dt, Le = g ? void 0 : _t, le = z("dateField.openCalendar"), Ye = {
+    role: fr,
+    "aria-expanded": dr,
+    "aria-haspopup": cr,
+    "aria-controls": Ct,
+    ...Mt
+  } = _t, Ye = g ? void 0 : Ct, le = z("dateField.openCalendar"), je = {
     "aria-label": le,
     "aria-expanded": g ? ee : h,
     "aria-haspopup": "dialog",
-    "aria-controls": Le
+    "aria-controls": Ye
   };
-  return /* @__PURE__ */ At(vt, { children: [
+  return /* @__PURE__ */ vt(Ft, { children: [
     /* @__PURE__ */ D(
       "div",
       {
-        className: B(y["tedi-date-field__container"], qe),
-        ...Ct,
+        className: B(y["tedi-date-field__container"], ze),
+        ...Mt,
         ref: I.setReference,
         children: s === "multiple" ? /* @__PURE__ */ D(
-          It,
+          Vt,
           {
             ...i,
-            ref: Ie,
-            id: pe,
-            label: he,
-            tagsDirection: Ge,
-            values: Ve.map((e) => e.label),
+            ref: Ve,
+            id: he,
+            label: ge,
+            tagsDirection: Xe,
+            values: Be.map((e) => e.label),
             icon: "calendar_today",
             onIconClick: se,
-            iconButtonProps: m ? Ye : { "aria-label": le },
-            isClearable: !0,
+            iconButtonProps: m ? je : { "aria-label": le },
+            isClearable: pe,
             required: Y,
             onChange: (e) => {
               if (!Array.isArray(o)) return;
-              const t = Ve.filter((r) => e.includes(r.label)).map((r) => r.date);
+              const t = Be.filter((r) => e.includes(r.label)).map((r) => r.date);
               f || p(t), a == null || a(t, {}, {}, {});
             },
             className: B(y["tedi-date-field__textfield"], {
@@ -306,28 +307,28 @@ const Kt = F.forwardRef((w, N) => {
             })
           }
         ) : /* @__PURE__ */ D(
-          Vt,
+          Bt,
           {
             ...i,
-            ref: rt,
-            id: pe,
-            label: he,
+            ref: at,
+            id: he,
+            label: ge,
             readOnly: O,
-            value: c ? it : te,
-            placeholder: Ue,
+            value: c ? ot : te,
+            placeholder: qe,
             icon: "calendar_today",
-            isClearable: !0,
+            isClearable: pe,
             onIconClick: se,
-            iconButtonProps: m && !c ? Ye : { "aria-label": le },
-            onChange: (e) => c ? bt(e) : ft(e),
+            iconButtonProps: m && !c ? je : { "aria-label": le },
+            onChange: (e) => c ? Dt(e) : dt(e),
             onBlur: (e) => {
               var t;
-              c || dt(), (t = i == null ? void 0 : i.onBlur) == null || t.call(i, e);
+              c || ct(), (t = i == null ? void 0 : i.onBlur) == null || t.call(i, e);
             },
             required: Y,
-            invalid: Ee || Oe || (i == null ? void 0 : i.invalid),
+            invalid: Oe || Re || (i == null ? void 0 : i.invalid),
             helper: (() => {
-              const e = i == null ? void 0 : i.helper, t = Ee ? Qe : Oe ? Ze : null, r = t ? { text: t, type: "error" } : null;
+              const e = i == null ? void 0 : i.helper, t = Oe ? Ze : Re ? et : null, r = t ? { text: t, type: "error" } : null;
               return r ? e ? Array.isArray(e) ? [...e, r] : [e, r] : r : e;
             })(),
             className: B(y["tedi-date-field__textfield"], {
@@ -341,7 +342,7 @@ const Kt = F.forwardRef((w, N) => {
                 role: "combobox",
                 "aria-haspopup": "dialog",
                 "aria-expanded": g ? ee : h,
-                "aria-controls": Le
+                "aria-controls": Ye
               } : {}
             }
           }
@@ -349,75 +350,75 @@ const Kt = F.forwardRef((w, N) => {
       }
     ),
     g && /* @__PURE__ */ D(
-      Yt,
+      jt,
       {
         open: ee,
-        onOpenChange: ke,
+        onOpenChange: Pe,
         value: o,
-        onConfirm: yt,
+        onConfirm: bt,
         mode: s,
-        numberOfMonths: Re,
-        locale: Me,
+        numberOfMonths: Ie,
+        locale: xe,
         localeCode: H,
-        showOutsideDays: ge,
+        showOutsideDays: ye,
         disabledMatchers: U,
         required: Y,
-        availableDays: Fe,
-        footer: xe,
-        monthYearSelectType: ye,
-        minYear: be,
-        maxYear: De,
-        dayStatus: _e,
-        showNavigation: Ce,
+        availableDays: we,
+        footer: Ae,
+        monthYearSelectType: be,
+        minYear: De,
+        maxYear: _e,
+        dayStatus: Ce,
+        showNavigation: Me,
         selectionLevel: E,
         initialView: j,
         initialMonth: W,
-        modalProps: Je,
-        ...we,
-        title: Ke
+        modalProps: Ke,
+        ...Ne,
+        title: Qe
       }
     ),
-    m && !c && !g && /* @__PURE__ */ D(Et, { children: h && /* @__PURE__ */ D(Ot, { context: q, modal: !1, initialFocus: -1, children: /* @__PURE__ */ D(
+    m && !c && !g && /* @__PURE__ */ D(Ot, { children: h && /* @__PURE__ */ D(Rt, { context: q, modal: !1, initialFocus: -1, children: /* @__PURE__ */ D(
       "div",
       {
         ref: I.setFloating,
         className: B({
           [y["tedi-date-field__calendar-popover--fullwidth"]]: A
         }),
-        ...$e.getFloatingProps({
+        ...Le.getFloatingProps({
           style: {
-            position: pt,
-            top: mt ?? 0,
-            left: A ? 0 : ut ?? 0,
+            position: ht,
+            top: pt ?? 0,
+            left: A ? 0 : mt ?? 0,
             right: A ? 0 : void 0
           }
         }),
         children: /* @__PURE__ */ D(
-          Rt,
+          It,
           {
-            ...we,
-            numberOfMonths: Re,
-            view: tt,
+            ...Ne,
+            numberOfMonths: Ie,
+            view: rt,
             selectionLevel: E,
-            currentMonth: ot,
+            currentMonth: nt,
             setCurrentMonth: oe,
-            setView: Pe,
+            setView: Ee,
             mode: s,
             value: o,
-            locale: Me,
+            locale: xe,
             localeCode: H,
-            showOutsideDays: ge,
+            showOutsideDays: ye,
             disabledMatchers: U,
             required: Y,
-            availableDays: Fe,
-            footer: xe,
-            monthYearSelectType: ye,
-            minYear: be,
-            maxYear: De,
-            dayStatus: _e,
-            showNavigation: Ce,
-            handleSelect: nt,
-            applyValue: st,
+            availableDays: we,
+            footer: Ae,
+            monthYearSelectType: be,
+            minYear: De,
+            maxYear: _e,
+            dayStatus: Ce,
+            showNavigation: Me,
+            handleSelect: st,
+            applyValue: lt,
             className: B(y["tedi-date-field__calendar"], {
               [y["tedi-date-field__calendar--fullwidth"]]: A
             })
@@ -427,7 +428,7 @@ const Kt = F.forwardRef((w, N) => {
     ) }) })
   ] });
 });
-Kt.displayName = "DateField";
+Qt.displayName = "DateField";
 export {
-  Kt as DateField
+  Qt as DateField
 };

package/src/tedi/components/form/date-time-field/date-time-field.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),D=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),w=require("../../../../../external/classnames/index.cjs.js"),n=require("react"),ke=require("../../buttons/button/button.cjs.js"),Nt=require("../../content/calendar/calendar.cjs.js"),y=require("../date-field/date-field-helpers.cjs.js"),Dt=require("../textfield/textfield.cjs.js"),Fe=require("../time-picker/time-picker.cjs.js"),a=require("./date-time-field.module.scss.cjs.js"),yt=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),jt=require("../../../providers/label-provider/use-labels.cjs.js"),Te=require("../../../helpers/hooks/use-breakpoint.cjs.js"),kt=require("../../../../../external/react-day-picker/dist/esm/locale/et.cjs.js"),Ft=require("../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),Y=require("../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),Tt=require("../../../../../external/react-day-picker/dist/esm/utils/dateMatchModifiers.cjs.js"),h=s=>String(s).padStart(2,"0"),g=s=>s?`${h(s.getHours())}:${h(s.getMinutes())}`:"00:00",_=(s,c)=>{const[G,b]=c.split(":"),R=Number(G),P=Number(b),E=new Date(s);return E.setHours(Number.isFinite(R)?R:0,Number.isFinite(P)?P:0,0,0),E},ne=s=>s instanceof Date,Mt=s=>s?`${s.getFullYear()}-${h(s.getMonth()+1)}-${h(s.getDate())}T${h(s.getHours())}:${h(s.getMinutes())}`:"",St=s=>{if(!s)return;const c=new Date(s);return isNaN(c.getTime())?void 0:c},Ct=s=>!s||ne(s)?{}:s,wt=s=>ne(s)?s:void 0,Me=n.forwardRef((s,c)=>{const{getCurrentBreakpointProps:G}=yt.useBreakpointProps(s.defaultServerBreakpoint),{getLabel:b}=jt.useLabels(),R=Te.default(s.defaultServerBreakpoint),P=Te.isBreakpointBelow(R,"md"),{layout:E="side-by-side",useNativePicker:Se=!1,monthYearSelectType:Ce="dropdown",timeGridVariant:we,showOutsideDays:Re=!0,availableTimes:v,timeHeading:U=b("dateTimeField.timeHeading")}=G(s),{id:Pe,label:Ee,placeholder:Ve,className:qe,value:le,defaultValue:Ae,onChange:z,required:de,readOnly:Oe,disabled:V,minDate:oe,maxDate:ce,disablePast:ue,disableFuture:me,disabledMatchers:j,stepMinutes:fe=15,initialMonth:W,locale:$e=kt.et,localeCode:k="et-EE",selectTimeLabel:Le=b("dateTimeField.selectTime"),backLabel:He=b("dateTimeField.back"),mode:Be="single",selectionLevel:Ie="days",minYear:Ye,maxYear:Ge,inputProps:l,disabledDateErrorMessage:Ue=b("dateField.disabledDateError")}=s,d=Be==="range",f=Se&&!d,F=d?"side-by-side":E,he=we??(F==="multi-step"?"radio":"button"),pe=le!==void 0,[ze,We]=n.useState(Ae),x=pe?le:ze,u=d?Ct(x):{},m=d?void 0:wt(x),[N,J]=n.useState(!1),[Je,K]=n.useState("date"),[Ke,ge]=n.useState("days"),Q=d?u.from:m,[Qe,q]=n.useState(()=>Q??W??new Date),_e=n.useRef(Q);_e.current=Q,n.useEffect(()=>{N||(K("date"),ge("days"),q(_e.current??W??new Date))},[N,W]);const A=n.useMemo(()=>new Intl.DateTimeFormat(k,{day:"2-digit",month:"2-digit",year:"numeric"}),[k]),Xe=n.useMemo(()=>new Intl.DateTimeFormat(k,{day:"2-digit",month:"2-digit",year:"2-digit"}),[k]),O=n.useCallback(e=>e?`${A.format(e)} ${h(e.getHours())}:${h(e.getMinutes())}`:"",[A]),$=n.useCallback(e=>{if(!e)return"";if(ne(e))return O(e);const t=O(e.from),r=O(e.to);return!t&&!r?"":r?t?`${t} – ${r}`:r:t},[O]),Ze=n.useMemo(()=>{const e=y.getLocaleDateParts(A),{fieldOrder:t}=e,r=new RegExp(`^${y.buildDateRegexSource(e)}\\s+(\\d{2}):(\\d{2})$`);return bt=>{const I=bt.trim().match(r);if(!I)return;const De={};t.forEach((vt,xt)=>{De[vt]=Number(I[xt+1])});const ye=Number(I[t.length+1]),je=Number(I[t.length+2]),{day:ae,month:se,year:re}=De;if(ae===void 0||se===void 0||re===void 0||ye>23||je>59)return;const C=new Date(re,se-1,ae,ye,je,0,0);if(!(isNaN(C.getTime())||C.getFullYear()!==re||C.getMonth()!==se-1||C.getDate()!==ae))return C}},[A]),[et,X]=n.useState(()=>$(x)),[be,p]=n.useState(!1);n.useEffect(()=>{X($(x))},[x,$]);const tt=D.useFloating({open:N,onOpenChange:J,placement:"bottom-end",middleware:[Y.offset(y.CALENDAR_POPOVER_OFFSET),Y.flip(),Y.shift({padding:y.CALENDAR_POPOVER_PADDING}),Y.size({padding:y.CALENDAR_POPOVER_PADDING,apply({availableWidth:e,elements:t}){t.floating.style.maxWidth=`${e}px`}})],whileElementsMounted:Ft.autoUpdate}),{refs:Z,context:ee,x:it,y:at,strategy:st}=tt,rt=D.useInteractions([D.useDismiss(ee,{outsidePress:e=>{const t=e.target;return!(t!=null&&t.closest('[role="menu"], [role="listbox"]'))}}),D.useRole(ee,{role:"dialog"})]),L=n.useRef(null),nt=n.useCallback(e=>{L.current=e,typeof c=="function"?c(e):c&&(c.current=e)},[c]);n.useEffect(()=>{var e;(e=L.current)!=null&&e.inner&&Z.setReference(L.current.inner)},[Z]);const o=e=>{pe||We(e),z==null||z(e),X($(e))},T=n.useCallback(e=>{if(v)return typeof v=="function"?v(e??new Date):v},[v]),M=n.useCallback((e,t)=>{const r=T(e);return!r||r.length===0||r.includes(t)?t:r[0]},[T]),lt=e=>{if(d){const t=e;if(!t||!t.from&&!t.to){o(void 0);return}const r={};t.from&&(r.from=_(t.from,M(t.from,g(u.from)))),t.to&&(r.to=_(t.to,M(t.to,g(u.to)))),o(r);return}e instanceof Date?o(_(e,M(e,g(m)))):e===void 0&&o(void 0)},dt=e=>{if(d){o({from:_(e,M(e,g(u.from)))});return}o(_(e,M(e,g(m))))},ot=e=>{const t=m??new Date;o(_(t,e)),F==="multi-step"&&T(t)&&J(!1)},ct=e=>t=>{const r=u[e]??u.from??new Date;o({...u,[e]:_(r,t)})},H=n.useMemo(()=>[...y.buildDisabledMatchers({minDate:oe,maxDate:ce,disablePast:ue,disableFuture:me}),...j?Array.isArray(j)?j:[j]:[]],[oe,ce,ue,me,j]),ve=n.useCallback(e=>Tt.dateMatchModifiers(e,H),[H]),ut=e=>{if(X(e),e===""){p(!1),o(void 0);return}if(f){const r=St(e);if(!r){p(!1);return}if(ve(r)){p(!0);return}p(!1),o(r),q(r);return}if(d)return;const t=Ze(e);if(!t){p(!1);return}if(ve(t)){p(!0);return}p(!1),o(t),q(t)},mt=()=>{var t;const e=(t=L.current)==null?void 0:t.input;if(e){if(typeof e.showPicker=="function"){e.showPicker();return}e.focus()}},ft=()=>{if(!V){if(f){mt();return}J(e=>!e)}},ht=F==="multi-step"?i.jsx("div",{className:a.default["tedi-date-time-field__select-time-wrapper"],children:i.jsx(ke.Button,{type:"button",visualType:"link",size:"small",iconLeft:"schedule",onClick:()=>K("time"),children:Le})}):void 0,te=i.jsx(Nt.Calendar,{view:Ke,setView:ge,selectionLevel:Ie,currentMonth:Qe,setCurrentMonth:q,mode:d?"range":"single",value:d?u:m,numberOfMonths:d&&!P?2:1,locale:$e,localeCode:k,showOutsideDays:Re,monthYearSelectType:Ce,minYear:Ye,maxYear:Ge,disabledMatchers:H.length?H:void 0,required:de,handleSelect:lt,applyValue:dt,footer:ht,className:w.default(a.default["tedi-date-time-field__calendar"],F==="side-by-side"&&a.default["tedi-date-time-field__calendar--split"])}),ie=T(m),pt=!ie||ie.length===0,xe=i.jsx(Fe.TimePicker,{value:g(m),stepMinutes:fe,availableTimes:ie,gridVariant:he,onChange:ot,className:w.default(a.default["tedi-date-time-field__time-picker"],{[a.default["tedi-date-time-field__time-picker--wheel"]]:pt})}),Ne=e=>{const t=T(u[e]),r=!t||t.length===0;return i.jsx(Fe.TimePicker,{value:g(u[e]),stepMinutes:fe,availableTimes:t,gridVariant:he,onChange:ct(e),className:w.default(a.default["tedi-date-time-field__time-picker"],{[a.default["tedi-date-time-field__time-picker--wheel"]]:r})})},S=l==null?void 0:l.helper,B=be?{text:Ue,type:"error"}:null,gt=B?S?Array.isArray(S)?[...S,B]:[S,B]:B:S,_t={...l,id:Pe,label:Ee,value:f?Mt(m):et,placeholder:Ve,readOnly:Oe||!f&&!!v&&!!x,icon:"calendar_today",isClearable:!0,required:de,disabled:V,invalid:be||(l==null?void 0:l.invalid),helper:gt,onIconClick:ft,onChange:ut,className:w.default(a.default["tedi-date-time-field__textfield"],l==null?void 0:l.className,{[a.default["tedi-date-time-field__icon--disabled"]]:V}),input:{...l==null?void 0:l.input,type:f?"datetime-local":"text","aria-expanded":f?void 0:N}};return i.jsxs(i.Fragment,{children:[i.jsx("div",{className:w.default(a.default["tedi-date-time-field__container"],qe),"aria-haspopup":"dialog",children:i.jsx(Dt.TextField,{ref:nt,"aria-expanded":f?void 0:N,..._t})}),!f&&i.jsx(D.FloatingPortal,{children:N&&!V&&i.jsx(D.FloatingFocusManager,{context:ee,modal:!1,initialFocus:-1,children:i.jsx("div",{ref:Z.setFloating,className:a.default["tedi-date-time-field__popup"],...rt.getFloatingProps({style:{position:st,top:at??0,left:it??0}}),children:d?i.jsxs("div",{className:a.default["tedi-date-time-field__range"],children:[te,i.jsx("div",{className:a.default["tedi-date-time-field__range-separator"],"aria-hidden":"true",children:i.jsx("div",{className:a.default["tedi-date-time-field__range-separator-line"]})}),i.jsxs("div",{className:a.default["tedi-date-time-field__range-times"],children:[i.jsxs("div",{className:a.default["tedi-date-time-field__range-time"],children:[i.jsx("div",{className:a.default["tedi-date-time-field__split-time-header"],children:i.jsx("span",{className:a.default["tedi-date-time-field__split-heading"],children:U})}),i.jsx("div",{className:a.default["tedi-date-time-field__split-time-body"],children:Ne("from")})]}),i.jsxs("div",{className:a.default["tedi-date-time-field__range-time"],children:[i.jsx("div",{className:a.default["tedi-date-time-field__split-time-header"],children:i.jsx("span",{className:a.default["tedi-date-time-field__split-heading"],children:U})}),i.jsx("div",{className:a.default["tedi-date-time-field__split-time-body"],children:Ne("to")})]})]})]}):F==="side-by-side"?i.jsxs("div",{className:a.default["tedi-date-time-field__split"],children:[te,i.jsx("div",{className:a.default["tedi-date-time-field__split-separator"],"aria-hidden":"true",children:i.jsx("div",{className:a.default["tedi-date-time-field__split-separator-line"]})}),i.jsxs("div",{className:a.default["tedi-date-time-field__split-time"],children:[i.jsx("div",{className:a.default["tedi-date-time-field__split-time-header"],children:i.jsx("span",{className:a.default["tedi-date-time-field__split-heading"],children:U})}),i.jsx("div",{className:a.default["tedi-date-time-field__split-time-body"],children:xe})]})]}):Je==="date"?te:i.jsxs("div",{className:a.default["tedi-date-time-field__time-step"],children:[i.jsxs("header",{className:a.default["tedi-date-time-field__time-header"],children:[i.jsx(ke.Button,{type:"button",visualType:"link",size:"small",iconLeft:"arrow_back",onClick:()=>K("date"),children:He}),i.jsx("span",{className:a.default["tedi-date-time-field__time-date"],children:Xe.format(m??new Date)})]}),i.jsx("div",{className:a.default["tedi-date-time-field__time-body"],children:xe})]})})})})]})});Me.displayName="DateTimeField";exports.DateTimeField=Me;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),D=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),w=require("../../../../../external/classnames/index.cjs.js"),n=require("react"),ke=require("../../buttons/button/button.cjs.js"),Dt=require("../../content/calendar/calendar.cjs.js"),y=require("../date-field/date-field-helpers.cjs.js"),yt=require("../textfield/textfield.cjs.js"),Fe=require("../time-picker/time-picker.cjs.js"),a=require("./date-time-field.module.scss.cjs.js"),jt=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),kt=require("../../../providers/label-provider/use-labels.cjs.js"),Te=require("../../../helpers/hooks/use-breakpoint.cjs.js"),Ft=require("../../../../../external/react-day-picker/dist/esm/locale/et.cjs.js"),Tt=require("../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),Y=require("../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),Mt=require("../../../../../external/react-day-picker/dist/esm/utils/dateMatchModifiers.cjs.js"),h=s=>String(s).padStart(2,"0"),g=s=>s?`${h(s.getHours())}:${h(s.getMinutes())}`:"00:00",_=(s,c)=>{const[G,b]=c.split(":"),R=Number(G),P=Number(b),E=new Date(s);return E.setHours(Number.isFinite(R)?R:0,Number.isFinite(P)?P:0,0,0),E},ne=s=>s instanceof Date,St=s=>s?`${s.getFullYear()}-${h(s.getMonth()+1)}-${h(s.getDate())}T${h(s.getHours())}:${h(s.getMinutes())}`:"",Ct=s=>{if(!s)return;const c=new Date(s);return isNaN(c.getTime())?void 0:c},wt=s=>!s||ne(s)?{}:s,Rt=s=>ne(s)?s:void 0,Me=n.forwardRef((s,c)=>{const{getCurrentBreakpointProps:G}=jt.useBreakpointProps(s.defaultServerBreakpoint),{getLabel:b}=kt.useLabels(),R=Te.default(s.defaultServerBreakpoint),P=Te.isBreakpointBelow(R,"md"),{layout:E="side-by-side",useNativePicker:Se=!1,monthYearSelectType:Ce="dropdown",timeGridVariant:we,showOutsideDays:Re=!0,availableTimes:v,timeHeading:U=b("dateTimeField.timeHeading"),clearable:Pe=!0}=G(s),{id:Ee,label:Ve,placeholder:qe,className:Ae,value:le,defaultValue:Oe,onChange:z,required:de,readOnly:$e,disabled:V,minDate:oe,maxDate:ce,disablePast:ue,disableFuture:me,disabledMatchers:j,stepMinutes:fe=15,initialMonth:W,locale:Le=Ft.et,localeCode:k="et-EE",selectTimeLabel:He=b("dateTimeField.selectTime"),backLabel:Be=b("dateTimeField.back"),mode:Ie="single",selectionLevel:Ye="days",minYear:Ge,maxYear:Ue,inputProps:l,disabledDateErrorMessage:ze=b("dateField.disabledDateError")}=s,d=Ie==="range",f=Se&&!d,F=d?"side-by-side":E,he=we??(F==="multi-step"?"radio":"button"),pe=le!==void 0,[We,Je]=n.useState(Oe),x=pe?le:We,u=d?wt(x):{},m=d?void 0:Rt(x),[N,J]=n.useState(!1),[Ke,K]=n.useState("date"),[Qe,ge]=n.useState("days"),Q=d?u.from:m,[Xe,q]=n.useState(()=>Q??W??new Date),_e=n.useRef(Q);_e.current=Q,n.useEffect(()=>{N||(K("date"),ge("days"),q(_e.current??W??new Date))},[N,W]);const A=n.useMemo(()=>new Intl.DateTimeFormat(k,{day:"2-digit",month:"2-digit",year:"numeric"}),[k]),Ze=n.useMemo(()=>new Intl.DateTimeFormat(k,{day:"2-digit",month:"2-digit",year:"2-digit"}),[k]),O=n.useCallback(e=>e?`${A.format(e)} ${h(e.getHours())}:${h(e.getMinutes())}`:"",[A]),$=n.useCallback(e=>{if(!e)return"";if(ne(e))return O(e);const t=O(e.from),r=O(e.to);return!t&&!r?"":r?t?`${t} – ${r}`:r:t},[O]),et=n.useMemo(()=>{const e=y.getLocaleDateParts(A),{fieldOrder:t}=e,r=new RegExp(`^${y.buildDateRegexSource(e)}\\s+(\\d{2}):(\\d{2})$`);return vt=>{const I=vt.trim().match(r);if(!I)return;const De={};t.forEach((xt,Nt)=>{De[xt]=Number(I[Nt+1])});const ye=Number(I[t.length+1]),je=Number(I[t.length+2]),{day:ae,month:se,year:re}=De;if(ae===void 0||se===void 0||re===void 0||ye>23||je>59)return;const C=new Date(re,se-1,ae,ye,je,0,0);if(!(isNaN(C.getTime())||C.getFullYear()!==re||C.getMonth()!==se-1||C.getDate()!==ae))return C}},[A]),[tt,X]=n.useState(()=>$(x)),[be,p]=n.useState(!1);n.useEffect(()=>{X($(x))},[x,$]);const it=D.useFloating({open:N,onOpenChange:J,placement:"bottom-end",middleware:[Y.offset(y.CALENDAR_POPOVER_OFFSET),Y.flip(),Y.shift({padding:y.CALENDAR_POPOVER_PADDING}),Y.size({padding:y.CALENDAR_POPOVER_PADDING,apply({availableWidth:e,elements:t}){t.floating.style.maxWidth=`${e}px`}})],whileElementsMounted:Tt.autoUpdate}),{refs:Z,context:ee,x:at,y:st,strategy:rt}=it,nt=D.useInteractions([D.useDismiss(ee,{outsidePress:e=>{const t=e.target;return!(t!=null&&t.closest('[role="menu"], [role="listbox"]'))}}),D.useRole(ee,{role:"dialog"})]),L=n.useRef(null),lt=n.useCallback(e=>{L.current=e,typeof c=="function"?c(e):c&&(c.current=e)},[c]);n.useEffect(()=>{var e;(e=L.current)!=null&&e.inner&&Z.setReference(L.current.inner)},[Z]);const o=e=>{pe||Je(e),z==null||z(e),X($(e))},T=n.useCallback(e=>{if(v)return typeof v=="function"?v(e??new Date):v},[v]),M=n.useCallback((e,t)=>{const r=T(e);return!r||r.length===0||r.includes(t)?t:r[0]},[T]),dt=e=>{if(d){const t=e;if(!t||!t.from&&!t.to){o(void 0);return}const r={};t.from&&(r.from=_(t.from,M(t.from,g(u.from)))),t.to&&(r.to=_(t.to,M(t.to,g(u.to)))),o(r);return}e instanceof Date?o(_(e,M(e,g(m)))):e===void 0&&o(void 0)},ot=e=>{if(d){o({from:_(e,M(e,g(u.from)))});return}o(_(e,M(e,g(m))))},ct=e=>{const t=m??new Date;o(_(t,e)),F==="multi-step"&&T(t)&&J(!1)},ut=e=>t=>{const r=u[e]??u.from??new Date;o({...u,[e]:_(r,t)})},H=n.useMemo(()=>[...y.buildDisabledMatchers({minDate:oe,maxDate:ce,disablePast:ue,disableFuture:me}),...j?Array.isArray(j)?j:[j]:[]],[oe,ce,ue,me,j]),ve=n.useCallback(e=>Mt.dateMatchModifiers(e,H),[H]),mt=e=>{if(X(e),e===""){p(!1),o(void 0);return}if(f){const r=Ct(e);if(!r){p(!1);return}if(ve(r)){p(!0);return}p(!1),o(r),q(r);return}if(d)return;const t=et(e);if(!t){p(!1);return}if(ve(t)){p(!0);return}p(!1),o(t),q(t)},ft=()=>{var t;const e=(t=L.current)==null?void 0:t.input;if(e){if(typeof e.showPicker=="function"){e.showPicker();return}e.focus()}},ht=()=>{if(!V){if(f){ft();return}J(e=>!e)}},pt=F==="multi-step"?i.jsx("div",{className:a.default["tedi-date-time-field__select-time-wrapper"],children:i.jsx(ke.Button,{type:"button",visualType:"link",size:"small",iconLeft:"schedule",onClick:()=>K("time"),children:He})}):void 0,te=i.jsx(Dt.Calendar,{view:Qe,setView:ge,selectionLevel:Ye,currentMonth:Xe,setCurrentMonth:q,mode:d?"range":"single",value:d?u:m,numberOfMonths:d&&!P?2:1,locale:Le,localeCode:k,showOutsideDays:Re,monthYearSelectType:Ce,minYear:Ge,maxYear:Ue,disabledMatchers:H.length?H:void 0,required:de,handleSelect:dt,applyValue:ot,footer:pt,className:w.default(a.default["tedi-date-time-field__calendar"],F==="side-by-side"&&a.default["tedi-date-time-field__calendar--split"])}),ie=T(m),gt=!ie||ie.length===0,xe=i.jsx(Fe.TimePicker,{value:g(m),stepMinutes:fe,availableTimes:ie,gridVariant:he,onChange:ct,className:w.default(a.default["tedi-date-time-field__time-picker"],{[a.default["tedi-date-time-field__time-picker--wheel"]]:gt})}),Ne=e=>{const t=T(u[e]),r=!t||t.length===0;return i.jsx(Fe.TimePicker,{value:g(u[e]),stepMinutes:fe,availableTimes:t,gridVariant:he,onChange:ut(e),className:w.default(a.default["tedi-date-time-field__time-picker"],{[a.default["tedi-date-time-field__time-picker--wheel"]]:r})})},S=l==null?void 0:l.helper,B=be?{text:ze,type:"error"}:null,_t=B?S?Array.isArray(S)?[...S,B]:[S,B]:B:S,bt={...l,id:Ee,label:Ve,value:f?St(m):tt,placeholder:qe,readOnly:$e||!f&&!!v&&!!x,icon:"calendar_today",isClearable:Pe,required:de,disabled:V,invalid:be||(l==null?void 0:l.invalid),helper:_t,onIconClick:ht,onChange:mt,className:w.default(a.default["tedi-date-time-field__textfield"],l==null?void 0:l.className,{[a.default["tedi-date-time-field__icon--disabled"]]:V}),input:{...l==null?void 0:l.input,type:f?"datetime-local":"text","aria-expanded":f?void 0:N}};return i.jsxs(i.Fragment,{children:[i.jsx("div",{className:w.default(a.default["tedi-date-time-field__container"],Ae),"aria-haspopup":"dialog",children:i.jsx(yt.TextField,{ref:lt,"aria-expanded":f?void 0:N,...bt})}),!f&&i.jsx(D.FloatingPortal,{children:N&&!V&&i.jsx(D.FloatingFocusManager,{context:ee,modal:!1,initialFocus:-1,children:i.jsx("div",{ref:Z.setFloating,className:a.default["tedi-date-time-field__popup"],...nt.getFloatingProps({style:{position:rt,top:st??0,left:at??0}}),children:d?i.jsxs("div",{className:a.default["tedi-date-time-field__range"],children:[te,i.jsx("div",{className:a.default["tedi-date-time-field__range-separator"],"aria-hidden":"true",children:i.jsx("div",{className:a.default["tedi-date-time-field__range-separator-line"]})}),i.jsxs("div",{className:a.default["tedi-date-time-field__range-times"],children:[i.jsxs("div",{className:a.default["tedi-date-time-field__range-time"],children:[i.jsx("div",{className:a.default["tedi-date-time-field__split-time-header"],children:i.jsx("span",{className:a.default["tedi-date-time-field__split-heading"],children:U})}),i.jsx("div",{className:a.default["tedi-date-time-field__split-time-body"],children:Ne("from")})]}),i.jsxs("div",{className:a.default["tedi-date-time-field__range-time"],children:[i.jsx("div",{className:a.default["tedi-date-time-field__split-time-header"],children:i.jsx("span",{className:a.default["tedi-date-time-field__split-heading"],children:U})}),i.jsx("div",{className:a.default["tedi-date-time-field__split-time-body"],children:Ne("to")})]})]})]}):F==="side-by-side"?i.jsxs("div",{className:a.default["tedi-date-time-field__split"],children:[te,i.jsx("div",{className:a.default["tedi-date-time-field__split-separator"],"aria-hidden":"true",children:i.jsx("div",{className:a.default["tedi-date-time-field__split-separator-line"]})}),i.jsxs("div",{className:a.default["tedi-date-time-field__split-time"],children:[i.jsx("div",{className:a.default["tedi-date-time-field__split-time-header"],children:i.jsx("span",{className:a.default["tedi-date-time-field__split-heading"],children:U})}),i.jsx("div",{className:a.default["tedi-date-time-field__split-time-body"],children:xe})]})]}):Ke==="date"?te:i.jsxs("div",{className:a.default["tedi-date-time-field__time-step"],children:[i.jsxs("header",{className:a.default["tedi-date-time-field__time-header"],children:[i.jsx(ke.Button,{type:"button",visualType:"link",size:"small",iconLeft:"arrow_back",onClick:()=>K("date"),children:Be}),i.jsx("span",{className:a.default["tedi-date-time-field__time-date"],children:Ze.format(m??new Date)})]}),i.jsx("div",{className:a.default["tedi-date-time-field__time-body"],children:xe})]})})})})]})});Me.displayName="DateTimeField";exports.DateTimeField=Me;

package/src/tedi/components/form/date-time-field/date-time-field.d.ts

@@ -20,6 +20,12 @@ type DateTimeFieldBreakpointProps = {
      * @default false
      */
     useNativePicker?: boolean;
+    /**
+     * Whether the field shows a clear button to reset the value. Disable it
+     * when the field is required or the value should not be cleared.
+     * @default true
+     */
+    clearable?: boolean;
     /**
      * Layout of the date-and-time popover. `mode='range'` always uses
      * `'side-by-side'` regardless of this value — the range UI needs the