@adyen/bento-vue3 1.34.0 → 1.35.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/@types/packages/vue2/src/components/checkbox/checkbox.vue.d.ts +1 -1
- package/dist/@types/packages/vue2/src/components/checkbox/components/checkbox-group/checkbox-group.vue.d.ts +1 -1
- package/dist/@types/packages/vue2/src/components/code-snippet/code-snippet.vue.d.ts +1 -1
- package/dist/@types/packages/vue2/src/components/data-grid/components/data-grid-config-settings/data-grid-config-settings.vue.d.ts +1 -1
- package/dist/@types/packages/vue2/src/components/dropdown/composables/use-display-value.d.ts +1 -1
- package/dist/@types/packages/vue2/src/components/dropdown/composables/use-display-value.types.d.ts +1 -0
- package/dist/@types/packages/vue2/src/components/filter-bar/components/select-filter/variants/select-avatar-filter/select-avatar-filter.vue.d.ts +7 -7
- package/dist/@types/packages/vue2/src/components/filter-bar/components/select-filter/variants/select-country-filter/select-country-filter.vue.d.ts +1 -1
- package/dist/@types/packages/vue2/src/components/filter-bar/components/select-filter/variants/select-currency-filter/select-currency-filter.vue.d.ts +7 -7
- package/dist/@types/packages/vue2/src/components/filter-bar/components/select-filter/variants/select-payment-method-filter/select-payment-method-filter.vue.d.ts +7 -7
- package/dist/@types/packages/vue2/src/components/filter-bar/components/select-filter/variants/select-tag-filter/select-tag-filter.vue.d.ts +7 -7
- package/dist/@types/packages/vue2/src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/components/listbox-multi-select-category/listbox-multi-select-category.vue.d.ts +1 -1
- package/dist/@types/packages/vue2/src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/listbox-multi-select-options.vue.d.ts +2 -2
- package/dist/@types/packages/vue2/src/components/internal/listbox/components/listbox-multi-select/listbox-multi-select.vue.d.ts +3 -3
- package/dist/@types/packages/vue2/src/components/internal/listbox/listbox.vue.d.ts +3 -3
- package/dist/@types/packages/vue2/src/utils/ts/get-date-locale/get-date-locale.d.ts +11 -0
- package/dist/accordion.js +1 -1
- package/dist/action-bar.js +1 -1
- package/dist/alert.js +1 -1
- package/dist/assets/accordion-item.css +1 -1
- package/dist/assets/action-bar.css +1 -1
- package/dist/assets/avatar.css +1 -1
- package/dist/assets/base-modal.css +1 -1
- package/dist/assets/calendar.css +1 -1
- package/dist/assets/card.css +1 -1
- package/dist/assets/checkbox.css +1 -1
- package/dist/assets/code-snippet.css +1 -1
- package/dist/assets/currency.css +1 -0
- package/dist/assets/data-grid.css +1 -1
- package/dist/assets/date-range-picker.css +1 -1
- package/dist/assets/dialog-page.css +1 -1
- package/dist/assets/dropdown.css +1 -1
- package/dist/assets/error-message.css +1 -1
- package/dist/assets/filter-bar.css +1 -1
- package/dist/assets/header.css +1 -1
- package/dist/assets/inspector.css +1 -1
- package/dist/assets/loading-button.css +1 -1
- package/dist/assets/menu.css +1 -1
- package/dist/assets/modal-fullscreen.css +1 -1
- package/dist/assets/popover.css +1 -1
- package/dist/assets/sidepanel.css +1 -1
- package/dist/assets/structured-list-item.css +1 -1
- package/dist/assets/tutorial.css +1 -1
- package/dist/avatar.js +1 -1
- package/dist/button.js +2 -2
- package/dist/card.js +1 -1
- package/dist/checkbox.js +2 -2
- package/dist/chunks/accordion-item.C30QFxol.js +142 -0
- package/dist/chunks/accordion-item.C30QFxol.js.map +1 -0
- package/dist/chunks/{action-bar.DGQYYi8b.js → action-bar.5XBrXwYv.js} +58 -44
- package/dist/chunks/{action-bar.DGQYYi8b.js.map → action-bar.5XBrXwYv.js.map} +1 -1
- package/dist/chunks/{alert.Bz4tNKDH.js → alert.BvSx_Bi7.js} +26 -20
- package/dist/chunks/{alert.Bz4tNKDH.js.map → alert.BvSx_Bi7.js.map} +1 -1
- package/dist/chunks/{avatar.mNlMngHQ.js → avatar.8erKxh8t.js} +13 -13
- package/dist/chunks/avatar.8erKxh8t.js.map +1 -0
- package/dist/chunks/{base-modal.Bl7DBkt0.js → base-modal.BenvK-Np.js} +35 -29
- package/dist/chunks/{base-modal.Bl7DBkt0.js.map → base-modal.BenvK-Np.js.map} +1 -1
- package/dist/chunks/{button-actions-with-menu.BLmcwr2f.js → button-actions-with-menu.CHOjMHpd.js} +4 -4
- package/dist/chunks/{button-actions-with-menu.BLmcwr2f.js.map → button-actions-with-menu.CHOjMHpd.js.map} +1 -1
- package/dist/chunks/{button-actions.hdK5IgrZ.js → button-actions.DyI_dSvx.js} +2 -2
- package/dist/chunks/{button-actions.hdK5IgrZ.js.map → button-actions.DyI_dSvx.js.map} +1 -1
- package/dist/chunks/{calendar.D--sOCBT.js → calendar.DzYaxc0M.js} +148 -148
- package/dist/chunks/calendar.DzYaxc0M.js.map +1 -0
- package/dist/chunks/{card.BvSoujBc.js → card.Bt8jcp9I.js} +45 -37
- package/dist/chunks/card.Bt8jcp9I.js.map +1 -0
- package/dist/chunks/{checkbox-group.CuLP3hPd.js → checkbox-group.B0wngKi6.js} +4 -4
- package/dist/chunks/{checkbox-group.CuLP3hPd.js.map → checkbox-group.B0wngKi6.js.map} +1 -1
- package/dist/chunks/{checkbox.DMMXn-h8.js → checkbox.Bk_jmkGe.js} +50 -40
- package/dist/chunks/{checkbox.DMMXn-h8.js.map → checkbox.Bk_jmkGe.js.map} +1 -1
- package/dist/chunks/{code-snippet.BWM5w4CP.js → code-snippet.1SigVnjS.js} +97 -88
- package/dist/chunks/code-snippet.1SigVnjS.js.map +1 -0
- package/dist/chunks/{controls-group.BnZVHgQK.js → controls-group.COc0kArc.js} +2 -2
- package/dist/chunks/{controls-group.BnZVHgQK.js.map → controls-group.COc0kArc.js.map} +1 -1
- package/dist/chunks/{copy.h-wVGvID.js → copy.1-HH1fz5.js} +28 -20
- package/dist/chunks/{copy.h-wVGvID.js.map → copy.1-HH1fz5.js.map} +1 -1
- package/dist/chunks/{currency.CFJy6QYU.js → currency.BdtY-UIM.js} +3 -2
- package/dist/chunks/{currency.CFJy6QYU.js.map → currency.BdtY-UIM.js.map} +1 -1
- package/dist/chunks/{dashboard-section.BIH2wzgk.js → dashboard-section.BOrGKdY9.js} +2 -2
- package/dist/chunks/{dashboard-section.BIH2wzgk.js.map → dashboard-section.BOrGKdY9.js.map} +1 -1
- package/dist/chunks/{dashed-underline.CFJdLuJp.js → dashed-underline.BO4BuqUM.js} +2 -2
- package/dist/chunks/{dashed-underline.CFJdLuJp.js.map → dashed-underline.BO4BuqUM.js.map} +1 -1
- package/dist/chunks/{data-grid-template.21gqdYrs.js → data-grid-template.O946JKTa.js} +2 -2
- package/dist/chunks/{data-grid-template.21gqdYrs.js.map → data-grid-template.O946JKTa.js.map} +1 -1
- package/dist/chunks/{data-grid.DUwLxtW_.js → data-grid.Bv5TA_zR.js} +578 -532
- package/dist/chunks/{data-grid.DUwLxtW_.js.map → data-grid.Bv5TA_zR.js.map} +1 -1
- package/dist/chunks/{date-picker.21z_Sw4V.js → date-picker.DvEPEMIM.js} +99 -91
- package/dist/chunks/date-picker.DvEPEMIM.js.map +1 -0
- package/dist/chunks/{date-range-picker.K2TeW8aX.js → date-range-picker.BLVlkkG_.js} +338 -316
- package/dist/chunks/date-range-picker.BLVlkkG_.js.map +1 -0
- package/dist/chunks/{date.D8rQMzMG.js → date.CYUV4seY.js} +92 -92
- package/dist/chunks/{date.D8rQMzMG.js.map → date.CYUV4seY.js.map} +1 -1
- package/dist/chunks/{dropdown-tag.BNJnscD2.js → dropdown-tag.bpKWbC_O.js} +3 -3
- package/dist/chunks/{dropdown-tag.BNJnscD2.js.map → dropdown-tag.bpKWbC_O.js.map} +1 -1
- package/dist/chunks/{dropdown.ex87AZ7s.js → dropdown.rFZp3hMb.js} +212 -193
- package/dist/chunks/dropdown.rFZp3hMb.js.map +1 -0
- package/dist/chunks/{error-message.D2Y99KjT.js → error-message.DblYEZ7E.js} +43 -29
- package/dist/chunks/{error-message.D2Y99KjT.js.map → error-message.DblYEZ7E.js.map} +1 -1
- package/dist/chunks/es6.BvpG4Oi6.js.map +1 -1
- package/dist/chunks/{filter-bar.BAmG-yML.js → filter-bar.IN7gqxsc.js} +727 -712
- package/dist/chunks/filter-bar.IN7gqxsc.js.map +1 -0
- package/dist/chunks/{footer-actions.gtxofUAa.js → footer-actions.CyoMN_ca.js} +2 -2
- package/dist/chunks/{footer-actions.gtxofUAa.js.map → footer-actions.CyoMN_ca.js.map} +1 -1
- package/dist/chunks/{form-layout-title.Boi0QQZL.js → form-layout-title.Bi_3du_6.js} +2 -2
- package/dist/chunks/{form-layout-title.Boi0QQZL.js.map → form-layout-title.Bi_3du_6.js.map} +1 -1
- package/dist/chunks/{index.B_UZQ6qF.js → get-date-locale.BN8xEjY0.js} +855 -204
- package/dist/chunks/get-date-locale.BN8xEjY0.js.map +1 -0
- package/dist/chunks/{header.BMYhkrGT.js → header.Byd6jXl6.js} +104 -98
- package/dist/chunks/{header.BMYhkrGT.js.map → header.Byd6jXl6.js.map} +1 -1
- package/dist/chunks/{index.Z84QE0E2.js → index.CrhTVr5J.js} +2 -2
- package/dist/chunks/{index.Z84QE0E2.js.map → index.CrhTVr5J.js.map} +1 -1
- package/dist/chunks/{index.xqFSZOAb.js → index.DDnf1O9p.js} +2 -2
- package/dist/chunks/{index.xqFSZOAb.js.map → index.DDnf1O9p.js.map} +1 -1
- package/dist/chunks/{index.B_EJflcs.js → index.DPafeRJa.js} +2 -2
- package/dist/chunks/{index.B_EJflcs.js.map → index.DPafeRJa.js.map} +1 -1
- package/dist/chunks/{input-field.Dely7A8G.js → input-field.CgS1AEGu.js} +3 -3
- package/dist/chunks/{input-field.Dely7A8G.js.map → input-field.CgS1AEGu.js.map} +1 -1
- package/dist/chunks/{inspector.types.t2SPyhw3.js → inspector.types.xpv2J9pJ.js} +44 -36
- package/dist/chunks/{inspector.types.t2SPyhw3.js.map → inspector.types.xpv2J9pJ.js.map} +1 -1
- package/dist/chunks/loading-button.Bntgn6Lk.js +137 -0
- package/dist/chunks/loading-button.Bntgn6Lk.js.map +1 -0
- package/dist/chunks/{menu.CLicp_2I.js → menu.BN5WGXw3.js} +2 -2
- package/dist/chunks/{menu.CLicp_2I.js.map → menu.BN5WGXw3.js.map} +1 -1
- package/dist/chunks/{modal-fullscreen.Caqa7dDp.js → modal-fullscreen.zljoH4pr.js} +35 -29
- package/dist/chunks/{modal-fullscreen.Caqa7dDp.js.map → modal-fullscreen.zljoH4pr.js.map} +1 -1
- package/dist/chunks/{modal.vue_vue_type_script_setup_true_lang.Dzmth-oW.js → modal.vue_vue_type_script_setup_true_lang.tT8umwqG.js} +31 -25
- package/dist/chunks/modal.vue_vue_type_script_setup_true_lang.tT8umwqG.js.map +1 -0
- package/dist/chunks/{pagination.I5w8bpUS.js → pagination.BMn5ryDD.js} +2 -2
- package/dist/chunks/{pagination.I5w8bpUS.js.map → pagination.BMn5ryDD.js.map} +1 -1
- package/dist/chunks/{popover.DQP3ce2x.js → popover.pDk6zsak.js} +2 -2
- package/dist/chunks/{popover.DQP3ce2x.js.map → popover.pDk6zsak.js.map} +1 -1
- package/dist/chunks/{radio-group.lOSBHghv.js → radio-group.DUtoFXmr.js} +3 -3
- package/dist/chunks/{radio-group.lOSBHghv.js.map → radio-group.DUtoFXmr.js.map} +1 -1
- package/dist/chunks/{search-bar.GCRTgBUA.js → search-bar.poJCoGD-.js} +49 -41
- package/dist/chunks/{search-bar.GCRTgBUA.js.map → search-bar.poJCoGD-.js.map} +1 -1
- package/dist/chunks/{secondary-nav.CGH_6m7u.js → secondary-nav.Dyvd-YBg.js} +2 -2
- package/dist/chunks/{secondary-nav.CGH_6m7u.js.map → secondary-nav.Dyvd-YBg.js.map} +1 -1
- package/dist/chunks/{selection-card-group.BdTuPhEm.js → selection-card-group.CHBS81j6.js} +3 -3
- package/dist/chunks/{selection-card-group.BdTuPhEm.js.map → selection-card-group.CHBS81j6.js.map} +1 -1
- package/dist/chunks/{sidepanel.DA8nQepj.js → sidepanel.CuQCXV1E.js} +36 -30
- package/dist/chunks/{sidepanel.DA8nQepj.js.map → sidepanel.CuQCXV1E.js.map} +1 -1
- package/dist/chunks/{structured-list-item.Z-1ivOFu.js → structured-list-item.1A2sjhP4.js} +35 -29
- package/dist/chunks/{structured-list-item.Z-1ivOFu.js.map → structured-list-item.1A2sjhP4.js.map} +1 -1
- package/dist/chunks/{summary-grid-item-custom.Dq3IIEvH.js → summary-grid-item-custom.CuvUVoQ8.js} +2 -2
- package/dist/chunks/{summary-grid-item-custom.Dq3IIEvH.js.map → summary-grid-item-custom.CuvUVoQ8.js.map} +1 -1
- package/dist/chunks/{textarea.kYFGQFwd.js → textarea.CHnvON8G.js} +2 -2
- package/dist/chunks/{textarea.kYFGQFwd.js.map → textarea.CHnvON8G.js.map} +1 -1
- package/dist/chunks/{timeline-item.D-Yy2qQr.js → timeline-item.Dc_l5Xyy.js} +81 -75
- package/dist/chunks/{timeline-item.D-Yy2qQr.js.map → timeline-item.Dc_l5Xyy.js.map} +1 -1
- package/dist/chunks/{tutorial.vue_vue_type_script_setup_true_lang.D-ZFDn95.js → tutorial.vue_vue_type_script_setup_true_lang.DdLmYCOe.js} +82 -70
- package/dist/chunks/{tutorial.vue_vue_type_script_setup_true_lang.D-ZFDn95.js.map → tutorial.vue_vue_type_script_setup_true_lang.DdLmYCOe.js.map} +1 -1
- package/dist/chunks/{use-cached-selected-values.ClVxNmUf.js → use-cached-selected-values.CS3gHOyI.js} +86 -72
- package/dist/chunks/{use-cached-selected-values.ClVxNmUf.js.map → use-cached-selected-values.CS3gHOyI.js.map} +1 -1
- package/dist/code-snippet.js +1 -1
- package/dist/currency.js +1 -1
- package/dist/dashboard-template.js +1 -1
- package/dist/dashed-underline.js +1 -1
- package/dist/data-grid-template.js +1 -1
- package/dist/data-grid.js +1 -1
- package/dist/date-picker.js +2 -2
- package/dist/date-range-picker.js +2 -2
- package/dist/date.js +1 -1
- package/dist/dropdown.js +3 -3
- package/dist/filter-bar.js +1 -1
- package/dist/form-layout.js +1 -1
- package/dist/header.js +1 -1
- package/dist/index.js +43 -43
- package/dist/input-field.js +1 -1
- package/dist/inspector.js +1 -1
- package/dist/internal.js +5 -5
- package/dist/menu.js +1 -1
- package/dist/modal-fullscreen.js +1 -1
- package/dist/modal.js +2 -2
- package/dist/pagination.js +1 -1
- package/dist/popover.js +1 -1
- package/dist/radio-group.js +1 -1
- package/dist/search-bar.js +2 -2
- package/dist/secondary-nav.js +1 -1
- package/dist/selection-card.js +1 -1
- package/dist/sidepanel.js +1 -1
- package/dist/structured-list.js +1 -1
- package/dist/styles/bento.css +3 -0
- package/dist/styles/legacy.css +3 -0
- package/dist/styles/styleguide.css +3 -0
- package/dist/summary-grid.js +1 -1
- package/dist/textarea.js +1 -1
- package/dist/timeline.js +1 -1
- package/dist/tutorial.js +1 -1
- package/dist/web-types.json +1 -1
- package/package.json +2 -2
- package/dist/chunks/accordion-item.CQ8DLt9l.js +0 -126
- package/dist/chunks/accordion-item.CQ8DLt9l.js.map +0 -1
- package/dist/chunks/avatar.mNlMngHQ.js.map +0 -1
- package/dist/chunks/calendar.D--sOCBT.js.map +0 -1
- package/dist/chunks/card.BvSoujBc.js.map +0 -1
- package/dist/chunks/code-snippet.BWM5w4CP.js.map +0 -1
- package/dist/chunks/date-picker.21z_Sw4V.js.map +0 -1
- package/dist/chunks/date-range-picker.K2TeW8aX.js.map +0 -1
- package/dist/chunks/dropdown.ex87AZ7s.js.map +0 -1
- package/dist/chunks/filter-bar.BAmG-yML.js.map +0 -1
- package/dist/chunks/index.B_UZQ6qF.js.map +0 -1
- package/dist/chunks/loading-button.Mx-oDIGy.js +0 -123
- package/dist/chunks/loading-button.Mx-oDIGy.js.map +0 -1
- package/dist/chunks/modal.vue_vue_type_script_setup_true_lang.Dzmth-oW.js.map +0 -1
|
@@ -1,57 +1,65 @@
|
|
|
1
|
-
import { ref as C, computed as
|
|
2
|
-
import { B as
|
|
3
|
-
import { B as
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import { D as A, v as se, f as de } from "./date-input.BqBdAO1E.js";
|
|
1
|
+
import { ref as C, computed as P, defineComponent as H, toRef as V, watch as Q, nextTick as N, resolveComponent as c, resolveDirective as X, withDirectives as Z, openBlock as f, createElementBlock as _, withKeys as U, createBlock as y, createCommentVNode as k, createElementVNode as x, createVNode as M, normalizeClass as ee, withCtx as h, createTextVNode as ae, toDisplayString as te } from "vue";
|
|
2
|
+
import { B as re } from "./popover.pDk6zsak.js";
|
|
3
|
+
import { B as ne } from "./typography.z9P0Ec3Q.js";
|
|
4
|
+
import { d as oe } from "./debounce.DUTu11PS.js";
|
|
5
|
+
import { D as A, v as le, f as ie } from "./date-input.BqBdAO1E.js";
|
|
7
6
|
import { g as I } from "./unique-id.XFfoKuc2.js";
|
|
8
|
-
import { u as
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import { u as
|
|
12
|
-
import { B as
|
|
13
|
-
import { a as g } from "./calendar.
|
|
14
|
-
import {
|
|
15
|
-
import {
|
|
7
|
+
import { u as L } from "./i18n.DL9GT2-k.js";
|
|
8
|
+
import { g as se } from "./get-date-locale.BN8xEjY0.js";
|
|
9
|
+
import { f as $ } from "./date.CYUV4seY.js";
|
|
10
|
+
import { u as de } from "./use-form-layout-loading.D3lALhtC.js";
|
|
11
|
+
import { B as ue } from "./directive.O3yEdalv.js";
|
|
12
|
+
import { a as g } from "./calendar.DzYaxc0M.js";
|
|
13
|
+
import { D as pe } from "./dropdown-default-textbox.Bu4bpNGU.js";
|
|
14
|
+
import { E as ce, F as fe } from "./error-message.DblYEZ7E.js";
|
|
15
|
+
import { _ as me } from "./_plugin-vue_export-helper.CHgC5LLL.js";
|
|
16
16
|
import "../assets/date-picker.css";
|
|
17
|
-
const
|
|
18
|
-
var
|
|
19
|
-
const { locale: o, t:
|
|
17
|
+
const De = ({ datePickerValue: e, isDateIncorrect: t }) => {
|
|
18
|
+
var s;
|
|
19
|
+
const { locale: o, t: m } = L(), l = se(), i = C((s = e.value) == null ? void 0 : s.toDateString());
|
|
20
20
|
return {
|
|
21
21
|
// Values
|
|
22
|
-
dateDisplayValue:
|
|
23
|
-
locale:
|
|
24
|
-
}) :
|
|
25
|
-
textInputValue:
|
|
22
|
+
dateDisplayValue: P(() => t.value ? i.value : e.value ? $(e.value, A.FULL_DATE, {
|
|
23
|
+
locale: l[o.value.substring(0, 2)] || l.enUS
|
|
24
|
+
}) : m("selectDate")),
|
|
25
|
+
textInputValue: i,
|
|
26
26
|
// Methods
|
|
27
|
-
formatTextInputDisplayValue: (
|
|
28
|
-
t.value || (
|
|
29
|
-
locale:
|
|
27
|
+
formatTextInputDisplayValue: (d = e.value) => {
|
|
28
|
+
t.value || (i.value = d ? $(d, A.NUMERIC_DATE_YEAR_FIRST, {
|
|
29
|
+
locale: l[o.value.substring(0, 2)] || l.enUS
|
|
30
30
|
}) : null);
|
|
31
31
|
}
|
|
32
32
|
};
|
|
33
33
|
};
|
|
34
|
-
var
|
|
35
|
-
const
|
|
34
|
+
var u = /* @__PURE__ */ ((e) => (e.INPUT = "input", e))(u || {});
|
|
35
|
+
const F = {
|
|
36
36
|
"en-US": {
|
|
37
|
+
datePicker: "Date picker",
|
|
37
38
|
provideDateInAFormat: "Provide date in a YYYY-MM-DD format",
|
|
38
39
|
selectDate: "Select a date",
|
|
39
40
|
selectDateRange: "Select a date range",
|
|
40
|
-
selectedDateIsNotAvailable: "Selected date is not available"
|
|
41
|
-
|
|
41
|
+
selectedDateIsNotAvailable: "Selected date is not available"
|
|
42
|
+
},
|
|
43
|
+
"pt-BR": {
|
|
44
|
+
datePicker: "Seletor de datas",
|
|
45
|
+
selectDate: "Selecione uma data"
|
|
46
|
+
},
|
|
47
|
+
"ja-JP": {
|
|
48
|
+
datePicker: "日付ピッカー",
|
|
49
|
+
selectDate: "日付を選択"
|
|
42
50
|
}
|
|
43
|
-
},
|
|
44
|
-
i18n: { messages:
|
|
51
|
+
}, be = 1e3, ve = H({
|
|
52
|
+
i18n: { messages: F },
|
|
45
53
|
name: "bento-date-picker",
|
|
46
54
|
components: {
|
|
47
|
-
BentoTypography:
|
|
48
|
-
BentoPopover:
|
|
55
|
+
BentoTypography: ne,
|
|
56
|
+
BentoPopover: re,
|
|
49
57
|
Calendar: g,
|
|
50
|
-
ErrorMessage:
|
|
51
|
-
DropdownInputDefault:
|
|
52
|
-
FieldLabel:
|
|
58
|
+
ErrorMessage: ce,
|
|
59
|
+
DropdownInputDefault: pe,
|
|
60
|
+
FieldLabel: fe
|
|
53
61
|
},
|
|
54
|
-
directives: { BentoClickOutsideDirective:
|
|
62
|
+
directives: { BentoClickOutsideDirective: ue },
|
|
55
63
|
props: {
|
|
56
64
|
/**
|
|
57
65
|
* Descriptive supporting text visbile underneath the dropdown.
|
|
@@ -106,83 +114,83 @@ const L = {
|
|
|
106
114
|
*/
|
|
107
115
|
value: { type: [Date, Object], default: null }
|
|
108
116
|
},
|
|
109
|
-
emits: [
|
|
117
|
+
emits: [u.INPUT],
|
|
110
118
|
setup(e, { emit: t }) {
|
|
111
|
-
const { t: o } =
|
|
112
|
-
|
|
119
|
+
const { t: o } = L({ messages: F }), m = I("bento-date-picker-container"), l = I("bento-date-picker-label"), i = I("bento-date-picker-description"), D = I("bento-date-picker-error"), b = I("bento-date-picker-date-error"), s = P(() => e.label || o("datePicker", { name: m })), d = C(null), E = C(null), r = C(!1), n = C(!1), { isReadOnly: v } = de(V(e, "readonly"));
|
|
120
|
+
Q(
|
|
113
121
|
() => e.disabled,
|
|
114
122
|
(a) => {
|
|
115
123
|
a && n.value && (n.value = !1);
|
|
116
124
|
}
|
|
117
125
|
);
|
|
118
|
-
const { dateDisplayValue:
|
|
119
|
-
datePickerValue:
|
|
126
|
+
const { dateDisplayValue: K, textInputValue: p, formatTextInputDisplayValue: T } = De({
|
|
127
|
+
datePickerValue: V(e, "value"),
|
|
120
128
|
isDateIncorrect: r
|
|
121
|
-
}), B =
|
|
129
|
+
}), B = P(() => e.isDateDisabled && e.isDateDisabled(new Date(p.value)) && !n.value ? o("selectedDateIsNotAvailable") : r.value ? o("provideDateInAFormat") : null), Y = P(() => ({
|
|
122
130
|
"b-date-picker__description--error": e.errorMessage || B.value
|
|
123
|
-
})),
|
|
124
|
-
() => `${e.description ?
|
|
125
|
-
),
|
|
131
|
+
})), q = P(
|
|
132
|
+
() => `${e.description ? i : ""} ${e.errorMessage ? D : ""} ${B.value ? b : ""}`.trim() || null
|
|
133
|
+
), W = (a) => e.min && a <= e.min || e.max && a >= e.max ? !1 : e.isDateDisabled ? !e.isDateDisabled(a) : !0, w = () => {
|
|
126
134
|
n.value = !1;
|
|
127
|
-
},
|
|
128
|
-
n.value = !0,
|
|
129
|
-
},
|
|
130
|
-
r.value = !1,
|
|
131
|
-
},
|
|
132
|
-
r.value && (r.value = !1,
|
|
133
|
-
},
|
|
134
|
-
|
|
135
|
+
}, O = () => {
|
|
136
|
+
n.value = !0, T();
|
|
137
|
+
}, j = (a) => {
|
|
138
|
+
r.value = !1, w(), t(u.INPUT, a);
|
|
139
|
+
}, z = async () => {
|
|
140
|
+
r.value && (r.value = !1, p.value = null), t(u.INPUT, null);
|
|
141
|
+
}, J = (a) => {
|
|
142
|
+
le(a);
|
|
135
143
|
}, R = (a) => {
|
|
136
144
|
if (a.length < 10)
|
|
137
145
|
return;
|
|
138
|
-
/^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/.test(a) &&
|
|
139
|
-
},
|
|
146
|
+
/^\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/.test(a) && W(new Date(a)) ? (r.value = !1, t(u.INPUT, new Date(a))) : a && (r.value = !0, t(u.INPUT, null));
|
|
147
|
+
}, G = oe(R, be);
|
|
140
148
|
return {
|
|
141
149
|
// Refs
|
|
142
|
-
inputContainerRef:
|
|
143
|
-
calendarContainerRef:
|
|
150
|
+
inputContainerRef: E,
|
|
151
|
+
calendarContainerRef: d,
|
|
144
152
|
// Values,
|
|
145
|
-
dateDisplayValue:
|
|
146
|
-
datePickerContainerId:
|
|
147
|
-
descriptionConditionalClasses:
|
|
153
|
+
dateDisplayValue: K,
|
|
154
|
+
datePickerContainerId: m,
|
|
155
|
+
descriptionConditionalClasses: Y,
|
|
148
156
|
isDateIncorrect: r,
|
|
149
157
|
isDatePickerOpen: n,
|
|
150
158
|
isReadOnly: v,
|
|
151
159
|
dateErrorText: B,
|
|
152
|
-
labelId:
|
|
153
|
-
descriptionId:
|
|
160
|
+
labelId: l,
|
|
161
|
+
descriptionId: i,
|
|
154
162
|
errorId: D,
|
|
155
163
|
dateErrorId: b,
|
|
156
|
-
popoverAriaLabel:
|
|
157
|
-
ariaDescribedBy:
|
|
158
|
-
textInputValue:
|
|
164
|
+
popoverAriaLabel: s,
|
|
165
|
+
ariaDescribedBy: q,
|
|
166
|
+
textInputValue: p,
|
|
159
167
|
// Events
|
|
160
|
-
closeDatePicker:
|
|
161
|
-
clearDatePickerValue:
|
|
162
|
-
onDateSelected:
|
|
163
|
-
openDatePicker:
|
|
164
|
-
onDateKeyDown:
|
|
168
|
+
closeDatePicker: w,
|
|
169
|
+
clearDatePickerValue: z,
|
|
170
|
+
onDateSelected: j,
|
|
171
|
+
openDatePicker: O,
|
|
172
|
+
onDateKeyDown: J,
|
|
165
173
|
onDateInputChange: (a) => {
|
|
166
|
-
|
|
174
|
+
p.value = ie(a), n.value ? G(p.value) : R(p.value);
|
|
167
175
|
},
|
|
168
176
|
// Keyboard navigation
|
|
169
177
|
onSpaceBarOrEnter: async (a) => {
|
|
170
|
-
var
|
|
171
|
-
n.value || (a.preventDefault(),
|
|
178
|
+
var S;
|
|
179
|
+
n.value || (a.preventDefault(), O(), await N(), e.value || (T(/* @__PURE__ */ new Date()), t(u.INPUT, /* @__PURE__ */ new Date()), await N()), (S = d.value) == null || S.$refs.calendarRef[0].focusOnDate(e.value));
|
|
172
180
|
}
|
|
173
181
|
};
|
|
174
182
|
}
|
|
175
183
|
});
|
|
176
|
-
function
|
|
177
|
-
const D =
|
|
178
|
-
return
|
|
184
|
+
function ye(e, t, o, m, l, i) {
|
|
185
|
+
const D = c("field-label"), b = c("dropdown-input-default"), s = c("error-message"), d = c("bento-typography"), E = c("calendar"), r = c("bento-popover"), n = X("bento-click-outside-directive");
|
|
186
|
+
return Z((f(), _("div", {
|
|
179
187
|
class: "b-date-picker",
|
|
180
188
|
onKeydownCapture: [
|
|
181
|
-
t[0] || (t[0] =
|
|
182
|
-
t[1] || (t[1] =
|
|
189
|
+
t[0] || (t[0] = U((...v) => e.onSpaceBarOrEnter && e.onSpaceBarOrEnter(...v), ["space"])),
|
|
190
|
+
t[1] || (t[1] = U((...v) => e.onSpaceBarOrEnter && e.onSpaceBarOrEnter(...v), ["enter"]))
|
|
183
191
|
]
|
|
184
192
|
}, [
|
|
185
|
-
e.label ? (
|
|
193
|
+
e.label ? (f(), y(D, {
|
|
186
194
|
key: 0,
|
|
187
195
|
id: e.labelId,
|
|
188
196
|
label: e.label,
|
|
@@ -190,7 +198,7 @@ function Ie(e, t, o, f, m, l) {
|
|
|
190
198
|
optional: e.optional,
|
|
191
199
|
required: e.required
|
|
192
200
|
}, null, 8, ["id", "label", "tooltip-text", "optional", "required"])) : k("", !0),
|
|
193
|
-
|
|
201
|
+
x("div", null, [
|
|
194
202
|
M(b, {
|
|
195
203
|
ref: "inputContainerRef",
|
|
196
204
|
"always-combobox-is-input": "",
|
|
@@ -213,29 +221,29 @@ function Ie(e, t, o, f, m, l) {
|
|
|
213
221
|
onClose: e.closeDatePicker
|
|
214
222
|
}, null, 8, ["ariaControls", "ariaExpanded", "aria-labelledby", "aria-describedby", "disabled", "is-invalid", "open", "value", "display-value", "readonly", "onInput", "onOpen", "onKeydown", "onClear", "onClose"])
|
|
215
223
|
]),
|
|
216
|
-
e.dateErrorText ? (
|
|
224
|
+
e.dateErrorText ? (f(), y(s, {
|
|
217
225
|
key: 1,
|
|
218
226
|
id: e.dateErrorId,
|
|
219
227
|
"error-message": e.dateErrorText,
|
|
220
228
|
class: "b-date-picker__error-message"
|
|
221
229
|
}, null, 8, ["id", "error-message"])) : k("", !0),
|
|
222
|
-
e.errorMessage ? (
|
|
230
|
+
e.errorMessage ? (f(), y(s, {
|
|
223
231
|
key: 2,
|
|
224
232
|
id: e.errorId,
|
|
225
233
|
"error-message": e.errorMessage,
|
|
226
234
|
class: "b-date-picker__error-message"
|
|
227
235
|
}, null, 8, ["id", "error-message"])) : k("", !0),
|
|
228
|
-
e.description ? (
|
|
236
|
+
e.description ? (f(), y(d, {
|
|
229
237
|
key: 3,
|
|
230
|
-
class:
|
|
238
|
+
class: ee(["b-date-picker__description", e.descriptionConditionalClasses]),
|
|
231
239
|
el: "span"
|
|
232
240
|
}, {
|
|
233
241
|
default: h(() => [
|
|
234
|
-
te(
|
|
242
|
+
ae(te(e.description), 1)
|
|
235
243
|
]),
|
|
236
244
|
_: 1
|
|
237
245
|
}, 8, ["class"])) : k("", !0),
|
|
238
|
-
e.inputContainerRef ? (
|
|
246
|
+
e.inputContainerRef ? (f(), y(r, {
|
|
239
247
|
key: 4,
|
|
240
248
|
id: e.datePickerContainerId,
|
|
241
249
|
class: "b-date-picker__container",
|
|
@@ -249,7 +257,7 @@ function Ie(e, t, o, f, m, l) {
|
|
|
249
257
|
"fit-content": ""
|
|
250
258
|
}, {
|
|
251
259
|
default: h(() => [
|
|
252
|
-
M(
|
|
260
|
+
M(E, {
|
|
253
261
|
ref: "calendarContainerRef",
|
|
254
262
|
"first-day-of-week": e.firstDayOfWeek,
|
|
255
263
|
"is-date-disabled": e.isDateDisabled,
|
|
@@ -266,9 +274,9 @@ function Ie(e, t, o, f, m, l) {
|
|
|
266
274
|
[n, e.closeDatePicker]
|
|
267
275
|
]);
|
|
268
276
|
}
|
|
269
|
-
const
|
|
277
|
+
const $e = /* @__PURE__ */ me(ve, [["render", ye], ["__scopeId", "data-v-a7b0c2e4"]]);
|
|
270
278
|
export {
|
|
271
|
-
|
|
272
|
-
|
|
279
|
+
$e as B,
|
|
280
|
+
u as a
|
|
273
281
|
};
|
|
274
|
-
//# sourceMappingURL=date-picker.
|
|
282
|
+
//# sourceMappingURL=date-picker.DvEPEMIM.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"date-picker.DvEPEMIM.js","sources":["../../../vue2/src/components/date-picker/composables/use-date-picker-single-calendar-text.ts","../../../vue2/src/components/date-picker/date-picker.types.ts","../../../vue2/src/components/date-picker/date-picker.vue"],"sourcesContent":["import { computed, ref } from 'vue';\nimport { useI18n } from '@/utils/ts/i18n';\nimport { UseDateDisplayText } from './use-date-picker-single-calendar-text.types';\nimport { DateFormat } from '@/types';\nimport { getDateLocale } from '@/utils/ts/get-date-locale/get-date-locale';\nimport format from 'date-fns/format';\n\n/**\n * Composable that sets and formats the date to be displayed in the input box of a Single Date Picker\n * @param {Ref<Date>} option.datePickerValue Ref to the datePickerValue set in the DatePicker component\n * @param {Ref<boolean>} option.isDateIncorrect Indicates if the date is correct or not\n */\nexport const useDatePickerSingleCalendarText: UseDateDisplayText<Date> = ({ datePickerValue, isDateIncorrect }) => {\n const { locale, t } = useI18n();\n const locales = getDateLocale();\n\n const textInputValue = ref(datePickerValue.value?.toDateString());\n\n const dateDisplayValue = computed(() => {\n // Display incorrect date when there's an error with the input\n if (isDateIncorrect.value) {\n return textInputValue.value;\n }\n\n // Display \"Select a date\" when there's no date selected or input\n if (!datePickerValue.value) {\n return t('selectDate') as string;\n }\n\n // Display the date in format \"dd MMM, yyyy (25 Jun, 2023)\" if there's a valid date selected\n return format(datePickerValue.value as Date, DateFormat.FULL_DATE, {\n locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n });\n });\n\n /**\n * Formats the \"dateToFormat\" date value with the yyyy-MM-dd format and sets it as \"formatTextInputDisplayValue\" value\n * @param {DATE} dateToFormat - Date to be assigned and formatted\n */\n const formatTextInputDisplayValue = (dateToFormat: Date = datePickerValue.value) => {\n // If date is incorrect, leave the textInputValue intact\n if (isDateIncorrect.value) {\n return;\n }\n\n textInputValue.value = dateToFormat\n ? format(dateToFormat, DateFormat.NUMERIC_DATE_YEAR_FIRST, {\n locale: locales[locale.value.substring(0, 2)] || locales.enUS,\n })\n : null;\n };\n\n return {\n // Values\n dateDisplayValue,\n textInputValue,\n\n // Methods\n formatTextInputDisplayValue,\n };\n};\n","export { CalendarFirstDayOfWeek as BentoDatePickerFirstDayOfWeek } from '@/internal';\nexport type {\n CalendarIsDateDisabled as BentoDatePickerIsDateDisabled,\n CalendarSingleDateValue as BentoDatePickerValue,\n} from '@/internal';\n\nexport enum BentoDatePickerEvent {\n INPUT = 'input',\n}\n","<!-- TODO: Remove aria props as these are part of JSX elements /vue/types/jsx.d.ts -->\n<!-- eslint-disable vue/attribute-hyphenation -->\n<template>\n <div\n v-bento-click-outside-directive=\"closeDatePicker\"\n class=\"b-date-picker\"\n @keydown.space.capture=\"onSpaceBarOrEnter\"\n @keydown.enter.capture=\"onSpaceBarOrEnter\"\n >\n <!-- Label -->\n <field-label\n v-if=\"label\"\n :id=\"labelId\"\n :label=\"label\"\n :tooltip-text=\"tooltipText\"\n :optional=\"optional\"\n :required=\"required\"\n />\n\n <!-- Input -->\n <div>\n <dropdown-input-default\n ref=\"inputContainerRef\"\n always-combobox-is-input\n :ariaControls=\"datePickerContainerId\"\n :ariaExpanded=\"isDatePickerOpen\"\n :aria-labelledby=\"label ? labelId : null\"\n :aria-describedby=\"ariaDescribedBy\"\n :disabled=\"disabled\"\n dynamic-filtering\n :is-invalid=\"!!errorMessage || !!dateErrorText\"\n :open=\"isDatePickerOpen\"\n :value=\"textInputValue\"\n :display-value=\"dateDisplayValue\"\n :debounce-time=\"0\"\n :readonly=\"isReadOnly\"\n @input=\"onDateInputChange\"\n @open=\"openDatePicker\"\n @keydown=\"onDateKeyDown\"\n @clear=\"clearDatePickerValue\"\n @close=\"closeDatePicker\"\n />\n </div>\n\n <!-- Error Messages -->\n <error-message\n v-if=\"dateErrorText\"\n :id=\"dateErrorId\"\n :error-message=\"dateErrorText\"\n class=\"b-date-picker__error-message\"\n />\n <error-message\n v-if=\"errorMessage\"\n :id=\"errorId\"\n :error-message=\"errorMessage\"\n class=\"b-date-picker__error-message\"\n />\n\n <!-- Description -->\n <bento-typography\n v-if=\"description\"\n class=\"b-date-picker__description\"\n :class=\"descriptionConditionalClasses\"\n el=\"span\"\n >\n {{ description }}\n </bento-typography>\n\n <!-- Calendar container -->\n <bento-popover\n v-if=\"inputContainerRef\"\n :id=\"datePickerContainerId\"\n class=\"b-date-picker__container\"\n role=\"dialog\"\n :open=\"isDatePickerOpen\"\n :target-element=\"inputContainerRef\"\n :disable-focus-trap=\"true\"\n :aria-label=\"popoverAriaLabel\"\n :aria-modal=\"true\"\n position=\"bottom-start\"\n fit-content\n >\n <calendar\n ref=\"calendarContainerRef\"\n :first-day-of-week=\"firstDayOfWeek\"\n :is-date-disabled=\"isDateDisabled\"\n :number-of-months=\"1\"\n :value=\"value\"\n :min=\"min\"\n :max=\"max\"\n @input=\"onDateSelected\"\n />\n </bento-popover>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, nextTick, PropType, Ref, ref, toRef, watch } from 'vue';\n\n // Components\n import { BentoPopover } from '@/components/popover';\n import { BentoTypography } from '../typography';\n import { Calendar, ErrorMessage, FieldLabel } from '@/internal';\n import { DropdownInputDefault } from '@/components/dropdown/components';\n\n // Utils\n import { debounce } from '@/utils/ts/debounce';\n import { formatDateInputValue, validateDateInput } from '@/utils/ts/date-input';\n import { generateUid } from '@/utils/ts/unique-id';\n import { useI18n } from '@/utils/ts/i18n';\n\n // Composables\n import { useDatePickerSingleCalendarText } from './composables/use-date-picker-single-calendar-text';\n import { useFormLayoutFieldLoading } from '@/composables';\n\n // Directive\n import { BentoClickOutsideDirective } from '@/directives';\n\n // Types\n import { BentoDatePickerEvent, BentoDatePickerValue } from './date-picker.types';\n\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n const DEBOUNCE_TIME = 1000;\n\n /**\n * Date picker selector.\n *\n * @example\n * import { BentoDatePicker } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoDatePicker },\n * template: `\n * <bento-date-picker\n * label=\"Label\"\n * description=\"Supporting text\"\n * required\n * optional\n * disabled\n * @input=\"onDateChanged\"\n * v-model=\"selectedDate\"\n * />\n * `,\n * setup() {\n * const selectedDate = ref(new Date()); // reactive({ startDate: new Date(), endDate: new Date() })\n * return {\n * selectedDate,\n * }\n * }\n * }\n */\n export default defineComponent({\n i18n: { messages },\n name: 'bento-date-picker',\n components: {\n BentoTypography,\n BentoPopover,\n Calendar,\n ErrorMessage,\n DropdownInputDefault,\n FieldLabel,\n },\n directives: { BentoClickOutsideDirective },\n props: {\n /**\n * Descriptive supporting text visbile underneath the dropdown.\n */\n description: { type: String, default: undefined },\n\n /**\n * Disables dropdown functionality.\n */\n disabled: { type: Boolean, default: false },\n\n /**\n * Displays component in an error state with an error message\n */\n errorMessage: { type: String, default: null },\n\n /**\n * Allows you to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday\n */\n firstDayOfWeek: Calendar.props.firstDayOfWeek,\n\n /**\n * Indicate if a date should be disabled or not\n */\n isDateDisabled: Calendar.props.isDateDisabled,\n\n /**\n * Sets a minimum limit for selectable dates - dates before `min` will not be selectable\n */\n min: Calendar.props.min,\n\n /**\n * Sets a maximum limit for selectable dates - dates after `max` will not be selectable\n */\n max: Calendar.props.max,\n\n /**\n * Text that is displayed as a label above the element.\n */\n label: { type: String, default: undefined },\n\n /**\n * Highlights the dropdown is optional.\n */\n optional: { type: Boolean, default: false },\n\n /**\n * The Boolean readonly property, when present, makes the element not mutable, meaning the user can not edit the date picker.\n */\n readonly: { type: Boolean, default: false },\n\n /**\n * Highlights the dropdown is required.\n */\n required: { type: Boolean, default: false },\n\n /**\n * Adds a info icon next to the label to display the passed tooltip message.\n */\n tooltipText: { type: String, default: null },\n\n /**\n * Selected date\n */\n value: { type: [Date, Object] as PropType<BentoDatePickerValue>, default: null },\n },\n emits: [BentoDatePickerEvent.INPUT],\n setup(props, { emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const datePickerContainerId = generateUid('bento-date-picker-container');\n const labelId = generateUid('bento-date-picker-label');\n const descriptionId = generateUid('bento-date-picker-description');\n const errorId = generateUid('bento-date-picker-error');\n const dateErrorId = generateUid('bento-date-picker-date-error');\n const popoverAriaLabel = computed(() => props.label || t('datePicker', { name: datePickerContainerId }));\n\n // Refs\n const calendarContainerRef = ref(null);\n const inputContainerRef = ref(null);\n\n // Values\n const isDateIncorrect = ref(false);\n const isDatePickerOpen = ref(false);\n const { isReadOnly } = useFormLayoutFieldLoading(toRef(props, 'readonly'));\n\n watch(\n () => props.disabled,\n disabled => {\n // Close date picker popover if it's opened when it's disabled\n if (disabled && isDatePickerOpen.value) {\n isDatePickerOpen.value = false;\n }\n }\n );\n\n const { dateDisplayValue, textInputValue, formatTextInputDisplayValue } = useDatePickerSingleCalendarText({\n datePickerValue: toRef(props, 'value') as Ref<Date>,\n isDateIncorrect,\n });\n\n const dateErrorText = computed(() => {\n if (\n props.isDateDisabled &&\n props.isDateDisabled(new Date(textInputValue.value)) &&\n !isDatePickerOpen.value\n ) {\n return t('selectedDateIsNotAvailable');\n }\n\n return isDateIncorrect.value ? t('provideDateInAFormat') : null;\n });\n\n const descriptionConditionalClasses = computed(() => ({\n 'b-date-picker__description--error': props.errorMessage || dateErrorText.value,\n }));\n\n const ariaDescribedBy = computed(\n () =>\n `${props.description ? descriptionId : ''} ${props.errorMessage ? errorId : ''} ${\n dateErrorText.value ? dateErrorId : ''\n }`.trim() || null\n );\n\n const isDateEnabled = (date: Date) => {\n // Check if date is between min/max bounds, if there are any\n if ((props.min && date <= props.min) || (props.max && date >= props.max)) {\n return false;\n }\n\n // Check if function is set, otherwise all dates are enabled\n if (props.isDateDisabled) {\n return !props.isDateDisabled(date);\n }\n\n return true;\n };\n\n const closeDatePicker = () => {\n isDatePickerOpen.value = false;\n };\n\n const openDatePicker = () => {\n isDatePickerOpen.value = true;\n\n formatTextInputDisplayValue();\n };\n\n const onDateSelected = (selectedDate: Date) => {\n // Reset the error state when a valid date is selected\n isDateIncorrect.value = false;\n\n closeDatePicker();\n emit(BentoDatePickerEvent.INPUT, selectedDate);\n };\n\n const clearDatePickerValue = async () => {\n if (isDateIncorrect.value) {\n isDateIncorrect.value = false;\n textInputValue.value = null;\n }\n emit(BentoDatePickerEvent.INPUT, null);\n };\n\n const onDateKeyDown = (event: KeyboardEvent) => {\n validateDateInput(event);\n };\n\n const validateDate = (stringDate: string) => {\n // Validate only if the date is complete\n if (stringDate.length < 10) {\n return;\n }\n\n // Checks for YYYY-MM-DD format\n const dateRegex = /^\\d{4}-(0?[1-9]|1[012])-(0?[1-9]|[12][0-9]|3[01])$/;\n const isValidDate = dateRegex.test(stringDate) && isDateEnabled(new Date(stringDate));\n if (isValidDate) {\n isDateIncorrect.value = false;\n emit(BentoDatePickerEvent.INPUT, new Date(stringDate));\n } else if (stringDate) {\n // Only set to true if the value exists (not null/undefined)\n isDateIncorrect.value = true;\n emit(BentoDatePickerEvent.INPUT, null);\n }\n };\n\n const validateDateDebounced = debounce(validateDate, DEBOUNCE_TIME);\n\n const onDateInputChange = (stringDate: string) => {\n textInputValue.value = formatDateInputValue(stringDate);\n // If we are closing the date picker, we should validate (and emit date inputs) immediately so the user doesn't have to wait for the debounce time.\n if (isDatePickerOpen.value) {\n validateDateDebounced(textInputValue.value);\n } else {\n validateDate(textInputValue.value);\n }\n };\n\n /**\n * Space bar and Enter keyDown event handler.\n *\n * * Opens the date picker dialog on the first keydown.\n * * Move focus to selected date, i.e., the date displayed in the date input text field. If no date has been selected, places focus on the current date.\n * @param {KeyboardEvent} event Event being triggered\n */\n const onSpaceBarOrEnter = async (event: KeyboardEvent) => {\n if (isDatePickerOpen.value) {\n return;\n }\n event.preventDefault();\n\n openDatePicker();\n\n // Wait for the date picker dialog to open\n await nextTick();\n\n // Set current date (today) if no date is selected\n if (!props.value) {\n // Format the opened date picker date to YYYY-MM-DD\n formatTextInputDisplayValue(new Date());\n emit(BentoDatePickerEvent.INPUT, new Date());\n\n // Wait for new value to be set with the emit\n await nextTick();\n }\n\n // Focus on date\n calendarContainerRef.value?.$refs.calendarRef[0].focusOnDate(props.value);\n };\n\n return {\n // Refs\n inputContainerRef,\n calendarContainerRef,\n\n // Values,\n dateDisplayValue,\n datePickerContainerId,\n descriptionConditionalClasses,\n isDateIncorrect,\n isDatePickerOpen,\n isReadOnly,\n dateErrorText,\n labelId,\n descriptionId,\n errorId,\n dateErrorId,\n popoverAriaLabel,\n ariaDescribedBy,\n textInputValue,\n\n // Events\n closeDatePicker,\n clearDatePickerValue,\n onDateSelected,\n openDatePicker,\n onDateKeyDown,\n onDateInputChange,\n\n // Keyboard navigation\n onSpaceBarOrEnter,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./date-picker.scss\" />\n"],"names":["useDatePickerSingleCalendarText","datePickerValue","isDateIncorrect","locale","t","useI18n","locales","getDateLocale","textInputValue","ref","_a","computed","format","DateFormat","dateToFormat","BentoDatePickerEvent","BentoDatePickerEvent2","DEBOUNCE_TIME","_sfc_main","defineComponent","messages","BentoTypography","BentoPopover","Calendar","ErrorMessage","DropdownInputDefault","FieldLabel","BentoClickOutsideDirective","props","emit","datePickerContainerId","generateUid","labelId","descriptionId","errorId","dateErrorId","popoverAriaLabel","calendarContainerRef","inputContainerRef","isDatePickerOpen","isReadOnly","useFormLayoutFieldLoading","toRef","watch","disabled","dateDisplayValue","formatTextInputDisplayValue","dateErrorText","descriptionConditionalClasses","ariaDescribedBy","isDateEnabled","date","closeDatePicker","openDatePicker","onDateSelected","selectedDate","clearDatePickerValue","onDateKeyDown","event","validateDateInput","validateDate","stringDate","validateDateDebounced","debounce","formatDateInputValue","nextTick","withDirectives","openBlock","createElementBlock","_ctx","createBlock","_component_field_label","optional","required","createCommentVNode","createElementVNode","createVNode","_component_dropdown_input_default","label","onDateInputChange","_component_error_message","_component_bento_typography","normalizeClass","createTextVNode","toDisplayString","_component_bento_popover","withCtx","_component_calendar","firstDayOfWeek","max"],"mappings":"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"}
|