linear-react-components-ui 1.1.26-beta.2 → 1.1.26-beta.21

package/lib/inputs/period/helper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helper.js","sources":["../../../src/lib/inputs/period/helper.ts"],"sourcesContent":["import moment, { Moment } from 'moment';\nimport { DateTypes } from './types';\n\nconst getCalendarDropdownStyle = ({ topPosition, leftPosition, width }:\n{ topPosition: number | string, leftPosition: number | string, width: number | string }) => (\n  `top: ${topPosition}px;\n  left: ${leftPosition}px;\n  width:${width}px`\n);\nexport default getCalendarDropdownStyle;\n\nexport const getDropdownItemCssClass = (selected = false, disabled = false, striped = false) => {\n  let className = 'item';\n  className += (selected && !disabled ? ' -selected ' : '');\n  className += disabled ? ' -disabled' : '';\n  className += (!selected && !disabled && striped ? ' -striped ' : '');\n  return className;\n};\n\nexport const CalcDatesByPeriod = (dateType: DateTypes): Moment[] => {\n  const currentDate = moment();\n  const dateTypes = {\n    today: () => [currentDate, currentDate],\n    week: () => {\n      const weekStart = currentDate.clone().startOf('week');\n      const weekEnd = currentDate.clone().endOf('week');\n      return [weekStart, weekEnd];\n    },\n    lastweek: () => {\n      const lastWeek = currentDate.subtract(1, 'weeks');\n      const weekStart = lastWeek.clone().startOf('week');\n      const weekEnd = lastWeek.clone().endOf('week');\n      return [weekStart, weekEnd];\n    },\n    last15: () => {\n      const last15Day = moment(currentDate);\n      return [last15Day.subtract(15, 'days'), currentDate];\n    },\n    month: () => {\n      const monthStart = currentDate.clone().startOf('month');\n      const monthEnd = currentDate.clone().endOf('month');\n      return [monthStart, monthEnd];\n    },\n    lastmonth: () => {\n      const lastMonth = currentDate.subtract(1, 'months');\n      const monthStart = lastMonth.clone().startOf('month');\n      const monthEnd = lastMonth.clone().endOf('month');\n      return [monthStart, monthEnd];\n    },\n  };\n  return dateTypes[dateType]();\n};\n\nexport const isDateValid = (date: Moment) => date && moment(date).isValid();\n"],"names":["getDropdownItemCssClass","selected","disabled","striped","className","CalcDatesByPeriod","dateType","currentDate","moment","today","week","weekStart","clone","startOf","weekEnd","endOf","lastweek","lastWeek","subtract","last15","month","monthStart","monthEnd","lastmonth","lastMonth"],"mappings":";AAWO,MAAMA,IAA0BA,CAACC,IAAW,IAAOC,IAAW,IAAOC,IAAU,OAAU;AAC9F,MAAIC,IAAY;AAChBA,SAAAA,KAAcH,KAAY,CAACC,IAAW,gBAAgB,IACtDE,KAAaF,IAAW,eAAe,IACvCE,KAAc,CAACH,KAAY,CAACC,KAAYC,IAAU,eAAe,IAC1DC;AACT,GAEaC,IAAoBA,CAACC,MAAkC;AAClE,QAAMC,IAAcC,EAAAA;AA8BpB,SA7BkB;AAAA,IAChBC,OAAOA,MAAM,CAACF,GAAaA,CAAW;AAAA,IACtCG,MAAMA,MAAM;AACV,YAAMC,IAAYJ,EAAYK,MAAAA,EAAQC,QAAQ,MAAM,GAC9CC,IAAUP,EAAYK,MAAAA,EAAQG,MAAM,MAAM;AAChD,aAAO,CAACJ,GAAWG,CAAO;AAAA,IAC5B;AAAA,IACAE,UAAUA,MAAM;AACd,YAAMC,IAAWV,EAAYW,SAAS,GAAG,OAAO,GAC1CP,IAAYM,EAASL,MAAAA,EAAQC,QAAQ,MAAM,GAC3CC,IAAUG,EAASL,MAAAA,EAAQG,MAAM,MAAM;AAC7C,aAAO,CAACJ,GAAWG,CAAO;AAAA,IAC5B;AAAA,IACAK,QAAQA,MAEC,CADWX,EAAOD,CAAW,EAClBW,SAAS,IAAI,MAAM,GAAGX,CAAW;AAAA,IAErDa,OAAOA,MAAM;AACX,YAAMC,IAAad,EAAYK,MAAAA,EAAQC,QAAQ,OAAO,GAChDS,IAAWf,EAAYK,MAAAA,EAAQG,MAAM,OAAO;AAClD,aAAO,CAACM,GAAYC,CAAQ;AAAA,IAC9B;AAAA,IACAC,WAAWA,MAAM;AACf,YAAMC,IAAYjB,EAAYW,SAAS,GAAG,QAAQ,GAC5CG,IAAaG,EAAUZ,MAAAA,EAAQC,QAAQ,OAAO,GAC9CS,IAAWE,EAAUZ,MAAAA,EAAQG,MAAM,OAAO;AAChD,aAAO,CAACM,GAAYC,CAAQ;AAAA,IAC9B;AAAA,EAAA,EAEehB,CAAQ,EAAA;AAC3B;"}

package/lib/inputs/period/index.js

@@ -1,351 +1,199 @@
-import { j as r } from "../../chunks/jsx-runtime.CYK1ROHF.js";
-import { useId as ve, useState as Y, useRef as h, useEffect as V, useCallback as Ce } from "react";
-import s from "moment";
-import qe from "./PeriodList.js";
-import De from "../mask/BaseMask.js";
-import _ from "./Dropdown.js";
-import Ne from "../../calendar/base/index.js";
-import Ye from "../../buttons/Button.js";
-import G from "../../icons/index.js";
-/* empty css                           */
-import H from "./Dialog.js";
-import ze from "../../hint/index.js";
-/* empty css                               */
-import Ke from "../../gridlayout/GridCol.js";
-import { getInputWrapperClass as Ue } from "../base/helpers.js";
-import { ErrorMessage as We } from "../errorMessage/index.js";
-import pe from "../../textContent/index.js";
-import $e from "../../popover/index.js";
-const mn = (t) => {
+import { jsx as i, jsxs as x } from "react/jsx-runtime";
+import '../../assets/styles/button.css';import '../../assets/styles/periodpicker.css';/* empty css                                    */
+import { useId as se, useState as v, useRef as h, useCallback as ce, useEffect as L } from "react";
+import l from "../../node_modules/moment/dist/moment.js";
+import ye from "./PeriodList.js";
+import fe from "../mask/BaseMask.js";
+import U from "./Dropdown.js";
+import Oe from "../../calendar/base/index.js";
+import "../../_virtual/compiler-runtime.js";
+import de from "../../buttons/Button.js";
+/* empty css                              */
+import W from "../../icons/index.js";
+import $ from "./Dialog.js";
+import ke from "../../hint/index.js";
+import xe from "../../gridlayout/GridCol.js";
+import { getInputWrapperClass as Le } from "../base/helpers.js";
+import { ErrorMessage as Ee } from "../errorMessage/index.js";
+import me from "../../textContent/index.js";
+import Ve from "../../popover/index.js";
+const tn = (n) => {
   const {
-    showButtonOpen: P = !0,
-    openOnFocus: xe = !0,
-    shouldCloseOnSelect: J = !0,
-    calendarColorStyle: R,
-    showCalendarInDialog: b = !1,
-    dialogSize: T = { width: "350px", height: "350px" },
-    hint: E,
-    hintPosition: Q = "below",
-    themePopover: be = "light",
-    popoverAlign: Ie = "left",
-    gridLayout: X
-  } = t, Fe = ve(), we = ve(), [a, I] = Y(t.value && s(t.value.initial, "DD/MM/YYYY")), [o, F] = Y(t.value && s(t.value.final, "DD/MM/YYYY")), [Z, ee] = Y("week"), [v, C] = Y(!1), [p, c] = Y(!1), [y, x] = Y(!1), [A, q] = Y(), [D, ne] = Y(), [te, ie] = Y("valueInitial"), M = h(null), g = h(null), m = h(null), ye = h(null), N = h(null), Me = h(null), w = h(null);
-  h(null);
-  const u = h(null), f = h(null), z = () => {
-    var e;
-    q((e = g == null ? void 0 : g.current) == null ? void 0 : e.getBoundingClientRect());
-  }, je = (e) => {
-    var i;
-    const n = !((i = M.current) != null && i.contains(e.relatedTarget));
-    !b && v && n && C(!1), !b && p && n && c(!1);
-  }, le = (e) => {
-    var l, d, j, S, B, de, me;
-    const { target: n } = e, i = n;
-    if (f.current && e && e.key && e.key === "Escape" && (e.preventDefault(), i.focus(), v && (i.id !== "valueInitial" && ((l = m.current) == null || l.focus()), C(!1)), p && (i.id !== "valueFinal" && ((d = u.current) == null || d.focus()), c(!1)), y && (x(!1), (j = u.current) == null || j.focus(), c(!1))), f.current && e && e.key && e.key === "Tab") {
-      const Ve = (S = f.current) == null ? void 0 : S.getElementsByClassName("navbutton"), Te = ((B = f.current) == null ? void 0 : B.getElementsByClassName("-selectedday"))[0].firstChild, $ = Array.from([...Ve, Te]), ge = $[0], Ae = $[$.length - 1], he = f.current.id === "valueInitial";
-      !e.shiftKey && v && document.activeElement === m.current && (e.preventDefault(), ge.focus()), e.shiftKey && he && document.activeElement === ge && (e.preventDefault(), (de = m.current) == null || de.focus()), !e.shiftKey && he && document.activeElement === Ae && (e.preventDefault(), (me = u.current) == null || me.focus());
-    }
-    e.stopPropagation();
-  }, k = () => {
-    var i;
-    const e = (i = g.current) == null ? void 0 : i.getBoundingClientRect(), n = e && e.bottom;
-    w && w.current && e && (w.current.style.top = String(n).concat("px"));
-  };
-  V(() => {
-    var e;
-    return window.addEventListener("resize", z), document.addEventListener("scroll", k), (e = document.getElementById("modal-dialog-content")) == null || e.addEventListener("scroll", k), g.current && z(), m && m.current && (m.current.id = Fe), u && u.current && (u.current.id = we), () => {
-      var n;
-      window.removeEventListener("resize", z), document.removeEventListener("scroll", k), (n = document.getElementById("modal-dialog-content")) == null || n.removeEventListener("scroll", k);
-    };
-  }, []), V(() => (document.addEventListener("keydown", le), () => {
-    document.removeEventListener("keydown", le);
-  }), [
-    p,
-    v,
-    y,
-    f.current
-  ]), V(() => {
-    if (o && a && s(o).isBefore(s(a)))
-      I(o), F(a);
-    else if (t.onChange) {
-      const e = a ? a.format("YYYY-MM-DD") : "", n = o ? o.format("YYYY-MM-DD") : "";
-      t.onChange(void 0, "", { initial: e, final: n });
-    }
-  }, [a, o]), V(() => {
-    if (t.value && !(s(t.value.initial).isSame(a) || s(t.value.final).isSame(o))) {
-      const { initial: e, final: n } = t.value;
-      let i, l;
-      s(e, "YYYY-MM-DD", !0).isValid() && (i = s(e, "YYYY-MM-DD")), s(n, "YYYY-MM-DD", !0).isValid() && (l = s(n, "YYYY-MM-DD")), I(i), F(l);
-    }
-  }, [t.value]);
-  const re = (e) => {
-    var n, i;
-    e === "valueInitial" && (ie("valueInitial"), c(!1), v || ((n = m.current) == null || n.focus(), b && setTimeout(() => {
-      var l;
-      (l = N.current) == null || l.focus();
-    }, 100), C(!0))), e === "valueFinal" && (ie("valueFinal"), C(!1), p || ((i = u.current) == null || i.focus(), b && setTimeout(() => {
-      var l;
-      (l = N.current) == null || l.focus();
-    }, 100), c(!0))), g.current && q(g.current.getBoundingClientRect());
-  }, Se = (e) => {
-    var n, i;
-    e === "valueInitial" && ((n = m.current) == null || n.focus()), e === "valueFinal" && ((i = u.current) == null || i.focus()), C(!1), c(!1);
-  }, K = (e) => {
+    showButtonOpen: R = !0,
+    openOnFocus: ge = !0,
+    shouldCloseOnSelect: G = !0,
+    calendarColorStyle: B,
+    showCalendarInDialog: I = !1,
+    dialogSize: E = {
+      width: "350px",
+      height: "350px"
+    },
+    hint: P,
+    hintPosition: H = "below",
+    themePopover: ve = "light",
+    popoverAlign: he = "left",
+    gridLayout: K
+  } = n, Ce = se(), Ye = se(), [r, w] = v(n.value && l(n.value.initial, "DD/MM/YYYY")), [s, M] = v(n.value && l(n.value.final, "DD/MM/YYYY")), [J, Q] = v("week"), [C, d] = v(!1), [Y, o] = v(!1), [S, D] = v(!1), [V, T] = v(), [m, X] = v(), [Z, _] = v("valueInitial"), F = h(null), p = h(null), f = h(null), De = h(null), q = h(null), pe = h(null), b = h(null), a = h(null), g = h(null), A = () => {
+    T(p?.current?.getBoundingClientRect());
+  }, Ie = (e) => {
+    const t = !F.current?.contains(e.relatedTarget);
+    !I && C && t && d(!1), !I && Y && t && o(!1);
+  }, ee = (e) => {
+    const {
+      target: t
+    } = e, u = t;
+    g.current && e && e.key && e.key === "Escape" && (e.preventDefault(), u.focus(), C && (u.id !== "valueInitial" && f.current?.focus(), d(!1)), Y && (u.id !== "valueFinal" && a.current?.focus(), o(!1)), S && (D(!1), a.current?.focus(), o(!1))), e.stopPropagation();
+  }, y = () => {
+    const e = p.current?.getBoundingClientRect(), t = e && e.bottom;
+    b && b.current && e && (b.current.style.top = String(t).concat("px"));
+  }, ne = (e) => {
+    e === "valueInitial" && (_("valueInitial"), o(!1), C || (f.current?.focus(), I && setTimeout(() => {
+      q.current?.focus();
+    }, 100), d(!0))), e === "valueFinal" && (_("valueFinal"), d(!1), Y || (a.current?.focus(), I && setTimeout(() => {
+      q.current?.focus();
+    }, 100), o(!0))), p.current && T(p.current.getBoundingClientRect());
+  }, be = (e) => {
+    e === "valueInitial" && f.current?.focus(), e === "valueFinal" && a.current?.focus(), d(!1), o(!1);
+  }, te = (e) => {
+    const t = e.initial ? e.initial.format("YYYY-MM-DD") : "", u = e.final ? e.final.format("YYYY-MM-DD") : "";
+    n?.onChange?.(void 0, "", {
+      initial: t,
+      final: u
+    });
+  }, z = (e) => {
     setTimeout(() => {
-      var n, i, l;
-      e === "valueInitial" && ((n = m.current) == null || n.focus(), C(!1)), e === "valueFinal" && ((i = u.current) == null || i.focus(), c(!1)), e === "periodSelection" && (x(!1), (l = u.current) == null || l.focus(), c(!1));
+      e === "valueInitial" && (f.current?.focus(), d(!1)), e === "valueFinal" && (a.current?.focus(), o(!1)), e === "periodSelection" && (D(!1), a.current?.focus(), o(!1));
     }, 100);
-  }, ae = (e) => {
-    const { name: n } = e.target;
-    xe && re(n), t.onFocus && t.onFocus(e);
-  }, oe = (e) => {
-    t.onBlur && t.onBlur(e);
-  }, se = (e, n) => {
+  }, ie = (e) => {
+    const {
+      name: t
+    } = e.target;
+    ge && ne(t), n.onFocus && n.onFocus(e);
+  }, le = (e) => {
+    n.onBlur && n.onBlur(e);
+  }, re = (e) => {
     if (e) {
-      const { name: i } = e.target;
-      n && n.replace(/\D/g, "").trim().length !== 0 && (i === "valueInitial" ? I(void 0) : F(void 0));
-    }
-  }, O = (e) => {
-    if (t.onChange) {
-      const n = e.initial ? e.initial.format("YYYY-MM-DD") : "", i = e.final ? e.final.format("YYYY-MM-DD") : "";
-      t.onChange(void 0, "", { initial: n, final: i });
+      const {
+        name: t,
+        value: u
+      } = e.target;
+      String(u).trim().length === 0 && (t === "valueInitial" ? w(void 0) : M(void 0));
     }
-  }, U = (e, n, i = !0) => {
-    var j, S, B;
-    const l = e ? e.target.name : "", d = s(n, "DD/MM/YYYY");
-    v && ((j = m.current) == null || j.focus()), p && ((S = u.current) == null || S.focus()), l === "valueFinal" && a && d.isBefore(a) ? (I(d), F(a), O({ initial: d, final: a })) : l === "valueInitial" && o && d.isAfter(o) ? (I(o), F(d), O({ initial: o, final: d })) : l === "valueInitial" ? (I(d), O({ initial: d, final: o })) : (F(d), O({ initial: a, final: d })), l === "valueInitial" && !o && i && ((B = u.current) == null || B.focus(), setTimeout(() => c(!0), 100)), J && (C(!1), c(!1));
-  }, W = () => {
-    const { disabled: e } = t;
-    return e || D && (D.disabled || D.hideContent);
-  }, Be = Ce(() => P ? /* @__PURE__ */ r.jsx(
-    Ye,
-    {
-      boxShadow: !1,
-      disabled: W(),
-      customClass: "calendar-button",
-      icon: /* @__PURE__ */ r.jsx(G, { name: "calendar" }),
-      onClick: () => {
-        p || v ? Se(te) : re(te);
-      },
-      tabIndex: -1,
-      targetRef: (e) => {
-        ye.current = e;
-      }
-    },
-    "button-open"
-  ) : null, [p, v]), ue = (e, n) => /* @__PURE__ */ r.jsx(qe, { selected: e, handleOnSelect: n }), Pe = () => {
-    c(!1), C(!1), x(!0), g.current && q(g.current.getBoundingClientRect());
-  }, Re = () => {
-    var e;
-    x(!1), (e = u.current) == null || e.focus(), c(!1);
-  }, Ee = Ce(() => /* @__PURE__ */ r.jsx(
-    Ye,
-    {
-      disabled: W(),
-      tabIndex: -1,
-      customClass: "calendar-button",
-      icon: /* @__PURE__ */ r.jsx(G, { name: "more1" }),
-      onBlur: () => setTimeout(() => x(!1), 100),
-      onClick: () => y ? Re() : Pe(),
-      targetRef: (e) => {
-        Me.current = e;
-      }
-    },
-    "button-select-period"
-  ), [y]), L = (e, n, i) => /* @__PURE__ */ r.jsx(
-    Ne,
-    {
-      colorStyle: n,
-      currentDate: e !== void 0 ? s(e) : s(),
-      calendarContainer: (l) => {
-        f.current = l;
-      },
-      onDateChange: (l) => U({ target: { name: i } }, l),
-      currentDateButton: (l) => N.current = l
+  }, N = (e, t, u = !0) => {
+    const c = e ? e.target.name : "", k = l(t, "DD/MM/YYYY");
+    C && f.current?.focus(), Y && a.current?.focus(), c === "valueInitial" ? (w(k), te({
+      initial: k,
+      final: s
+    })) : (M(k), te({
+      initial: r,
+      final: k
+    })), c === "valueInitial" && !s && u && (a.current?.focus(), o(!0)), G && (d(!1), o(!1));
+  }, j = () => {
+    const {
+      disabled: e
+    } = n;
+    return e || m && (m.disabled || m.hideContent);
+  }, we = ce(() => R ? /* @__PURE__ */ i(de, { boxShadow: !1, disabled: j(), customClass: "calendar-button", icon: /* @__PURE__ */ i(W, { name: "calendar" }), onClick: () => {
+    Y || C ? be(Z) : ne(Z);
+  }, tabIndex: -1, targetRef: (e) => {
+    De.current = e;
+  } }, "button-open") : null, [Y, C]), oe = (e, t) => /* @__PURE__ */ i(ye, { selected: e, handleOnSelect: t }), Me = () => {
+    o(!1), d(!1), D(!0), p.current && T(p.current.getBoundingClientRect());
+  }, Se = () => {
+    D(!1), a.current?.focus(), o(!1);
+  }, Fe = ce(() => /* @__PURE__ */ i(de, { disabled: j(), tabIndex: -1, customClass: "calendar-button", icon: /* @__PURE__ */ i(W, { name: "more1" }), onBlur: () => setTimeout(() => D(!1), 100), onClick: () => S ? Se() : Me(), targetRef: (e) => {
+    pe.current = e;
+  } }, "button-select-period"), [S]), O = (e, t, u) => /* @__PURE__ */ i(Oe, { colorStyle: t, currentDate: e !== void 0 ? l(e) : l(), calendarContainer: (c) => {
+    g.current = c;
+  }, onDateChange: (c) => N({
+    target: {
+      name: u
     }
-  ), ce = (e, n) => {
-    var i, l;
+  }, c), currentDateButton: (c) => q.current = c }), ae = (e, t) => {
     if (e === "custom") {
-      (i = m.current) == null || i.focus(), ee(e), x(!1);
+      f.current?.focus(), Q(e), D(!1);
       return;
     }
-    ee(e), n && (I(n[0]), F(n[1])), J && x(!1), (l = u.current) == null || l.focus(), c(!1);
-  }, ke = () => D && D.readOnly ? null : (f && f.current && (f.current.id = "valueInitial"), b ? /* @__PURE__ */ r.jsx(
-    H,
-    {
-      handlerClose: () => K("valueInitial"),
-      dialogSize: T,
-      onOpenChange: C,
-      children: L(a, R, "valueInitial")
-    }
-  ) : /* @__PURE__ */ r.jsx(
-    _,
-    {
-      containerRef: M,
-      showButtonOpen: P,
-      inputDimensions: A,
-      dropdownRef: (e) => {
-        w.current = e;
-      },
-      children: L(a, R, "valueInitial")
-    }
-  )), Oe = () => D && D.readOnly ? null : (f && f.current && (f.current.id = "valueFinal"), b ? /* @__PURE__ */ r.jsx(
-    H,
-    {
-      handlerClose: () => K("valueFinal"),
-      dialogSize: T,
-      onOpenChange: c,
-      children: L(o, R, "valueFinal")
-    }
-  ) : /* @__PURE__ */ r.jsx(
-    _,
-    {
-      containerRef: M,
-      showButtonOpen: P,
-      inputDimensions: A,
-      dropdownRef: (e) => {
-        w.current = e;
-      },
-      children: L(o, R, "valueFinal")
-    }
-  )), Le = () => b ? /* @__PURE__ */ r.jsx(
-    H,
-    {
-      handlerClose: () => K("periodSelection"),
-      dialogSize: T,
-      onOpenChange: x,
-      children: ue(Z, ce)
-    }
-  ) : /* @__PURE__ */ r.jsx(
-    _,
-    {
-      containerRef: M,
-      showButtonOpen: P,
-      inputDimensions: A,
-      dropdownRef: (e) => {
-        w.current = e;
-      },
-      children: ue(Z, ce)
+    Q(e), t && (w(t[0]), M(t[1])), G && D(!1), a.current?.focus(), o(!1);
+  }, Re = () => m && m.readOnly ? null : (g && g.current && (g.current.id = "valueInitial"), I ? /* @__PURE__ */ i($, { handlerClose: () => z("valueInitial"), dialogSize: E, onOpenChange: d, children: O(r, B, "valueInitial") }) : /* @__PURE__ */ i(U, { containerRef: F, showButtonOpen: R, inputDimensions: V, dropdownRef: (e) => {
+    b.current = e;
+  }, children: O(r, B, "valueInitial") })), Be = () => m && m.readOnly ? null : (g && g.current && (g.current.id = "valueFinal"), I ? /* @__PURE__ */ i($, { handlerClose: () => z("valueFinal"), dialogSize: E, onOpenChange: o, children: O(s, B, "valueFinal") }) : /* @__PURE__ */ i(U, { containerRef: F, showButtonOpen: R, inputDimensions: V, dropdownRef: (e) => {
+    b.current = e;
+  }, children: O(s, B, "valueFinal") })), Pe = () => I ? /* @__PURE__ */ i($, { handlerClose: () => z("periodSelection"), dialogSize: E, onOpenChange: D, children: oe(J, ae) }) : /* @__PURE__ */ i(U, { containerRef: F, showButtonOpen: R, inputDimensions: V, dropdownRef: (e) => {
+    b.current = e;
+  }, children: oe(J, ae) });
+  if (L(() => (window.addEventListener("resize", A), document.addEventListener("scroll", y), document.getElementById("modal-dialog-content")?.addEventListener("scroll", y), p.current && A(), f && f.current && (f.current.id = Ce), a && a.current && (a.current.id = Ye), () => {
+    window.removeEventListener("resize", A), document.removeEventListener("scroll", y), document.getElementById("modal-dialog-content")?.removeEventListener("scroll", y);
+  }), []), L(() => (document.addEventListener("keydown", ee), () => {
+    document.removeEventListener("keydown", ee);
+  }), [Y, C, S, g.current]), L(() => {
+    if (s && r && l(s).isBefore(l(r)))
+      w(s), M(r);
+    else if (n.onChange) {
+      const e = r ? r.format("YYYY-MM-DD") : "", t = s ? s.format("YYYY-MM-DD") : "";
+      n.onChange(void 0, "", {
+        initial: e,
+        final: t
+      });
     }
-  );
-  if (D && D.unvisible) return null;
-  const fe = () => /* @__PURE__ */ r.jsxs(
-    "div",
-    {
-      ref: M,
-      onBlur: je,
-      className: "input-base-component datepicker-period-container",
-      children: [
-        t.label && /* @__PURE__ */ r.jsxs("div", { className: "labelcontainer", children: [
-          /* @__PURE__ */ r.jsx(
-            pe,
-            {
-              required: t.required,
-              className: t.customClassForLabel,
-              labelUppercase: t.labelUppercase
-            }
-          ),
-          /* @__PURE__ */ r.jsx(
-            "div",
-            {
-              className: "text-content",
-              style: { display: "flex" },
-              children: /* @__PURE__ */ r.jsxs(
-                "div",
-                {
-                  className: `label ${t.customClassForLabel} ${t.labelUppercase && " -uppercase"}`,
-                  style: { alignSelf: "center" },
-                  children: [
-                    t.label,
-                    t.required && /* @__PURE__ */ r.jsx("span", { className: "-requiredlabel", children: "*" }),
-                    !!E && Q === "onLabelRight" && /* @__PURE__ */ r.jsx(
-                      $e,
-                      {
-                        theme: be,
-                        align: Ie,
-                        iconColor: "#03bde2",
-                        customClass: "-hint",
-                        style: { margin: "0px 5px", height: "auto", width: 20 },
-                        children: E
-                      }
-                    )
-                  ]
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ r.jsx(pe, {})
-        ] }),
-        /* @__PURE__ */ r.jsxs(
-          "div",
-          {
-            className: `periodpicker-component ${Ue({
-              ...t,
-              value: a ? s(a).format("DD/MM/YYYY") : "",
-              disabled: W()
-            })}`,
-            ref: g,
-            children: [
-              /* @__PURE__ */ r.jsx(
-                De,
-                {
-                  gridLayout: void 0,
-                  permissionAttr: t.permissionAttr,
-                  name: "valueInitial",
-                  value: a ? s(a).format("DD/MM/YYYY") : "",
-                  mask: "00/00/0000",
-                  onComplete: (e) => {
-                    U(e, e.target.value, !0);
-                  },
-                  onFocus: ae,
-                  onBlur: (e) => oe(e),
-                  onChange: se,
-                  inputRef: (e) => {
-                    m.current = e;
-                  },
-                  handlerSetOnDenied: (e) => {
-                    ne(e);
-                  },
-                  required: t.required
-                }
-              ),
-              /* @__PURE__ */ r.jsx(G, { name: "arrow_right", customClass: "separation_icon" }),
-              /* @__PURE__ */ r.jsx(
-                De,
-                {
-                  gridLayout: void 0,
-                  permissionAttr: t.permissionAttr,
-                  name: "valueFinal",
-                  value: o ? s(o).format("DD/MM/YYYY") : "",
-                  mask: "00/00/0000",
-                  onComplete: (e) => {
-                    U(e, e.target.value, !0);
-                  },
-                  onFocus: ae,
-                  onBlur: (e) => oe(e),
-                  onChange: se,
-                  inputRef: (e) => {
-                    u.current = e;
-                  },
-                  handlerSetOnDenied: (e) => ne(e),
-                  required: t.required
-                }
-              ),
-              Be(),
-              Ee()
-            ]
-          }
-        ),
-        v && ke(),
-        p && Oe(),
-        y && Le(),
-        /* @__PURE__ */ r.jsx(ze, { visible: !!E && Q === "below", customClass: "hint", description: E }),
-        /* @__PURE__ */ r.jsx(We, { messages: t.errorMessages })
-      ]
+  }, [r, s]), L(() => {
+    if (n.value && !(l(n.value.initial).isSame(r) || l(n.value.final).isSame(s))) {
+      const {
+        initial: e,
+        final: t
+      } = n.value;
+      let u, c;
+      l(e, "YYYY-MM-DD", !0).isValid() && (u = l(e, "YYYY-MM-DD")), l(t, "YYYY-MM-DD", !0).isValid() && (c = l(t, "YYYY-MM-DD")), w(u), M(c);
     }
-  );
-  return X ? /* @__PURE__ */ r.jsx(Ke, { customClass: "-withinput", cols: X, children: fe() }) : fe();
+  }, [n.value]), m && m.unvisible) return null;
+  const ue = () => /* @__PURE__ */ x("div", { ref: F, onBlur: Ie, className: "input-base-component datepicker-period-container", children: [
+    n.label && /* @__PURE__ */ x("div", { className: "labelcontainer", children: [
+      /* @__PURE__ */ i(me, { required: n.required, className: n.customClassForLabel, labelUppercase: n.labelUppercase }),
+      /* @__PURE__ */ i("div", { className: "text-content", style: {
+        display: "flex"
+      }, children: /* @__PURE__ */ x("div", { className: `label ${n.customClassForLabel} ${n.labelUppercase && " -uppercase"}`, style: {
+        alignSelf: "center"
+      }, children: [
+        n.label,
+        n.required && /* @__PURE__ */ i("span", { className: "-requiredlabel", children: "*" }),
+        !!P && H === "onLabelRight" && /* @__PURE__ */ i(Ve, { theme: ve, align: he, iconColor: "#03bde2", customClass: "-hint", style: {
+          margin: "0px 5px",
+          height: "auto",
+          width: 20
+        }, children: P })
+      ] }) }),
+      /* @__PURE__ */ i(me, {})
+    ] }),
+    /* @__PURE__ */ x("div", { className: `periodpicker-component ${Le({
+      ...n,
+      value: r ? l(r).format("DD/MM/YYYY") : "",
+      disabled: j()
+    })}`, ref: p, children: [
+      /* @__PURE__ */ i(fe, { gridLayout: void 0, permissionAttr: n.permissionAttr, name: "valueInitial", value: r ? l(r).format("DD/MM/YYYY") : "", mask: "00/00/0000", onComplete: (e) => {
+        N(e, e.target.value, !0);
+      }, onFocus: ie, onBlur: (e) => le(e), onChange: re, inputRef: (e) => {
+        f.current = e;
+      }, handlerSetOnDenied: (e) => {
+        X(e);
+      }, required: n.required }),
+      /* @__PURE__ */ i(W, { name: "arrow_right", customClass: "separation_icon" }),
+      /* @__PURE__ */ i(fe, { gridLayout: void 0, permissionAttr: n.permissionAttr, name: "valueFinal", value: s ? l(s).format("DD/MM/YYYY") : "", mask: "00/00/0000", onComplete: (e) => {
+        N(e, e.target.value, !0);
+      }, onFocus: ie, onBlur: (e) => le(e), onChange: re, inputRef: (e) => {
+        a.current = e;
+      }, handlerSetOnDenied: (e) => X(e), required: n.required }),
+      we(),
+      Fe()
+    ] }),
+    C && Re(),
+    Y && Be(),
+    S && Pe(),
+    /* @__PURE__ */ i(ke, { visible: !!P && H === "below", customClass: "hint", description: P }),
+    /* @__PURE__ */ i(Ee, { messages: n.errorMessages })
+  ] });
+  return K ? /* @__PURE__ */ i(xe, { customClass: "-withinput", cols: K, children: ue() }) : ue();
 };
 export {
-  mn as default
+  tn as default
 };
+//# sourceMappingURL=index.js.map