@dialpad/dialtone 9.158.0 → 9.159.0

package/dist/vue3/lib/datepicker/datepicker.js

@@ -1,104 +1,137 @@
-import { ref as E, computed as B, watch as F, onMounted as V, openBlock as $, createBlock as G, unref as e, withCtx as m, createVNode as i, createElementVNode as M, toDisplayString as P, nextTick as N, createElementBlock as g, Fragment as x, renderList as Y, normalizeClass as q, createTextVNode as W, getCurrentInstance as j } from "vue";
-import { DtIconChevronsLeft as J, DtIconChevronLeft as Q, DtIconChevronRight as Z, DtIconChevronsRight as ee } from "@dialpad/dialtone-icons/vue3";
-import { getMonth as K, getYear as S, getDate as te, set as ae, addMonths as ne, subMonths as re } from "date-fns";
-import { getCalendarDays as le, formatMonth as oe, getWeekDayNames as se, calculateNextFocusDate as ce, calculatePrevFocusDate as ue, formatDate as ie } from "./utils.js";
-import { INTL_MONTH_FORMAT as U, WEEK_START as de } from "./datepicker-constants.js";
-import { returnFirstEl as p, warnIfUnmounted as fe } from "../../common/utils/index.js";
-import { DialtoneLocalization as z } from "../../localization/index.js";
-import R from "../stack/stack.js";
-import w from "../tooltip/tooltip.js";
-import I from "../button/button.js";
-function ve(d, s) {
-  const c = E(K(d.selectedDate)), t = E(S(d.selectedDate)), n = E(null), r = E(0), D = E([]), v = new z(), b = B(() => le(c.value, t.value, n.value));
-  F(c, () => {
-    l(), s("calendar-days", b.value);
-  }, { immediate: !0 }), F(t, () => {
-    l(), s("calendar-days", b.value);
-  }, { immediate: !0 });
-  function k(a) {
-    return oe(a, U, v.currentLocale);
+import { ref as E, computed as N, watch as w, onMounted as Z, openBlock as $, createBlock as ee, unref as t, withCtx as p, createVNode as d, createElementVNode as M, toDisplayString as O, nextTick as L, createElementBlock as g, Fragment as B, renderList as V, normalizeClass as ne, createTextVNode as le, getCurrentInstance as re } from "vue";
+import { DtIconChevronsLeft as oe, DtIconChevronLeft as se, DtIconChevronRight as ue, DtIconChevronsRight as ie } from "@dialpad/dialtone-icons/vue3";
+import { getMonth as G, getYear as q, subMonths as W, endOfMonth as j, startOfDay as P, addMonths as J, startOfMonth as Q, getDate as ce, set as de } from "date-fns";
+import { getCalendarDays as fe, formatMonth as De, getWeekDayNames as ve, calculateNextFocusDate as me, calculatePrevFocusDate as pe, formatDate as ke } from "./utils.js";
+import { INTL_MONTH_FORMAT as te, WEEK_START as be } from "./datepicker-constants.js";
+import { returnFirstEl as v, warnIfUnmounted as ye } from "../../common/utils/index.js";
+import { DialtoneLocalization as U } from "../../localization/index.js";
+import Y from "../stack/stack.js";
+import R from "../tooltip/tooltip.js";
+import C from "../button/button.js";
+function he(l, o) {
+  const u = E(G(l.selectedDate)), a = E(q(l.selectedDate)), n = E(null), r = E(0), m = E([]), D = new U(), h = N(() => fe(u.value, a.value, n.value, l.minDate, l.maxDate)), k = N(() => {
+    if (!l.minDate) return !1;
+    const e = W(new Date(a.value, u.value, 1), 1);
+    return j(e) < P(l.minDate);
+  }), _ = N(() => {
+    if (!l.maxDate) return !1;
+    const e = J(new Date(a.value, u.value, 1), 1);
+    return Q(e) > P(l.maxDate);
+  }), b = N(() => {
+    if (!l.minDate) return !1;
+    const e = new Date(a.value - 1, u.value, 1);
+    return j(e) < P(l.minDate);
+  }), T = N(() => {
+    if (!l.maxDate) return !1;
+    const e = new Date(a.value + 1, u.value, 1);
+    return Q(e) > P(l.maxDate);
+  });
+  w(u, () => {
+    x(), o("calendar-days", h.value);
+  }, { immediate: !0 }), w(a, () => {
+    x(), o("calendar-days", h.value);
+  }, { immediate: !0 }), w(() => l.minDate, () => {
+    o("calendar-days", h.value);
+  }), w(() => l.maxDate, () => {
+    o("calendar-days", h.value);
+  });
+  function s(e) {
+    return De(e, te, D.currentLocale);
   }
-  function h(a) {
-    D.value.includes(a) || D.value.push(a);
+  function i(e) {
+    m.value.includes(e) || m.value.push(e);
   }
-  function _() {
-    p(D.value[0].$el).focus();
+  function A() {
+    v(m.value[0].$el).focus();
   }
-  function A(a) {
-    switch (a.key) {
+  function f(e) {
+    switch (e.key) {
       case "ArrowLeft":
-        a.preventDefault(), r.value === 0 ? (r.value = 3, p(D.value[r.value].$el).focus()) : (r.value--, p(D.value[r.value].$el).focus());
+        e.preventDefault(), r.value === 0 ? (r.value = 3, v(m.value[r.value].$el).focus()) : (r.value--, v(m.value[r.value].$el).focus());
         break;
       case "ArrowRight":
-        a.preventDefault(), r.value === 3 ? (r.value = 0, p(D.value[r.value].$el).focus()) : (r.value++, p(D.value[r.value].$el).focus());
+        e.preventDefault(), r.value === 3 ? (r.value = 0, v(m.value[r.value].$el).focus()) : (r.value++, v(m.value[r.value].$el).focus());
         break;
       case "ArrowDown":
-        a.preventDefault(), s("focus-first-day");
+        e.preventDefault(), o("focus-first-day");
         break;
       case "Tab":
-        a.preventDefault(), s("focus-first-day");
+        e.preventDefault(), o("focus-first-day");
         break;
       case "Escape":
-        s("close-datepicker");
+        o("close-datepicker");
         break;
     }
   }
-  function l() {
-    const a = S(d.selectedDate), L = K(d.selectedDate);
-    a !== t.value || L !== c.value ? n.value = null : n.value = te(d.selectedDate);
+  function x() {
+    const e = q(l.selectedDate), I = G(l.selectedDate);
+    e !== a.value || I !== u.value ? n.value = null : n.value = ce(l.selectedDate);
   }
-  function o(a) {
-    (c.value === 0 && a === -1 || c.value === 11 && a === 1) && (t.value += a);
-    const L = ae(d.selectedDate, { month: c.value, year: t.value }), X = a === 1 ? ne(L, 1) : re(L, 1);
-    c.value = K(X);
+  function y(e) {
+    if (e === -1 && k.value || e === 1 && _.value) return;
+    (u.value === 0 && e === -1 || u.value === 11 && e === 1) && (a.value += e);
+    const I = de(l.selectedDate, { month: u.value, year: a.value }), ae = e === 1 ? J(I, 1) : W(I, 1);
+    u.value = G(ae);
   }
-  function T(a) {
-    t.value = t.value + a;
+  function K(e) {
+    e === -1 && b.value || e === 1 && T.value || (a.value = a.value + e);
   }
-  function f() {
-    o(1);
+  function F() {
+    y(1);
   }
-  function C() {
-    o(-1);
+  function z() {
+    y(-1);
   }
-  function y() {
-    return `${v.$t("DIALTONE_DATEPICKER_CHANGE_TO")} ${v.$t("DIALTONE_DATEPICKER_PREVIOUS_YEAR")} ${t.value - 1}`;
+  function H() {
+    return `${D.$t("DIALTONE_DATEPICKER_CHANGE_TO")} ${D.$t("DIALTONE_DATEPICKER_PREVIOUS_YEAR")} ${a.value - 1}`;
   }
-  function O() {
-    return `${v.$t("DIALTONE_DATEPICKER_CHANGE_TO")} ${v.$t("DIALTONE_DATEPICKER_PREVIOUS_MONTH")} ${k(c.value - 1)}`;
+  function S() {
+    return `${D.$t("DIALTONE_DATEPICKER_CHANGE_TO")} ${D.$t("DIALTONE_DATEPICKER_PREVIOUS_MONTH")} ${s(u.value - 1)}`;
   }
-  function H() {
-    return `${v.$t("DIALTONE_DATEPICKER_CHANGE_TO")} ${v.$t("DIALTONE_DATEPICKER_NEXT_YEAR")} ${t.value + 1}`;
+  function X() {
+    return `${D.$t("DIALTONE_DATEPICKER_CHANGE_TO")} ${D.$t("DIALTONE_DATEPICKER_NEXT_YEAR")} ${a.value + 1}`;
   }
-  function u() {
-    return `${v.$t("DIALTONE_DATEPICKER_CHANGE_TO")} ${v.$t("DIALTONE_DATEPICKER_NEXT_MONTH")} ${k(c.value + 1)}`;
+  function c() {
+    return `${D.$t("DIALTONE_DATEPICKER_CHANGE_TO")} ${D.$t("DIALTONE_DATEPICKER_NEXT_MONTH")} ${s(u.value + 1)}`;
   }
   return {
-    selectMonth: c,
-    selectYear: t,
-    formattedMonth: k,
-    setDayRef: h,
-    focusMonthYearPicker: _,
-    handleKeyDown: A,
-    changeMonth: o,
-    changeYear: T,
-    goToNextMonth: f,
-    goToPrevMonth: C,
-    previousYearAriaLabel: y,
-    previousMonthAriaLabel: O,
-    nextYearAriaLabel: H,
-    nextMonthAriaLabel: u
+    selectMonth: u,
+    selectYear: a,
+    formattedMonth: s,
+    setDayRef: i,
+    focusMonthYearPicker: A,
+    handleKeyDown: f,
+    changeMonth: y,
+    changeYear: K,
+    goToNextMonth: F,
+    goToPrevMonth: z,
+    isPrevMonthDisabled: k,
+    isNextMonthDisabled: _,
+    isPrevYearDisabled: b,
+    isNextYearDisabled: T,
+    previousYearAriaLabel: H,
+    previousMonthAriaLabel: S,
+    nextYearAriaLabel: X,
+    nextMonthAriaLabel: c
   };
 }
-const pe = {
+const _e = {
   id: "calendar-heading",
   class: "d-datepicker__month-year-title"
-}, De = {
+}, $e = {
   __name: "month-year-picker",
   props: {
     selectedDate: {
       type: Date,
       required: !0
+    },
+    minDate: {
+      type: Date,
+      default: null
+    },
+    maxDate: {
+      type: Date,
+      default: null
     }
   },
   emits: [
@@ -128,166 +161,174 @@ const pe = {
        */
     "close-datepicker"
   ],
-  setup(d, { expose: s, emit: c }) {
-    const t = d, n = c, r = new z(), {
-      selectMonth: D,
-      selectYear: v,
-      formattedMonth: b,
+  setup(l, { expose: o, emit: u }) {
+    const a = l, n = u, r = new U(), {
+      selectMonth: m,
+      selectYear: D,
+      formattedMonth: h,
       setDayRef: k,
-      focusMonthYearPicker: h,
-      handleKeyDown: _,
-      changeMonth: A,
-      changeYear: l,
-      goToNextMonth: o,
-      goToPrevMonth: T,
-      previousYearAriaLabel: f,
-      previousMonthAriaLabel: C,
-      nextMonthAriaLabel: y,
-      nextYearAriaLabel: O
-    } = ve(t, n);
-    return V(() => {
-      h();
-    }), s({
-      focusMonthYearPicker: h,
-      goToNextMonth: o,
-      goToPrevMonth: T
-    }), (H, u) => ($(), G(e(R), {
+      focusMonthYearPicker: _,
+      handleKeyDown: b,
+      changeMonth: T,
+      changeYear: s,
+      goToNextMonth: i,
+      goToPrevMonth: A,
+      isPrevMonthDisabled: f,
+      isNextMonthDisabled: x,
+      isPrevYearDisabled: y,
+      isNextYearDisabled: K,
+      previousYearAriaLabel: F,
+      previousMonthAriaLabel: z,
+      nextMonthAriaLabel: H,
+      nextYearAriaLabel: S
+    } = he(a, n);
+    return Z(() => {
+      _();
+    }), o({
+      focusMonthYearPicker: _,
+      goToNextMonth: i,
+      goToPrevMonth: A
+    }), (X, c) => ($(), ee(t(Y), {
       class: "d-datepicker__month-year",
       direction: "row",
       gap: "300"
     }, {
-      default: m(() => [
-        i(e(R), {
+      default: p(() => [
+        d(t(Y), {
           as: "nav",
           class: "d-datepicker__nav",
           direction: "row",
           gap: "200"
         }, {
-          default: m(() => [
-            i(e(w), {
+          default: p(() => [
+            d(t(R), {
               "fallback-placements": ["top-start", "auto"],
-              message: e(r).$t("DIALTONE_DATEPICKER_PREVIOUS_YEAR"),
+              message: t(r).$t("DIALTONE_DATEPICKER_PREVIOUS_YEAR"),
               placement: "top"
             }, {
-              anchor: m(() => [
-                i(e(I), {
+              anchor: p(() => [
+                d(t(C), {
                   id: "prevYearButton",
-                  ref: (a) => {
-                    a && e(k)(a);
+                  ref: (e) => {
+                    e && t(k)(e);
                   },
-                  "aria-label": e(f)(),
+                  "aria-label": t(F)(),
                   circle: !0,
+                  disabled: t(y),
                   class: "d-datepicker__nav-btn",
                   importance: "clear",
                   kind: "muted",
                   size: "xs",
                   type: "button",
-                  onClick: u[0] || (u[0] = (a) => e(l)(-1)),
-                  onKeydown: u[1] || (u[1] = (a) => e(_)(a))
+                  onClick: c[0] || (c[0] = (e) => t(s)(-1)),
+                  onKeydown: c[1] || (c[1] = (e) => t(b)(e))
                 }, {
-                  default: m(() => [
-                    i(e(J), { size: "200" })
+                  default: p(() => [
+                    d(t(oe), { size: "200" })
                   ]),
                   _: 1
-                }, 8, ["aria-label"])
+                }, 8, ["aria-label", "disabled"])
               ]),
               _: 1
             }, 8, ["message"]),
-            i(e(w), {
+            d(t(R), {
               "fallback-placements": ["top-start", "auto"],
-              message: e(r).$t("DIALTONE_DATEPICKER_PREVIOUS_MONTH"),
+              message: t(r).$t("DIALTONE_DATEPICKER_PREVIOUS_MONTH"),
               placement: "top"
             }, {
-              anchor: m(() => [
-                i(e(I), {
+              anchor: p(() => [
+                d(t(C), {
                   id: "prevMonthButton",
-                  ref: (a) => {
-                    a && e(k)(a);
+                  ref: (e) => {
+                    e && t(k)(e);
                   },
-                  "aria-label": e(C)(),
+                  "aria-label": t(z)(),
                   circle: !0,
+                  disabled: t(f),
                   class: "d-datepicker__nav-btn",
                   importance: "clear",
                   kind: "muted",
                   size: "xs",
                   type: "button",
-                  onClick: u[2] || (u[2] = (a) => e(A)(-1)),
-                  onKeydown: u[3] || (u[3] = (a) => e(_)(a))
+                  onClick: c[2] || (c[2] = (e) => t(T)(-1)),
+                  onKeydown: c[3] || (c[3] = (e) => t(b)(e))
                 }, {
-                  default: m(() => [
-                    i(e(Q), { size: "200" })
+                  default: p(() => [
+                    d(t(se), { size: "200" })
                   ]),
                   _: 1
-                }, 8, ["aria-label"])
+                }, 8, ["aria-label", "disabled"])
               ]),
               _: 1
             }, 8, ["message"])
           ]),
           _: 1
         }),
-        M("div", pe, P(e(b)(e(D))) + " " + P(e(v)), 1),
-        i(e(R), {
+        M("div", _e, O(t(h)(t(m))) + " " + O(t(D)), 1),
+        d(t(Y), {
           as: "nav",
           class: "d-datepicker__nav",
           direction: "row",
           gap: "200"
         }, {
-          default: m(() => [
-            i(e(w), {
+          default: p(() => [
+            d(t(R), {
               "fallback-placements": ["top-end", "auto"],
-              message: e(r).$t("DIALTONE_DATEPICKER_NEXT_MONTH"),
+              message: t(r).$t("DIALTONE_DATEPICKER_NEXT_MONTH"),
               placement: "top"
             }, {
-              anchor: m(() => [
-                i(e(I), {
+              anchor: p(() => [
+                d(t(C), {
                   id: "nextMonthButton",
-                  ref: (a) => {
-                    a && e(k)(a);
+                  ref: (e) => {
+                    e && t(k)(e);
                   },
-                  "aria-label": e(y)(),
+                  "aria-label": t(H)(),
                   circle: !0,
+                  disabled: t(x),
                   class: "d-datepicker__nav-btn",
                   importance: "clear",
                   kind: "muted",
                   size: "xs",
                   type: "button",
-                  onClick: u[4] || (u[4] = (a) => e(A)(1)),
-                  onKeydown: u[5] || (u[5] = (a) => e(_)(a))
+                  onClick: c[4] || (c[4] = (e) => t(T)(1)),
+                  onKeydown: c[5] || (c[5] = (e) => t(b)(e))
                 }, {
-                  default: m(() => [
-                    i(e(Z), { size: "200" })
+                  default: p(() => [
+                    d(t(ue), { size: "200" })
                   ]),
                   _: 1
-                }, 8, ["aria-label"])
+                }, 8, ["aria-label", "disabled"])
               ]),
               _: 1
             }, 8, ["message"]),
-            i(e(w), {
+            d(t(R), {
               "fallback-placements": ["top-end", "auto"],
-              message: e(r).$t("DIALTONE_DATEPICKER_NEXT_YEAR"),
+              message: t(r).$t("DIALTONE_DATEPICKER_NEXT_YEAR"),
               placement: "top"
             }, {
-              anchor: m(() => [
-                i(e(I), {
+              anchor: p(() => [
+                d(t(C), {
                   id: "nextYearButton",
-                  ref: (a) => {
-                    a && e(k)(a);
+                  ref: (e) => {
+                    e && t(k)(e);
                   },
-                  "aria-label": e(O)(),
+                  "aria-label": t(S)(),
                   circle: !0,
+                  disabled: t(K),
                   class: "d-datepicker__nav-btn",
                   importance: "clear",
                   kind: "muted",
                   size: "xs",
                   type: "button",
-                  onClick: u[6] || (u[6] = (a) => e(l)(1)),
-                  onKeydown: u[7] || (u[7] = (a) => e(_)(a))
+                  onClick: c[6] || (c[6] = (e) => t(s)(1)),
+                  onKeydown: c[7] || (c[7] = (e) => t(b)(e))
                 }, {
-                  default: m(() => [
-                    i(e(ee), { size: "200" })
+                  default: p(() => [
+                    d(t(ie), { size: "200" })
                   ]),
                   _: 1
-                }, 8, ["aria-label"])
+                }, 8, ["aria-label", "disabled"])
               ]),
               _: 1
             }, 8, ["message"])
@@ -299,82 +340,82 @@ const pe = {
     }));
   }
 };
-function me(d, s) {
-  const c = E(null), t = E(0), n = E([]), r = new z(), D = B(() => se(d.locale, de));
-  F(() => d.calendarDays, () => {
-    t.value = 0, n.value = [], c.value = null;
+function Ee(l, o) {
+  const u = E(null), a = E(0), n = E([]), r = new U(), m = N(() => ve(l.locale, be));
+  w(() => l.calendarDays, () => {
+    a.value = 0, n.value = [], u.value = null;
   });
-  function v(l) {
-    return r.$t("DIALTONE_DATEPICKER_SELECT_DAY") + ` ${ie(l.value, U, r.currentLocale)}`;
+  function D(s) {
+    return r.$t("DIALTONE_DATEPICKER_SELECT_DAY") + ` ${ke(s.value, te, r.currentLocale)}`;
   }
-  function b(l, o) {
-    !n.value.some((T) => T.el === l) && o.currentMonth && n.value.push({ el: l, day: o });
+  function h(s, i) {
+    !n.value.some((A) => A.el === s) && !i.disabled && n.value.push({ el: s, day: i });
   }
-  function k(l) {
-    switch (l.key) {
+  function k(s) {
+    switch (s.key) {
       case "ArrowUp":
-        l.preventDefault(), t.value -= 7;
+        s.preventDefault(), a.value -= 7;
         try {
-          p(n.value[t.value].el.$el).focus();
+          v(n.value[a.value].el.$el).focus();
         } catch {
-          const o = ue(n.value[t.value + 7].day.value);
-          s("go-to-prev-month"), N(() => {
-            p(n.value[o - 1].el.$el).focus(), t.value += o - 1;
+          const i = pe(n.value[a.value + 7].day.value);
+          o("go-to-prev-month"), L(() => {
+            v(n.value[i - 1].el.$el).focus(), a.value += i - 1;
           });
         }
         break;
       case "ArrowDown":
-        l.preventDefault(), t.value += 7;
+        s.preventDefault(), a.value += 7;
         try {
-          p(n.value[t.value].el.$el).focus();
+          v(n.value[a.value].el.$el).focus();
         } catch {
-          const o = ce(n.value[t.value - 7].day.value);
-          s("go-to-next-month"), N(() => {
-            p(n.value[o - 1].el.$el).focus(), t.value += o - 1;
+          const i = me(n.value[a.value - 7].day.value);
+          o("go-to-next-month"), L(() => {
+            v(n.value[i - 1].el.$el).focus(), a.value += i - 1;
           });
         }
         break;
       case "ArrowLeft":
-        l.preventDefault(), t.value > 0 ? (t.value -= 1, p(n.value[t.value].el.$el).focus()) : (s("go-to-prev-month"), _());
+        s.preventDefault(), a.value > 0 ? (a.value -= 1, v(n.value[a.value].el.$el).focus()) : (o("go-to-prev-month"), b());
         break;
       case "ArrowRight":
-        l.preventDefault(), t.value < n.value.length - 1 ? (t.value += 1, p(n.value[t.value].el.$el).focus()) : (s("go-to-next-month"), h());
+        s.preventDefault(), a.value < n.value.length - 1 ? (a.value += 1, v(n.value[a.value].el.$el).focus()) : (o("go-to-next-month"), _());
         break;
       case "Tab":
-        l.preventDefault(), s("focus-month-year-picker");
+        s.preventDefault(), o("focus-month-year-picker");
         break;
       case "Escape":
-        s("close-datepicker");
+        o("close-datepicker");
         break;
     }
   }
-  function h() {
-    t.value = 0, N(() => {
-      p(n.value[t.value].el.$el).focus();
+  function _() {
+    a.value = 0, L(() => {
+      v(n.value[a.value].el.$el).focus();
     });
   }
-  function _() {
-    N(() => {
-      t.value = n.value.length - 1, p(n.value[t.value].el.$el).focus();
+  function b() {
+    L(() => {
+      a.value = n.value.length - 1, v(n.value[a.value].el.$el).focus();
     });
   }
-  function A(l) {
-    l.currentMonth && (c.value = l.text, s("select-date", l.value));
+  function T(s) {
+    s.disabled || (u.value = s.text, o("select-date", s.value));
   }
   return {
-    selectedDay: c,
-    weekDays: D,
-    dayAriaLabel: v,
-    setDayRef: b,
+    selectedDay: u,
+    weekDays: m,
+    dayAriaLabel: D,
+    setDayRef: h,
     handleKeyDown: k,
-    focusFirstDay: h,
-    selectDay: A
+    focusFirstDay: _,
+    selectDay: T
   };
 }
-const ke = {
+const Te = {
   class: "d-datepicker__calendar",
   "aria-labelledby": "calendar-heading"
-}, _e = ["title", "aria-label"], he = {
+}, Ae = ["title", "aria-label"], ge = {
   __name: "calendar",
   props: {
     calendarDays: {
@@ -415,63 +456,63 @@ const ke = {
        */
     "go-to-prev-month"
   ],
-  setup(d, { expose: s, emit: c }) {
-    const t = d, n = c, {
+  setup(l, { expose: o, emit: u }) {
+    const a = l, n = u, {
       selectedDay: r,
-      weekDays: D,
-      dayAriaLabel: v,
-      setDayRef: b,
+      weekDays: m,
+      dayAriaLabel: D,
+      setDayRef: h,
       handleKeyDown: k,
-      focusFirstDay: h,
-      selectDay: _
-    } = me(t, n);
-    return s({
-      focusFirstDay: h
-    }), (A, l) => ($(), g("table", ke, [
+      focusFirstDay: _,
+      selectDay: b
+    } = Ee(a, n);
+    return o({
+      focusFirstDay: _
+    }), (T, s) => ($(), g("table", Te, [
       M("thead", null, [
         M("tr", null, [
-          ($(!0), g(x, null, Y(e(D), (o) => ($(), g("th", {
-            key: o,
+          ($(!0), g(B, null, V(t(m), (i) => ($(), g("th", {
+            key: i,
             scope: "col",
             class: "d-datepicker__cell d-datepicker__cell--header"
           }, [
             M("span", {
               class: "d-datepicker__weekday",
-              title: o,
-              "aria-label": o
-            }, P(o), 9, _e)
+              title: i,
+              "aria-label": i
+            }, O(i), 9, Ae)
           ]))), 128))
         ])
       ]),
       M("tbody", null, [
-        ($(!0), g(x, null, Y(d.calendarDays, (o, T) => ($(), g("tr", { key: T }, [
-          ($(!0), g(x, null, Y(o.days, (f, C) => ($(), g("td", {
-            key: T + C,
+        ($(!0), g(B, null, V(l.calendarDays, (i, A) => ($(), g("tr", { key: A }, [
+          ($(!0), g(B, null, V(i.days, (f, x) => ($(), g("td", {
+            key: A + x,
             class: "d-datepicker__cell",
             role: "listbox"
           }, [
-            i(e(I), {
+            d(t(C), {
               ref_for: !0,
               ref: (y) => {
-                y && e(b)(y, f);
+                y && t(h)(y, f);
               },
-              class: q(["d-datepicker__day", {
-                "d-datepicker__day--disabled": !f.currentMonth,
-                "d-datepicker__day--selected": e(r) ? f.text === e(r) && f.currentMonth : f.selected
+              class: ne(["d-datepicker__day", {
+                "d-datepicker__day--disabled": f.disabled,
+                "d-datepicker__day--selected": t(r) ? f.text === t(r) && !f.disabled : f.selected
               }]),
               circle: !0,
               size: "sm",
               importance: "clear",
-              disabled: !f.currentMonth,
+              disabled: f.disabled,
               type: "button",
-              "aria-selected": e(r) ? f.text === e(r) && f.currentMonth : f.selected,
-              "aria-label": e(v)(f),
+              "aria-selected": t(r) ? f.text === t(r) && !f.disabled : f.selected,
+              "aria-label": t(D)(f),
               role: "option",
-              onClick: (y) => e(_)(f),
-              onKeydown: l[0] || (l[0] = (y) => e(k)(y))
+              onClick: (y) => t(b)(f),
+              onKeydown: s[0] || (s[0] = (y) => t(k)(y))
             }, {
-              default: m(() => [
-                W(P(f.text), 1)
+              default: p(() => [
+                le(O(f.text), 1)
               ]),
               _: 2
             }, 1032, ["disabled", "class", "aria-selected", "aria-label", "onClick"])
@@ -480,7 +521,7 @@ const ke = {
       ])
     ]));
   }
-}, ye = { class: "d-datepicker__hd" }, $e = { class: "d-datepicker__bd" }, we = {
+}, Me = { class: "d-datepicker__hd" }, xe = { class: "d-datepicker__bd" }, Fe = {
   __name: "datepicker",
   props: {
     /**
@@ -491,6 +532,27 @@ const ke = {
     selectedDate: {
       type: Date,
       default: () => /* @__PURE__ */ new Date()
+    },
+    /**
+       * Minimum selectable date. Days before this date will be disabled.
+       * Must be before or equal to maxDate when both are provided.
+       *
+       * @type {Date}
+       */
+    minDate: {
+      type: Date,
+      default: null
+    },
+    /**
+       * Maximum selectable date. Days after this date will be disabled.
+       * Must be after or equal to minDate when both are provided.
+       *
+       * @type {Date}
+       */
+    maxDate: {
+      type: Date,
+      default: null,
+      validator: (l, o) => l && o.minDate && l < o.minDate ? (console.warn("[DtDatepicker]: maxDate must be after or equal to minDate."), !1) : !0
     }
   },
   emits: [
@@ -508,38 +570,40 @@ const ke = {
        */
     "close-datepicker"
   ],
-  setup(d) {
-    const s = E([]);
-    function c(t) {
-      s.value = t;
+  setup(l) {
+    const o = E([]);
+    function u(a) {
+      o.value = a;
     }
-    return V(() => {
-      const t = j();
-      fe(p(t.proxy.$el), "datepicker");
-    }), (t, n) => ($(), G(e(R), {
+    return Z(() => {
+      const a = re();
+      ye(v(a.proxy.$el), "datepicker");
+    }), (a, n) => ($(), ee(t(Y), {
       class: "d-datepicker",
       gap: "400"
     }, {
-      default: m(() => [
-        M("div", ye, [
-          i(De, {
+      default: p(() => [
+        M("div", Me, [
+          d($e, {
             ref: "monthYearPicker",
-            "selected-date": d.selectedDate,
-            onCalendarDays: c,
-            onFocusFirstDay: n[0] || (n[0] = (r) => t.$refs.calendar.focusFirstDay()),
-            onFocusLastDay: n[1] || (n[1] = (r) => t.$refs.calendar.focusLastDay()),
-            onCloseDatepicker: n[2] || (n[2] = (r) => t.$emit("close-datepicker"))
-          }, null, 8, ["selected-date"])
+            "selected-date": l.selectedDate,
+            "min-date": l.minDate,
+            "max-date": l.maxDate,
+            onCalendarDays: u,
+            onFocusFirstDay: n[0] || (n[0] = (r) => a.$refs.calendar.focusFirstDay()),
+            onFocusLastDay: n[1] || (n[1] = (r) => a.$refs.calendar.focusLastDay()),
+            onCloseDatepicker: n[2] || (n[2] = (r) => a.$emit("close-datepicker"))
+          }, null, 8, ["selected-date", "min-date", "max-date"])
         ]),
-        M("div", $e, [
-          i(he, {
+        M("div", xe, [
+          d(ge, {
             ref: "calendar",
-            "calendar-days": s.value,
-            onSelectDate: n[3] || (n[3] = (r) => t.$emit("selected-date", r)),
-            onFocusMonthYearPicker: n[4] || (n[4] = (r) => t.$refs.monthYearPicker.focusMonthYearPicker()),
-            onCloseDatepicker: n[5] || (n[5] = (r) => t.$emit("close-datepicker")),
-            onGoToNextMonth: n[6] || (n[6] = (r) => t.$refs.monthYearPicker.goToNextMonth()),
-            onGoToPrevMonth: n[7] || (n[7] = (r) => t.$refs.monthYearPicker.goToPrevMonth())
+            "calendar-days": o.value,
+            onSelectDate: n[3] || (n[3] = (r) => a.$emit("selected-date", r)),
+            onFocusMonthYearPicker: n[4] || (n[4] = (r) => a.$refs.monthYearPicker.focusMonthYearPicker()),
+            onCloseDatepicker: n[5] || (n[5] = (r) => a.$emit("close-datepicker")),
+            onGoToNextMonth: n[6] || (n[6] = (r) => a.$refs.monthYearPicker.goToNextMonth()),
+            onGoToPrevMonth: n[7] || (n[7] = (r) => a.$refs.monthYearPicker.goToPrevMonth())
           }, null, 8, ["calendar-days"])
         ])
       ]),
@@ -548,6 +612,6 @@ const ke = {
   }
 };
 export {
-  we as default
+  Fe as default
 };
 //# sourceMappingURL=datepicker.js.map