@dialpad/dialtone 9.126.5 → 9.127.0
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/README.md +1 -1
- package/dist/tokens/doc.json +29906 -29906
- package/dist/vue2/lib/callbar-button-with-dropdown/callbar-button-with-dropdown.cjs +1 -1
- package/dist/vue2/lib/callbar-button-with-dropdown/callbar-button-with-dropdown.cjs.map +1 -1
- package/dist/vue2/lib/callbar-button-with-dropdown/callbar-button-with-dropdown.js +7 -7
- package/dist/vue2/lib/callbar-button-with-dropdown/callbar-button-with-dropdown.js.map +1 -1
- package/dist/vue2/lib/callbar-button-with-popover/callbar-button-with-popover.cjs +1 -1
- package/dist/vue2/lib/callbar-button-with-popover/callbar-button-with-popover.cjs.map +1 -1
- package/dist/vue2/lib/callbar-button-with-popover/callbar-button-with-popover.js +5 -5
- package/dist/vue2/lib/callbar-button-with-popover/callbar-button-with-popover.js.map +1 -1
- package/dist/vue2/lib/datepicker/datepicker.cjs +1 -1
- package/dist/vue2/lib/datepicker/datepicker.cjs.map +1 -1
- package/dist/vue2/lib/datepicker/datepicker.js +10 -10
- package/dist/vue2/lib/datepicker/datepicker.js.map +1 -1
- package/dist/vue2/lib/dropdown/dropdown.cjs +1 -1
- package/dist/vue2/lib/dropdown/dropdown.cjs.map +1 -1
- package/dist/vue2/lib/dropdown/dropdown.js +24 -26
- package/dist/vue2/lib/dropdown/dropdown.js.map +1 -1
- package/dist/vue2/lib/emoji-picker/emoji-picker.cjs.map +1 -1
- package/dist/vue2/lib/emoji-picker/emoji-picker.js +1 -0
- package/dist/vue2/lib/emoji-picker/emoji-picker.js.map +1 -1
- package/dist/vue2/lib/rich-text-editor/rich-text-editor.cjs +3 -3
- package/dist/vue2/lib/rich-text-editor/rich-text-editor.cjs.map +1 -1
- package/dist/vue2/lib/rich-text-editor/rich-text-editor.js +65 -65
- package/dist/vue2/lib/rich-text-editor/rich-text-editor.js.map +1 -1
- package/dist/vue2/lib/toast/toast.cjs.map +1 -1
- package/dist/vue2/lib/toast/toast.js.map +1 -1
- package/dist/vue2/localization/de-DE.cjs +1 -13
- package/dist/vue2/localization/de-DE.cjs.map +1 -1
- package/dist/vue2/localization/de-DE.js +1 -13
- package/dist/vue2/localization/de-DE.js.map +1 -1
- package/dist/vue2/localization/es-LA.cjs +1 -13
- package/dist/vue2/localization/es-LA.cjs.map +1 -1
- package/dist/vue2/localization/es-LA.js +1 -13
- package/dist/vue2/localization/es-LA.js.map +1 -1
- package/dist/vue2/localization/fr-FR.cjs +1 -13
- package/dist/vue2/localization/fr-FR.cjs.map +1 -1
- package/dist/vue2/localization/fr-FR.js +1 -13
- package/dist/vue2/localization/fr-FR.js.map +1 -1
- package/dist/vue2/localization/it-IT.cjs +1 -13
- package/dist/vue2/localization/it-IT.cjs.map +1 -1
- package/dist/vue2/localization/it-IT.js +1 -13
- package/dist/vue2/localization/it-IT.js.map +1 -1
- package/dist/vue2/localization/ja-JP.cjs +1 -8
- package/dist/vue2/localization/ja-JP.cjs.map +1 -1
- package/dist/vue2/localization/ja-JP.js +1 -8
- package/dist/vue2/localization/ja-JP.js.map +1 -1
- package/dist/vue2/localization/nl-NL.cjs +1 -13
- package/dist/vue2/localization/nl-NL.cjs.map +1 -1
- package/dist/vue2/localization/nl-NL.js +1 -13
- package/dist/vue2/localization/nl-NL.js.map +1 -1
- package/dist/vue2/localization/pt-BR.cjs +1 -13
- package/dist/vue2/localization/pt-BR.cjs.map +1 -1
- package/dist/vue2/localization/pt-BR.js +1 -13
- package/dist/vue2/localization/pt-BR.js.map +1 -1
- package/dist/vue2/localization/ru-RU.cjs +1 -23
- package/dist/vue2/localization/ru-RU.cjs.map +1 -1
- package/dist/vue2/localization/ru-RU.js +1 -23
- package/dist/vue2/localization/ru-RU.js.map +1 -1
- package/dist/vue2/localization/zh-CN.cjs +1 -8
- package/dist/vue2/localization/zh-CN.cjs.map +1 -1
- package/dist/vue2/localization/zh-CN.js +1 -8
- package/dist/vue2/localization/zh-CN.js.map +1 -1
- package/dist/vue2/types/components/dropdown/dropdown.vue.d.ts.map +1 -1
- package/dist/vue2/types/components/rich_text_editor/rich_text_editor.vue.d.ts.map +1 -1
- package/dist/vue2/types/components/toast/layouts/toast_layout_alternate.vue.d.ts.map +1 -1
- package/dist/vue2/types/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.d.ts +1 -1
- package/dist/vue2/types/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.d.ts.map +1 -1
- package/dist/vue2/types/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.d.ts +1 -1
- package/dist/vue2/types/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.d.ts.map +1 -1
- package/dist/vue3/common/mixins/index.cjs +1 -1
- package/dist/vue3/common/mixins/index.js +8 -10
- package/dist/vue3/common/mixins/index.js.map +1 -1
- package/dist/vue3/common/utils/index.cjs +1 -1
- package/dist/vue3/common/utils/index.cjs.map +1 -1
- package/dist/vue3/common/utils/index.js +42 -38
- package/dist/vue3/common/utils/index.js.map +1 -1
- package/dist/vue3/component-documentation.json +1 -1
- package/dist/vue3/dialtone-vue.cjs +1 -1
- package/dist/vue3/dialtone-vue.js +298 -299
- package/dist/vue3/lib/attachment-carousel/attachment-carousel.cjs +1 -1
- package/dist/vue3/lib/attachment-carousel/attachment-carousel.cjs.map +1 -1
- package/dist/vue3/lib/attachment-carousel/attachment-carousel.js +86 -110
- package/dist/vue3/lib/attachment-carousel/attachment-carousel.js.map +1 -1
- package/dist/vue3/lib/banner/banner.cjs +2 -2
- package/dist/vue3/lib/banner/banner.cjs.map +1 -1
- package/dist/vue3/lib/banner/banner.js +27 -38
- package/dist/vue3/lib/banner/banner.js.map +1 -1
- package/dist/vue3/lib/breadcrumbs/breadcrumbs.cjs +1 -1
- package/dist/vue3/lib/breadcrumbs/breadcrumbs.cjs.map +1 -1
- package/dist/vue3/lib/breadcrumbs/breadcrumbs.js +20 -18
- package/dist/vue3/lib/breadcrumbs/breadcrumbs.js.map +1 -1
- package/dist/vue3/lib/button/button.cjs +1 -1
- package/dist/vue3/lib/button/button.cjs.map +1 -1
- package/dist/vue3/lib/button/button.js +26 -24
- package/dist/vue3/lib/button/button.js.map +1 -1
- package/dist/vue3/lib/callbar-button-with-dropdown/callbar-button-with-dropdown.cjs +1 -1
- package/dist/vue3/lib/callbar-button-with-dropdown/callbar-button-with-dropdown.cjs.map +1 -1
- package/dist/vue3/lib/callbar-button-with-dropdown/callbar-button-with-dropdown.js +36 -41
- package/dist/vue3/lib/callbar-button-with-dropdown/callbar-button-with-dropdown.js.map +1 -1
- package/dist/vue3/lib/callbar-button-with-popover/callbar-button-with-popover.cjs +1 -1
- package/dist/vue3/lib/callbar-button-with-popover/callbar-button-with-popover.cjs.map +1 -1
- package/dist/vue3/lib/callbar-button-with-popover/callbar-button-with-popover.js +35 -37
- package/dist/vue3/lib/callbar-button-with-popover/callbar-button-with-popover.js.map +1 -1
- package/dist/vue3/lib/chip/chip.cjs +1 -1
- package/dist/vue3/lib/chip/chip.cjs.map +1 -1
- package/dist/vue3/lib/chip/chip.js +54 -57
- package/dist/vue3/lib/chip/chip.js.map +1 -1
- package/dist/vue3/lib/combobox/combobox-constants.cjs +1 -1
- package/dist/vue3/lib/combobox/combobox-constants.cjs.map +1 -1
- package/dist/vue3/lib/combobox/combobox-constants.js +2 -2
- package/dist/vue3/lib/combobox/combobox-constants.js.map +1 -1
- package/dist/vue3/lib/combobox/combobox-empty-list.cjs.map +1 -1
- package/dist/vue3/lib/combobox/combobox-empty-list.js.map +1 -1
- package/dist/vue3/lib/combobox/combobox-loading-list.cjs.map +1 -1
- package/dist/vue3/lib/combobox/combobox-loading-list.js.map +1 -1
- package/dist/vue3/lib/combobox/combobox.cjs +2 -2
- package/dist/vue3/lib/combobox/combobox.cjs.map +1 -1
- package/dist/vue3/lib/combobox/combobox.js +20 -20
- package/dist/vue3/lib/combobox/combobox.js.map +1 -1
- package/dist/vue3/lib/combobox/index.cjs +1 -1
- package/dist/vue3/lib/combobox/index.js +3 -3
- package/dist/vue3/lib/combobox-multi-select/combobox-multi-select.cjs +1 -1
- package/dist/vue3/lib/combobox-multi-select/combobox-multi-select.cjs.map +1 -1
- package/dist/vue3/lib/combobox-multi-select/combobox-multi-select.js +119 -124
- package/dist/vue3/lib/combobox-multi-select/combobox-multi-select.js.map +1 -1
- package/dist/vue3/lib/combobox-with-popover/combobox-with-popover.cjs +1 -1
- package/dist/vue3/lib/combobox-with-popover/combobox-with-popover.cjs.map +1 -1
- package/dist/vue3/lib/combobox-with-popover/combobox-with-popover.js +76 -80
- package/dist/vue3/lib/combobox-with-popover/combobox-with-popover.js.map +1 -1
- package/dist/vue3/lib/contact-centers-row/contact-centers-row.cjs +1 -1
- package/dist/vue3/lib/contact-centers-row/contact-centers-row.cjs.map +1 -1
- package/dist/vue3/lib/contact-centers-row/contact-centers-row.js +68 -63
- package/dist/vue3/lib/contact-centers-row/contact-centers-row.js.map +1 -1
- package/dist/vue3/lib/contact-row/contact-row.cjs +1 -1
- package/dist/vue3/lib/contact-row/contact-row.cjs.map +1 -1
- package/dist/vue3/lib/contact-row/contact-row.js +32 -48
- package/dist/vue3/lib/contact-row/contact-row.js.map +1 -1
- package/dist/vue3/lib/datepicker/datepicker-constants.cjs +1 -1
- package/dist/vue3/lib/datepicker/datepicker-constants.cjs.map +1 -1
- package/dist/vue3/lib/datepicker/datepicker-constants.js +2 -3
- package/dist/vue3/lib/datepicker/datepicker-constants.js.map +1 -1
- package/dist/vue3/lib/datepicker/datepicker.cjs +1 -1
- package/dist/vue3/lib/datepicker/datepicker.cjs.map +1 -1
- package/dist/vue3/lib/datepicker/datepicker.js +264 -349
- package/dist/vue3/lib/datepicker/datepicker.js.map +1 -1
- package/dist/vue3/lib/datepicker/formatUtils.cjs +1 -1
- package/dist/vue3/lib/datepicker/formatUtils.cjs.map +1 -1
- package/dist/vue3/lib/datepicker/formatUtils.js +21 -20
- package/dist/vue3/lib/datepicker/formatUtils.js.map +1 -1
- package/dist/vue3/lib/datepicker/utils.cjs +1 -1
- package/dist/vue3/lib/datepicker/utils.cjs.map +1 -1
- package/dist/vue3/lib/datepicker/utils.js +12 -11
- package/dist/vue3/lib/datepicker/utils.js.map +1 -1
- package/dist/vue3/lib/description-list/description-list.cjs +1 -1
- package/dist/vue3/lib/description-list/description-list.cjs.map +1 -1
- package/dist/vue3/lib/description-list/description-list.js +10 -10
- package/dist/vue3/lib/description-list/description-list.js.map +1 -1
- package/dist/vue3/lib/dropdown/dropdown.cjs +1 -1
- package/dist/vue3/lib/dropdown/dropdown.cjs.map +1 -1
- package/dist/vue3/lib/dropdown/dropdown.js +36 -46
- package/dist/vue3/lib/dropdown/dropdown.js.map +1 -1
- package/dist/vue3/lib/editor/editor.cjs +1 -1
- package/dist/vue3/lib/editor/editor.cjs.map +1 -1
- package/dist/vue3/lib/editor/editor.js +169 -186
- package/dist/vue3/lib/editor/editor.js.map +1 -1
- package/dist/vue3/lib/editor/index.cjs +1 -1
- package/dist/vue3/lib/editor/index.js +2 -2
- package/dist/vue3/lib/emoji-picker/emoji-picker-constants.cjs +1 -1
- package/dist/vue3/lib/emoji-picker/emoji-picker-constants.cjs.map +1 -1
- package/dist/vue3/lib/emoji-picker/emoji-picker-constants.js +7 -20
- package/dist/vue3/lib/emoji-picker/emoji-picker-constants.js.map +1 -1
- package/dist/vue3/lib/emoji-picker/emoji-picker.cjs +1 -1
- package/dist/vue3/lib/emoji-picker/emoji-picker.cjs.map +1 -1
- package/dist/vue3/lib/emoji-picker/emoji-picker.js +419 -477
- package/dist/vue3/lib/emoji-picker/emoji-picker.js.map +1 -1
- package/dist/vue3/lib/emoji-picker/index.cjs +1 -1
- package/dist/vue3/lib/emoji-picker/index.js +3 -4
- package/dist/vue3/lib/emoji-row/emoji-row-constants.cjs +1 -1
- package/dist/vue3/lib/emoji-row/emoji-row-constants.cjs.map +1 -1
- package/dist/vue3/lib/emoji-row/emoji-row-constants.js +6 -7
- package/dist/vue3/lib/emoji-row/emoji-row-constants.js.map +1 -1
- package/dist/vue3/lib/emoji-row/emoji-row.cjs +1 -1
- package/dist/vue3/lib/emoji-row/emoji-row.cjs.map +1 -1
- package/dist/vue3/lib/emoji-row/emoji-row.js +53 -43
- package/dist/vue3/lib/emoji-row/emoji-row.js.map +1 -1
- package/dist/vue3/lib/feed-item-pill/feed-item-pill.cjs +1 -1
- package/dist/vue3/lib/feed-item-pill/feed-item-pill.cjs.map +1 -1
- package/dist/vue3/lib/feed-item-pill/feed-item-pill.js +52 -53
- package/dist/vue3/lib/feed-item-pill/feed-item-pill.js.map +1 -1
- package/dist/vue3/lib/general-row/general-row.cjs +1 -1
- package/dist/vue3/lib/general-row/general-row.cjs.map +1 -1
- package/dist/vue3/lib/general-row/general-row.js +133 -118
- package/dist/vue3/lib/general-row/general-row.js.map +1 -1
- package/dist/vue3/lib/group-row/group-row.cjs +1 -1
- package/dist/vue3/lib/group-row/group-row.cjs.map +1 -1
- package/dist/vue3/lib/group-row/group-row.js +53 -39
- package/dist/vue3/lib/group-row/group-row.js.map +1 -1
- package/dist/vue3/lib/icon/icon-constants.cjs.map +1 -1
- package/dist/vue3/lib/icon/icon-constants.js.map +1 -1
- package/dist/vue3/lib/icon/icon.cjs +1 -1
- package/dist/vue3/lib/icon/icon.cjs.map +1 -1
- package/dist/vue3/lib/icon/icon.js +15 -11
- package/dist/vue3/lib/icon/icon.js.map +1 -1
- package/dist/vue3/lib/image-viewer/image-viewer.cjs +1 -1
- package/dist/vue3/lib/image-viewer/image-viewer.cjs.map +1 -1
- package/dist/vue3/lib/image-viewer/image-viewer.js +51 -47
- package/dist/vue3/lib/image-viewer/image-viewer.js.map +1 -1
- package/dist/vue3/lib/ivr-node/ivr-node-constants.cjs +1 -1
- package/dist/vue3/lib/ivr-node/ivr-node-constants.cjs.map +1 -1
- package/dist/vue3/lib/ivr-node/ivr-node-constants.js +24 -24
- package/dist/vue3/lib/ivr-node/ivr-node-constants.js.map +1 -1
- package/dist/vue3/lib/ivr-node/ivr-node.cjs +1 -1
- package/dist/vue3/lib/ivr-node/ivr-node.cjs.map +1 -1
- package/dist/vue3/lib/ivr-node/ivr-node.js +80 -76
- package/dist/vue3/lib/ivr-node/ivr-node.js.map +1 -1
- package/dist/vue3/lib/message-input/message-input-link.cjs +1 -1
- package/dist/vue3/lib/message-input/message-input-link.cjs.map +1 -1
- package/dist/vue3/lib/message-input/message-input-link.js +100 -77
- package/dist/vue3/lib/message-input/message-input-link.js.map +1 -1
- package/dist/vue3/lib/message-input/message-input-topbar.cjs +1 -1
- package/dist/vue3/lib/message-input/message-input-topbar.cjs.map +1 -1
- package/dist/vue3/lib/message-input/message-input-topbar.js +126 -94
- package/dist/vue3/lib/message-input/message-input-topbar.js.map +1 -1
- package/dist/vue3/lib/message-input/message-input.cjs +1 -1
- package/dist/vue3/lib/message-input/message-input.cjs.map +1 -1
- package/dist/vue3/lib/message-input/message-input.js +272 -296
- package/dist/vue3/lib/message-input/message-input.js.map +1 -1
- package/dist/vue3/lib/modal/modal.cjs +1 -2
- package/dist/vue3/lib/modal/modal.cjs.map +1 -1
- package/dist/vue3/lib/modal/modal.js +64 -79
- package/dist/vue3/lib/modal/modal.js.map +1 -1
- package/dist/vue3/lib/notice/notice-action.cjs +1 -1
- package/dist/vue3/lib/notice/notice-action.cjs.map +1 -1
- package/dist/vue3/lib/notice/notice-action.js +38 -39
- package/dist/vue3/lib/notice/notice-action.js.map +1 -1
- package/dist/vue3/lib/notice/notice.cjs +1 -1
- package/dist/vue3/lib/notice/notice.cjs.map +1 -1
- package/dist/vue3/lib/notice/notice.js +37 -49
- package/dist/vue3/lib/notice/notice.js.map +1 -1
- package/dist/vue3/lib/pagination/pagination.cjs +1 -1
- package/dist/vue3/lib/pagination/pagination.cjs.map +1 -1
- package/dist/vue3/lib/pagination/pagination.js +72 -81
- package/dist/vue3/lib/pagination/pagination.js.map +1 -1
- package/dist/vue3/lib/popover/popover-header-footer.cjs +1 -1
- package/dist/vue3/lib/popover/popover-header-footer.cjs.map +1 -1
- package/dist/vue3/lib/popover/popover-header-footer.js +44 -45
- package/dist/vue3/lib/popover/popover-header-footer.js.map +1 -1
- package/dist/vue3/lib/popover/popover.cjs +1 -1
- package/dist/vue3/lib/popover/popover.cjs.map +1 -1
- package/dist/vue3/lib/popover/popover.js +26 -37
- package/dist/vue3/lib/popover/popover.js.map +1 -1
- package/dist/vue3/lib/rich-text-editor/rich-text-editor.cjs +4 -4
- package/dist/vue3/lib/rich-text-editor/rich-text-editor.cjs.map +1 -1
- package/dist/vue3/lib/rich-text-editor/rich-text-editor.js +187 -185
- package/dist/vue3/lib/rich-text-editor/rich-text-editor.js.map +1 -1
- package/dist/vue3/lib/settings-menu-button/settings-menu-button.cjs.map +1 -1
- package/dist/vue3/lib/settings-menu-button/settings-menu-button.js.map +1 -1
- package/dist/vue3/lib/time-pill/time-pill.cjs.map +1 -1
- package/dist/vue3/lib/time-pill/time-pill.js.map +1 -1
- package/dist/vue3/lib/toast/toast.cjs +1 -1
- package/dist/vue3/lib/toast/toast.cjs.map +1 -1
- package/dist/vue3/lib/toast/toast.js +83 -127
- package/dist/vue3/lib/toast/toast.js.map +1 -1
- package/dist/vue3/lib/unread-pill/unread-pill.cjs +1 -1
- package/dist/vue3/lib/unread-pill/unread-pill.cjs.map +1 -1
- package/dist/vue3/lib/unread-pill/unread-pill.js +25 -14
- package/dist/vue3/lib/unread-pill/unread-pill.js.map +1 -1
- package/dist/vue3/localization/de-DE.cjs +157 -0
- package/dist/vue3/localization/de-DE.cjs.map +1 -0
- package/dist/vue3/localization/de-DE.js +160 -0
- package/dist/vue3/localization/de-DE.js.map +1 -0
- package/dist/vue3/localization/en-US.cjs +175 -0
- package/dist/vue3/localization/en-US.cjs.map +1 -0
- package/dist/vue3/localization/en-US.js +178 -0
- package/dist/vue3/localization/en-US.js.map +1 -0
- package/dist/vue3/localization/es-LA.cjs +157 -0
- package/dist/vue3/localization/es-LA.cjs.map +1 -0
- package/dist/vue3/localization/es-LA.js +160 -0
- package/dist/vue3/localization/es-LA.js.map +1 -0
- package/dist/vue3/localization/fr-FR.cjs +157 -0
- package/dist/vue3/localization/fr-FR.cjs.map +1 -0
- package/dist/vue3/localization/fr-FR.js +160 -0
- package/dist/vue3/localization/fr-FR.js.map +1 -0
- package/dist/vue3/localization/index.cjs +2 -0
- package/dist/vue3/localization/index.cjs.map +1 -0
- package/dist/vue3/localization/index.js +82 -0
- package/dist/vue3/localization/index.js.map +1 -0
- package/dist/vue3/localization/it-IT.cjs +157 -0
- package/dist/vue3/localization/it-IT.cjs.map +1 -0
- package/dist/vue3/localization/it-IT.js +160 -0
- package/dist/vue3/localization/it-IT.js.map +1 -0
- package/dist/vue3/localization/ja-JP.cjs +157 -0
- package/dist/vue3/localization/ja-JP.cjs.map +1 -0
- package/dist/vue3/localization/ja-JP.js +160 -0
- package/dist/vue3/localization/ja-JP.js.map +1 -0
- package/dist/vue3/localization/nl-NL.cjs +157 -0
- package/dist/vue3/localization/nl-NL.cjs.map +1 -0
- package/dist/vue3/localization/nl-NL.js +160 -0
- package/dist/vue3/localization/nl-NL.js.map +1 -0
- package/dist/vue3/localization/pt-BR.cjs +157 -0
- package/dist/vue3/localization/pt-BR.cjs.map +1 -0
- package/dist/vue3/localization/pt-BR.js +160 -0
- package/dist/vue3/localization/pt-BR.js.map +1 -0
- package/dist/vue3/localization/ru-RU.cjs +157 -0
- package/dist/vue3/localization/ru-RU.cjs.map +1 -0
- package/dist/vue3/localization/ru-RU.js +160 -0
- package/dist/vue3/localization/ru-RU.js.map +1 -0
- package/dist/vue3/localization/zh-CN.cjs +157 -0
- package/dist/vue3/localization/zh-CN.cjs.map +1 -0
- package/dist/vue3/localization/zh-CN.js +160 -0
- package/dist/vue3/localization/zh-CN.js.map +1 -0
- package/dist/vue3/shared/sr_only_close_button.cjs +1 -1
- package/dist/vue3/shared/sr_only_close_button.cjs.map +1 -1
- package/dist/vue3/shared/sr_only_close_button.js +27 -25
- package/dist/vue3/shared/sr_only_close_button.js.map +1 -1
- package/dist/vue3/types/common/mixins/index.d.ts +0 -1
- package/dist/vue3/types/common/sr_only_close_button.vue.d.ts +8 -15
- package/dist/vue3/types/common/sr_only_close_button.vue.d.ts.map +1 -1
- package/dist/vue3/types/common/utils/index.d.ts +1 -0
- package/dist/vue3/types/common/utils/index.d.ts.map +1 -1
- package/dist/vue3/types/components/banner/banner.vue.d.ts +0 -33
- package/dist/vue3/types/components/banner/banner.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/breadcrumbs/breadcrumbs.vue.d.ts +2 -0
- package/dist/vue3/types/components/breadcrumbs/breadcrumbs.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/button/button.vue.d.ts +2 -0
- package/dist/vue3/types/components/button/button.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/chip/chip.vue.d.ts +3 -15
- package/dist/vue3/types/components/chip/chip.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/combobox/combobox.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/combobox/combobox_constants.d.ts +2 -2
- package/dist/vue3/types/components/combobox/index.d.ts +1 -1
- package/dist/vue3/types/components/datepicker/composables/useCalendar.d.ts.map +1 -1
- package/dist/vue3/types/components/datepicker/composables/useMonthYearPicker.d.ts +5 -1
- package/dist/vue3/types/components/datepicker/composables/useMonthYearPicker.d.ts.map +1 -1
- package/dist/vue3/types/components/datepicker/datepicker.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/datepicker/datepicker_constants.d.ts +0 -1
- package/dist/vue3/types/components/datepicker/datepicker_constants.d.ts.map +1 -1
- package/dist/vue3/types/components/datepicker/formatUtils.d.ts +5 -5
- package/dist/vue3/types/components/datepicker/formatUtils.d.ts.map +1 -1
- package/dist/vue3/types/components/datepicker/modules/calendar.vue.d.ts +0 -4
- package/dist/vue3/types/components/datepicker/modules/calendar.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/datepicker/modules/month-year-picker.vue.d.ts +0 -12
- package/dist/vue3/types/components/datepicker/modules/month-year-picker.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/datepicker/utils.d.ts +1 -0
- package/dist/vue3/types/components/datepicker/utils.d.ts.map +1 -1
- package/dist/vue3/types/components/dropdown/dropdown.vue.d.ts +0 -24
- package/dist/vue3/types/components/dropdown/dropdown.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/emoji_picker/emoji_picker_constants.d.ts +0 -13
- package/dist/vue3/types/components/emoji_picker/modules/emoji_tabset.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/icon/icon.vue.d.ts +1 -0
- package/dist/vue3/types/components/icon/icon_constants.d.ts.map +1 -1
- package/dist/vue3/types/components/image_viewer/image_viewer.vue.d.ts +3 -8
- package/dist/vue3/types/components/image_viewer/image_viewer.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/modal/modal.vue.d.ts +3 -35
- package/dist/vue3/types/components/modal/modal.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/notice/notice.vue.d.ts +1 -34
- package/dist/vue3/types/components/notice/notice.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/notice/notice_action.vue.d.ts +7 -35
- package/dist/vue3/types/components/notice/notice_action.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/pagination/pagination.vue.d.ts +5 -24
- package/dist/vue3/types/components/pagination/pagination.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/popover/popover.vue.d.ts +0 -33
- package/dist/vue3/types/components/popover/popover.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/popover/popover_header_footer.vue.d.ts +5 -10
- package/dist/vue3/types/components/popover/popover_header_footer.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/rich_text_editor/rich_text_editor.vue.d.ts +2 -0
- package/dist/vue3/types/components/rich_text_editor/rich_text_editor.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/toast/layouts/toast_layout_alternate.vue.d.ts +2 -46
- package/dist/vue3/types/components/toast/layouts/toast_layout_alternate.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/toast/layouts/toast_layout_default.vue.d.ts +1 -34
- package/dist/vue3/types/components/toast/layouts/toast_layout_default.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/toast/toast.vue.d.ts +4 -115
- package/dist/vue3/types/components/toast/toast.vue.d.ts.map +1 -1
- package/dist/vue3/types/index.d.ts +1 -0
- package/dist/vue3/types/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.d.ts +3 -11
- package/dist/vue3/types/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.d.ts +3 -10
- package/dist/vue3/types/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/cards/ivr_node/ivr_node.vue.d.ts +4 -8
- package/dist/vue3/types/recipes/cards/ivr_node/ivr_node.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/cards/ivr_node/ivr_node_constants.d.ts +7 -7
- package/dist/vue3/types/recipes/cards/ivr_node/ivr_node_constants.d.ts.map +1 -1
- package/dist/vue3/types/recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue.d.ts +1 -25
- package/dist/vue3/types/recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.d.ts +3 -41
- package/dist/vue3/types/recipes/conversation_view/attachment_carousel/attachment_carousel.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.d.ts +6 -25
- package/dist/vue3/types/recipes/conversation_view/attachment_carousel/media_components/image_carousel.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/attachment_carousel/media_components/progress_bar.vue.d.ts +2 -2
- package/dist/vue3/types/recipes/conversation_view/editor/editor.vue.d.ts +6 -49
- package/dist/vue3/types/recipes/conversation_view/editor/editor.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/editor/index.d.ts +1 -1
- package/dist/vue3/types/recipes/conversation_view/emoji_row/emoji_row.vue.d.ts +6 -2
- package/dist/vue3/types/recipes/conversation_view/emoji_row/emoji_row.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/emoji_row/emoji_row_constants.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.d.ts +3 -8
- package/dist/vue3/types/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/feed_item_row/feed_item_row.vue.d.ts +1 -1
- package/dist/vue3/types/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.d.ts +6 -1
- package/dist/vue3/types/recipes/conversation_view/message_input/extensions/meeting_pill/MeetingPill.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/message_input/message_input.vue.d.ts +12 -88
- package/dist/vue3/types/recipes/conversation_view/message_input/message_input.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts +11 -1
- package/dist/vue3/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/message_input/message_input_topbar.vue.d.ts +13 -1
- package/dist/vue3/types/recipes/conversation_view/message_input/message_input_topbar.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/leftbar/contact_centers_row/contact_centers_row.vue.d.ts +5 -8
- package/dist/vue3/types/recipes/leftbar/contact_centers_row/contact_centers_row.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/leftbar/contact_row/contact_row.vue.d.ts +0 -18
- package/dist/vue3/types/recipes/leftbar/contact_row/contact_row.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/leftbar/general_row/general_row.vue.d.ts +9 -27
- package/dist/vue3/types/recipes/leftbar/general_row/general_row.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/leftbar/group_row/group_row.vue.d.ts +11 -21
- package/dist/vue3/types/recipes/leftbar/group_row/group_row.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/leftbar/unread_pill/unread_pill.vue.d.ts +6 -2
- package/dist/vue3/types/recipes/leftbar/unread_pill/unread_pill.vue.d.ts.map +1 -1
- package/package.json +2 -2
- package/dist/vue3/common/mixins/sr-only-close-button.cjs +0 -3
- package/dist/vue3/common/mixins/sr-only-close-button.cjs.map +0 -1
- package/dist/vue3/common/mixins/sr-only-close-button.js +0 -44
- package/dist/vue3/common/mixins/sr-only-close-button.js.map +0 -1
- package/dist/vue3/lib/contact-row/contact-row-constants.cjs +0 -2
- package/dist/vue3/lib/contact-row/contact-row-constants.cjs.map +0 -1
- package/dist/vue3/lib/contact-row/contact-row-constants.js +0 -5
- package/dist/vue3/lib/contact-row/contact-row-constants.js.map +0 -1
- package/dist/vue3/lib/emoji/emoji-constants.cjs +0 -2
- package/dist/vue3/lib/emoji/emoji-constants.cjs.map +0 -1
- package/dist/vue3/lib/emoji/emoji-constants.js +0 -5
- package/dist/vue3/lib/emoji/emoji-constants.js.map +0 -1
- package/dist/vue3/lib/group-row/group-row-constants.cjs +0 -2
- package/dist/vue3/lib/group-row/group-row-constants.cjs.map +0 -1
- package/dist/vue3/lib/group-row/group-row-constants.js +0 -8
- package/dist/vue3/lib/group-row/group-row-constants.js.map +0 -1
- package/dist/vue3/lib/time-pill/time-pill-constants.cjs +0 -2
- package/dist/vue3/lib/time-pill/time-pill-constants.cjs.map +0 -1
- package/dist/vue3/lib/time-pill/time-pill-constants.js +0 -8
- package/dist/vue3/lib/time-pill/time-pill-constants.js.map +0 -1
- package/dist/vue3/types/common/mixins/sr_only_close_button.d.ts +0 -30
- package/dist/vue3/types/common/mixins/sr_only_close_button.d.ts.map +0 -1
- package/dist/vue3/types/components/emoji/emoji_constants.d.ts +0 -3
- package/dist/vue3/types/components/emoji/emoji_constants.d.ts.map +0 -1
- package/dist/vue3/types/recipes/conversation_view/time_pill/time_pill_constants.d.ts +0 -6
- package/dist/vue3/types/recipes/conversation_view/time_pill/time_pill_constants.d.ts.map +0 -1
- package/dist/vue3/types/recipes/leftbar/contact_row/contact_row_constants.d.ts +0 -3
- package/dist/vue3/types/recipes/leftbar/contact_row/contact_row_constants.d.ts.map +0 -1
- package/dist/vue3/types/recipes/leftbar/group_row/group_row_constants.d.ts +0 -6
- package/dist/vue3/types/recipes/leftbar/group_row/group_row_constants.d.ts.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.cjs","sources":["../../../components/dropdown/dropdown.vue"],"sourcesContent":["<!-- eslint-disable max-lines -->\n<template>\n <dt-popover\n ref=\"popover\"\n :content-width=\"contentWidth\"\n :open=\"open\"\n :placement=\"placement\"\n :initial-focus-element=\"openedWithKeyboard ? 'first' : 'dialog'\"\n :fallback-placements=\"fallbackPlacements\"\n padding=\"none\"\n role=\"menu\"\n :append-to=\"appendTo\"\n :modal=\"modal\"\n :max-height=\"maxHeight\"\n :max-width=\"maxWidth\"\n :open-with-arrow-keys=\"shouldOpenWithArrowKeys\"\n :open-on-context=\"openOnContext\"\n v-bind=\"$attrs\"\n :tether=\"tether\"\n :transition=\"transition\"\n v-on=\"dropdownListeners\"\n >\n <template #anchor=\"{ attrs }\">\n <!-- @slot Anchor element that activates the dropdown -->\n <slot\n ref=\"anchor\"\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content=\"{ close }\">\n <!-- eslint-disable-next-line max-len -->\n <!-- eslint-disable-next-line vuejs-accessibility/mouse-events-have-key-events vuejs-accessibility/no-static-element-interactions -->\n <ul\n :id=\"listId\"\n ref=\"listWrapper\"\n :class=\"listClasses\"\n data-qa=\"dt-dropdown-list-wrapper\"\n @mouseleave=\"clearHighlightIndex\"\n @mousemove.capture=\"onMouseHighlight\"\n >\n <!-- @slot Slot for the list component -->\n <slot\n name=\"list\"\n :close=\"close\"\n />\n <sr-only-close-button\n v-if=\"showVisuallyHiddenClose\"\n :visually-hidden-close-label=\"visuallyHiddenCloseLabel\"\n :tabindex=\"isArrowKeyNav ? -1 : 0\"\n @close=\"close\"\n />\n </ul>\n </template>\n <template #footerContent=\"{ close }\">\n <!-- @slot Slot for the footer content -->\n <slot\n name=\"footer\"\n :close=\"close\"\n />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport KeyboardNavigation from '@/common/mixins/keyboard_list_navigation';\nimport { DtPopover, POPOVER_APPEND_TO_VALUES } from '@/components/popover';\nimport { LIST_ITEM_NAVIGATION_TYPES } from '@/components/list_item';\nimport { DROPDOWN_PADDING_CLASSES } from './dropdown_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { EVENT_KEYNAMES } from '@/common/constants';\nimport SrOnlyCloseButtonMixin from '@/common/mixins/sr_only_close_button';\nimport SrOnlyCloseButton from '@/common/sr_only_close_button.vue';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtDropdown',\n\n components: {\n DtPopover,\n SrOnlyCloseButton,\n },\n\n mixins: [\n KeyboardNavigation({\n indexKey: 'highlightIndex',\n idKey: 'highlightId',\n listElementKey: 'getListElement',\n listItemRole: 'menuitem',\n afterHighlightMethod: 'afterHighlight',\n beginningOfListMethod: 'beginningOfListMethod',\n endOfListMethod: 'endOfListMethod',\n activeItemKey: 'activeItemEl',\n focusOnKeyboardNavigation: true,\n }),\n SrOnlyCloseButtonMixin,\n ],\n\n inheritAttrs: false,\n\n props: {\n /**\n * Controls whether the dropdown is shown. Leaving this null will have the dropdown trigger on click by default.\n * If you set this value, the default trigger behavior will be disabled and you can control it as you need.\n * Supports v-model\n */\n open: {\n type: Boolean,\n default: null,\n },\n\n /**\n * Opens the dropdown on right click (context menu). If you set this value to `true`,\n * the default trigger behavior will be disabled.\n */\n openOnContext: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Vertical padding size around the list element.\n * @values none, small, large\n */\n padding: {\n type: String,\n default: 'small',\n validator: (padding) => {\n return Object.keys(DROPDOWN_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Determines modal state, dropdown has a modal overlay preventing interaction with elements\n * below it, but it is invisible.\n */\n modal: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Width configuration for the popover content. When its value is 'anchor',\n * the popover content will have the same width as the anchor.\n * @values null, anchor\n */\n contentWidth: {\n type: String,\n default: null,\n },\n\n /**\n * Determines maximum height for the popover before overflow.\n * Possible units rem|px|em\n */\n maxHeight: {\n type: String,\n default: '',\n },\n\n /**\n * Determines maximum width for the popover before overflow.\n * Possible units rem|px|%|em\n */\n maxWidth: {\n type: String,\n default: '',\n },\n\n /**\n * Sets an ID on the list element of the component. Used by several aria attributes\n * as well as when deriving the IDs for each item.\n */\n listId: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * The type of navigation that this component should support.\n * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n * - \"tab\" for items that are navigated using the TAB key.\n * - \"none\" for static items that are not interactive.\n * @values arrow-keys, tab, none\n */\n navigationType: {\n type: String,\n default: LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS,\n validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n },\n\n /**\n * If the dropdown does not fit in the direction described by \"placement\",\n * it will attempt to change it's direction to the \"fallbackPlacements\".\n *\n * @values top, top-start, top-end,\n * right, right-start, right-end,\n * left, left-start, left-end,\n * bottom, bottom-start, bottom-end,\n * auto, auto-start, auto-end\n * */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the dropdown displays relative to the anchor.\n */\n placement: {\n type: String,\n default: 'bottom',\n },\n\n /**\n * A method that will be called when the selection goes past the beginning of the list.\n */\n onBeginningOfList: {\n type: Function,\n default: null,\n },\n\n /**\n * A method that will be called when the selection goes past the end of the list.\n */\n onEndOfList: {\n type: Function,\n default: null,\n },\n\n /**\n * Additional class for the wrapper list element.\n */\n listClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Sets the element to which the popover is going to append to.\n * 'body' will append to the nearest body (supports shadow DOM).\n * @values 'body', 'parent', HTMLElement,\n */\n appendTo: {\n type: [HTMLElement, String],\n default: 'body',\n validator: appendTo => {\n return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n (appendTo instanceof HTMLElement);\n },\n },\n\n /**\n * If set to false the dialog will display over top of the anchor when there is insufficient space.\n * If set to true it will never move from its position relative to the anchor and will clip instead.\n * <a\n * class=\"d-link\"\n * href=\"https://popper.js.org/docs/v2/modifiers/prevent-overflow/#tether\"\n * target=\"_blank\"\n * >\n * Popper.js docs\n * </a>\n * @values true, false\n */\n tether: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Named transition when the content display is toggled.\n * @see DtLazyShow\n */\n transition: {\n type: String,\n default: 'fade',\n },\n },\n\n emits: [\n /**\n * Native keydown event\n *\n * @event keydown\n * @type {KeyboardEvent}\n */\n 'keydown',\n\n /**\n * Event fired when the highlight changes\n *\n * @event highlight\n * @type {Number}\n */\n 'highlight',\n\n /**\n * Event fired to sync the open prop with the parent component\n * @event update:open\n */\n 'update:open',\n\n /**\n * Event fired when dropdown is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n\n /**\n * Event fired to sync the open prop with the parent component\n * @event update:open\n */\n 'update:open',\n ],\n\n data () {\n return {\n LIST_ITEM_NAVIGATION_TYPES,\n DROPDOWN_PADDING_CLASSES,\n EVENT_KEYNAMES,\n openedWithKeyboard: false,\n isOpen: null,\n };\n },\n\n computed: {\n dropdownListeners () {\n return {\n opened: isPopoverOpen => {\n this.updateInitialHighlightIndex(isPopoverOpen);\n },\n\n keydown: event => {\n const eventCode = event.code;\n\n switch (eventCode) {\n case EVENT_KEYNAMES.up:\n case EVENT_KEYNAMES.arrowup:\n this.onUpKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.down:\n case EVENT_KEYNAMES.arrowdown:\n this.onDownKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.space:\n case EVENT_KEYNAMES.spacebar:\n this.onSpaceKey();\n break;\n case EVENT_KEYNAMES.enter:\n this.onEnterKey();\n break;\n case EVENT_KEYNAMES.home:\n this.onHomeKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.end:\n this.onEndKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n default:\n this.onKeyPress(event);\n break;\n }\n\n this.$emit('keydown', event);\n },\n };\n },\n\n beginningOfListMethod () {\n return this.onBeginningOfList || this.jumpToEnd;\n },\n\n endOfListMethod () {\n return this.onEndOfList || this.jumpToBeginning;\n },\n\n activeItemEl () {\n return this.getListElement().querySelector('#' + this.highlightId);\n },\n\n isArrowKeyNav () {\n return this.navigationType === this.LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS;\n },\n\n listClasses () {\n return [\n 'd-dropdown-list',\n DROPDOWN_PADDING_CLASSES[this.padding],\n this.listClass,\n { 'd-context-menu-list': this.openOnContext },\n ];\n },\n\n shouldOpenWithArrowKeys () {\n return !this.openOnContext;\n },\n },\n\n methods: {\n onMouseHighlight (e) {\n const liElement = e.target.closest('li');\n\n if (liElement && liElement.role && this.highlightId !== liElement.id) {\n this.setHighlightId(liElement.id);\n liElement.focus();\n }\n },\n\n getListElement () {\n return this.$refs.listWrapper;\n },\n\n clearHighlightIndex () {\n this.setHighlightIndex(-1);\n },\n\n afterHighlight () {\n if (this.visuallyHiddenClose && this.highlightIndex === this._itemsLength() - 1) {\n return;\n }\n\n this.$emit('highlight', this.highlightIndex);\n },\n\n updateInitialHighlightIndex (isPopoverOpen) {\n this.isOpen = isPopoverOpen;\n\n if (isPopoverOpen) {\n if (this.openedWithKeyboard && this.isArrowKeyNav) {\n this.setHighlightIndex(0);\n }\n this.$emit('opened', true);\n } else {\n this.clearHighlightIndex();\n this.openedWithKeyboard = false;\n this.$emit('opened', false);\n }\n },\n\n onSpaceKey () {\n if (!this.open) {\n this.openedWithKeyboard = true;\n }\n },\n\n onEnterKey () {\n if (!this.open) {\n this.openedWithKeyboard = true;\n }\n },\n\n onUpKeyPress () {\n if (!this.isOpen) {\n this.openedWithKeyboard = true;\n return;\n }\n if (this.isArrowKeyNav) {\n return this.onUpKey();\n }\n },\n\n onDownKeyPress () {\n if (!this.isOpen) {\n this.openedWithKeyboard = true;\n return;\n }\n if (this.isArrowKeyNav) {\n return this.onDownKey();\n }\n },\n\n onHomeKeyPress () {\n if (!this.isOpen || !this.isArrowKeyNav) {\n return;\n }\n\n return this.onHomeKey();\n },\n\n onEndKeyPress () {\n if (!this.isOpen || !this.isArrowKeyNav) {\n return;\n }\n\n return this.onEndKey();\n },\n\n onKeyPress (e) {\n if (!this.isOpen || !this.isArrowKeyNav || !this.isValidLetter(e.key)) {\n return;\n }\n\n e.stopPropagation();\n e.preventDefault();\n\n return this.onNavigationKey(e.key);\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","SrOnlyCloseButton","KeyboardNavigation","SrOnlyCloseButtonMixin","padding","DROPDOWN_PADDING_CLASSES","item","getUniqueString","LIST_ITEM_NAVIGATION_TYPES","t","appendTo","POPOVER_APPEND_TO_VALUES","EVENT_KEYNAMES","isPopoverOpen","event","liElement","_hoisted_1","_openBlock","_createBlock","_component_dt_popover","_mergeProps","$props","$data","$options","_ctx","_toHandlers","_withCtx","attrs","_renderSlot","close","_createElementVNode","_normalizeClass","args","_cache","_component_sr_only_close_button","_createCommentVNode"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dropdown.cjs","sources":["../../../components/dropdown/dropdown.vue"],"sourcesContent":["<!-- eslint-disable max-lines -->\n<template>\n <dt-popover\n ref=\"popover\"\n :content-width=\"contentWidth\"\n :open=\"open\"\n :placement=\"placement\"\n :initial-focus-element=\"openedWithKeyboard ? 'first' : 'dialog'\"\n :fallback-placements=\"fallbackPlacements\"\n padding=\"none\"\n role=\"menu\"\n :append-to=\"appendTo\"\n :modal=\"modal\"\n :max-height=\"maxHeight\"\n :max-width=\"maxWidth\"\n :open-with-arrow-keys=\"shouldOpenWithArrowKeys\"\n :open-on-context=\"openOnContext\"\n v-bind=\"$attrs\"\n :tether=\"tether\"\n :transition=\"transition\"\n v-on=\"dropdownListeners\"\n >\n <template #anchor=\"{ attrs }\">\n <!-- @slot Anchor element that activates the dropdown -->\n <slot\n ref=\"anchor\"\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content=\"{ close }\">\n <!-- eslint-disable-next-line max-len -->\n <!-- eslint-disable-next-line vuejs-accessibility/mouse-events-have-key-events vuejs-accessibility/no-static-element-interactions -->\n <ul\n :id=\"listId\"\n ref=\"listWrapper\"\n :class=\"listClasses\"\n data-qa=\"dt-dropdown-list-wrapper\"\n @mouseleave=\"clearHighlightIndex\"\n @mousemove.capture=\"onMouseHighlight\"\n >\n <!-- @slot Slot for the list component -->\n <slot\n name=\"list\"\n :close=\"close\"\n />\n </ul>\n </template>\n <template #footerContent=\"{ close }\">\n <!-- @slot Slot for the footer content -->\n <slot\n name=\"footer\"\n :close=\"close\"\n />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport KeyboardNavigation from '@/common/mixins/keyboard_list_navigation';\nimport { DtPopover, POPOVER_APPEND_TO_VALUES } from '@/components/popover';\nimport { LIST_ITEM_NAVIGATION_TYPES } from '@/components/list_item';\nimport { DROPDOWN_PADDING_CLASSES } from './dropdown_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { EVENT_KEYNAMES } from '@/common/constants';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtDropdown',\n\n components: {\n DtPopover,\n },\n\n mixins: [\n KeyboardNavigation({\n indexKey: 'highlightIndex',\n idKey: 'highlightId',\n listElementKey: 'getListElement',\n listItemRole: 'menuitem',\n afterHighlightMethod: 'afterHighlight',\n beginningOfListMethod: 'beginningOfListMethod',\n endOfListMethod: 'endOfListMethod',\n activeItemKey: 'activeItemEl',\n focusOnKeyboardNavigation: true,\n }),\n ],\n\n inheritAttrs: false,\n\n props: {\n /**\n * Controls whether the dropdown is shown. Leaving this null will have the dropdown trigger on click by default.\n * If you set this value, the default trigger behavior will be disabled and you can control it as you need.\n * Supports v-model\n */\n open: {\n type: Boolean,\n default: null,\n },\n\n /**\n * Opens the dropdown on right click (context menu). If you set this value to `true`,\n * the default trigger behavior will be disabled.\n */\n openOnContext: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Vertical padding size around the list element.\n * @values none, small, large\n */\n padding: {\n type: String,\n default: 'small',\n validator: (padding) => {\n return Object.keys(DROPDOWN_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Determines modal state, dropdown has a modal overlay preventing interaction with elements\n * below it, but it is invisible.\n */\n modal: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Width configuration for the popover content. When its value is 'anchor',\n * the popover content will have the same width as the anchor.\n * @values null, anchor\n */\n contentWidth: {\n type: String,\n default: null,\n },\n\n /**\n * Determines maximum height for the popover before overflow.\n * Possible units rem|px|em\n */\n maxHeight: {\n type: String,\n default: '',\n },\n\n /**\n * Determines maximum width for the popover before overflow.\n * Possible units rem|px|%|em\n */\n maxWidth: {\n type: String,\n default: '',\n },\n\n /**\n * Sets an ID on the list element of the component. Used by several aria attributes\n * as well as when deriving the IDs for each item.\n */\n listId: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * The type of navigation that this component should support.\n * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n * - \"tab\" for items that are navigated using the TAB key.\n * - \"none\" for static items that are not interactive.\n * @values arrow-keys, tab, none\n */\n navigationType: {\n type: String,\n default: LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS,\n validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n },\n\n /**\n * If the dropdown does not fit in the direction described by \"placement\",\n * it will attempt to change it's direction to the \"fallbackPlacements\".\n *\n * @values top, top-start, top-end,\n * right, right-start, right-end,\n * left, left-start, left-end,\n * bottom, bottom-start, bottom-end,\n * auto, auto-start, auto-end\n * */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the dropdown displays relative to the anchor.\n */\n placement: {\n type: String,\n default: 'bottom',\n },\n\n /**\n * A method that will be called when the selection goes past the beginning of the list.\n */\n onBeginningOfList: {\n type: Function,\n default: null,\n },\n\n /**\n * A method that will be called when the selection goes past the end of the list.\n */\n onEndOfList: {\n type: Function,\n default: null,\n },\n\n /**\n * Additional class for the wrapper list element.\n */\n listClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Sets the element to which the popover is going to append to.\n * 'body' will append to the nearest body (supports shadow DOM).\n * @values 'body', 'parent', HTMLElement,\n */\n appendTo: {\n type: [HTMLElement, String],\n default: 'body',\n validator: appendTo => {\n return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n (appendTo instanceof HTMLElement);\n },\n },\n\n /**\n * If set to false the dialog will display over top of the anchor when there is insufficient space.\n * If set to true it will never move from its position relative to the anchor and will clip instead.\n * <a\n * class=\"d-link\"\n * href=\"https://popper.js.org/docs/v2/modifiers/prevent-overflow/#tether\"\n * target=\"_blank\"\n * >\n * Popper.js docs\n * </a>\n * @values true, false\n */\n tether: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Named transition when the content display is toggled.\n * @see DtLazyShow\n */\n transition: {\n type: String,\n default: 'fade',\n },\n },\n\n emits: [\n /**\n * Native keydown event\n *\n * @event keydown\n * @type {KeyboardEvent}\n */\n 'keydown',\n\n /**\n * Event fired when the highlight changes\n *\n * @event highlight\n * @type {Number}\n */\n 'highlight',\n\n /**\n * Event fired to sync the open prop with the parent component\n * @event update:open\n */\n 'update:open',\n\n /**\n * Event fired when dropdown is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n\n /**\n * Event fired to sync the open prop with the parent component\n * @event update:open\n */\n 'update:open',\n ],\n\n data () {\n return {\n LIST_ITEM_NAVIGATION_TYPES,\n DROPDOWN_PADDING_CLASSES,\n EVENT_KEYNAMES,\n openedWithKeyboard: false,\n isOpen: null,\n };\n },\n\n computed: {\n dropdownListeners () {\n return {\n opened: isPopoverOpen => {\n this.updateInitialHighlightIndex(isPopoverOpen);\n },\n\n keydown: event => {\n const eventCode = event.code;\n\n switch (eventCode) {\n case EVENT_KEYNAMES.up:\n case EVENT_KEYNAMES.arrowup:\n this.onUpKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.down:\n case EVENT_KEYNAMES.arrowdown:\n this.onDownKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.space:\n case EVENT_KEYNAMES.spacebar:\n this.onSpaceKey();\n break;\n case EVENT_KEYNAMES.enter:\n this.onEnterKey();\n break;\n case EVENT_KEYNAMES.home:\n this.onHomeKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.end:\n this.onEndKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n default:\n this.onKeyPress(event);\n break;\n }\n\n this.$emit('keydown', event);\n },\n };\n },\n\n beginningOfListMethod () {\n return this.onBeginningOfList || this.jumpToEnd;\n },\n\n endOfListMethod () {\n return this.onEndOfList || this.jumpToBeginning;\n },\n\n activeItemEl () {\n return this.getListElement().querySelector('#' + this.highlightId);\n },\n\n isArrowKeyNav () {\n return this.navigationType === this.LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS;\n },\n\n listClasses () {\n return [\n 'd-dropdown-list',\n DROPDOWN_PADDING_CLASSES[this.padding],\n this.listClass,\n { 'd-context-menu-list': this.openOnContext },\n ];\n },\n\n shouldOpenWithArrowKeys () {\n return !this.openOnContext;\n },\n },\n\n methods: {\n onMouseHighlight (e) {\n const liElement = e.target.closest('li');\n\n if (liElement && liElement.role && this.highlightId !== liElement.id) {\n this.setHighlightId(liElement.id);\n liElement.focus();\n }\n },\n\n getListElement () {\n return this.$refs.listWrapper;\n },\n\n clearHighlightIndex () {\n this.setHighlightIndex(-1);\n },\n\n afterHighlight () {\n if (this.highlightIndex === this._itemsLength() - 1) {\n return;\n }\n\n this.$emit('highlight', this.highlightIndex);\n },\n\n updateInitialHighlightIndex (isPopoverOpen) {\n this.isOpen = isPopoverOpen;\n\n if (isPopoverOpen) {\n if (this.openedWithKeyboard && this.isArrowKeyNav) {\n this.setHighlightIndex(0);\n }\n this.$emit('opened', true);\n } else {\n this.clearHighlightIndex();\n this.openedWithKeyboard = false;\n this.$emit('opened', false);\n }\n },\n\n onSpaceKey () {\n if (!this.open) {\n this.openedWithKeyboard = true;\n }\n },\n\n onEnterKey () {\n if (!this.open) {\n this.openedWithKeyboard = true;\n }\n },\n\n onUpKeyPress () {\n if (!this.isOpen) {\n this.openedWithKeyboard = true;\n return;\n }\n if (this.isArrowKeyNav) {\n return this.onUpKey();\n }\n },\n\n onDownKeyPress () {\n if (!this.isOpen) {\n this.openedWithKeyboard = true;\n return;\n }\n if (this.isArrowKeyNav) {\n return this.onDownKey();\n }\n },\n\n onHomeKeyPress () {\n if (!this.isOpen || !this.isArrowKeyNav) {\n return;\n }\n\n return this.onHomeKey();\n },\n\n onEndKeyPress () {\n if (!this.isOpen || !this.isArrowKeyNav) {\n return;\n }\n\n return this.onEndKey();\n },\n\n onKeyPress (e) {\n if (!this.isOpen || !this.isArrowKeyNav || !this.isValidLetter(e.key)) {\n return;\n }\n\n e.stopPropagation();\n e.preventDefault();\n\n return this.onNavigationKey(e.key);\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","KeyboardNavigation","padding","DROPDOWN_PADDING_CLASSES","item","getUniqueString","LIST_ITEM_NAVIGATION_TYPES","t","appendTo","POPOVER_APPEND_TO_VALUES","EVENT_KEYNAMES","isPopoverOpen","event","liElement","_hoisted_1","_openBlock","_createBlock","_component_dt_popover","_mergeProps","$props","$data","$options","_ctx","_toHandlers","_withCtx","attrs","_renderSlot","close","_createElementVNode","_normalizeClass","args","_cache"],"mappings":"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"}
|
|
@@ -1,23 +1,20 @@
|
|
|
1
|
-
import
|
|
1
|
+
import f from "../../common/mixins/keyboard-list-navigation.js";
|
|
2
2
|
import { DROPDOWN_PADDING_CLASSES as a } from "./dropdown-constants.js";
|
|
3
|
-
import { getUniqueString as
|
|
3
|
+
import { getUniqueString as m } from "../../common/utils/index.js";
|
|
4
4
|
import { EVENT_KEYNAMES as n } from "../../common/constants/index.js";
|
|
5
|
-
import O from "
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import {
|
|
9
|
-
import
|
|
10
|
-
|
|
11
|
-
import { POPOVER_APPEND_TO_VALUES as C } from "../popover/popover-constants.js";
|
|
12
|
-
const _ = {
|
|
5
|
+
import { resolveComponent as y, openBlock as c, createBlock as K, mergeProps as p, toHandlers as w, withCtx as h, renderSlot as l, createElementVNode as O, normalizeClass as E } from "vue";
|
|
6
|
+
import { _ as I } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
|
|
7
|
+
import b from "../popover/popover.js";
|
|
8
|
+
import { LIST_ITEM_NAVIGATION_TYPES as d } from "../list-item/list-item-constants.js";
|
|
9
|
+
import { POPOVER_APPEND_TO_VALUES as x } from "../popover/popover-constants.js";
|
|
10
|
+
const P = {
|
|
13
11
|
compatConfig: { MODE: 3 },
|
|
14
12
|
name: "DtDropdown",
|
|
15
13
|
components: {
|
|
16
|
-
DtPopover:
|
|
17
|
-
SrOnlyCloseButton: b
|
|
14
|
+
DtPopover: b
|
|
18
15
|
},
|
|
19
16
|
mixins: [
|
|
20
|
-
|
|
17
|
+
f({
|
|
21
18
|
indexKey: "highlightIndex",
|
|
22
19
|
idKey: "highlightId",
|
|
23
20
|
listElementKey: "getListElement",
|
|
@@ -27,8 +24,7 @@ const _ = {
|
|
|
27
24
|
endOfListMethod: "endOfListMethod",
|
|
28
25
|
activeItemKey: "activeItemEl",
|
|
29
26
|
focusOnKeyboardNavigation: !0
|
|
30
|
-
})
|
|
31
|
-
O
|
|
27
|
+
})
|
|
32
28
|
],
|
|
33
29
|
inheritAttrs: !1,
|
|
34
30
|
props: {
|
|
@@ -98,7 +94,7 @@ const _ = {
|
|
|
98
94
|
listId: {
|
|
99
95
|
type: String,
|
|
100
96
|
default() {
|
|
101
|
-
return
|
|
97
|
+
return m();
|
|
102
98
|
}
|
|
103
99
|
},
|
|
104
100
|
/**
|
|
@@ -110,8 +106,8 @@ const _ = {
|
|
|
110
106
|
*/
|
|
111
107
|
navigationType: {
|
|
112
108
|
type: String,
|
|
113
|
-
default:
|
|
114
|
-
validator: (e) => Object.values(
|
|
109
|
+
default: d.ARROW_KEYS,
|
|
110
|
+
validator: (e) => Object.values(d).includes(e)
|
|
115
111
|
},
|
|
116
112
|
/**
|
|
117
113
|
* If the dropdown does not fit in the direction described by "placement",
|
|
@@ -163,7 +159,7 @@ const _ = {
|
|
|
163
159
|
appendTo: {
|
|
164
160
|
type: [HTMLElement, String],
|
|
165
161
|
default: "body",
|
|
166
|
-
validator: (e) =>
|
|
162
|
+
validator: (e) => x.includes(e) || e instanceof HTMLElement
|
|
167
163
|
},
|
|
168
164
|
/**
|
|
169
165
|
* If set to false the dialog will display over top of the anchor when there is insufficient space.
|
|
@@ -225,7 +221,7 @@ const _ = {
|
|
|
225
221
|
],
|
|
226
222
|
data() {
|
|
227
223
|
return {
|
|
228
|
-
LIST_ITEM_NAVIGATION_TYPES:
|
|
224
|
+
LIST_ITEM_NAVIGATION_TYPES: d,
|
|
229
225
|
DROPDOWN_PADDING_CLASSES: a,
|
|
230
226
|
EVENT_KEYNAMES: n,
|
|
231
227
|
openedWithKeyboard: !1,
|
|
@@ -305,7 +301,7 @@ const _ = {
|
|
|
305
301
|
this.setHighlightIndex(-1);
|
|
306
302
|
},
|
|
307
303
|
afterHighlight() {
|
|
308
|
-
this.
|
|
304
|
+
this.highlightIndex !== this._itemsLength() - 1 && this.$emit("highlight", this.highlightIndex);
|
|
309
305
|
},
|
|
310
306
|
updateInitialHighlightIndex(e) {
|
|
311
307
|
this.isOpen = e, e ? (this.openedWithKeyboard && this.isArrowKeyNav && this.setHighlightIndex(0), this.$emit("opened", !0)) : (this.clearHighlightIndex(), this.openedWithKeyboard = !1, this.$emit("opened", !1));
|
|
@@ -345,15 +341,15 @@ const _ = {
|
|
|
345
341
|
return e.stopPropagation(), e.preventDefault(), this.onNavigationKey(e.key);
|
|
346
342
|
}
|
|
347
343
|
}
|
|
348
|
-
},
|
|
349
|
-
function
|
|
350
|
-
const
|
|
351
|
-
return
|
|
344
|
+
}, S = ["id"];
|
|
345
|
+
function A(e, t, i, H, u, o) {
|
|
346
|
+
const g = y("dt-popover");
|
|
347
|
+
return c(), K(g, p({
|
|
352
348
|
ref: "popover",
|
|
353
349
|
"content-width": i.contentWidth,
|
|
354
350
|
open: i.open,
|
|
355
351
|
placement: i.placement,
|
|
356
|
-
"initial-focus-element":
|
|
352
|
+
"initial-focus-element": u.openedWithKeyboard ? "first" : "dialog",
|
|
357
353
|
"fallback-placements": i.fallbackPlacements,
|
|
358
354
|
padding: "none",
|
|
359
355
|
role: "menu",
|
|
@@ -366,36 +362,30 @@ function L(e, t, i, v, f, o) {
|
|
|
366
362
|
}, e.$attrs, {
|
|
367
363
|
tether: i.tether,
|
|
368
364
|
transition: i.transition
|
|
369
|
-
},
|
|
370
|
-
anchor:
|
|
371
|
-
|
|
365
|
+
}, w(o.dropdownListeners)), {
|
|
366
|
+
anchor: h(({ attrs: r }) => [
|
|
367
|
+
l(e.$slots, "anchor", p({ ref: "anchor" }, r))
|
|
372
368
|
]),
|
|
373
|
-
content:
|
|
374
|
-
|
|
369
|
+
content: h(({ close: r }) => [
|
|
370
|
+
O("ul", {
|
|
375
371
|
id: i.listId,
|
|
376
372
|
ref: "listWrapper",
|
|
377
|
-
class:
|
|
373
|
+
class: E(o.listClasses),
|
|
378
374
|
"data-qa": "dt-dropdown-list-wrapper",
|
|
379
|
-
onMouseleave: t[0] || (t[0] = (...
|
|
380
|
-
onMousemoveCapture: t[1] || (t[1] = (...
|
|
375
|
+
onMouseleave: t[0] || (t[0] = (...s) => o.clearHighlightIndex && o.clearHighlightIndex(...s)),
|
|
376
|
+
onMousemoveCapture: t[1] || (t[1] = (...s) => o.onMouseHighlight && o.onMouseHighlight(...s))
|
|
381
377
|
}, [
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
key: 0,
|
|
385
|
-
"visually-hidden-close-label": e.visuallyHiddenCloseLabel,
|
|
386
|
-
tabindex: o.isArrowKeyNav ? -1 : 0,
|
|
387
|
-
onClose: s
|
|
388
|
-
}, null, 8, ["visually-hidden-close-label", "tabindex", "onClose"])) : S("", !0)
|
|
389
|
-
], 42, A)
|
|
378
|
+
l(e.$slots, "list", { close: r })
|
|
379
|
+
], 42, S)
|
|
390
380
|
]),
|
|
391
|
-
footerContent:
|
|
392
|
-
|
|
381
|
+
footerContent: h(({ close: r }) => [
|
|
382
|
+
l(e.$slots, "footer", { close: r })
|
|
393
383
|
]),
|
|
394
384
|
_: 3
|
|
395
385
|
}, 16, ["content-width", "open", "placement", "initial-focus-element", "fallback-placements", "append-to", "modal", "max-height", "max-width", "open-with-arrow-keys", "open-on-context", "tether", "transition"]);
|
|
396
386
|
}
|
|
397
|
-
const
|
|
387
|
+
const T = /* @__PURE__ */ I(P, [["render", A]]);
|
|
398
388
|
export {
|
|
399
|
-
|
|
389
|
+
T as default
|
|
400
390
|
};
|
|
401
391
|
//# sourceMappingURL=dropdown.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.js","sources":["../../../components/dropdown/dropdown.vue"],"sourcesContent":["<!-- eslint-disable max-lines -->\n<template>\n <dt-popover\n ref=\"popover\"\n :content-width=\"contentWidth\"\n :open=\"open\"\n :placement=\"placement\"\n :initial-focus-element=\"openedWithKeyboard ? 'first' : 'dialog'\"\n :fallback-placements=\"fallbackPlacements\"\n padding=\"none\"\n role=\"menu\"\n :append-to=\"appendTo\"\n :modal=\"modal\"\n :max-height=\"maxHeight\"\n :max-width=\"maxWidth\"\n :open-with-arrow-keys=\"shouldOpenWithArrowKeys\"\n :open-on-context=\"openOnContext\"\n v-bind=\"$attrs\"\n :tether=\"tether\"\n :transition=\"transition\"\n v-on=\"dropdownListeners\"\n >\n <template #anchor=\"{ attrs }\">\n <!-- @slot Anchor element that activates the dropdown -->\n <slot\n ref=\"anchor\"\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content=\"{ close }\">\n <!-- eslint-disable-next-line max-len -->\n <!-- eslint-disable-next-line vuejs-accessibility/mouse-events-have-key-events vuejs-accessibility/no-static-element-interactions -->\n <ul\n :id=\"listId\"\n ref=\"listWrapper\"\n :class=\"listClasses\"\n data-qa=\"dt-dropdown-list-wrapper\"\n @mouseleave=\"clearHighlightIndex\"\n @mousemove.capture=\"onMouseHighlight\"\n >\n <!-- @slot Slot for the list component -->\n <slot\n name=\"list\"\n :close=\"close\"\n />\n <sr-only-close-button\n v-if=\"showVisuallyHiddenClose\"\n :visually-hidden-close-label=\"visuallyHiddenCloseLabel\"\n :tabindex=\"isArrowKeyNav ? -1 : 0\"\n @close=\"close\"\n />\n </ul>\n </template>\n <template #footerContent=\"{ close }\">\n <!-- @slot Slot for the footer content -->\n <slot\n name=\"footer\"\n :close=\"close\"\n />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport KeyboardNavigation from '@/common/mixins/keyboard_list_navigation';\nimport { DtPopover, POPOVER_APPEND_TO_VALUES } from '@/components/popover';\nimport { LIST_ITEM_NAVIGATION_TYPES } from '@/components/list_item';\nimport { DROPDOWN_PADDING_CLASSES } from './dropdown_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { EVENT_KEYNAMES } from '@/common/constants';\nimport SrOnlyCloseButtonMixin from '@/common/mixins/sr_only_close_button';\nimport SrOnlyCloseButton from '@/common/sr_only_close_button.vue';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtDropdown',\n\n components: {\n DtPopover,\n SrOnlyCloseButton,\n },\n\n mixins: [\n KeyboardNavigation({\n indexKey: 'highlightIndex',\n idKey: 'highlightId',\n listElementKey: 'getListElement',\n listItemRole: 'menuitem',\n afterHighlightMethod: 'afterHighlight',\n beginningOfListMethod: 'beginningOfListMethod',\n endOfListMethod: 'endOfListMethod',\n activeItemKey: 'activeItemEl',\n focusOnKeyboardNavigation: true,\n }),\n SrOnlyCloseButtonMixin,\n ],\n\n inheritAttrs: false,\n\n props: {\n /**\n * Controls whether the dropdown is shown. Leaving this null will have the dropdown trigger on click by default.\n * If you set this value, the default trigger behavior will be disabled and you can control it as you need.\n * Supports v-model\n */\n open: {\n type: Boolean,\n default: null,\n },\n\n /**\n * Opens the dropdown on right click (context menu). If you set this value to `true`,\n * the default trigger behavior will be disabled.\n */\n openOnContext: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Vertical padding size around the list element.\n * @values none, small, large\n */\n padding: {\n type: String,\n default: 'small',\n validator: (padding) => {\n return Object.keys(DROPDOWN_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Determines modal state, dropdown has a modal overlay preventing interaction with elements\n * below it, but it is invisible.\n */\n modal: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Width configuration for the popover content. When its value is 'anchor',\n * the popover content will have the same width as the anchor.\n * @values null, anchor\n */\n contentWidth: {\n type: String,\n default: null,\n },\n\n /**\n * Determines maximum height for the popover before overflow.\n * Possible units rem|px|em\n */\n maxHeight: {\n type: String,\n default: '',\n },\n\n /**\n * Determines maximum width for the popover before overflow.\n * Possible units rem|px|%|em\n */\n maxWidth: {\n type: String,\n default: '',\n },\n\n /**\n * Sets an ID on the list element of the component. Used by several aria attributes\n * as well as when deriving the IDs for each item.\n */\n listId: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * The type of navigation that this component should support.\n * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n * - \"tab\" for items that are navigated using the TAB key.\n * - \"none\" for static items that are not interactive.\n * @values arrow-keys, tab, none\n */\n navigationType: {\n type: String,\n default: LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS,\n validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n },\n\n /**\n * If the dropdown does not fit in the direction described by \"placement\",\n * it will attempt to change it's direction to the \"fallbackPlacements\".\n *\n * @values top, top-start, top-end,\n * right, right-start, right-end,\n * left, left-start, left-end,\n * bottom, bottom-start, bottom-end,\n * auto, auto-start, auto-end\n * */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the dropdown displays relative to the anchor.\n */\n placement: {\n type: String,\n default: 'bottom',\n },\n\n /**\n * A method that will be called when the selection goes past the beginning of the list.\n */\n onBeginningOfList: {\n type: Function,\n default: null,\n },\n\n /**\n * A method that will be called when the selection goes past the end of the list.\n */\n onEndOfList: {\n type: Function,\n default: null,\n },\n\n /**\n * Additional class for the wrapper list element.\n */\n listClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Sets the element to which the popover is going to append to.\n * 'body' will append to the nearest body (supports shadow DOM).\n * @values 'body', 'parent', HTMLElement,\n */\n appendTo: {\n type: [HTMLElement, String],\n default: 'body',\n validator: appendTo => {\n return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n (appendTo instanceof HTMLElement);\n },\n },\n\n /**\n * If set to false the dialog will display over top of the anchor when there is insufficient space.\n * If set to true it will never move from its position relative to the anchor and will clip instead.\n * <a\n * class=\"d-link\"\n * href=\"https://popper.js.org/docs/v2/modifiers/prevent-overflow/#tether\"\n * target=\"_blank\"\n * >\n * Popper.js docs\n * </a>\n * @values true, false\n */\n tether: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Named transition when the content display is toggled.\n * @see DtLazyShow\n */\n transition: {\n type: String,\n default: 'fade',\n },\n },\n\n emits: [\n /**\n * Native keydown event\n *\n * @event keydown\n * @type {KeyboardEvent}\n */\n 'keydown',\n\n /**\n * Event fired when the highlight changes\n *\n * @event highlight\n * @type {Number}\n */\n 'highlight',\n\n /**\n * Event fired to sync the open prop with the parent component\n * @event update:open\n */\n 'update:open',\n\n /**\n * Event fired when dropdown is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n\n /**\n * Event fired to sync the open prop with the parent component\n * @event update:open\n */\n 'update:open',\n ],\n\n data () {\n return {\n LIST_ITEM_NAVIGATION_TYPES,\n DROPDOWN_PADDING_CLASSES,\n EVENT_KEYNAMES,\n openedWithKeyboard: false,\n isOpen: null,\n };\n },\n\n computed: {\n dropdownListeners () {\n return {\n opened: isPopoverOpen => {\n this.updateInitialHighlightIndex(isPopoverOpen);\n },\n\n keydown: event => {\n const eventCode = event.code;\n\n switch (eventCode) {\n case EVENT_KEYNAMES.up:\n case EVENT_KEYNAMES.arrowup:\n this.onUpKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.down:\n case EVENT_KEYNAMES.arrowdown:\n this.onDownKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.space:\n case EVENT_KEYNAMES.spacebar:\n this.onSpaceKey();\n break;\n case EVENT_KEYNAMES.enter:\n this.onEnterKey();\n break;\n case EVENT_KEYNAMES.home:\n this.onHomeKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.end:\n this.onEndKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n default:\n this.onKeyPress(event);\n break;\n }\n\n this.$emit('keydown', event);\n },\n };\n },\n\n beginningOfListMethod () {\n return this.onBeginningOfList || this.jumpToEnd;\n },\n\n endOfListMethod () {\n return this.onEndOfList || this.jumpToBeginning;\n },\n\n activeItemEl () {\n return this.getListElement().querySelector('#' + this.highlightId);\n },\n\n isArrowKeyNav () {\n return this.navigationType === this.LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS;\n },\n\n listClasses () {\n return [\n 'd-dropdown-list',\n DROPDOWN_PADDING_CLASSES[this.padding],\n this.listClass,\n { 'd-context-menu-list': this.openOnContext },\n ];\n },\n\n shouldOpenWithArrowKeys () {\n return !this.openOnContext;\n },\n },\n\n methods: {\n onMouseHighlight (e) {\n const liElement = e.target.closest('li');\n\n if (liElement && liElement.role && this.highlightId !== liElement.id) {\n this.setHighlightId(liElement.id);\n liElement.focus();\n }\n },\n\n getListElement () {\n return this.$refs.listWrapper;\n },\n\n clearHighlightIndex () {\n this.setHighlightIndex(-1);\n },\n\n afterHighlight () {\n if (this.visuallyHiddenClose && this.highlightIndex === this._itemsLength() - 1) {\n return;\n }\n\n this.$emit('highlight', this.highlightIndex);\n },\n\n updateInitialHighlightIndex (isPopoverOpen) {\n this.isOpen = isPopoverOpen;\n\n if (isPopoverOpen) {\n if (this.openedWithKeyboard && this.isArrowKeyNav) {\n this.setHighlightIndex(0);\n }\n this.$emit('opened', true);\n } else {\n this.clearHighlightIndex();\n this.openedWithKeyboard = false;\n this.$emit('opened', false);\n }\n },\n\n onSpaceKey () {\n if (!this.open) {\n this.openedWithKeyboard = true;\n }\n },\n\n onEnterKey () {\n if (!this.open) {\n this.openedWithKeyboard = true;\n }\n },\n\n onUpKeyPress () {\n if (!this.isOpen) {\n this.openedWithKeyboard = true;\n return;\n }\n if (this.isArrowKeyNav) {\n return this.onUpKey();\n }\n },\n\n onDownKeyPress () {\n if (!this.isOpen) {\n this.openedWithKeyboard = true;\n return;\n }\n if (this.isArrowKeyNav) {\n return this.onDownKey();\n }\n },\n\n onHomeKeyPress () {\n if (!this.isOpen || !this.isArrowKeyNav) {\n return;\n }\n\n return this.onHomeKey();\n },\n\n onEndKeyPress () {\n if (!this.isOpen || !this.isArrowKeyNav) {\n return;\n }\n\n return this.onEndKey();\n },\n\n onKeyPress (e) {\n if (!this.isOpen || !this.isArrowKeyNav || !this.isValidLetter(e.key)) {\n return;\n }\n\n e.stopPropagation();\n e.preventDefault();\n\n return this.onNavigationKey(e.key);\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","SrOnlyCloseButton","KeyboardNavigation","SrOnlyCloseButtonMixin","padding","DROPDOWN_PADDING_CLASSES","item","getUniqueString","LIST_ITEM_NAVIGATION_TYPES","t","appendTo","POPOVER_APPEND_TO_VALUES","EVENT_KEYNAMES","isPopoverOpen","event","liElement","_hoisted_1","_openBlock","_createBlock","_component_dt_popover","_mergeProps","$props","$data","$options","_ctx","_toHandlers","_withCtx","attrs","_renderSlot","close","_createElementVNode","_normalizeClass","args","_cache","_component_sr_only_close_button","_createCommentVNode"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dropdown.js","sources":["../../../components/dropdown/dropdown.vue"],"sourcesContent":["<!-- eslint-disable max-lines -->\n<template>\n <dt-popover\n ref=\"popover\"\n :content-width=\"contentWidth\"\n :open=\"open\"\n :placement=\"placement\"\n :initial-focus-element=\"openedWithKeyboard ? 'first' : 'dialog'\"\n :fallback-placements=\"fallbackPlacements\"\n padding=\"none\"\n role=\"menu\"\n :append-to=\"appendTo\"\n :modal=\"modal\"\n :max-height=\"maxHeight\"\n :max-width=\"maxWidth\"\n :open-with-arrow-keys=\"shouldOpenWithArrowKeys\"\n :open-on-context=\"openOnContext\"\n v-bind=\"$attrs\"\n :tether=\"tether\"\n :transition=\"transition\"\n v-on=\"dropdownListeners\"\n >\n <template #anchor=\"{ attrs }\">\n <!-- @slot Anchor element that activates the dropdown -->\n <slot\n ref=\"anchor\"\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content=\"{ close }\">\n <!-- eslint-disable-next-line max-len -->\n <!-- eslint-disable-next-line vuejs-accessibility/mouse-events-have-key-events vuejs-accessibility/no-static-element-interactions -->\n <ul\n :id=\"listId\"\n ref=\"listWrapper\"\n :class=\"listClasses\"\n data-qa=\"dt-dropdown-list-wrapper\"\n @mouseleave=\"clearHighlightIndex\"\n @mousemove.capture=\"onMouseHighlight\"\n >\n <!-- @slot Slot for the list component -->\n <slot\n name=\"list\"\n :close=\"close\"\n />\n </ul>\n </template>\n <template #footerContent=\"{ close }\">\n <!-- @slot Slot for the footer content -->\n <slot\n name=\"footer\"\n :close=\"close\"\n />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport KeyboardNavigation from '@/common/mixins/keyboard_list_navigation';\nimport { DtPopover, POPOVER_APPEND_TO_VALUES } from '@/components/popover';\nimport { LIST_ITEM_NAVIGATION_TYPES } from '@/components/list_item';\nimport { DROPDOWN_PADDING_CLASSES } from './dropdown_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { EVENT_KEYNAMES } from '@/common/constants';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtDropdown',\n\n components: {\n DtPopover,\n },\n\n mixins: [\n KeyboardNavigation({\n indexKey: 'highlightIndex',\n idKey: 'highlightId',\n listElementKey: 'getListElement',\n listItemRole: 'menuitem',\n afterHighlightMethod: 'afterHighlight',\n beginningOfListMethod: 'beginningOfListMethod',\n endOfListMethod: 'endOfListMethod',\n activeItemKey: 'activeItemEl',\n focusOnKeyboardNavigation: true,\n }),\n ],\n\n inheritAttrs: false,\n\n props: {\n /**\n * Controls whether the dropdown is shown. Leaving this null will have the dropdown trigger on click by default.\n * If you set this value, the default trigger behavior will be disabled and you can control it as you need.\n * Supports v-model\n */\n open: {\n type: Boolean,\n default: null,\n },\n\n /**\n * Opens the dropdown on right click (context menu). If you set this value to `true`,\n * the default trigger behavior will be disabled.\n */\n openOnContext: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Vertical padding size around the list element.\n * @values none, small, large\n */\n padding: {\n type: String,\n default: 'small',\n validator: (padding) => {\n return Object.keys(DROPDOWN_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Determines modal state, dropdown has a modal overlay preventing interaction with elements\n * below it, but it is invisible.\n */\n modal: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Width configuration for the popover content. When its value is 'anchor',\n * the popover content will have the same width as the anchor.\n * @values null, anchor\n */\n contentWidth: {\n type: String,\n default: null,\n },\n\n /**\n * Determines maximum height for the popover before overflow.\n * Possible units rem|px|em\n */\n maxHeight: {\n type: String,\n default: '',\n },\n\n /**\n * Determines maximum width for the popover before overflow.\n * Possible units rem|px|%|em\n */\n maxWidth: {\n type: String,\n default: '',\n },\n\n /**\n * Sets an ID on the list element of the component. Used by several aria attributes\n * as well as when deriving the IDs for each item.\n */\n listId: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * The type of navigation that this component should support.\n * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n * - \"tab\" for items that are navigated using the TAB key.\n * - \"none\" for static items that are not interactive.\n * @values arrow-keys, tab, none\n */\n navigationType: {\n type: String,\n default: LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS,\n validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n },\n\n /**\n * If the dropdown does not fit in the direction described by \"placement\",\n * it will attempt to change it's direction to the \"fallbackPlacements\".\n *\n * @values top, top-start, top-end,\n * right, right-start, right-end,\n * left, left-start, left-end,\n * bottom, bottom-start, bottom-end,\n * auto, auto-start, auto-end\n * */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the dropdown displays relative to the anchor.\n */\n placement: {\n type: String,\n default: 'bottom',\n },\n\n /**\n * A method that will be called when the selection goes past the beginning of the list.\n */\n onBeginningOfList: {\n type: Function,\n default: null,\n },\n\n /**\n * A method that will be called when the selection goes past the end of the list.\n */\n onEndOfList: {\n type: Function,\n default: null,\n },\n\n /**\n * Additional class for the wrapper list element.\n */\n listClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Sets the element to which the popover is going to append to.\n * 'body' will append to the nearest body (supports shadow DOM).\n * @values 'body', 'parent', HTMLElement,\n */\n appendTo: {\n type: [HTMLElement, String],\n default: 'body',\n validator: appendTo => {\n return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n (appendTo instanceof HTMLElement);\n },\n },\n\n /**\n * If set to false the dialog will display over top of the anchor when there is insufficient space.\n * If set to true it will never move from its position relative to the anchor and will clip instead.\n * <a\n * class=\"d-link\"\n * href=\"https://popper.js.org/docs/v2/modifiers/prevent-overflow/#tether\"\n * target=\"_blank\"\n * >\n * Popper.js docs\n * </a>\n * @values true, false\n */\n tether: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Named transition when the content display is toggled.\n * @see DtLazyShow\n */\n transition: {\n type: String,\n default: 'fade',\n },\n },\n\n emits: [\n /**\n * Native keydown event\n *\n * @event keydown\n * @type {KeyboardEvent}\n */\n 'keydown',\n\n /**\n * Event fired when the highlight changes\n *\n * @event highlight\n * @type {Number}\n */\n 'highlight',\n\n /**\n * Event fired to sync the open prop with the parent component\n * @event update:open\n */\n 'update:open',\n\n /**\n * Event fired when dropdown is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n\n /**\n * Event fired to sync the open prop with the parent component\n * @event update:open\n */\n 'update:open',\n ],\n\n data () {\n return {\n LIST_ITEM_NAVIGATION_TYPES,\n DROPDOWN_PADDING_CLASSES,\n EVENT_KEYNAMES,\n openedWithKeyboard: false,\n isOpen: null,\n };\n },\n\n computed: {\n dropdownListeners () {\n return {\n opened: isPopoverOpen => {\n this.updateInitialHighlightIndex(isPopoverOpen);\n },\n\n keydown: event => {\n const eventCode = event.code;\n\n switch (eventCode) {\n case EVENT_KEYNAMES.up:\n case EVENT_KEYNAMES.arrowup:\n this.onUpKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.down:\n case EVENT_KEYNAMES.arrowdown:\n this.onDownKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.space:\n case EVENT_KEYNAMES.spacebar:\n this.onSpaceKey();\n break;\n case EVENT_KEYNAMES.enter:\n this.onEnterKey();\n break;\n case EVENT_KEYNAMES.home:\n this.onHomeKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n case EVENT_KEYNAMES.end:\n this.onEndKeyPress(event);\n event.stopPropagation();\n event.preventDefault();\n break;\n default:\n this.onKeyPress(event);\n break;\n }\n\n this.$emit('keydown', event);\n },\n };\n },\n\n beginningOfListMethod () {\n return this.onBeginningOfList || this.jumpToEnd;\n },\n\n endOfListMethod () {\n return this.onEndOfList || this.jumpToBeginning;\n },\n\n activeItemEl () {\n return this.getListElement().querySelector('#' + this.highlightId);\n },\n\n isArrowKeyNav () {\n return this.navigationType === this.LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS;\n },\n\n listClasses () {\n return [\n 'd-dropdown-list',\n DROPDOWN_PADDING_CLASSES[this.padding],\n this.listClass,\n { 'd-context-menu-list': this.openOnContext },\n ];\n },\n\n shouldOpenWithArrowKeys () {\n return !this.openOnContext;\n },\n },\n\n methods: {\n onMouseHighlight (e) {\n const liElement = e.target.closest('li');\n\n if (liElement && liElement.role && this.highlightId !== liElement.id) {\n this.setHighlightId(liElement.id);\n liElement.focus();\n }\n },\n\n getListElement () {\n return this.$refs.listWrapper;\n },\n\n clearHighlightIndex () {\n this.setHighlightIndex(-1);\n },\n\n afterHighlight () {\n if (this.highlightIndex === this._itemsLength() - 1) {\n return;\n }\n\n this.$emit('highlight', this.highlightIndex);\n },\n\n updateInitialHighlightIndex (isPopoverOpen) {\n this.isOpen = isPopoverOpen;\n\n if (isPopoverOpen) {\n if (this.openedWithKeyboard && this.isArrowKeyNav) {\n this.setHighlightIndex(0);\n }\n this.$emit('opened', true);\n } else {\n this.clearHighlightIndex();\n this.openedWithKeyboard = false;\n this.$emit('opened', false);\n }\n },\n\n onSpaceKey () {\n if (!this.open) {\n this.openedWithKeyboard = true;\n }\n },\n\n onEnterKey () {\n if (!this.open) {\n this.openedWithKeyboard = true;\n }\n },\n\n onUpKeyPress () {\n if (!this.isOpen) {\n this.openedWithKeyboard = true;\n return;\n }\n if (this.isArrowKeyNav) {\n return this.onUpKey();\n }\n },\n\n onDownKeyPress () {\n if (!this.isOpen) {\n this.openedWithKeyboard = true;\n return;\n }\n if (this.isArrowKeyNav) {\n return this.onDownKey();\n }\n },\n\n onHomeKeyPress () {\n if (!this.isOpen || !this.isArrowKeyNav) {\n return;\n }\n\n return this.onHomeKey();\n },\n\n onEndKeyPress () {\n if (!this.isOpen || !this.isArrowKeyNav) {\n return;\n }\n\n return this.onEndKey();\n },\n\n onKeyPress (e) {\n if (!this.isOpen || !this.isArrowKeyNav || !this.isValidLetter(e.key)) {\n return;\n }\n\n e.stopPropagation();\n e.preventDefault();\n\n return this.onNavigationKey(e.key);\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","KeyboardNavigation","padding","DROPDOWN_PADDING_CLASSES","item","getUniqueString","LIST_ITEM_NAVIGATION_TYPES","t","appendTo","POPOVER_APPEND_TO_VALUES","EVENT_KEYNAMES","isPopoverOpen","event","liElement","_hoisted_1","_openBlock","_createBlock","_component_dt_popover","_mergeProps","$props","$data","$options","_ctx","_toHandlers","_withCtx","attrs","_renderSlot","close","_createElementVNode","_normalizeClass","args","_cache"],"mappings":";;;;;;;;;AAkEA,MAAKA,IAAU;AAAA,EACb,cAAc,EAAE,MAAM,EAAG;AAAA,EACzB,MAAM;AAAA,EAEN,YAAY;AAAA,IACV,WAAAC;AAAA,EACD;AAAA,EAED,QAAQ;AAAA,IACNC,EAAmB;AAAA,MACjB,UAAU;AAAA,MACV,OAAO;AAAA,MACP,gBAAgB;AAAA,MAChB,cAAc;AAAA,MACd,sBAAsB;AAAA,MACtB,uBAAuB;AAAA,MACvB,iBAAiB;AAAA,MACjB,eAAe;AAAA,MACf,2BAA2B;AAAA,IAC7B,CAAC;AAAA,EACF;AAAA,EAED,cAAc;AAAA,EAEd,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAML,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,eAAe;AAAA,MACb,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAACC,MACH,OAAO,KAAKC,CAAwB,EAAE,KAAK,CAACC,MAASA,MAASF,CAAO;AAAA,IAE/E;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,cAAc;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,UAAW;AAAE,eAAOG,EAAe;AAAA,MAAK;AAAA,IACzC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASD,gBAAgB;AAAA,MACd,MAAM;AAAA,MACN,SAASC,EAA2B;AAAA,MACpC,WAAW,CAACC,MAAM,OAAO,OAAOD,CAA0B,EAAE,SAASC,CAAC;AAAA,IACvE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAYD,oBAAoB;AAAA,MAClB,MAAM;AAAA,MACN,SAAS,MACA,CAAC,MAAM;AAAA,IAEjB;AAAA;AAAA;AAAA;AAAA,IAKD,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,mBAAmB;AAAA,MACjB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,WAAW;AAAA,MACT,MAAM,CAAC,QAAQ,OAAO,MAAM;AAAA,MAC5B,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,UAAU;AAAA,MACR,MAAM,CAAC,aAAa,MAAM;AAAA,MAC1B,SAAS;AAAA,MACT,WAAW,CAAAC,MACFC,EAAyB,SAASD,CAAQ,KAC5CA,aAAoB;AAAA,IAE5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAcD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOL;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA;AAAA,EACD;AAAA,EAED,OAAQ;AACN,WAAO;AAAA,MACL,4BAAAF;AAAA,MACA,0BAAAH;AAAA,MACA,gBAAAO;AAAA,MACA,oBAAoB;AAAA,MACpB,QAAQ;AAAA;EAEX;AAAA,EAED,UAAU;AAAA,IACR,oBAAqB;AACnB,aAAO;AAAA,QACL,QAAQ,CAAAC,MAAiB;AACvB,eAAK,4BAA4BA,CAAa;AAAA,QAC/C;AAAA,QAED,SAAS,CAAAC,MAAS;AAGhB,kBAFkBA,EAAM,MAEP;AAAA,YACf,KAAKF,EAAe;AAAA,YACpB,KAAKA,EAAe;AAClB,mBAAK,aAAaE,CAAK,GACvBA,EAAM,gBAAe,GACrBA,EAAM,eAAc;AACpB;AAAA,YACF,KAAKF,EAAe;AAAA,YACpB,KAAKA,EAAe;AAClB,mBAAK,eAAeE,CAAK,GACzBA,EAAM,gBAAe,GACrBA,EAAM,eAAc;AACpB;AAAA,YACF,KAAKF,EAAe;AAAA,YACpB,KAAKA,EAAe;AAClB,mBAAK,WAAU;AACf;AAAA,YACF,KAAKA,EAAe;AAClB,mBAAK,WAAU;AACf;AAAA,YACF,KAAKA,EAAe;AAClB,mBAAK,eAAeE,CAAK,GACzBA,EAAM,gBAAe,GACrBA,EAAM,eAAc;AACpB;AAAA,YACF,KAAKF,EAAe;AAClB,mBAAK,cAAcE,CAAK,GACxBA,EAAM,gBAAe,GACrBA,EAAM,eAAc;AACpB;AAAA,YACF;AACE,mBAAK,WAAWA,CAAK;AACrB;AAAA,UACJ;AAEA,eAAK,MAAM,WAAWA,CAAK;AAAA,QAC5B;AAAA;IAEJ;AAAA,IAED,wBAAyB;AACvB,aAAO,KAAK,qBAAqB,KAAK;AAAA,IACvC;AAAA,IAED,kBAAmB;AACjB,aAAO,KAAK,eAAe,KAAK;AAAA,IACjC;AAAA,IAED,eAAgB;AACd,aAAO,KAAK,iBAAiB,cAAc,MAAM,KAAK,WAAW;AAAA,IAClE;AAAA,IAED,gBAAiB;AACf,aAAO,KAAK,mBAAmB,KAAK,2BAA2B;AAAA,IAChE;AAAA,IAED,cAAe;AACb,aAAO;AAAA,QACL;AAAA,QACAT,EAAyB,KAAK,OAAO;AAAA,QACrC,KAAK;AAAA,QACL,EAAE,uBAAuB,KAAK,cAAe;AAAA;IAEhD;AAAA,IAED,0BAA2B;AACzB,aAAO,CAAC,KAAK;AAAA,IACd;AAAA,EACF;AAAA,EAED,SAAS;AAAA,IACP,iBAAkB,GAAG;AACnB,YAAMU,IAAY,EAAE,OAAO,QAAQ,IAAI;AAEvC,MAAIA,KAAaA,EAAU,QAAQ,KAAK,gBAAgBA,EAAU,OAChE,KAAK,eAAeA,EAAU,EAAE,GAChCA,EAAU,MAAK;AAAA,IAElB;AAAA,IAED,iBAAkB;AAChB,aAAO,KAAK,MAAM;AAAA,IACnB;AAAA,IAED,sBAAuB;AACrB,WAAK,kBAAkB,EAAE;AAAA,IAC1B;AAAA,IAED,iBAAkB;AAChB,MAAI,KAAK,mBAAmB,KAAK,aAAY,IAAK,KAIlD,KAAK,MAAM,aAAa,KAAK,cAAc;AAAA,IAC5C;AAAA,IAED,4BAA6BF,GAAe;AAC1C,WAAK,SAASA,GAEVA,KACE,KAAK,sBAAsB,KAAK,iBAClC,KAAK,kBAAkB,CAAC,GAE1B,KAAK,MAAM,UAAU,EAAI,MAEzB,KAAK,oBAAmB,GACxB,KAAK,qBAAqB,IAC1B,KAAK,MAAM,UAAU,EAAK;AAAA,IAE7B;AAAA,IAED,aAAc;AACZ,MAAK,KAAK,SACR,KAAK,qBAAqB;AAAA,IAE7B;AAAA,IAED,aAAc;AACZ,MAAK,KAAK,SACR,KAAK,qBAAqB;AAAA,IAE7B;AAAA,IAED,eAAgB;AACd,UAAI,CAAC,KAAK,QAAQ;AAChB,aAAK,qBAAqB;AAC1B;AAAA,MACF;AACA,UAAI,KAAK;AACP,eAAO,KAAK;IAEf;AAAA,IAED,iBAAkB;AAChB,UAAI,CAAC,KAAK,QAAQ;AAChB,aAAK,qBAAqB;AAC1B;AAAA,MACF;AACA,UAAI,KAAK;AACP,eAAO,KAAK;IAEf;AAAA,IAED,iBAAkB;AAChB,UAAI,GAAC,KAAK,UAAU,CAAC,KAAK;AAI1B,eAAO,KAAK;IACb;AAAA,IAED,gBAAiB;AACf,UAAI,GAAC,KAAK,UAAU,CAAC,KAAK;AAI1B,eAAO,KAAK;IACb;AAAA,IAED,WAAY,GAAG;AACb,UAAI,GAAC,KAAK,UAAU,CAAC,KAAK,iBAAiB,CAAC,KAAK,cAAc,EAAE,GAAG;AAIpE,iBAAE,gBAAe,GACjB,EAAE,eAAc,GAET,KAAK,gBAAgB,EAAE,GAAG;AAAA,IAClC;AAAA,EACF;AACH,GAnfAG,IAAA,CAAA,IAAA;;;AAEE,SAAAC,EAAA,GAAAC,EAqDaC,GArDbC,EAqDa;AAAA,IApDX,KAAI;AAAA,IACH,iBAAeC,EAAY;AAAA,IAC3B,MAAMA,EAAI;AAAA,IACV,WAAWA,EAAS;AAAA,IACpB,yBAAuBC,EAAkB,qBAAA,UAAA;AAAA,IACzC,uBAAqBD,EAAkB;AAAA,IACxC,SAAQ;AAAA,IACR,MAAK;AAAA,IACJ,aAAWA,EAAQ;AAAA,IACnB,OAAOA,EAAK;AAAA,IACZ,cAAYA,EAAS;AAAA,IACrB,aAAWA,EAAQ;AAAA,IACnB,wBAAsBE,EAAuB;AAAA,IAC7C,mBAAiBF,EAAa;AAAA,KACvBG,EAAM,QAAA;AAAA,IACb,QAAQH,EAAM;AAAA,IACd,YAAYA,EAAU;AAAA,EACvB,GAAAI,EAAwBF,EAAD,iBAAA,CAAA,GAAA;AAAA,IAEZ,QAAMG,EAEf,CAIE,EANiB,OAAAC,QAAK;AAAA,MAExBC,EAIEJ,oBAJFJ,EAIE,EAHA,KAAI,YAEIO,CAAK,CAAA;AAAA;IAGN,SAAOD,EAGhB,CAaK,EAhBe,OAAAG,QAAK;AAAA,MAGzBC,EAaK,MAAA;AAAA,QAZF,IAAIT,EAAM;AAAA,QACX,KAAI;AAAA,QACH,OApCTU,EAoCgBR,EAAW,WAAA;AAAA,QACnB,WAAQ;AAAA,QACP,wCAAYA,EAAmB,uBAAAA,EAAA,oBAAA,GAAAS,CAAA;AAAA,QAtCxC,oBAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAD,MAuC4BT,EAAgB,oBAAAA,EAAA,iBAAA,GAAAS,CAAA;AAAA;QAGpCJ,EAGEJ,EAAA,QAAA,QAAA,EADC,OAAOK,GAAK;AAAA,MA5CvB,GAAA,IAAAb,CAAA;AAAA;IAgDe,eAAaU,EAEtB,CAGE,EALwB,OAAAG,QAAK;AAAA,MAE/BD,EAGEJ,EAAA,QAAA,UAAA,EADC,OAAOK,GAAK;AAAA;IApDrB,GAAA;AAAA;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("./editor-constants.cjs"),f=require("../../common/utils/index.cjs"),r=require("@dialpad/dialtone-icons/vue3"),e=require("vue"),C=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),x=require("../rich-text-editor/rich-text-editor.cjs"),y=require("../button/button.cjs"),A=require("../popover/popover.cjs"),L=require("../stack/stack.cjs"),b=require("../input/input.cjs"),T=require("../tooltip/tooltip.cjs"),B=require("../rich-text-editor/rich-text-editor-constants.cjs"),_={compatConfig:{MODE:3},name:"DtRecipeEditor",components:{DtRichTextEditor:x.default,DtButton:y.default,DtPopover:A.default,DtStack:L.default,DtInput:b.default,DtTooltip:T.default,DtIconQuickReply:r.DtIconQuickReply,DtIconBold:r.DtIconBold,DtIconItalic:r.DtIconItalic,DtIconUnderline:r.DtIconUnderline,DtIconStrikethrough:r.DtIconStrikethrough,DtIconListBullet:r.DtIconListBullet,DtIconListOrdered:r.DtIconListOrdered,DtIconAlignLeft:r.DtIconAlignLeft,DtIconAlignCenter:r.DtIconAlignCenter,DtIconAlignRight:r.DtIconAlignRight,DtIconAlignJustify:r.DtIconAlignJustify,DtIconQuote:r.DtIconQuote,DtIconCodeBlock:r.DtIconCodeBlock,DtIconLink2:r.DtIconLink2,DtIconImage:r.DtIconImage},mixins:[],inheritAttrs:!1,props:{modelValue:{type:[Object,String],default:""},editable:{type:Boolean,default:!0},inputAriaLabel:{type:String,required:!0,default:""},inputClass:{type:String,default:""},autoFocus:{type:[Boolean,String,Number],default:!1,validator(t){return typeof t=="string"?B.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(t):!0}},placeholder:{type:String,default:""},maxHeight:{type:String,default:"unset"},confirmSetLinkButton:{type:Object,default:()=>({label:"Confirm",ariaLabel:"Confirm set link"})},removeLinkButton:{type:Object,default:()=>({label:"Remove",ariaLabel:"Remove link"})},cancelSetLinkButton:{type:Object,default:()=>({label:"Cancel",ariaLabel:"Cancel set link"})},setLinkPlaceholder:{type:String,default:""},showBoldButton:{type:Boolean,default:!0},showItalicsButton:{type:Boolean,default:!0},showUnderlineButton:{type:Boolean,default:!0},showStrikeButton:{type:Boolean,default:!0},showListItemsButton:{type:Boolean,default:!0},showOrderedListButton:{type:Boolean,default:!0},showAlignLeftButton:{type:Boolean,default:!0},showAlignCenterButton:{type:Boolean,default:!0},showAlignRightButton:{type:Boolean,default:!0},showAlignJustifyButton:{type:Boolean,default:!0},showQuoteButton:{type:Boolean,default:!0},showCodeBlockButton:{type:Boolean,default:!0},showQuickRepliesButton:{type:Boolean,default:!0},showInlineImageButton:{type:Boolean,default:!1},showAddLink:{type:Object,default:()=>({showAddLinkButton:!0,setLinkTitle:"Add a link",setLinkInputAriaLabel:"Input field to add link"})},useDivTags:{type:Boolean,default:!1}},emits:["focus","blur","input","update:modelValue","quick-replies-click","inline-image-click","text-input"],data(){return{internalInputValue:this.modelValue,hasFocus:!1,linkOptions:{class:"d-recipe-editor__link"},showLinkInput:!1,linkInput:"",currentButtonRefIndex:0}},computed:{inputLength(){return this.internalInputValue.length},htmlOutputFormat(){return B.RICH_TEXT_EDITOR_OUTPUT_FORMATS[2]},showingTextFormatButtons(){return this.showBoldButton||this.showItalicsButton||this.showStrikeButton||this.showUnderlineButton},showingAlignmentButtons(){return this.showAlignLeftButton||this.showAlignCenterButton||this.showAlignRightButton||this.showAlignJustifyButton},showingListButtons(){return this.showListItemsButton||this.showOrderedListButton},orderedRefs(){const t=this.buttonGroups.reduce((function(i,n){return n.buttonGroup.forEach(l=>{i.push(this.getButtonRef(n.key,l.selector))},this),i}).bind(this),[]);return t.push(this.getButtonRef("custom","link")),t},buttonGroups(){const t=this.individualButtons.map(i=>({key:i.selector,buttonGroup:[i]}));return[{key:"new",buttonGroup:this.newButtons},{key:"format",buttonGroup:this.textFormatButtons},{key:"alignment",buttonGroup:this.alignmentButtons},{key:"list",buttonGroup:this.listButtons},...t].filter(i=>i.buttonGroup.length>0)},newButtons(){return[{showBtn:this.showQuickRepliesButton,label:"Quick reply",selector:"quickReplies",icon:r.DtIconQuickReply,dataQA:"dt-recipe-editor-quick-replies-btn",tooltipMessage:"Quick Reply",onClick:this.onQuickRepliesClick}].filter(t=>t.showBtn)},textFormatButtons(){return[{showBtn:this.showBoldButton,selector:"bold",icon:r.DtIconBold,dataQA:"dt-recipe-editor-bold-btn",tooltipMessage:"Bold",onClick:this.onBoldTextToggle},{showBtn:this.showItalicsButton,selector:"italic",icon:r.DtIconItalic,dataQA:"dt-recipe-editor-italics-btn",tooltipMessage:"Italics",onClick:this.onItalicTextToggle},{showBtn:this.showUnderlineButton,selector:"underline",icon:r.DtIconUnderline,dataQA:"dt-recipe-editor-underline-btn",tooltipMessage:"Underline",onClick:this.onUnderlineTextToggle},{showBtn:this.showStrikeButton,selector:"strike",icon:r.DtIconStrikethrough,dataQA:"dt-recipe-editor-strike-btn",tooltipMessage:"Strike",onClick:this.onStrikethroughTextToggle}].filter(t=>t.showBtn)},alignmentButtons(){return[{showBtn:this.showAlignLeftButton,selector:{textAlign:"left"},icon:r.DtIconAlignLeft,dataQA:"dt-recipe-editor-align-left-btn",tooltipMessage:"Align Left",onClick:()=>this.onTextAlign("left")},{showBtn:this.showAlignCenterButton,selector:{textAlign:"center"},icon:r.DtIconAlignCenter,dataQA:"dt-recipe-editor-align-center-btn",tooltipMessage:"Align Center",onClick:()=>this.onTextAlign("center")},{showBtn:this.showAlignRightButton,selector:{textAlign:"right"},icon:r.DtIconAlignRight,dataQA:"dt-recipe-editor-align-right-btn",tooltipMessage:"Align Right",onClick:()=>this.onTextAlign("right")},{showBtn:this.showAlignJustifyButton,selector:{textAlign:"justify"},icon:r.DtIconAlignJustify,dataQA:"dt-recipe-editor-align-justify-btn",tooltipMessage:"Align Justify",onClick:()=>this.onTextAlign("justify")}].filter(t=>t.showBtn)},listButtons(){return[{showBtn:this.showListItemsButton,selector:"bulletList",icon:r.DtIconListBullet,dataQA:"dt-recipe-editor-list-items-btn",tooltipMessage:"Bullet List",onClick:this.onBulletListToggle},{showBtn:this.showOrderedListButton,selector:"orderedList",icon:r.DtIconListOrdered,dataQA:"dt-recipe-editor-ordered-list-items-btn",tooltipMessage:"Ordered List",onClick:this.onOrderedListToggle}].filter(t=>t.showBtn)},individualButtons(){return[{showBtn:this.showQuoteButton,selector:"blockquote",icon:r.DtIconQuote,dataQA:"dt-recipe-editor-blockquote-btn",tooltipMessage:"Quote",onClick:this.onBlockquoteToggle},{showBtn:this.showCodeBlockButton,selector:"codeBlock",icon:r.DtIconCodeBlock,dataQA:"dt-recipe-editor-code-block-btn",tooltipMessage:"Code",onClick:this.onCodeBlockToggle},{showBtn:this.showInlineImageButton,selector:"image",icon:r.DtIconImage,dataQA:"dt-recipe-editor-inline-image-btn",tooltipMessage:"Image",onClick:this.onInsertInlineImageClick}].filter(t=>t.showBtn)},linkButton(){return{showBtn:this.showAddLink.showAddLinkButton,selector:"link",icon:r.DtIconLink2,dataQA:"dt-recipe-editor-add-link-btn",tooltipMessage:"Link",onClick:this.openLinkInput}}},watch:{modelValue(t){this.internalInputValue=t}},methods:{removeClassStyleAttrs:f.removeClassStyleAttrs,addClassStyleAttrs:f.addClassStyleAttrs,onInputFocus(t){t==null||t.stopPropagation()},removeLink(){var t,i,n,l,s;(s=(l=(n=(i=(t=this.$refs.richTextEditor)==null?void 0:t.editor)==null?void 0:i.chain())==null?void 0:n.focus())==null?void 0:l.unsetLink())==null||s.run(),this.closeLinkInput()},setLink(t){var s,o,c;const i=(s=this.$refs.richTextEditor)==null?void 0:s.editor;if(t==null||t.preventDefault(),t==null||t.stopPropagation(),!this.linkInput){this.removeLink();return}g.EDITOR_SUPPORTED_LINK_PROTOCOLS.find(d=>d.test(this.linkInput))||(this.linkInput=`${g.EDITOR_DEFAULT_LINK_PREFIX}${this.linkInput}`);const l=(c=(o=i==null?void 0:i.view)==null?void 0:o.state)==null?void 0:c.selection;l.anchor===l.head?i.chain().focus().insertContentAt(l.anchor,`<a class="${this.linkOptions.class}" href=${this.linkInput}>${this.linkInput}</a>`).run():i.chain().focus().extendMarkRange("link").setLink({href:this.linkInput,class:this.linkOptions.class}).run(),this.closeLinkInput()},openLinkInput(){this.showLinkInput=!0},updateInput(t){var i,n,l;if(!t)return this.closeLinkInput();this.linkInput=(l=(n=(i=this.$refs.richTextEditor)==null?void 0:i.editor)==null?void 0:n.getAttributes("link"))==null?void 0:l.href},closeLinkInput(){var t;this.showLinkInput=!1,this.linkInput="",(t=this.$refs.richTextEditor.editor)==null||t.chain().focus()},onBoldTextToggle(){var t,i;(i=(t=this.$refs.richTextEditor)==null?void 0:t.editor)==null||i.chain().focus().toggleBold().run()},onItalicTextToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleItalic().run()},onUnderlineTextToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleUnderline().run()},onStrikethroughTextToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleStrike().run()},onTextAlign(t){var i,n,l,s;if((n=(i=this.$refs.richTextEditor)==null?void 0:i.editor)!=null&&n.isActive({textAlign:t}))return(l=this.$refs.richTextEditor)==null?void 0:l.editor.chain().focus().unsetTextAlign().run();(s=this.$refs.richTextEditor)==null||s.editor.chain().focus().setTextAlign(t).run()},onBulletListToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleBulletList().run()},onOrderedListToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleOrderedList().run()},onCodeBlockToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleCodeBlock().run()},onQuickRepliesClick(){this.$emit("quick-replies-click")},onInsertInlineImageClick(){this.$emit("inline-image-click")},insertInlineImage(t){var i;(i=this.$refs.richTextEditor)==null||i.editor.chain().focus().setImage({src:t}).run()},insertInMessageBody(t){var i;(i=this.$refs.richTextEditor)==null||i.editor.chain().focus().insertContent(t).run()},setCursorPosition(t=null){var i;(i=this.$refs.richTextEditor)==null||i.editor.chain().focus(t).run()},onBlockquoteToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleBlockquote().run()},onTextInput(t){this.$emit("text-input",t)},onFocus(t){this.hasFocus=!0,this.$emit("focus",t)},onBlur(t){this.hasFocus=!1,this.$emit("blur",t)},onInput(t){this.$emit("input",t),this.$emit("update:modelValue",t)},getButtonKey(t,i){return`${t}-${JSON.stringify(i)}`},getButtonRef(t,i){return`${this.getButtonKey(t,i)}-ref`},canFocus(t){return t===this.orderedRefs[this.currentButtonRefIndex]},shiftActionBarFocusRight(){this.shiftButtonRefIndex(1)},shiftActionBarFocusLeft(){this.shiftButtonRefIndex(-1)},shiftButtonRefIndex(t){const i=this.$refs[this.orderedRefs[this.currentButtonRefIndex]],n=Array.isArray(i)?i[0]:i,l=(this.currentButtonRefIndex+t)%this.orderedRefs.length;this.currentButtonRefIndex=l>=0?l:this.orderedRefs.length+l;const s=this.$refs[this.orderedRefs[this.currentButtonRefIndex]],o=Array.isArray(s)?s[0]:s;n.$el.blur(),o.$el.focus()}}},D=e.createElementVNode("div",{class:"d-recipe-editor__button-group-divider"},null,-1),R={class:"d-recipe-editor__popover-content"},v={key:0};function E(t,i,n,l,s,o){const c=e.resolveComponent("dt-button"),d=e.resolveComponent("dt-tooltip"),h=e.resolveComponent("dt-stack"),m=e.resolveComponent("dt-input"),I=e.resolveComponent("dt-popover"),w=e.resolveComponent("dt-rich-text-editor");return e.openBlock(),e.createElementBlock("div",e.mergeProps({class:"d-recipe-editor"},o.addClassStyleAttrs(t.$attrs),{"data-qa":"dt-recipe-editor",role:"presentation",onClick:i[4]||(i[4]=u=>t.$refs.richTextEditor.focusEditor())}),[e.createVNode(h,{class:"d-recipe-editor__top-bar",direction:"row",gap:"450"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.buttonGroups,u=>(e.openBlock(),e.createBlock(h,{key:u.key,direction:"row",gap:"300"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.buttonGroup,a=>(e.openBlock(),e.createBlock(d,{key:o.getButtonKey(u.key,a.selector),message:a.tooltipMessage,placement:"top"},{anchor:e.withCtx(()=>{var p,k;return[e.createVNode(c,{ref_for:!0,ref:o.getButtonRef(u.key,a.selector),active:(k=(p=t.$refs.richTextEditor)==null?void 0:p.editor)==null?void 0:k.isActive(a.selector),"aria-label":a.tooltipMessage,"data-qa":a.dataQA,tabindex:o.canFocus(o.getButtonRef(u.key,a.selector))?0:-1,importance:"clear",kind:"muted",size:"xs",onClick:O=>a.onClick(),onKeydown:[e.withKeys(e.withModifiers(o.shiftActionBarFocusRight,["stop"]),["right"]),e.withKeys(e.withModifiers(o.shiftActionBarFocusLeft,["stop"]),["left"])]},{icon:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(a.icon),{size:"200"}))]),default:e.withCtx(()=>[e.createTextVNode(" "+e.toDisplayString(a==null?void 0:a.label),1)]),_:2},1032,["active","aria-label","data-qa","tabindex","onClick","onKeydown"])]}),_:2},1032,["message"]))),128)),D]),_:2},1024))),128)),o.linkButton.showBtn?(e.openBlock(),e.createBlock(h,{key:0,direction:"row",gap:"300"},{default:e.withCtx(()=>[e.createVNode(I,{open:s.showLinkInput,"show-close-button":!1,"visually-hidden-close":!0,"visually-hidden-close-label":"Close link input popover","data-qa":"dt-recipe-editor-link-input-popover",padding:"none",placement:"bottom-start",onClick:[o.onInputFocus,e.withModifiers(o.onInputFocus,["stop"])],onOpened:o.updateInput},{anchor:e.withCtx(()=>[(e.openBlock(),e.createBlock(d,{key:o.linkButton.key,message:o.linkButton.tooltipMessage,placement:"top"},{anchor:e.withCtx(()=>{var u,a;return[e.createVNode(c,{ref:o.getButtonRef("custom","link"),active:(a=(u=t.$refs.richTextEditor)==null?void 0:u.editor)==null?void 0:a.isActive(o.linkButton.selector),"aria-label":o.linkButton.tooltipMessage,"data-qa":o.linkButton.dataQA,tabindex:o.canFocus(o.getButtonRef("custom","link"))?0:-1,importance:"clear",kind:"muted",size:"xs",onClick:i[0]||(i[0]=p=>o.linkButton.onClick()),onKeydown:[e.withKeys(e.withModifiers(o.shiftActionBarFocusRight,["stop"]),["right"]),e.withKeys(e.withModifiers(o.shiftActionBarFocusLeft,["stop"]),["left"])]},{icon:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.linkButton.icon),{size:"200"}))]),_:1},8,["active","aria-label","data-qa","tabindex","onKeydown"])]}),_:1},8,["message"]))]),content:e.withCtx(()=>[e.createElementVNode("div",R,[n.showAddLink.setLinkTitle.length>0?(e.openBlock(),e.createElementBlock("span",v,e.toDisplayString(n.showAddLink.setLinkTitle),1)):e.createCommentVNode("",!0),e.createVNode(m,{modelValue:s.linkInput,"onUpdate:modelValue":i[1]||(i[1]=u=>s.linkInput=u),"input-aria-label":n.showAddLink.setLinkInputAriaLabel,placeholder:n.setLinkPlaceholder,"data-qa":"dt-recipe-editor-link-input","input-wrapper-class":"d-recipe-editor-link__input-wrapper",onClick:[o.onInputFocus,e.withModifiers(o.onInputFocus,["stop"])],onFocus:o.onInputFocus,onKeydown:e.withKeys(o.setLink,["enter"])},null,8,["modelValue","input-aria-label","placeholder","onClick","onFocus","onKeydown"])])]),footerContent:e.withCtx(()=>[e.createVNode(h,{direction:"row",gap:"300",class:"d-recipe-editor__popover-footer"},{default:e.withCtx(()=>[e.createVNode(c,{"aria-label":n.removeLinkButton.ariaLabel,"data-qa":"dt-recipe-editor-remove-link-btn",importance:"clear",kind:"muted",size:"sm",onClick:o.removeLink},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(n.removeLinkButton.label),1)]),_:1},8,["aria-label","onClick"]),e.createVNode(c,{"aria-label":n.cancelSetLinkButton.ariaLabel,"data-qa":"dt-recipe-editor-set-link-cancel-btn",importance:"clear",kind:"muted",size:"sm",onClick:o.closeLinkInput},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(n.cancelSetLinkButton.label),1)]),_:1},8,["aria-label","onClick"]),e.createVNode(c,{"aria-label":n.confirmSetLinkButton.ariaLabel,"data-qa":"dt-recipe-editor-set-link-confirm-btn",size:"sm",onClick:o.setLink},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(n.confirmSetLinkButton.label),1)]),_:1},8,["aria-label","onClick"])]),_:1})]),_:1},8,["open","onClick","onOpened"])]),_:1})):e.createCommentVNode("",!0)]),_:1}),e.createElementVNode("div",{style:e.normalizeStyle({"max-height":n.maxHeight}),class:"d-recipe-editor__content"},[e.createVNode(w,e.mergeProps({ref:"richTextEditor",modelValue:s.internalInputValue,"onUpdate:modelValue":i[2]||(i[2]=u=>s.internalInputValue=u),"allow-font-color":!0,"allow-font-family":!0,"allow-inline-images":!0,"allow-line-breaks":!0,"hide-link-bubble-menu":!0,"auto-focus":n.autoFocus,editable:n.editable,"input-aria-label":n.inputAriaLabel,"input-class":`d-recipe-editor__content-input ${n.inputClass}`,link:!0,"output-format":o.htmlOutputFormat,placeholder:n.placeholder,"use-div-tags":n.useDivTags,"data-qa":"dt-rich-text-editor"},o.removeClassStyleAttrs(t.$attrs),{onTextInput:o.onTextInput,onBlur:o.onBlur,onFocus:o.onFocus,onInput:i[3]||(i[3]=u=>o.onInput(u))}),null,16,["modelValue","auto-focus","editable","input-aria-label","input-class","output-format","placeholder","use-div-tags","onTextInput","onBlur","onFocus"])],4)],16)}const S=C._(_,[["render",E]]);exports.default=S;
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("./editor-constants.cjs"),f=require("../../common/utils/index.cjs"),n=require("@dialpad/dialtone-icons/vue3"),L=require("../../localization/index.cjs"),e=require("vue"),m=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),A=require("../rich-text-editor/rich-text-editor.cjs"),E=require("../button/button.cjs"),w=require("../popover/popover.cjs"),D=require("../stack/stack.cjs"),x=require("../input/input.cjs"),C=require("../tooltip/tooltip.cjs"),k=require("../rich-text-editor/rich-text-editor-constants.cjs"),O={compatConfig:{MODE:3},name:"DtRecipeEditor",components:{DtRichTextEditor:A.default,DtButton:E.default,DtPopover:w.default,DtStack:D.default,DtInput:x.default,DtTooltip:C.default,DtIconQuickReply:n.DtIconQuickReply,DtIconBold:n.DtIconBold,DtIconItalic:n.DtIconItalic,DtIconUnderline:n.DtIconUnderline,DtIconStrikethrough:n.DtIconStrikethrough,DtIconListBullet:n.DtIconListBullet,DtIconListOrdered:n.DtIconListOrdered,DtIconAlignLeft:n.DtIconAlignLeft,DtIconAlignCenter:n.DtIconAlignCenter,DtIconAlignRight:n.DtIconAlignRight,DtIconAlignJustify:n.DtIconAlignJustify,DtIconQuote:n.DtIconQuote,DtIconCodeBlock:n.DtIconCodeBlock,DtIconLink2:n.DtIconLink2,DtIconImage:n.DtIconImage},mixins:[],inheritAttrs:!1,props:{modelValue:{type:[Object,String],default:""},editable:{type:Boolean,default:!0},inputAriaLabel:{type:String,required:!0,default:""},inputClass:{type:String,default:""},autoFocus:{type:[Boolean,String,Number],default:!1,validator(t){return typeof t=="string"?k.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(t):!0}},placeholder:{type:String,default:""},maxHeight:{type:String,default:"unset"},setLinkPlaceholder:{type:String,default:""},showBoldButton:{type:Boolean,default:!0},showItalicsButton:{type:Boolean,default:!0},showUnderlineButton:{type:Boolean,default:!0},showStrikeButton:{type:Boolean,default:!0},showListItemsButton:{type:Boolean,default:!0},showOrderedListButton:{type:Boolean,default:!0},showAlignLeftButton:{type:Boolean,default:!0},showAlignCenterButton:{type:Boolean,default:!0},showAlignRightButton:{type:Boolean,default:!0},showAlignJustifyButton:{type:Boolean,default:!0},showQuoteButton:{type:Boolean,default:!0},showCodeBlockButton:{type:Boolean,default:!0},showQuickRepliesButton:{type:Boolean,default:!0},showInlineImageButton:{type:Boolean,default:!1},showAddLink:{type:Object,default:()=>({showAddLinkButton:!0})},useDivTags:{type:Boolean,default:!1}},emits:["focus","blur","input","update:modelValue","quick-replies-click","inline-image-click","text-input"],data(){return{internalInputValue:this.modelValue,hasFocus:!1,linkOptions:{class:"d-recipe-editor__link"},showLinkInput:!1,linkInput:"",currentButtonRefIndex:0,i18n:new L.DialtoneLocalization}},computed:{inputLength(){return this.internalInputValue.length},htmlOutputFormat(){return k.RICH_TEXT_EDITOR_OUTPUT_FORMATS[2]},showingTextFormatButtons(){return this.showBoldButton||this.showItalicsButton||this.showStrikeButton||this.showUnderlineButton},showingAlignmentButtons(){return this.showAlignLeftButton||this.showAlignCenterButton||this.showAlignRightButton||this.showAlignJustifyButton},showingListButtons(){return this.showListItemsButton||this.showOrderedListButton},orderedRefs(){const t=this.buttonGroups.reduce((function(i,r){return r.buttonGroup.forEach(s=>{i.push(this.getButtonRef(r.key,s.selector))},this),i}).bind(this),[]);return t.push(this.getButtonRef("custom","link")),t},buttonGroups(){const t=this.individualButtons.map(i=>({key:i.selector,buttonGroup:[i]}));return[{key:"new",buttonGroup:this.newButtons},{key:"format",buttonGroup:this.textFormatButtons},{key:"alignment",buttonGroup:this.alignmentButtons},{key:"list",buttonGroup:this.listButtons},...t].filter(i=>i.buttonGroup.length>0)},newButtons(){return[{showBtn:this.showQuickRepliesButton,label:this.i18n.$t("DIALTONE_EDITOR_QUICK_REPLY_BUTTON_LABEL"),selector:"quickReplies",icon:n.DtIconQuickReply,dataQA:"dt-recipe-editor-quick-replies-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_QUICK_REPLY_BUTTON_LABEL"),onClick:this.onQuickRepliesClick}].filter(t=>t.showBtn)},textFormatButtons(){return[{showBtn:this.showBoldButton,selector:"bold",icon:n.DtIconBold,dataQA:"dt-recipe-editor-bold-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_BOLD_BUTTON_LABEL"),onClick:this.onBoldTextToggle},{showBtn:this.showItalicsButton,selector:"italic",icon:n.DtIconItalic,dataQA:"dt-recipe-editor-italics-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_ITALICS_BUTTON_LABEL"),onClick:this.onItalicTextToggle},{showBtn:this.showUnderlineButton,selector:"underline",icon:n.DtIconUnderline,dataQA:"dt-recipe-editor-underline-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_UNDERLINE_BUTTON_LABEL"),onClick:this.onUnderlineTextToggle},{showBtn:this.showStrikeButton,selector:"strike",icon:n.DtIconStrikethrough,dataQA:"dt-recipe-editor-strike-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_STRIKE_BUTTON_LABEL"),onClick:this.onStrikethroughTextToggle}].filter(t=>t.showBtn)},alignmentButtons(){return[{showBtn:this.showAlignLeftButton,selector:{textAlign:"left"},icon:n.DtIconAlignLeft,dataQA:"dt-recipe-editor-align-left-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_ALIGN_LEFT_BUTTON_LABEL"),onClick:()=>this.onTextAlign("left")},{showBtn:this.showAlignCenterButton,selector:{textAlign:"center"},icon:n.DtIconAlignCenter,dataQA:"dt-recipe-editor-align-center-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_ALIGN_CENTER_BUTTON_LABEL"),onClick:()=>this.onTextAlign("center")},{showBtn:this.showAlignRightButton,selector:{textAlign:"right"},icon:n.DtIconAlignRight,dataQA:"dt-recipe-editor-align-right-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_ALIGN_RIGHT_BUTTON_LABEL"),onClick:()=>this.onTextAlign("right")},{showBtn:this.showAlignJustifyButton,selector:{textAlign:"justify"},icon:n.DtIconAlignJustify,dataQA:"dt-recipe-editor-align-justify-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_ALIGN_JUSTIFY_BUTTON_LABEL"),onClick:()=>this.onTextAlign("justify")}].filter(t=>t.showBtn)},listButtons(){return[{showBtn:this.showListItemsButton,selector:"bulletList",icon:n.DtIconListBullet,dataQA:"dt-recipe-editor-list-items-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_BULLET_LIST_BUTTON_LABEL"),onClick:this.onBulletListToggle},{showBtn:this.showOrderedListButton,selector:"orderedList",icon:n.DtIconListOrdered,dataQA:"dt-recipe-editor-ordered-list-items-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_ORDERED_LIST_BUTTON_LABEL"),onClick:this.onOrderedListToggle}].filter(t=>t.showBtn)},individualButtons(){return[{showBtn:this.showQuoteButton,selector:"blockquote",icon:n.DtIconQuote,dataQA:"dt-recipe-editor-blockquote-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_QUOTE_BUTTON_LABEL"),onClick:this.onBlockquoteToggle},{showBtn:this.showCodeBlockButton,selector:"codeBlock",icon:n.DtIconCodeBlock,dataQA:"dt-recipe-editor-code-block-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_CODE_BUTTON_LABEL"),onClick:this.onCodeBlockToggle},{showBtn:this.showInlineImageButton,selector:"image",icon:n.DtIconImage,dataQA:"dt-recipe-editor-inline-image-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_IMAGE_BUTTON_LABEL"),onClick:this.onInsertInlineImageClick}].filter(t=>t.showBtn)},linkButton(){return{showBtn:this.showAddLink.showAddLinkButton,selector:"link",icon:n.DtIconLink2,dataQA:"dt-recipe-editor-add-link-btn",tooltipMessage:this.i18n.$t("DIALTONE_EDITOR_LINK_BUTTON_LABEL"),onClick:this.openLinkInput}},confirmSetLinkButtonLabels(){return this.i18n.$ta("DIALTONE_EDITOR_CONFIRM_SET_LINK_BUTTON")},cancelSetLinkButtonLabels(){return this.i18n.$ta("DIALTONE_EDITOR_CANCEL_SET_LINK_BUTTON")},removeLinkButtonLabels(){return this.i18n.$ta("DIALTONE_EDITOR_REMOVE_LINK_BUTTON")},showAddLinkButtonLabels(){return this.i18n.$ta("DIALTONE_EDITOR_ADD_LINK_BUTTON")}},watch:{modelValue(t){this.internalInputValue=t}},methods:{removeClassStyleAttrs:f.removeClassStyleAttrs,addClassStyleAttrs:f.addClassStyleAttrs,onInputFocus(t){t==null||t.stopPropagation()},removeLink(){var t,i,r,s,l;(l=(s=(r=(i=(t=this.$refs.richTextEditor)==null?void 0:t.editor)==null?void 0:i.chain())==null?void 0:r.focus())==null?void 0:s.unsetLink())==null||l.run(),this.closeLinkInput()},setLink(t){var l,o,a;const i=(l=this.$refs.richTextEditor)==null?void 0:l.editor;if(t==null||t.preventDefault(),t==null||t.stopPropagation(),!this.linkInput){this.removeLink();return}g.EDITOR_SUPPORTED_LINK_PROTOCOLS.find(d=>d.test(this.linkInput))||(this.linkInput=`${g.EDITOR_DEFAULT_LINK_PREFIX}${this.linkInput}`);const s=(a=(o=i==null?void 0:i.view)==null?void 0:o.state)==null?void 0:a.selection;s.anchor===s.head?i.chain().focus().insertContentAt(s.anchor,`<a class="${this.linkOptions.class}" href=${this.linkInput}>${this.linkInput}</a>`).run():i.chain().focus().extendMarkRange("link").setLink({href:this.linkInput,class:this.linkOptions.class}).run(),this.closeLinkInput()},openLinkInput(){this.showLinkInput=!0},updateInput(t){var i,r,s;if(!t)return this.closeLinkInput();this.linkInput=(s=(r=(i=this.$refs.richTextEditor)==null?void 0:i.editor)==null?void 0:r.getAttributes("link"))==null?void 0:s.href},closeLinkInput(){var t;this.showLinkInput=!1,this.linkInput="",(t=this.$refs.richTextEditor.editor)==null||t.chain().focus()},onBoldTextToggle(){var t,i;(i=(t=this.$refs.richTextEditor)==null?void 0:t.editor)==null||i.chain().focus().toggleBold().run()},onItalicTextToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleItalic().run()},onUnderlineTextToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleUnderline().run()},onStrikethroughTextToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleStrike().run()},onTextAlign(t){var i,r,s,l;if((r=(i=this.$refs.richTextEditor)==null?void 0:i.editor)!=null&&r.isActive({textAlign:t}))return(s=this.$refs.richTextEditor)==null?void 0:s.editor.chain().focus().unsetTextAlign().run();(l=this.$refs.richTextEditor)==null||l.editor.chain().focus().setTextAlign(t).run()},onBulletListToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleBulletList().run()},onOrderedListToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleOrderedList().run()},onCodeBlockToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleCodeBlock().run()},onQuickRepliesClick(){this.$emit("quick-replies-click")},onInsertInlineImageClick(){this.$emit("inline-image-click")},insertInlineImage(t){var i;(i=this.$refs.richTextEditor)==null||i.editor.chain().focus().setImage({src:t}).run()},insertInMessageBody(t){var i;(i=this.$refs.richTextEditor)==null||i.editor.chain().focus().insertContent(t).run()},setCursorPosition(t=null){var i;(i=this.$refs.richTextEditor)==null||i.editor.chain().focus(t).run()},onBlockquoteToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleBlockquote().run()},onTextInput(t){this.$emit("text-input",t)},onFocus(t){this.hasFocus=!0,this.$emit("focus",t)},onBlur(t){this.hasFocus=!1,this.$emit("blur",t)},onInput(t){this.$emit("input",t),this.$emit("update:modelValue",t)},getButtonKey(t,i){return`${t}-${JSON.stringify(i)}`},getButtonRef(t,i){return`${this.getButtonKey(t,i)}-ref`},canFocus(t){return t===this.orderedRefs[this.currentButtonRefIndex]},shiftActionBarFocusRight(){this.shiftButtonRefIndex(1)},shiftActionBarFocusLeft(){this.shiftButtonRefIndex(-1)},shiftButtonRefIndex(t){const i=this.$refs[this.orderedRefs[this.currentButtonRefIndex]],r=Array.isArray(i)?i[0]:i,s=(this.currentButtonRefIndex+t)%this.orderedRefs.length;this.currentButtonRefIndex=s>=0?s:this.orderedRefs.length+s;const l=this.$refs[this.orderedRefs[this.currentButtonRefIndex]],o=Array.isArray(l)?l[0]:l;r.$el.blur(),o.$el.focus()}}},y=e.createElementVNode("div",{class:"d-recipe-editor__button-group-divider"},null,-1),R={class:"d-recipe-editor__popover-content"};function b(t,i,r,s,l,o){const a=e.resolveComponent("dt-button"),d=e.resolveComponent("dt-tooltip"),h=e.resolveComponent("dt-stack"),I=e.resolveComponent("dt-input"),T=e.resolveComponent("dt-popover"),_=e.resolveComponent("dt-rich-text-editor");return e.openBlock(),e.createElementBlock("div",e.mergeProps({class:"d-recipe-editor"},o.addClassStyleAttrs(t.$attrs),{"data-qa":"dt-recipe-editor",role:"presentation",onClick:i[4]||(i[4]=u=>t.$refs.richTextEditor.focusEditor())}),[e.createVNode(h,{class:"d-recipe-editor__top-bar",direction:"row",gap:"450"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.buttonGroups,u=>(e.openBlock(),e.createBlock(h,{key:u.key,direction:"row",gap:"300"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.buttonGroup,c=>(e.openBlock(),e.createBlock(d,{key:o.getButtonKey(u.key,c.selector),message:c.tooltipMessage,placement:"top"},{anchor:e.withCtx(()=>{var p,B;return[e.createVNode(a,{ref_for:!0,ref:o.getButtonRef(u.key,c.selector),active:(B=(p=t.$refs.richTextEditor)==null?void 0:p.editor)==null?void 0:B.isActive(c.selector),"aria-label":c.tooltipMessage,"data-qa":c.dataQA,tabindex:o.canFocus(o.getButtonRef(u.key,c.selector))?0:-1,importance:"clear",kind:"muted",size:"xs",onClick:S=>c.onClick(),onKeydown:[e.withKeys(e.withModifiers(o.shiftActionBarFocusRight,["stop"]),["right"]),e.withKeys(e.withModifiers(o.shiftActionBarFocusLeft,["stop"]),["left"])]},{icon:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(c.icon),{size:"200"}))]),default:e.withCtx(()=>[e.createTextVNode(" "+e.toDisplayString(c==null?void 0:c.label),1)]),_:2},1032,["active","aria-label","data-qa","tabindex","onClick","onKeydown"])]}),_:2},1032,["message"]))),128)),y]),_:2},1024))),128)),o.linkButton.showBtn?(e.openBlock(),e.createBlock(h,{key:0,direction:"row",gap:"300"},{default:e.withCtx(()=>[e.createVNode(T,{open:l.showLinkInput,"show-close-button":!1,"data-qa":"dt-recipe-editor-link-input-popover",padding:"none",placement:"bottom-start",onClick:[o.onInputFocus,e.withModifiers(o.onInputFocus,["stop"])],onOpened:o.updateInput},{anchor:e.withCtx(()=>[(e.openBlock(),e.createBlock(d,{key:o.linkButton.key,message:o.linkButton.tooltipMessage,placement:"top"},{anchor:e.withCtx(()=>{var u,c;return[e.createVNode(a,{ref:o.getButtonRef("custom","link"),active:(c=(u=t.$refs.richTextEditor)==null?void 0:u.editor)==null?void 0:c.isActive(o.linkButton.selector),"aria-label":o.linkButton.tooltipMessage,"data-qa":o.linkButton.dataQA,tabindex:o.canFocus(o.getButtonRef("custom","link"))?0:-1,importance:"clear",kind:"muted",size:"xs",onClick:i[0]||(i[0]=p=>o.linkButton.onClick()),onKeydown:[e.withKeys(e.withModifiers(o.shiftActionBarFocusRight,["stop"]),["right"]),e.withKeys(e.withModifiers(o.shiftActionBarFocusLeft,["stop"]),["left"])]},{icon:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.linkButton.icon),{size:"200"}))]),_:1},8,["active","aria-label","data-qa","tabindex","onKeydown"])]}),_:1},8,["message"]))]),content:e.withCtx(()=>[e.createElementVNode("div",R,[e.createElementVNode("span",null,e.toDisplayString(o.showAddLinkButtonLabels.title),1),e.createVNode(I,{modelValue:l.linkInput,"onUpdate:modelValue":i[1]||(i[1]=u=>l.linkInput=u),"input-aria-label":o.showAddLinkButtonLabels["aria-label"],placeholder:r.setLinkPlaceholder,"data-qa":"dt-recipe-editor-link-input","input-wrapper-class":"d-recipe-editor-link__input-wrapper",onClick:[o.onInputFocus,e.withModifiers(o.onInputFocus,["stop"])],onFocus:o.onInputFocus,onKeydown:e.withKeys(o.setLink,["enter"])},null,8,["modelValue","input-aria-label","placeholder","onClick","onFocus","onKeydown"])])]),footerContent:e.withCtx(()=>[e.createVNode(h,{direction:"row",gap:"300",class:"d-recipe-editor__popover-footer"},{default:e.withCtx(()=>[e.createVNode(a,e.mergeProps({"data-qa":"dt-recipe-editor-remove-link-btn",importance:"clear",kind:"muted",size:"sm"},o.removeLinkButtonLabels,{onClick:o.removeLink}),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.removeLinkButtonLabels.title),1)]),_:1},16,["onClick"]),e.createVNode(a,e.mergeProps({"data-qa":"dt-recipe-editor-set-link-cancel-btn",importance:"clear",kind:"muted",size:"sm"},o.cancelSetLinkButtonLabels,{onClick:o.closeLinkInput}),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.cancelSetLinkButtonLabels.title),1)]),_:1},16,["onClick"]),e.createVNode(a,e.mergeProps({"data-qa":"dt-recipe-editor-set-link-confirm-btn",size:"sm"},o.confirmSetLinkButtonLabels,{onClick:o.setLink}),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.confirmSetLinkButtonLabels.title),1)]),_:1},16,["onClick"])]),_:1})]),_:1},8,["open","onClick","onOpened"])]),_:1})):e.createCommentVNode("",!0)]),_:1}),e.createElementVNode("div",{style:e.normalizeStyle({"max-height":r.maxHeight}),class:"d-recipe-editor__content"},[e.createVNode(_,e.mergeProps({ref:"richTextEditor",modelValue:l.internalInputValue,"onUpdate:modelValue":i[2]||(i[2]=u=>l.internalInputValue=u),"allow-font-color":!0,"allow-font-family":!0,"allow-inline-images":!0,"allow-line-breaks":!0,"hide-link-bubble-menu":!0,"auto-focus":r.autoFocus,editable:r.editable,"input-aria-label":r.inputAriaLabel,"input-class":`d-recipe-editor__content-input ${r.inputClass}`,link:!0,"output-format":o.htmlOutputFormat,placeholder:r.placeholder,"use-div-tags":r.useDivTags,"data-qa":"dt-rich-text-editor"},o.removeClassStyleAttrs(t.$attrs),{onTextInput:o.onTextInput,onBlur:o.onBlur,onFocus:o.onFocus,onInput:i[3]||(i[3]=u=>o.onInput(u))}),null,16,["modelValue","auto-focus","editable","input-aria-label","input-class","output-format","placeholder","use-div-tags","onTextInput","onBlur","onFocus"])],4)],16)}const N=m._(O,[["render",b]]);exports.default=N;
|
|
2
2
|
//# sourceMappingURL=editor.cjs.map
|