@dialpad/dialtone-vue 2.127.0 → 2.127.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunks/_plugin-vue2_normalizer-1aBeR4AK.js +59 -0
- package/dist/chunks/_plugin-vue2_normalizer-1aBeR4AK.js.map +1 -0
- package/dist/chunks/_plugin-vue2_normalizer-sOSkiPF3.js +60 -0
- package/dist/chunks/_plugin-vue2_normalizer-sOSkiPF3.js.map +1 -0
- package/dist/chunks/{dropdown-SMWaTWyF.js → dropdown-DTtcQEFC.js} +131 -84
- package/dist/chunks/{dropdown-SMWaTWyF.js.map → dropdown-DTtcQEFC.js.map} +1 -1
- package/dist/chunks/dropdown-IaLNHmVd.js +403 -0
- package/dist/chunks/{dropdown-zhMEz3bn.js.map → dropdown-IaLNHmVd.js.map} +1 -1
- package/dist/chunks/dropdown_constants-2pGCXy7m.js +8 -0
- package/dist/chunks/dropdown_constants-2pGCXy7m.js.map +1 -0
- package/dist/chunks/dropdown_constants-w1MXGC3Z.js +9 -0
- package/dist/chunks/dropdown_constants-w1MXGC3Z.js.map +1 -0
- package/dist/chunks/{icon_constants-OpYAAKwF.js → icon_constants-Dy4MEUJL.js} +7 -6
- package/dist/chunks/{icon_constants-2S_OSQ1t.js.map → icon_constants-Dy4MEUJL.js.map} +1 -1
- package/dist/chunks/icon_constants-QYpmdE0R.js +16 -0
- package/dist/chunks/{icon_constants-OpYAAKwF.js.map → icon_constants-QYpmdE0R.js.map} +1 -1
- package/dist/chunks/index-eJ-WWRdf.js +442 -0
- package/dist/chunks/{index-2jPosQBn.js.map → index-eJ-WWRdf.js.map} +1 -1
- package/dist/chunks/index-gj1jEXP4.js +441 -0
- package/dist/chunks/{index-nIyl_PL6.js.map → index-gj1jEXP4.js.map} +1 -1
- package/dist/chunks/{input-1tm09l_-.js → input-6kbd8Pju.js} +83 -60
- package/dist/chunks/{input-o-fc1X4b.js.map → input-6kbd8Pju.js.map} +1 -1
- package/dist/chunks/input-Axw-wFj2.js +295 -0
- package/dist/chunks/{input-1tm09l_-.js.map → input-Axw-wFj2.js.map} +1 -1
- package/dist/chunks/input_group-m3cWYUfI.js +143 -0
- package/dist/chunks/{input_group-zcAq3DQl.js.map → input_group-m3cWYUfI.js.map} +1 -1
- package/dist/chunks/{input_group-zcAq3DQl.js → input_group-qVZaS5Bb.js} +27 -24
- package/dist/chunks/{input_group-j2gTtc1C.js.map → input_group-qVZaS5Bb.js.map} +1 -1
- package/dist/chunks/keyboard_list_navigation-ScXhrxya.js +284 -0
- package/dist/chunks/{keyboard_list_navigation-N74Bpdq7.js.map → keyboard_list_navigation-ScXhrxya.js.map} +1 -1
- package/dist/chunks/keyboard_list_navigation-fJnl_Iox.js +283 -0
- package/dist/chunks/{keyboard_list_navigation-F0O8nht0.js.map → keyboard_list_navigation-fJnl_Iox.js.map} +1 -1
- package/dist/chunks/link_constants-Huj7D_hm.js +22 -0
- package/dist/chunks/{link_constants-Kn6kP4i1.js.map → link_constants-Huj7D_hm.js.map} +1 -1
- package/dist/chunks/link_constants-nWVlXQBs.js +23 -0
- package/dist/chunks/{link_constants-vIUB92L4.js.map → link_constants-nWVlXQBs.js.map} +1 -1
- package/dist/chunks/list_item_constants-EiqkqZvP.js +13 -0
- package/dist/chunks/{list_item_constants-Tsz5CO1m.js.map → list_item_constants-EiqkqZvP.js.map} +1 -1
- package/dist/chunks/list_item_constants-u1xcN9Dd.js +14 -0
- package/dist/chunks/{list_item_constants-LTUc74pD.js.map → list_item_constants-u1xcN9Dd.js.map} +1 -1
- package/dist/chunks/modal-VgxXAQFP.js +105 -0
- package/dist/chunks/{modal-qEzlo0Sj.js.map → modal-VgxXAQFP.js.map} +1 -1
- package/dist/chunks/modal-XOr4kiNZ.js +106 -0
- package/dist/chunks/{modal-VuMFkZFH.js.map → modal-XOr4kiNZ.js.map} +1 -1
- package/dist/chunks/notice_action-IRUoLX2d.js +196 -0
- package/dist/chunks/{notice_action-u3ZKIhit.js.map → notice_action-IRUoLX2d.js.map} +1 -1
- package/dist/chunks/notice_action-P6uDyE9x.js +195 -0
- package/dist/chunks/{notice_action-9NmtQRai.js.map → notice_action-P6uDyE9x.js.map} +1 -1
- package/dist/chunks/notice_constants-7Qt2CQEY.js +7 -0
- package/dist/chunks/{notice_constants-mC6al2Dm.js.map → notice_constants-7Qt2CQEY.js.map} +1 -1
- package/dist/chunks/notice_constants-UXo9e3bS.js +6 -0
- package/dist/chunks/{notice_constants-c--hBFQw.js.map → notice_constants-UXo9e3bS.js.map} +1 -1
- package/dist/chunks/popover_constants-JwBF9h1Z.js +143 -0
- package/dist/chunks/{popover_constants-hOEhklvr.js.map → popover_constants-JwBF9h1Z.js.map} +1 -1
- package/dist/chunks/popover_constants-Qkpb0yh2.js +144 -0
- package/dist/chunks/{popover_constants-qjlEkroB.js.map → popover_constants-Qkpb0yh2.js.map} +1 -1
- package/dist/chunks/sr_only_close_button-81bHIpPu.js +95 -0
- package/dist/chunks/{sr_only_close_button-ErijKGYR.js.map → sr_only_close_button-81bHIpPu.js.map} +1 -1
- package/dist/chunks/sr_only_close_button-ZaGdAHz7.js +94 -0
- package/dist/chunks/{sr_only_close_button-JGole5Xi.js.map → sr_only_close_button-ZaGdAHz7.js.map} +1 -1
- package/dist/chunks/stack_constants-HraCekPm.js +15 -0
- package/dist/chunks/{stack_constants-m9Ickqw0.js.map → stack_constants-HraCekPm.js.map} +1 -1
- package/dist/chunks/stack_constants-SMzMWnAQ.js +14 -0
- package/dist/chunks/{stack_constants-u7tNqGtc.js.map → stack_constants-SMzMWnAQ.js.map} +1 -1
- package/dist/chunks/tab-FcsV5VmK.js +386 -0
- package/dist/chunks/{tab-7hJQSLFx.js.map → tab-FcsV5VmK.js.map} +1 -1
- package/dist/chunks/tab-V4cb44Ry.js +387 -0
- package/dist/chunks/{tab-Qm9LVkYj.js.map → tab-V4cb44Ry.js.map} +1 -1
- package/dist/common/constants.cjs +60 -0
- package/dist/{lib → common}/constants.cjs.map +1 -1
- package/dist/{lib → common}/constants.js +25 -18
- package/dist/{lib → common}/constants.js.map +1 -1
- package/dist/common/dates.cjs +72 -0
- package/dist/{lib → common}/dates.cjs.map +1 -1
- package/dist/common/dates.js +72 -0
- package/dist/{lib → common}/dates.js.map +1 -1
- package/dist/common/emoji.cjs +163 -0
- package/dist/common/emoji.cjs.map +1 -0
- package/dist/common/emoji.js +168 -0
- package/dist/common/emoji.js.map +1 -0
- package/dist/common/mixins.cjs +17 -0
- package/dist/{lib → common}/mixins.cjs.map +1 -1
- package/dist/common/mixins.js +17 -0
- package/dist/common/utils.cjs +237 -0
- package/dist/{lib → common}/utils.cjs.map +1 -1
- package/dist/common/utils.js +237 -0
- package/dist/{lib → common}/utils.js.map +1 -1
- package/dist/common/validators.cjs +23 -0
- package/dist/{lib → common}/validators.cjs.map +1 -1
- package/dist/common/validators.js +23 -0
- package/dist/{lib → common}/validators.js.map +1 -1
- package/dist/dialtone-vue.cjs +372 -1
- package/dist/dialtone-vue.cjs.map +1 -1
- package/dist/dialtone-vue.js +325 -324
- package/dist/dialtone-vue.js.map +1 -1
- package/dist/lib/attachment-carousel.cjs +260 -1
- package/dist/lib/attachment-carousel.cjs.map +1 -1
- package/dist/lib/attachment-carousel.js +96 -84
- package/dist/lib/attachment-carousel.js.map +1 -1
- package/dist/lib/avatar.cjs +399 -1
- package/dist/lib/avatar.cjs.map +1 -1
- package/dist/lib/avatar.js +111 -79
- package/dist/lib/avatar.js.map +1 -1
- package/dist/lib/badge.cjs +182 -1
- package/dist/lib/badge.cjs.map +1 -1
- package/dist/lib/badge.js +53 -38
- package/dist/lib/badge.js.map +1 -1
- package/dist/lib/banner.cjs +209 -2
- package/dist/lib/banner.cjs.map +1 -1
- package/dist/lib/banner.js +58 -47
- package/dist/lib/banner.js.map +1 -1
- package/dist/lib/breadcrumbs.cjs +146 -1
- package/dist/lib/breadcrumbs.cjs.map +1 -1
- package/dist/lib/breadcrumbs.js +57 -48
- package/dist/lib/breadcrumbs.js.map +1 -1
- package/dist/lib/button-group.cjs +47 -1
- package/dist/lib/button-group.cjs.map +1 -1
- package/dist/lib/button-group.js +21 -18
- package/dist/lib/button-group.js.map +1 -1
- package/dist/lib/button.cjs +349 -1
- package/dist/lib/button.cjs.map +1 -1
- package/dist/lib/button.js +98 -76
- package/dist/lib/button.js.map +1 -1
- package/dist/lib/callbar-button-with-popover.cjs +249 -1
- package/dist/lib/callbar-button-with-popover.cjs.map +1 -1
- package/dist/lib/callbar-button-with-popover.js +66 -50
- package/dist/lib/callbar-button-with-popover.js.map +1 -1
- package/dist/lib/callbar-button.cjs +182 -1
- package/dist/lib/callbar-button.cjs.map +1 -1
- package/dist/lib/callbar-button.js +42 -34
- package/dist/lib/callbar-button.js.map +1 -1
- package/dist/lib/callbox.cjs +146 -1
- package/dist/lib/callbox.cjs.map +1 -1
- package/dist/lib/callbox.js +38 -32
- package/dist/lib/callbox.js.map +1 -1
- package/dist/lib/card.cjs +73 -1
- package/dist/lib/card.cjs.map +1 -1
- package/dist/lib/card.js +22 -20
- package/dist/lib/card.js.map +1 -1
- package/dist/lib/checkbox-group.cjs +129 -1
- package/dist/lib/checkbox-group.cjs.map +1 -1
- package/dist/lib/checkbox-group.js +42 -29
- package/dist/lib/checkbox-group.js.map +1 -1
- package/dist/lib/checkbox.cjs +127 -1
- package/dist/lib/checkbox.cjs.map +1 -1
- package/dist/lib/checkbox.js +46 -35
- package/dist/lib/checkbox.js.map +1 -1
- package/dist/lib/chip.cjs +198 -1
- package/dist/lib/chip.cjs.map +1 -1
- package/dist/lib/chip.js +59 -45
- package/dist/lib/chip.js.map +1 -1
- package/dist/lib/codeblock.cjs +29 -2
- package/dist/lib/codeblock.cjs.map +1 -1
- package/dist/lib/codeblock.js +15 -14
- package/dist/lib/codeblock.js.map +1 -1
- package/dist/lib/collapsible.cjs +334 -1
- package/dist/lib/collapsible.cjs.map +1 -1
- package/dist/lib/collapsible.js +91 -68
- package/dist/lib/collapsible.js.map +1 -1
- package/dist/lib/combobox-multi-select.cjs +519 -1
- package/dist/lib/combobox-multi-select.cjs.map +1 -1
- package/dist/lib/combobox-multi-select.js +223 -136
- package/dist/lib/combobox-multi-select.js.map +1 -1
- package/dist/lib/combobox-with-popover.cjs +384 -1
- package/dist/lib/combobox-with-popover.cjs.map +1 -1
- package/dist/lib/combobox-with-popover.js +130 -86
- package/dist/lib/combobox-with-popover.js.map +1 -1
- package/dist/lib/combobox.cjs +18 -1
- package/dist/lib/combobox.cjs.map +1 -1
- package/dist/lib/combobox.js +9 -9
- package/dist/lib/contact-info.cjs +145 -1
- package/dist/lib/contact-info.cjs.map +1 -1
- package/dist/lib/contact-info.js +34 -32
- package/dist/lib/contact-info.js.map +1 -1
- package/dist/lib/contact-row.cjs +205 -1
- package/dist/lib/contact-row.cjs.map +1 -1
- package/dist/lib/contact-row.js +42 -39
- package/dist/lib/contact-row.js.map +1 -1
- package/dist/lib/datepicker.cjs +662 -1
- package/dist/lib/datepicker.cjs.map +1 -1
- package/dist/lib/datepicker.js +330 -218
- package/dist/lib/datepicker.js.map +1 -1
- package/dist/lib/description-list.cjs +114 -1
- package/dist/lib/description-list.cjs.map +1 -1
- package/dist/lib/description-list.js +51 -19
- package/dist/lib/description-list.js.map +1 -1
- package/dist/lib/dropdown.cjs +45 -1
- package/dist/lib/dropdown.cjs.map +1 -1
- package/dist/lib/dropdown.js +27 -25
- package/dist/lib/dropdown.js.map +1 -1
- package/dist/lib/editor.cjs +555 -1
- package/dist/lib/editor.cjs.map +1 -1
- package/dist/lib/editor.js +191 -162
- package/dist/lib/editor.js.map +1 -1
- package/dist/lib/emoji-picker.cjs +1063 -1
- package/dist/lib/emoji-picker.cjs.map +1 -1
- package/dist/lib/emoji-picker.js +638 -374
- package/dist/lib/emoji-picker.js.map +1 -1
- package/dist/lib/emoji-row.cjs +88 -1
- package/dist/lib/emoji-row.cjs.map +1 -1
- package/dist/lib/emoji-row.js +46 -40
- package/dist/lib/emoji-row.js.map +1 -1
- package/dist/lib/emoji-text-wrapper.cjs +109 -1
- package/dist/lib/emoji-text-wrapper.cjs.map +1 -1
- package/dist/lib/emoji-text-wrapper.js +49 -35
- package/dist/lib/emoji-text-wrapper.js.map +1 -1
- package/dist/lib/emoji.cjs +145 -1
- package/dist/lib/emoji.cjs.map +1 -1
- package/dist/lib/emoji.js +140 -5
- package/dist/lib/emoji.js.map +1 -1
- package/dist/lib/feed-item-row.cjs +213 -1
- package/dist/lib/feed-item-row.cjs.map +1 -1
- package/dist/lib/feed-item-row.js +71 -63
- package/dist/lib/feed-item-row.js.map +1 -1
- package/dist/lib/feed-pill.cjs +149 -1
- package/dist/lib/feed-pill.cjs.map +1 -1
- package/dist/lib/feed-pill.js +60 -51
- package/dist/lib/feed-pill.js.map +1 -1
- package/dist/lib/general-row.cjs +405 -1
- package/dist/lib/general-row.cjs.map +1 -1
- package/dist/lib/general-row.js +133 -106
- package/dist/lib/general-row.js.map +1 -1
- package/dist/lib/group-row.cjs +117 -1
- package/dist/lib/group-row.cjs.map +1 -1
- package/dist/lib/group-row.js +33 -30
- package/dist/lib/group-row.js.map +1 -1
- package/dist/lib/grouped-chip.cjs +45 -1
- package/dist/lib/grouped-chip.cjs.map +1 -1
- package/dist/lib/grouped-chip.js +28 -26
- package/dist/lib/grouped-chip.js.map +1 -1
- package/dist/lib/hovercard.cjs +227 -1
- package/dist/lib/hovercard.cjs.map +1 -1
- package/dist/lib/hovercard.js +98 -63
- package/dist/lib/hovercard.js.map +1 -1
- package/dist/lib/icon.cjs +59 -1
- package/dist/lib/icon.cjs.map +1 -1
- package/dist/lib/icon.js +22 -20
- package/dist/lib/icon.js.map +1 -1
- package/dist/lib/image-viewer.cjs +190 -1
- package/dist/lib/image-viewer.cjs.map +1 -1
- package/dist/lib/image-viewer.js +83 -62
- package/dist/lib/image-viewer.js.map +1 -1
- package/dist/lib/input-group.cjs +91 -1
- package/dist/lib/input-group.cjs.map +1 -1
- package/dist/lib/input-group.js +29 -27
- package/dist/lib/input-group.js.map +1 -1
- package/dist/lib/input.cjs +492 -1
- package/dist/lib/input.cjs.map +1 -1
- package/dist/lib/input.js +127 -89
- package/dist/lib/input.js.map +1 -1
- package/dist/lib/item-layout.cjs +40 -1
- package/dist/lib/item-layout.cjs.map +1 -1
- package/dist/lib/item-layout.js +15 -13
- package/dist/lib/item-layout.js.map +1 -1
- package/dist/lib/ivr-node.cjs +209 -1
- package/dist/lib/ivr-node.cjs.map +1 -1
- package/dist/lib/ivr-node.js +115 -99
- package/dist/lib/ivr-node.js.map +1 -1
- package/dist/lib/keyboard-shortcut.cjs +106 -1
- package/dist/lib/keyboard-shortcut.cjs.map +1 -1
- package/dist/lib/keyboard-shortcut.js +42 -34
- package/dist/lib/keyboard-shortcut.js.map +1 -1
- package/dist/lib/lazy-show.cjs +80 -1
- package/dist/lib/lazy-show.cjs.map +1 -1
- package/dist/lib/lazy-show.js +20 -16
- package/dist/lib/lazy-show.js.map +1 -1
- package/dist/lib/link.cjs +70 -1
- package/dist/lib/link.cjs.map +1 -1
- package/dist/lib/link.js +22 -20
- package/dist/lib/link.js.map +1 -1
- package/dist/lib/list-item-group.cjs +60 -1
- package/dist/lib/list-item-group.cjs.map +1 -1
- package/dist/lib/list-item-group.js +19 -17
- package/dist/lib/list-item-group.js.map +1 -1
- package/dist/lib/list-item.cjs +204 -1
- package/dist/lib/list-item.cjs.map +1 -1
- package/dist/lib/list-item.js +67 -56
- package/dist/lib/list-item.js.map +1 -1
- package/dist/lib/message-input.cjs +554 -1
- package/dist/lib/message-input.cjs.map +1 -1
- package/dist/lib/message-input.js +174 -152
- package/dist/lib/message-input.js.map +1 -1
- package/dist/lib/modal.cjs +350 -2
- package/dist/lib/modal.cjs.map +1 -1
- package/dist/lib/modal.js +118 -90
- package/dist/lib/modal.js.map +1 -1
- package/dist/lib/notice.cjs +159 -1
- package/dist/lib/notice.cjs.map +1 -1
- package/dist/lib/notice.js +46 -43
- package/dist/lib/notice.js.map +1 -1
- package/dist/lib/pagination.cjs +152 -1
- package/dist/lib/pagination.cjs.map +1 -1
- package/dist/lib/pagination.js +60 -48
- package/dist/lib/pagination.js.map +1 -1
- package/dist/lib/popover.cjs +956 -1
- package/dist/lib/popover.cjs.map +1 -1
- package/dist/lib/popover.js +401 -221
- package/dist/lib/popover.js.map +1 -1
- package/dist/lib/presence.cjs +65 -1
- package/dist/lib/presence.cjs.map +1 -1
- package/dist/lib/presence.js +32 -26
- package/dist/lib/presence.js.map +1 -1
- package/dist/lib/radio-group.cjs +98 -1
- package/dist/lib/radio-group.cjs.map +1 -1
- package/dist/lib/radio-group.js +24 -22
- package/dist/lib/radio-group.js.map +1 -1
- package/dist/lib/radio.cjs +118 -1
- package/dist/lib/radio.cjs.map +1 -1
- package/dist/lib/radio.js +43 -35
- package/dist/lib/radio.js.map +1 -1
- package/dist/lib/rich-text-editor.cjs +1138 -1
- package/dist/lib/rich-text-editor.cjs.map +1 -1
- package/dist/lib/rich-text-editor.js +574 -387
- package/dist/lib/rich-text-editor.js.map +1 -1
- package/dist/lib/root-layout.cjs +130 -1
- package/dist/lib/root-layout.cjs.map +1 -1
- package/dist/lib/root-layout.js +28 -24
- package/dist/lib/root-layout.js.map +1 -1
- package/dist/lib/select-menu.cjs +282 -1
- package/dist/lib/select-menu.cjs.map +1 -1
- package/dist/lib/select-menu.js +101 -61
- package/dist/lib/select-menu.js.map +1 -1
- package/dist/lib/settings-menu-button.cjs +65 -1
- package/dist/lib/settings-menu-button.cjs.map +1 -1
- package/dist/lib/settings-menu-button.js +26 -24
- package/dist/lib/settings-menu-button.js.map +1 -1
- package/dist/lib/skeleton.cjs +612 -1
- package/dist/lib/skeleton.cjs.map +1 -1
- package/dist/lib/skeleton.js +174 -135
- package/dist/lib/skeleton.js.map +1 -1
- package/dist/lib/stack.cjs +127 -1
- package/dist/lib/stack.cjs.map +1 -1
- package/dist/lib/stack.js +66 -56
- package/dist/lib/stack.js.map +1 -1
- package/dist/lib/tabs.cjs +99 -1
- package/dist/lib/tabs.cjs.map +1 -1
- package/dist/lib/tabs.js +42 -35
- package/dist/lib/tabs.js.map +1 -1
- package/dist/lib/time-pill.cjs +47 -1
- package/dist/lib/time-pill.cjs.map +1 -1
- package/dist/lib/time-pill.js +21 -16
- package/dist/lib/time-pill.js.map +1 -1
- package/dist/lib/toast.cjs +247 -1
- package/dist/lib/toast.cjs.map +1 -1
- package/dist/lib/toast.js +78 -55
- package/dist/lib/toast.js.map +1 -1
- package/dist/lib/toggle.cjs +177 -1
- package/dist/lib/toggle.cjs.map +1 -1
- package/dist/lib/toggle.js +46 -37
- package/dist/lib/toggle.js.map +1 -1
- package/dist/lib/tooltip-directive.cjs +87 -1
- package/dist/lib/tooltip-directive.cjs.map +1 -1
- package/dist/lib/tooltip-directive.js +55 -41
- package/dist/lib/tooltip-directive.js.map +1 -1
- package/dist/lib/tooltip.cjs +436 -1
- package/dist/lib/tooltip.cjs.map +1 -1
- package/dist/lib/tooltip.js +152 -90
- package/dist/lib/tooltip.js.map +1 -1
- package/dist/lib/top-banner-info.cjs +63 -1
- package/dist/lib/top-banner-info.cjs.map +1 -1
- package/dist/lib/top-banner-info.js +22 -18
- package/dist/lib/top-banner-info.js.map +1 -1
- package/dist/lib/unread-pill.cjs +63 -1
- package/dist/lib/unread-pill.cjs.map +1 -1
- package/dist/lib/unread-pill.js +25 -21
- package/dist/lib/unread-pill.js.map +1 -1
- package/dist/lib/validation-messages.cjs +85 -1
- package/dist/lib/validation-messages.cjs.map +1 -1
- package/dist/lib/validation-messages.js +32 -29
- package/dist/lib/validation-messages.js.map +1 -1
- package/dist/style.css +1214 -1
- package/dist/types/components/rich_text_editor/extensions/emoji/EmojiComponent.vue.d.ts +2 -2
- package/dist/types/components/rich_text_editor/extensions/mentions/MentionComponent.vue.d.ts +2 -2
- package/package.json +31 -30
- package/dist/chunks/_plugin-vue2_normalizer-ZK80B3OL.js +0 -2
- package/dist/chunks/_plugin-vue2_normalizer-ZK80B3OL.js.map +0 -1
- package/dist/chunks/_plugin-vue2_normalizer-u6G_3nkj.js +0 -33
- package/dist/chunks/_plugin-vue2_normalizer-u6G_3nkj.js.map +0 -1
- package/dist/chunks/dropdown-zhMEz3bn.js +0 -2
- package/dist/chunks/dropdown_constants-EUcDxBrX.js +0 -9
- package/dist/chunks/dropdown_constants-EUcDxBrX.js.map +0 -1
- package/dist/chunks/dropdown_constants-KHFvVI2L.js +0 -2
- package/dist/chunks/dropdown_constants-KHFvVI2L.js.map +0 -1
- package/dist/chunks/icon_constants-2S_OSQ1t.js +0 -2
- package/dist/chunks/index-2jPosQBn.js +0 -3
- package/dist/chunks/index-YkSDT8-g.js +0 -244
- package/dist/chunks/index-YkSDT8-g.js.map +0 -1
- package/dist/chunks/index-nIyl_PL6.js +0 -372
- package/dist/chunks/index-sdfB7Aok.js +0 -2
- package/dist/chunks/index-sdfB7Aok.js.map +0 -1
- package/dist/chunks/input-o-fc1X4b.js +0 -2
- package/dist/chunks/input_group-j2gTtc1C.js +0 -2
- package/dist/chunks/keyboard_list_navigation-F0O8nht0.js +0 -197
- package/dist/chunks/keyboard_list_navigation-N74Bpdq7.js +0 -2
- package/dist/chunks/link_constants-Kn6kP4i1.js +0 -2
- package/dist/chunks/link_constants-vIUB92L4.js +0 -16
- package/dist/chunks/list_item_constants-LTUc74pD.js +0 -13
- package/dist/chunks/list_item_constants-Tsz5CO1m.js +0 -2
- package/dist/chunks/modal-VuMFkZFH.js +0 -82
- package/dist/chunks/modal-qEzlo0Sj.js +0 -2
- package/dist/chunks/notice_action-9NmtQRai.js +0 -182
- package/dist/chunks/notice_action-u3ZKIhit.js +0 -2
- package/dist/chunks/notice_constants-c--hBFQw.js +0 -6
- package/dist/chunks/notice_constants-mC6al2Dm.js +0 -2
- package/dist/chunks/popover_constants-hOEhklvr.js +0 -2
- package/dist/chunks/popover_constants-qjlEkroB.js +0 -114
- package/dist/chunks/sr_only_close_button-ErijKGYR.js +0 -3
- package/dist/chunks/sr_only_close_button-JGole5Xi.js +0 -86
- package/dist/chunks/stack_constants-m9Ickqw0.js +0 -2
- package/dist/chunks/stack_constants-u7tNqGtc.js +0 -13
- package/dist/chunks/tab-7hJQSLFx.js +0 -2
- package/dist/chunks/tab-Qm9LVkYj.js +0 -346
- package/dist/lib/constants.cjs +0 -2
- package/dist/lib/dates.cjs +0 -2
- package/dist/lib/dates.js +0 -57
- package/dist/lib/mixins.cjs +0 -2
- package/dist/lib/mixins.js +0 -17
- package/dist/lib/utils.cjs +0 -2
- package/dist/lib/utils.js +0 -175
- package/dist/lib/validators.cjs +0 -2
- package/dist/lib/validators.js +0 -12
- /package/dist/{lib → common}/mixins.js.map +0 -0
package/dist/lib/banner.js
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import "
|
|
1
|
+
import { Modal } from "../chunks/modal-XOr4kiNZ.js";
|
|
2
|
+
import utils from "../common/utils.js";
|
|
3
|
+
import { SrOnlyCloseButtonMixin } from "../chunks/sr_only_close_button-81bHIpPu.js";
|
|
4
|
+
import { normalizeComponent } from "../chunks/_plugin-vue2_normalizer-sOSkiPF3.js";
|
|
5
|
+
import { DtNoticeIcon, DtNoticeContent, DtNoticeAction } from "../chunks/notice_action-IRUoLX2d.js";
|
|
6
|
+
import { NOTICE_KINDS } from "../chunks/notice_constants-7Qt2CQEY.js";
|
|
7
|
+
import "../common/constants.js";
|
|
8
8
|
import "vue";
|
|
9
9
|
import "./icon.js";
|
|
10
10
|
import "@dialpad/dialtone-icons/vue2";
|
|
11
|
-
import "../chunks/icon_constants-
|
|
11
|
+
import "../chunks/icon_constants-Dy4MEUJL.js";
|
|
12
12
|
import "@dialpad/dialtone-icons/icons.json";
|
|
13
13
|
import "./button.js";
|
|
14
|
-
import "../chunks/link_constants-
|
|
15
|
-
const
|
|
14
|
+
import "../chunks/link_constants-nWVlXQBs.js";
|
|
15
|
+
const _sfc_main = {
|
|
16
16
|
name: "DtBanner",
|
|
17
17
|
components: {
|
|
18
|
-
DtNoticeIcon
|
|
19
|
-
DtNoticeContent
|
|
20
|
-
DtNoticeAction
|
|
18
|
+
DtNoticeIcon,
|
|
19
|
+
DtNoticeContent,
|
|
20
|
+
DtNoticeAction
|
|
21
21
|
},
|
|
22
|
-
mixins: [
|
|
22
|
+
mixins: [Modal, SrOnlyCloseButtonMixin],
|
|
23
23
|
props: {
|
|
24
24
|
/**
|
|
25
25
|
* Sets an ID on the title element of the component. Useful for aria-describedby
|
|
@@ -28,7 +28,7 @@ const p = {
|
|
|
28
28
|
titleId: {
|
|
29
29
|
type: String,
|
|
30
30
|
default() {
|
|
31
|
-
return
|
|
31
|
+
return utils.getUniqueString();
|
|
32
32
|
}
|
|
33
33
|
},
|
|
34
34
|
/**
|
|
@@ -38,7 +38,7 @@ const p = {
|
|
|
38
38
|
contentId: {
|
|
39
39
|
type: String,
|
|
40
40
|
default() {
|
|
41
|
-
return
|
|
41
|
+
return utils.getUniqueString();
|
|
42
42
|
}
|
|
43
43
|
},
|
|
44
44
|
/**
|
|
@@ -56,7 +56,7 @@ const p = {
|
|
|
56
56
|
*/
|
|
57
57
|
important: {
|
|
58
58
|
type: Boolean,
|
|
59
|
-
default:
|
|
59
|
+
default: false
|
|
60
60
|
},
|
|
61
61
|
/**
|
|
62
62
|
* Pins the banner to the top of the window and pushes all app content down.
|
|
@@ -64,7 +64,7 @@ const p = {
|
|
|
64
64
|
*/
|
|
65
65
|
pinned: {
|
|
66
66
|
type: Boolean,
|
|
67
|
-
default:
|
|
67
|
+
default: false
|
|
68
68
|
},
|
|
69
69
|
/**
|
|
70
70
|
* Severity level of the notice, sets the icon and background
|
|
@@ -73,8 +73,8 @@ const p = {
|
|
|
73
73
|
kind: {
|
|
74
74
|
type: String,
|
|
75
75
|
default: "base",
|
|
76
|
-
validate(
|
|
77
|
-
return
|
|
76
|
+
validate(kind) {
|
|
77
|
+
return NOTICE_KINDS.includes(kind);
|
|
78
78
|
}
|
|
79
79
|
},
|
|
80
80
|
/**
|
|
@@ -90,7 +90,7 @@ const p = {
|
|
|
90
90
|
*/
|
|
91
91
|
hideClose: {
|
|
92
92
|
type: Boolean,
|
|
93
|
-
default:
|
|
93
|
+
default: false
|
|
94
94
|
},
|
|
95
95
|
/**
|
|
96
96
|
* Hides the icon from the notice
|
|
@@ -98,7 +98,7 @@ const p = {
|
|
|
98
98
|
*/
|
|
99
99
|
hideIcon: {
|
|
100
100
|
type: Boolean,
|
|
101
|
-
default:
|
|
101
|
+
default: false
|
|
102
102
|
},
|
|
103
103
|
/**
|
|
104
104
|
* Hides the action from the notice
|
|
@@ -106,7 +106,7 @@ const p = {
|
|
|
106
106
|
*/
|
|
107
107
|
hideAction: {
|
|
108
108
|
type: Boolean,
|
|
109
|
-
default:
|
|
109
|
+
default: false
|
|
110
110
|
},
|
|
111
111
|
/**
|
|
112
112
|
* Inner dialog class
|
|
@@ -146,15 +146,16 @@ const p = {
|
|
|
146
146
|
return this.important ? "alertdialog" : "status";
|
|
147
147
|
},
|
|
148
148
|
bannerClass() {
|
|
149
|
+
const kindClasses = {
|
|
150
|
+
error: "d-banner--error",
|
|
151
|
+
info: "d-banner--info",
|
|
152
|
+
success: "d-banner--success",
|
|
153
|
+
warning: "d-banner--warning",
|
|
154
|
+
base: "d-banner--base"
|
|
155
|
+
};
|
|
149
156
|
return [
|
|
150
157
|
"d-banner",
|
|
151
|
-
|
|
152
|
-
error: "d-banner--error",
|
|
153
|
-
info: "d-banner--info",
|
|
154
|
-
success: "d-banner--success",
|
|
155
|
-
warning: "d-banner--warning",
|
|
156
|
-
base: "d-banner--base"
|
|
157
|
-
}[this.kind],
|
|
158
|
+
kindClasses[this.kind],
|
|
158
159
|
{
|
|
159
160
|
"d-banner--important": this.important,
|
|
160
161
|
"d-banner--pinned": this.pinned
|
|
@@ -162,38 +163,48 @@ const p = {
|
|
|
162
163
|
];
|
|
163
164
|
},
|
|
164
165
|
bannerBackgroundImage() {
|
|
165
|
-
|
|
166
|
+
if (this.backgroundImage === "")
|
|
167
|
+
return null;
|
|
168
|
+
return `background-image: url(${this.backgroundImage});
|
|
166
169
|
background-size: ${this.backgroundSize};`;
|
|
167
170
|
}
|
|
168
171
|
},
|
|
169
172
|
mounted() {
|
|
170
|
-
this.important
|
|
173
|
+
if (this.important) {
|
|
174
|
+
this.focusFirstElement();
|
|
175
|
+
}
|
|
171
176
|
},
|
|
172
177
|
methods: {
|
|
173
178
|
trapFocus(e) {
|
|
174
|
-
this.important
|
|
179
|
+
if (this.important) {
|
|
180
|
+
this.focusTrappedTabPress(e);
|
|
181
|
+
}
|
|
175
182
|
}
|
|
176
183
|
}
|
|
177
184
|
};
|
|
178
|
-
var
|
|
179
|
-
var
|
|
180
|
-
return
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
return
|
|
184
|
-
},
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
185
|
+
var _sfc_render = function render() {
|
|
186
|
+
var _vm = this, _c = _vm._self._c;
|
|
187
|
+
return _c("aside", { class: _vm.bannerClass, style: _vm.bannerBackgroundImage, on: { "keydown": function($event) {
|
|
188
|
+
if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "tab", 9, $event.key, "Tab"))
|
|
189
|
+
return null;
|
|
190
|
+
return _vm.trapFocus.apply(null, arguments);
|
|
191
|
+
} } }, [_c("div", { staticClass: "d-banner__dialog", class: _vm.dialogClass, attrs: { "role": _vm.role, "aria-labelledby": _vm.titleId, "aria-describedby": _vm.contentId } }, [!_vm.hideIcon ? _c("dt-notice-icon", _vm._g({ attrs: { "kind": _vm.kind } }, _vm.$listeners), [_vm._t("icon")], 2) : _vm._e(), _c("dt-notice-content", _vm._g({ attrs: { "title-id": _vm.titleId, "content-id": _vm.contentId, "title": _vm.title }, scopedSlots: _vm._u([{ key: "titleOverride", fn: function() {
|
|
192
|
+
return [_vm._t("titleOverride")];
|
|
193
|
+
}, proxy: true }], null, true) }, _vm.$listeners), [_vm._t("default")], 2), _c("dt-notice-action", _vm._g({ attrs: { "hide-action": _vm.hideAction, "hide-close": _vm.hideClose, "close-button-props": _vm.closeButtonProps, "visually-hidden-close": _vm.visuallyHiddenClose, "visually-hidden-close-label": _vm.visuallyHiddenCloseLabel } }, _vm.$listeners), [_vm._t("action")], 2)], 1)]);
|
|
194
|
+
};
|
|
195
|
+
var _sfc_staticRenderFns = [];
|
|
196
|
+
var __component__ = /* @__PURE__ */ normalizeComponent(
|
|
197
|
+
_sfc_main,
|
|
198
|
+
_sfc_render,
|
|
199
|
+
_sfc_staticRenderFns,
|
|
200
|
+
false,
|
|
190
201
|
null,
|
|
191
202
|
null,
|
|
192
203
|
null,
|
|
193
204
|
null
|
|
194
205
|
);
|
|
195
|
-
const
|
|
206
|
+
const banner = __component__.exports;
|
|
196
207
|
export {
|
|
197
|
-
|
|
208
|
+
banner as DtBanner
|
|
198
209
|
};
|
|
199
210
|
//# sourceMappingURL=banner.js.map
|
package/dist/lib/banner.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"banner.js","sources":["../../components/banner/banner.vue"],"sourcesContent":["<!-- eslint-disable vuejs-accessibility/no-static-element-interactions -->\n<template>\n <aside\n :class=\"bannerClass\"\n :style=\"bannerBackgroundImage\"\n @keydown.tab=\"trapFocus\"\n >\n <div\n class=\"d-banner__dialog\"\n :class=\"dialogClass\"\n :role=\"role\"\n :aria-labelledby=\"titleId\"\n :aria-describedby=\"contentId\"\n >\n <dt-notice-icon\n v-if=\"!hideIcon\"\n :kind=\"kind\"\n v-on=\"$listeners\"\n >\n <!-- @slot Slot for custom icon -->\n <slot name=\"icon\" />\n </dt-notice-icon>\n <dt-notice-content\n :title-id=\"titleId\"\n :content-id=\"contentId\"\n :title=\"title\"\n v-on=\"$listeners\"\n >\n <template #titleOverride>\n <!-- eslint-disable-next-line max-len -->\n <!-- @slot Allows you to override the title, only use this if you need to override with something other than text. Otherwise use the \"title\" prop. -->\n <slot name=\"titleOverride\" />\n </template>\n <!-- @slot the main textual content of the banner -->\n <slot />\n </dt-notice-content>\n <dt-notice-action\n :hide-action=\"hideAction\"\n :hide-close=\"hideClose\"\n :close-button-props=\"closeButtonProps\"\n :visually-hidden-close=\"visuallyHiddenClose\"\n :visually-hidden-close-label=\"visuallyHiddenCloseLabel\"\n v-on=\"$listeners\"\n >\n <!-- @slot Enter a possible action for the user to take, such as a link to another page -->\n <slot name=\"action\" />\n </dt-notice-action>\n </div>\n </aside>\n</template>\n\n<script>\nimport { DtNoticeIcon, DtNoticeContent, DtNoticeAction, NOTICE_KINDS } from '@/components/notice';\nimport Modal from '@/common/mixins/modal';\nimport utils from '@/common/utils';\nimport SrOnlyCloseButtonMixin from '@/common/mixins/sr_only_close_button';\n\n/**\n * Banners are a type of notice, delivering system and engagement messaging.\n * These are highly intrusive notices and should be used sparingly and appropriately.\n * @see https://dialtone.dialpad.com/components/banner.html\n */\nexport default {\n name: 'DtBanner',\n\n components: {\n DtNoticeIcon,\n DtNoticeContent,\n DtNoticeAction,\n },\n\n mixins: [Modal, SrOnlyCloseButtonMixin],\n\n props: {\n /**\n * Sets an ID on the title element of the component. Useful for aria-describedby\n * or aria-labelledby or any other reason you may need an id to refer to the title.\n */\n titleId: {\n type: String,\n default () { return utils.getUniqueString(); },\n },\n\n /**\n * Sets an ID on the content element of the component. Useful for aria-describedby\n * or aria-labelledby or any other reason you may need an id to refer to the content.\n */\n contentId: {\n type: String,\n default () { return utils.getUniqueString(); },\n },\n\n /**\n * Title header of the notice. This can be left blank to remove the title from the notice entirely.\n */\n title: {\n type: String,\n default: '',\n },\n\n /**\n * Used in scenarios where the message needs to visually dominate the screen.\n * This will also change the aria role from status to alertdialog.\n * and will modally trap the keyboard focus in the dialog as soon as it displays.\n * @values true, false\n */\n important: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Pins the banner to the top of the window and pushes all app content down.\n * @values true, false\n */\n pinned: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Severity level of the notice, sets the icon and background\n * @values base, error, info, success, warning\n */\n kind: {\n type: String,\n default: 'base',\n validate (kind) {\n return NOTICE_KINDS.includes(kind);\n },\n },\n\n /**\n * Props for the notice close button.\n */\n closeButtonProps: {\n type: Object,\n default: () => ({}),\n },\n\n /**\n * Hides the close button from the notice\n * @values true, false\n */\n hideClose: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Hides the icon from the notice\n * @values true, false\n */\n hideIcon: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Hides the action from the notice\n * @values true, false\n */\n hideAction: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Inner dialog class\n */\n dialogClass: {\n type: String,\n default: '',\n },\n\n /**\n * Banner background image\n */\n backgroundImage: {\n type: String,\n default: '',\n },\n\n /**\n * Background image size, follows the background-size CSS property values\n * <a class=\"d-link\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/background-size\" target=\"_blank\">\n * CSS background-sizes\n * </a>\n */\n backgroundSize: {\n type: String,\n default: 'cover',\n },\n },\n\n emits: [\n /**\n * Close button click event\n *\n * @event close\n */\n 'close',\n ],\n\n computed: {\n role () {\n return this.important ? 'alertdialog' : 'status';\n },\n\n bannerClass () {\n const kindClasses = {\n error: 'd-banner--error',\n info: 'd-banner--info',\n success: 'd-banner--success',\n warning: 'd-banner--warning',\n base: 'd-banner--base',\n };\n\n return [\n 'd-banner',\n kindClasses[this.kind],\n {\n 'd-banner--important': this.important,\n 'd-banner--pinned': this.pinned,\n },\n ];\n },\n\n bannerBackgroundImage () {\n if (this.backgroundImage === '') return null;\n\n return `background-image: url(${this.backgroundImage});\n background-size: ${this.backgroundSize};`;\n },\n },\n\n mounted () {\n if (this.important) {\n this.focusFirstElement();\n }\n },\n\n methods: {\n trapFocus (e) {\n if (this.important) {\n this.focusTrappedTabPress(e);\n }\n },\n },\n};\n</script>\n"],"names":[
|
|
1
|
+
{"version":3,"file":"banner.js","sources":["../../components/banner/banner.vue"],"sourcesContent":["<!-- eslint-disable vuejs-accessibility/no-static-element-interactions -->\n<template>\n <aside\n :class=\"bannerClass\"\n :style=\"bannerBackgroundImage\"\n @keydown.tab=\"trapFocus\"\n >\n <div\n class=\"d-banner__dialog\"\n :class=\"dialogClass\"\n :role=\"role\"\n :aria-labelledby=\"titleId\"\n :aria-describedby=\"contentId\"\n >\n <dt-notice-icon\n v-if=\"!hideIcon\"\n :kind=\"kind\"\n v-on=\"$listeners\"\n >\n <!-- @slot Slot for custom icon -->\n <slot name=\"icon\" />\n </dt-notice-icon>\n <dt-notice-content\n :title-id=\"titleId\"\n :content-id=\"contentId\"\n :title=\"title\"\n v-on=\"$listeners\"\n >\n <template #titleOverride>\n <!-- eslint-disable-next-line max-len -->\n <!-- @slot Allows you to override the title, only use this if you need to override with something other than text. Otherwise use the \"title\" prop. -->\n <slot name=\"titleOverride\" />\n </template>\n <!-- @slot the main textual content of the banner -->\n <slot />\n </dt-notice-content>\n <dt-notice-action\n :hide-action=\"hideAction\"\n :hide-close=\"hideClose\"\n :close-button-props=\"closeButtonProps\"\n :visually-hidden-close=\"visuallyHiddenClose\"\n :visually-hidden-close-label=\"visuallyHiddenCloseLabel\"\n v-on=\"$listeners\"\n >\n <!-- @slot Enter a possible action for the user to take, such as a link to another page -->\n <slot name=\"action\" />\n </dt-notice-action>\n </div>\n </aside>\n</template>\n\n<script>\nimport { DtNoticeIcon, DtNoticeContent, DtNoticeAction, NOTICE_KINDS } from '@/components/notice';\nimport Modal from '@/common/mixins/modal';\nimport utils from '@/common/utils';\nimport SrOnlyCloseButtonMixin from '@/common/mixins/sr_only_close_button';\n\n/**\n * Banners are a type of notice, delivering system and engagement messaging.\n * These are highly intrusive notices and should be used sparingly and appropriately.\n * @see https://dialtone.dialpad.com/components/banner.html\n */\nexport default {\n name: 'DtBanner',\n\n components: {\n DtNoticeIcon,\n DtNoticeContent,\n DtNoticeAction,\n },\n\n mixins: [Modal, SrOnlyCloseButtonMixin],\n\n props: {\n /**\n * Sets an ID on the title element of the component. Useful for aria-describedby\n * or aria-labelledby or any other reason you may need an id to refer to the title.\n */\n titleId: {\n type: String,\n default () { return utils.getUniqueString(); },\n },\n\n /**\n * Sets an ID on the content element of the component. Useful for aria-describedby\n * or aria-labelledby or any other reason you may need an id to refer to the content.\n */\n contentId: {\n type: String,\n default () { return utils.getUniqueString(); },\n },\n\n /**\n * Title header of the notice. This can be left blank to remove the title from the notice entirely.\n */\n title: {\n type: String,\n default: '',\n },\n\n /**\n * Used in scenarios where the message needs to visually dominate the screen.\n * This will also change the aria role from status to alertdialog.\n * and will modally trap the keyboard focus in the dialog as soon as it displays.\n * @values true, false\n */\n important: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Pins the banner to the top of the window and pushes all app content down.\n * @values true, false\n */\n pinned: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Severity level of the notice, sets the icon and background\n * @values base, error, info, success, warning\n */\n kind: {\n type: String,\n default: 'base',\n validate (kind) {\n return NOTICE_KINDS.includes(kind);\n },\n },\n\n /**\n * Props for the notice close button.\n */\n closeButtonProps: {\n type: Object,\n default: () => ({}),\n },\n\n /**\n * Hides the close button from the notice\n * @values true, false\n */\n hideClose: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Hides the icon from the notice\n * @values true, false\n */\n hideIcon: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Hides the action from the notice\n * @values true, false\n */\n hideAction: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Inner dialog class\n */\n dialogClass: {\n type: String,\n default: '',\n },\n\n /**\n * Banner background image\n */\n backgroundImage: {\n type: String,\n default: '',\n },\n\n /**\n * Background image size, follows the background-size CSS property values\n * <a class=\"d-link\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/background-size\" target=\"_blank\">\n * CSS background-sizes\n * </a>\n */\n backgroundSize: {\n type: String,\n default: 'cover',\n },\n },\n\n emits: [\n /**\n * Close button click event\n *\n * @event close\n */\n 'close',\n ],\n\n computed: {\n role () {\n return this.important ? 'alertdialog' : 'status';\n },\n\n bannerClass () {\n const kindClasses = {\n error: 'd-banner--error',\n info: 'd-banner--info',\n success: 'd-banner--success',\n warning: 'd-banner--warning',\n base: 'd-banner--base',\n };\n\n return [\n 'd-banner',\n kindClasses[this.kind],\n {\n 'd-banner--important': this.important,\n 'd-banner--pinned': this.pinned,\n },\n ];\n },\n\n bannerBackgroundImage () {\n if (this.backgroundImage === '') return null;\n\n return `background-image: url(${this.backgroundImage});\n background-size: ${this.backgroundSize};`;\n },\n },\n\n mounted () {\n if (this.important) {\n this.focusFirstElement();\n }\n },\n\n methods: {\n trapFocus (e) {\n if (this.important) {\n this.focusTrappedTabPress(e);\n }\n },\n },\n};\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;AA8DA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,QAAA,CAAA,OAAA,sBAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,eAAA,MAAA,gBAAA;AAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,eAAA,MAAA,gBAAA;AAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,SAAA,MAAA;AACA,eAAA,aAAA,SAAA,IAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,kBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,OAAA,CAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,iBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,OAAA;AACA,aAAA,KAAA,YAAA,gBAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,YAAA,cAAA;AAAA,QACA,OAAA;AAAA,QACA,MAAA;AAAA,QACA,SAAA;AAAA,QACA,SAAA;AAAA,QACA,MAAA;AAAA,MACA;AAEA,aAAA;AAAA,QACA;AAAA,QACA,YAAA,KAAA,IAAA;AAAA,QACA;AAAA,UACA,uBAAA,KAAA;AAAA,UACA,oBAAA,KAAA;AAAA,QACA;AAAA,MACA;AAAA,IACA;AAAA,IAEA,wBAAA;AACA,UAAA,KAAA,oBAAA;AAAA,eAAA;AAEA,aAAA,yBAAA,KAAA,eAAA;AAAA,iCACA,KAAA,cAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,QAAA,KAAA,WAAA;AACA,WAAA,kBAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,UAAA,GAAA;AACA,UAAA,KAAA,WAAA;AACA,aAAA,qBAAA,CAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/lib/breadcrumbs.cjs
CHANGED
|
@@ -1,2 +1,147 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const link_constants = require("../chunks/link_constants-Huj7D_hm.js");
|
|
4
|
+
const _pluginVue2_normalizer = require("../chunks/_plugin-vue2_normalizer-1aBeR4AK.js");
|
|
5
|
+
const lib_link = require("./link.cjs");
|
|
6
|
+
const common_utils = require("../common/utils.cjs");
|
|
7
|
+
require("../common/constants.cjs");
|
|
8
|
+
require("vue");
|
|
9
|
+
const BREADCRUMB_ITEM_SELECTED_MODIFIER = "d-breadcrumbs__item--selected";
|
|
10
|
+
const BREADCRUMBS_INVERTED_MODIFIER = "d-breadcrumbs--inverted";
|
|
11
|
+
const _sfc_main$1 = {
|
|
12
|
+
name: "DtBreadcrumbItem",
|
|
13
|
+
components: {
|
|
14
|
+
DtLink: lib_link.DtLink
|
|
15
|
+
},
|
|
16
|
+
inheritAttrs: false,
|
|
17
|
+
props: {
|
|
18
|
+
/**
|
|
19
|
+
* Passed through to link. If true, applies inverted styles to the link.
|
|
20
|
+
*/
|
|
21
|
+
inverted: {
|
|
22
|
+
type: Boolean,
|
|
23
|
+
default: false
|
|
24
|
+
},
|
|
25
|
+
/**
|
|
26
|
+
* Applies selected styles to the breadcrumb
|
|
27
|
+
*/
|
|
28
|
+
selected: {
|
|
29
|
+
type: Boolean,
|
|
30
|
+
default: false
|
|
31
|
+
},
|
|
32
|
+
/**
|
|
33
|
+
* Describes the breadcrumb. Overridden by default slot
|
|
34
|
+
*/
|
|
35
|
+
label: {
|
|
36
|
+
type: String,
|
|
37
|
+
default: ""
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
data() {
|
|
41
|
+
return {
|
|
42
|
+
BREADCRUMB_ITEM_SELECTED_MODIFIER
|
|
43
|
+
};
|
|
44
|
+
},
|
|
45
|
+
computed: {
|
|
46
|
+
linkKind() {
|
|
47
|
+
return this.inverted ? link_constants.INVERTED : link_constants.MUTED;
|
|
48
|
+
},
|
|
49
|
+
ariaCurrent() {
|
|
50
|
+
return this.selected ? "location" : void 0;
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
var _sfc_render$1 = function render() {
|
|
55
|
+
var _vm = this, _c = _vm._self._c;
|
|
56
|
+
return _c("li", { class: [
|
|
57
|
+
"d-breadcrumbs__item",
|
|
58
|
+
{ [_vm.BREADCRUMB_ITEM_SELECTED_MODIFIER]: _vm.selected }
|
|
59
|
+
], attrs: { "data-qa": "dt-breadcrumb-item" } }, [_c("dt-link", _vm._b({ attrs: { "kind": _vm.linkKind, "aria-current": _vm.ariaCurrent, "data-qa": "breadcrumb-item" } }, "dt-link", _vm.$attrs, false), [_vm._t("default", function() {
|
|
60
|
+
return [_vm._v(" " + _vm._s(_vm.label) + " ")];
|
|
61
|
+
})], 2)], 1);
|
|
62
|
+
};
|
|
63
|
+
var _sfc_staticRenderFns$1 = [];
|
|
64
|
+
var __component__$1 = /* @__PURE__ */ _pluginVue2_normalizer.normalizeComponent(
|
|
65
|
+
_sfc_main$1,
|
|
66
|
+
_sfc_render$1,
|
|
67
|
+
_sfc_staticRenderFns$1,
|
|
68
|
+
false,
|
|
69
|
+
null,
|
|
70
|
+
null,
|
|
71
|
+
null,
|
|
72
|
+
null
|
|
73
|
+
);
|
|
74
|
+
const DtBreadcrumbItem = __component__$1.exports;
|
|
75
|
+
const _sfc_main = {
|
|
76
|
+
name: "DtBreadcrumbs",
|
|
77
|
+
components: {
|
|
78
|
+
DtBreadcrumbItem
|
|
79
|
+
},
|
|
80
|
+
props: {
|
|
81
|
+
/**
|
|
82
|
+
* A provided list of breadcrumbs. Overridden by default slot
|
|
83
|
+
*/
|
|
84
|
+
breadcrumbs: {
|
|
85
|
+
type: Array,
|
|
86
|
+
default: () => [],
|
|
87
|
+
validate(breadcrumbs2) {
|
|
88
|
+
return breadcrumbs2.every(({ href, label }) => {
|
|
89
|
+
return href !== void 0 && label !== void 0;
|
|
90
|
+
});
|
|
91
|
+
}
|
|
92
|
+
},
|
|
93
|
+
/**
|
|
94
|
+
* Passed through to link. If true, applies inverted styles to the link.
|
|
95
|
+
* @values true, false
|
|
96
|
+
*/
|
|
97
|
+
inverted: {
|
|
98
|
+
type: Boolean,
|
|
99
|
+
default: false
|
|
100
|
+
},
|
|
101
|
+
/**
|
|
102
|
+
* Descriptive label for the navigation content.
|
|
103
|
+
*/
|
|
104
|
+
ariaLabel: {
|
|
105
|
+
type: String,
|
|
106
|
+
default: "breadcrumb"
|
|
107
|
+
}
|
|
108
|
+
},
|
|
109
|
+
data() {
|
|
110
|
+
return {
|
|
111
|
+
BREADCRUMBS_INVERTED_MODIFIER
|
|
112
|
+
};
|
|
113
|
+
},
|
|
114
|
+
methods: {
|
|
115
|
+
getBreadcrumbItemKey(index) {
|
|
116
|
+
return `breadcrumbs-item-${index}-${common_utils.default.getUniqueString()}`;
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
};
|
|
120
|
+
var _sfc_render = function render2() {
|
|
121
|
+
var _vm = this, _c = _vm._self._c;
|
|
122
|
+
return _c("nav", { class: [
|
|
123
|
+
"d-breadcrumbs",
|
|
124
|
+
{ [_vm.BREADCRUMBS_INVERTED_MODIFIER]: _vm.inverted }
|
|
125
|
+
], attrs: { "aria-label": _vm.ariaLabel, "data-qa": "dt-breadcrumbs" } }, [_c("ol", [_vm._t("default", function() {
|
|
126
|
+
return _vm._l(_vm.breadcrumbs, function(item, index) {
|
|
127
|
+
return _c("dt-breadcrumb-item", _vm._g(_vm._b({ key: _vm.getBreadcrumbItemKey(index), attrs: { "inverted": _vm.inverted } }, "dt-breadcrumb-item", item, false), _vm.$listeners));
|
|
128
|
+
});
|
|
129
|
+
})], 2)]);
|
|
130
|
+
};
|
|
131
|
+
var _sfc_staticRenderFns = [];
|
|
132
|
+
var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.normalizeComponent(
|
|
133
|
+
_sfc_main,
|
|
134
|
+
_sfc_render,
|
|
135
|
+
_sfc_staticRenderFns,
|
|
136
|
+
false,
|
|
137
|
+
null,
|
|
138
|
+
null,
|
|
139
|
+
null,
|
|
140
|
+
null
|
|
141
|
+
);
|
|
142
|
+
const breadcrumbs = __component__.exports;
|
|
143
|
+
exports.BREADCRUMBS_INVERTED_MODIFIER = BREADCRUMBS_INVERTED_MODIFIER;
|
|
144
|
+
exports.BREADCRUMB_ITEM_SELECTED_MODIFIER = BREADCRUMB_ITEM_SELECTED_MODIFIER;
|
|
145
|
+
exports.DtBreadcrumbItem = DtBreadcrumbItem;
|
|
146
|
+
exports.DtBreadcrumbs = breadcrumbs;
|
|
2
147
|
//# sourceMappingURL=breadcrumbs.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"breadcrumbs.cjs","sources":["../../components/breadcrumbs/breadcrumbs_constants.js","../../components/breadcrumbs/breadcrumb_item.vue","../../components/breadcrumbs/breadcrumbs.vue"],"sourcesContent":["export const BREADCRUMB_ITEM_SELECTED_MODIFIER = 'd-breadcrumbs__item--selected';\nexport const BREADCRUMBS_INVERTED_MODIFIER = 'd-breadcrumbs--inverted';\n","<template>\n <li\n data-qa=\"dt-breadcrumb-item\"\n :class=\"[\n 'd-breadcrumbs__item',\n { [BREADCRUMB_ITEM_SELECTED_MODIFIER]: selected },\n ]\"\n >\n <dt-link\n :kind=\"linkKind\"\n :aria-current=\"ariaCurrent\"\n data-qa=\"breadcrumb-item\"\n v-bind=\"$attrs\"\n >\n <!-- @slot default slot for breadcrumb item's label -->\n <slot>\n {{ label }}\n </slot>\n </dt-link>\n </li>\n</template>\n\n<script>\nimport { BREADCRUMB_ITEM_SELECTED_MODIFIER } from './breadcrumbs_constants';\nimport { DtLink } from '../link';\nimport { INVERTED, MUTED } from '../link/link_constants';\n\nexport default {\n name: 'DtBreadcrumbItem',\n\n components: {\n DtLink,\n },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Passed through to link. If true, applies inverted styles to the link.\n */\n inverted: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Applies selected styles to the breadcrumb\n */\n selected: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Describes the breadcrumb. Overridden by default slot\n */\n label: {\n type: String,\n default: '',\n },\n },\n\n data () {\n return {\n BREADCRUMB_ITEM_SELECTED_MODIFIER,\n };\n },\n\n computed: {\n linkKind () {\n return this.inverted ? INVERTED : MUTED;\n },\n\n ariaCurrent () {\n return this.selected ? 'location' : undefined;\n },\n },\n};\n</script>\n","<template>\n <nav\n :aria-label=\"ariaLabel\"\n data-qa=\"dt-breadcrumbs\"\n :class=\"[\n 'd-breadcrumbs',\n { [BREADCRUMBS_INVERTED_MODIFIER]: inverted },\n ]\"\n >\n <ol>\n <!-- @slot default slot for breadcrumbs content -->\n <slot>\n <dt-breadcrumb-item\n v-for=\"(item, index) in breadcrumbs\"\n :key=\"getBreadcrumbItemKey(index)\"\n :inverted=\"inverted\"\n v-bind=\"item\"\n v-on=\"$listeners\"\n />\n </slot>\n </ol>\n </nav>\n</template>\n\n<script>\nimport { BREADCRUMBS_INVERTED_MODIFIER } from './breadcrumbs_constants';\nimport DtBreadcrumbItem from './breadcrumb_item.vue';\nimport utils from '@/common/utils';\n\n/**\n * Breadcrumbs are links used to provide context for the currently-viewed page\n * and where it is located within the overall site structure.\n * @see https://dialtone.dialpad.com/components/breadcrumbs.html\n */\nexport default {\n name: 'DtBreadcrumbs',\n\n components: {\n DtBreadcrumbItem,\n },\n\n props: {\n /**\n * A provided list of breadcrumbs. Overridden by default slot\n */\n breadcrumbs: {\n type: Array,\n default: () => [],\n validate (breadcrumbs) {\n return breadcrumbs.every(({ href, label }) => {\n return href !== undefined && label !== undefined;\n });\n },\n },\n\n /**\n * Passed through to link. If true, applies inverted styles to the link.\n * @values true, false\n */\n inverted: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Descriptive label for the navigation content.\n */\n ariaLabel: {\n type: String,\n default: 'breadcrumb',\n },\n },\n\n data () {\n return {\n BREADCRUMBS_INVERTED_MODIFIER,\n };\n },\n\n methods: {\n getBreadcrumbItemKey (index) {\n return `breadcrumbs-item-${index}-${utils.getUniqueString()}`;\n },\n },\n};\n</script>\n"],"names":["
|
|
1
|
+
{"version":3,"file":"breadcrumbs.cjs","sources":["../../components/breadcrumbs/breadcrumbs_constants.js","../../components/breadcrumbs/breadcrumb_item.vue","../../components/breadcrumbs/breadcrumbs.vue"],"sourcesContent":["export const BREADCRUMB_ITEM_SELECTED_MODIFIER = 'd-breadcrumbs__item--selected';\nexport const BREADCRUMBS_INVERTED_MODIFIER = 'd-breadcrumbs--inverted';\n","<template>\n <li\n data-qa=\"dt-breadcrumb-item\"\n :class=\"[\n 'd-breadcrumbs__item',\n { [BREADCRUMB_ITEM_SELECTED_MODIFIER]: selected },\n ]\"\n >\n <dt-link\n :kind=\"linkKind\"\n :aria-current=\"ariaCurrent\"\n data-qa=\"breadcrumb-item\"\n v-bind=\"$attrs\"\n >\n <!-- @slot default slot for breadcrumb item's label -->\n <slot>\n {{ label }}\n </slot>\n </dt-link>\n </li>\n</template>\n\n<script>\nimport { BREADCRUMB_ITEM_SELECTED_MODIFIER } from './breadcrumbs_constants';\nimport { DtLink } from '../link';\nimport { INVERTED, MUTED } from '../link/link_constants';\n\nexport default {\n name: 'DtBreadcrumbItem',\n\n components: {\n DtLink,\n },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Passed through to link. If true, applies inverted styles to the link.\n */\n inverted: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Applies selected styles to the breadcrumb\n */\n selected: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Describes the breadcrumb. Overridden by default slot\n */\n label: {\n type: String,\n default: '',\n },\n },\n\n data () {\n return {\n BREADCRUMB_ITEM_SELECTED_MODIFIER,\n };\n },\n\n computed: {\n linkKind () {\n return this.inverted ? INVERTED : MUTED;\n },\n\n ariaCurrent () {\n return this.selected ? 'location' : undefined;\n },\n },\n};\n</script>\n","<template>\n <nav\n :aria-label=\"ariaLabel\"\n data-qa=\"dt-breadcrumbs\"\n :class=\"[\n 'd-breadcrumbs',\n { [BREADCRUMBS_INVERTED_MODIFIER]: inverted },\n ]\"\n >\n <ol>\n <!-- @slot default slot for breadcrumbs content -->\n <slot>\n <dt-breadcrumb-item\n v-for=\"(item, index) in breadcrumbs\"\n :key=\"getBreadcrumbItemKey(index)\"\n :inverted=\"inverted\"\n v-bind=\"item\"\n v-on=\"$listeners\"\n />\n </slot>\n </ol>\n </nav>\n</template>\n\n<script>\nimport { BREADCRUMBS_INVERTED_MODIFIER } from './breadcrumbs_constants';\nimport DtBreadcrumbItem from './breadcrumb_item.vue';\nimport utils from '@/common/utils';\n\n/**\n * Breadcrumbs are links used to provide context for the currently-viewed page\n * and where it is located within the overall site structure.\n * @see https://dialtone.dialpad.com/components/breadcrumbs.html\n */\nexport default {\n name: 'DtBreadcrumbs',\n\n components: {\n DtBreadcrumbItem,\n },\n\n props: {\n /**\n * A provided list of breadcrumbs. Overridden by default slot\n */\n breadcrumbs: {\n type: Array,\n default: () => [],\n validate (breadcrumbs) {\n return breadcrumbs.every(({ href, label }) => {\n return href !== undefined && label !== undefined;\n });\n },\n },\n\n /**\n * Passed through to link. If true, applies inverted styles to the link.\n * @values true, false\n */\n inverted: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Descriptive label for the navigation content.\n */\n ariaLabel: {\n type: String,\n default: 'breadcrumb',\n },\n },\n\n data () {\n return {\n BREADCRUMBS_INVERTED_MODIFIER,\n };\n },\n\n methods: {\n getBreadcrumbItemKey (index) {\n return `breadcrumbs-item-${index}-${utils.getUniqueString()}`;\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtLink","INVERTED","MUTED","breadcrumbs","utils"],"mappings":";;;;;;;;AAAY,MAAC,oCAAoC;AACrC,MAAC,gCAAgC;AC0B7C,MAAAA,cAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,QAAAC,SAAA;AAAA,EACA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,WAAA;AACA,aAAA,KAAA,WAAAC,eAAA,WAAAC;IACA;AAAA,IAEA,cAAA;AACA,aAAA,KAAA,WAAA,aAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;AC3CA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA,CAAA;AAAA,MACA,SAAAC,cAAA;AACA,eAAAA,aAAA,MAAA,CAAA,EAAA,MAAA,MAAA,MAAA;AACA,iBAAA,SAAA,UAAA,UAAA;AAAA,QACA,CAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,qBAAA,OAAA;AACA,aAAA,oBAAA,KAAA,IAAAC,aAAAA,QAAA,gBAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/lib/breadcrumbs.js
CHANGED
|
@@ -1,29 +1,31 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import { DtLink
|
|
4
|
-
import
|
|
5
|
-
import "
|
|
1
|
+
import { INVERTED, MUTED } from "../chunks/link_constants-nWVlXQBs.js";
|
|
2
|
+
import { normalizeComponent } from "../chunks/_plugin-vue2_normalizer-sOSkiPF3.js";
|
|
3
|
+
import { DtLink } from "./link.js";
|
|
4
|
+
import utils from "../common/utils.js";
|
|
5
|
+
import "../common/constants.js";
|
|
6
6
|
import "vue";
|
|
7
|
-
const
|
|
7
|
+
const BREADCRUMB_ITEM_SELECTED_MODIFIER = "d-breadcrumbs__item--selected";
|
|
8
|
+
const BREADCRUMBS_INVERTED_MODIFIER = "d-breadcrumbs--inverted";
|
|
9
|
+
const _sfc_main$1 = {
|
|
8
10
|
name: "DtBreadcrumbItem",
|
|
9
11
|
components: {
|
|
10
|
-
DtLink
|
|
12
|
+
DtLink
|
|
11
13
|
},
|
|
12
|
-
inheritAttrs:
|
|
14
|
+
inheritAttrs: false,
|
|
13
15
|
props: {
|
|
14
16
|
/**
|
|
15
17
|
* Passed through to link. If true, applies inverted styles to the link.
|
|
16
18
|
*/
|
|
17
19
|
inverted: {
|
|
18
20
|
type: Boolean,
|
|
19
|
-
default:
|
|
21
|
+
default: false
|
|
20
22
|
},
|
|
21
23
|
/**
|
|
22
24
|
* Applies selected styles to the breadcrumb
|
|
23
25
|
*/
|
|
24
26
|
selected: {
|
|
25
27
|
type: Boolean,
|
|
26
|
-
default:
|
|
28
|
+
default: false
|
|
27
29
|
},
|
|
28
30
|
/**
|
|
29
31
|
* Describes the breadcrumb. Overridden by default slot
|
|
@@ -35,40 +37,43 @@ const c = "d-breadcrumbs__item--selected", m = "d-breadcrumbs--inverted", _ = {
|
|
|
35
37
|
},
|
|
36
38
|
data() {
|
|
37
39
|
return {
|
|
38
|
-
BREADCRUMB_ITEM_SELECTED_MODIFIER
|
|
40
|
+
BREADCRUMB_ITEM_SELECTED_MODIFIER
|
|
39
41
|
};
|
|
40
42
|
},
|
|
41
43
|
computed: {
|
|
42
44
|
linkKind() {
|
|
43
|
-
return this.inverted ?
|
|
45
|
+
return this.inverted ? INVERTED : MUTED;
|
|
44
46
|
},
|
|
45
47
|
ariaCurrent() {
|
|
46
48
|
return this.selected ? "location" : void 0;
|
|
47
49
|
}
|
|
48
50
|
}
|
|
49
51
|
};
|
|
50
|
-
var
|
|
51
|
-
var
|
|
52
|
-
return
|
|
52
|
+
var _sfc_render$1 = function render() {
|
|
53
|
+
var _vm = this, _c = _vm._self._c;
|
|
54
|
+
return _c("li", { class: [
|
|
53
55
|
"d-breadcrumbs__item",
|
|
54
|
-
{ [
|
|
55
|
-
], attrs: { "data-qa": "dt-breadcrumb-item" } }, [
|
|
56
|
-
return [
|
|
56
|
+
{ [_vm.BREADCRUMB_ITEM_SELECTED_MODIFIER]: _vm.selected }
|
|
57
|
+
], attrs: { "data-qa": "dt-breadcrumb-item" } }, [_c("dt-link", _vm._b({ attrs: { "kind": _vm.linkKind, "aria-current": _vm.ariaCurrent, "data-qa": "breadcrumb-item" } }, "dt-link", _vm.$attrs, false), [_vm._t("default", function() {
|
|
58
|
+
return [_vm._v(" " + _vm._s(_vm.label) + " ")];
|
|
57
59
|
})], 2)], 1);
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
60
|
+
};
|
|
61
|
+
var _sfc_staticRenderFns$1 = [];
|
|
62
|
+
var __component__$1 = /* @__PURE__ */ normalizeComponent(
|
|
63
|
+
_sfc_main$1,
|
|
64
|
+
_sfc_render$1,
|
|
65
|
+
_sfc_staticRenderFns$1,
|
|
66
|
+
false,
|
|
63
67
|
null,
|
|
64
68
|
null,
|
|
65
69
|
null,
|
|
66
70
|
null
|
|
67
71
|
);
|
|
68
|
-
const
|
|
72
|
+
const DtBreadcrumbItem = __component__$1.exports;
|
|
73
|
+
const _sfc_main = {
|
|
69
74
|
name: "DtBreadcrumbs",
|
|
70
75
|
components: {
|
|
71
|
-
DtBreadcrumbItem
|
|
76
|
+
DtBreadcrumbItem
|
|
72
77
|
},
|
|
73
78
|
props: {
|
|
74
79
|
/**
|
|
@@ -77,8 +82,10 @@ const p = f.exports, E = {
|
|
|
77
82
|
breadcrumbs: {
|
|
78
83
|
type: Array,
|
|
79
84
|
default: () => [],
|
|
80
|
-
validate(
|
|
81
|
-
return
|
|
85
|
+
validate(breadcrumbs2) {
|
|
86
|
+
return breadcrumbs2.every(({ href, label }) => {
|
|
87
|
+
return href !== void 0 && label !== void 0;
|
|
88
|
+
});
|
|
82
89
|
}
|
|
83
90
|
},
|
|
84
91
|
/**
|
|
@@ -87,7 +94,7 @@ const p = f.exports, E = {
|
|
|
87
94
|
*/
|
|
88
95
|
inverted: {
|
|
89
96
|
type: Boolean,
|
|
90
|
-
default:
|
|
97
|
+
default: false
|
|
91
98
|
},
|
|
92
99
|
/**
|
|
93
100
|
* Descriptive label for the navigation content.
|
|
@@ -99,40 +106,42 @@ const p = f.exports, E = {
|
|
|
99
106
|
},
|
|
100
107
|
data() {
|
|
101
108
|
return {
|
|
102
|
-
BREADCRUMBS_INVERTED_MODIFIER
|
|
109
|
+
BREADCRUMBS_INVERTED_MODIFIER
|
|
103
110
|
};
|
|
104
111
|
},
|
|
105
112
|
methods: {
|
|
106
|
-
getBreadcrumbItemKey(
|
|
107
|
-
return `breadcrumbs-item-${
|
|
113
|
+
getBreadcrumbItemKey(index) {
|
|
114
|
+
return `breadcrumbs-item-${index}-${utils.getUniqueString()}`;
|
|
108
115
|
}
|
|
109
116
|
}
|
|
110
117
|
};
|
|
111
|
-
var
|
|
112
|
-
var
|
|
113
|
-
return
|
|
118
|
+
var _sfc_render = function render2() {
|
|
119
|
+
var _vm = this, _c = _vm._self._c;
|
|
120
|
+
return _c("nav", { class: [
|
|
114
121
|
"d-breadcrumbs",
|
|
115
|
-
{ [
|
|
116
|
-
], attrs: { "aria-label":
|
|
117
|
-
return
|
|
118
|
-
return
|
|
122
|
+
{ [_vm.BREADCRUMBS_INVERTED_MODIFIER]: _vm.inverted }
|
|
123
|
+
], attrs: { "aria-label": _vm.ariaLabel, "data-qa": "dt-breadcrumbs" } }, [_c("ol", [_vm._t("default", function() {
|
|
124
|
+
return _vm._l(_vm.breadcrumbs, function(item, index) {
|
|
125
|
+
return _c("dt-breadcrumb-item", _vm._g(_vm._b({ key: _vm.getBreadcrumbItemKey(index), attrs: { "inverted": _vm.inverted } }, "dt-breadcrumb-item", item, false), _vm.$listeners));
|
|
119
126
|
});
|
|
120
127
|
})], 2)]);
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
128
|
+
};
|
|
129
|
+
var _sfc_staticRenderFns = [];
|
|
130
|
+
var __component__ = /* @__PURE__ */ normalizeComponent(
|
|
131
|
+
_sfc_main,
|
|
132
|
+
_sfc_render,
|
|
133
|
+
_sfc_staticRenderFns,
|
|
134
|
+
false,
|
|
126
135
|
null,
|
|
127
136
|
null,
|
|
128
137
|
null,
|
|
129
138
|
null
|
|
130
139
|
);
|
|
131
|
-
const
|
|
140
|
+
const breadcrumbs = __component__.exports;
|
|
132
141
|
export {
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
142
|
+
BREADCRUMBS_INVERTED_MODIFIER,
|
|
143
|
+
BREADCRUMB_ITEM_SELECTED_MODIFIER,
|
|
144
|
+
DtBreadcrumbItem,
|
|
145
|
+
breadcrumbs as DtBreadcrumbs
|
|
137
146
|
};
|
|
138
147
|
//# sourceMappingURL=breadcrumbs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"breadcrumbs.js","sources":["../../components/breadcrumbs/breadcrumbs_constants.js","../../components/breadcrumbs/breadcrumb_item.vue","../../components/breadcrumbs/breadcrumbs.vue"],"sourcesContent":["export const BREADCRUMB_ITEM_SELECTED_MODIFIER = 'd-breadcrumbs__item--selected';\nexport const BREADCRUMBS_INVERTED_MODIFIER = 'd-breadcrumbs--inverted';\n","<template>\n <li\n data-qa=\"dt-breadcrumb-item\"\n :class=\"[\n 'd-breadcrumbs__item',\n { [BREADCRUMB_ITEM_SELECTED_MODIFIER]: selected },\n ]\"\n >\n <dt-link\n :kind=\"linkKind\"\n :aria-current=\"ariaCurrent\"\n data-qa=\"breadcrumb-item\"\n v-bind=\"$attrs\"\n >\n <!-- @slot default slot for breadcrumb item's label -->\n <slot>\n {{ label }}\n </slot>\n </dt-link>\n </li>\n</template>\n\n<script>\nimport { BREADCRUMB_ITEM_SELECTED_MODIFIER } from './breadcrumbs_constants';\nimport { DtLink } from '../link';\nimport { INVERTED, MUTED } from '../link/link_constants';\n\nexport default {\n name: 'DtBreadcrumbItem',\n\n components: {\n DtLink,\n },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Passed through to link. If true, applies inverted styles to the link.\n */\n inverted: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Applies selected styles to the breadcrumb\n */\n selected: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Describes the breadcrumb. Overridden by default slot\n */\n label: {\n type: String,\n default: '',\n },\n },\n\n data () {\n return {\n BREADCRUMB_ITEM_SELECTED_MODIFIER,\n };\n },\n\n computed: {\n linkKind () {\n return this.inverted ? INVERTED : MUTED;\n },\n\n ariaCurrent () {\n return this.selected ? 'location' : undefined;\n },\n },\n};\n</script>\n","<template>\n <nav\n :aria-label=\"ariaLabel\"\n data-qa=\"dt-breadcrumbs\"\n :class=\"[\n 'd-breadcrumbs',\n { [BREADCRUMBS_INVERTED_MODIFIER]: inverted },\n ]\"\n >\n <ol>\n <!-- @slot default slot for breadcrumbs content -->\n <slot>\n <dt-breadcrumb-item\n v-for=\"(item, index) in breadcrumbs\"\n :key=\"getBreadcrumbItemKey(index)\"\n :inverted=\"inverted\"\n v-bind=\"item\"\n v-on=\"$listeners\"\n />\n </slot>\n </ol>\n </nav>\n</template>\n\n<script>\nimport { BREADCRUMBS_INVERTED_MODIFIER } from './breadcrumbs_constants';\nimport DtBreadcrumbItem from './breadcrumb_item.vue';\nimport utils from '@/common/utils';\n\n/**\n * Breadcrumbs are links used to provide context for the currently-viewed page\n * and where it is located within the overall site structure.\n * @see https://dialtone.dialpad.com/components/breadcrumbs.html\n */\nexport default {\n name: 'DtBreadcrumbs',\n\n components: {\n DtBreadcrumbItem,\n },\n\n props: {\n /**\n * A provided list of breadcrumbs. Overridden by default slot\n */\n breadcrumbs: {\n type: Array,\n default: () => [],\n validate (breadcrumbs) {\n return breadcrumbs.every(({ href, label }) => {\n return href !== undefined && label !== undefined;\n });\n },\n },\n\n /**\n * Passed through to link. If true, applies inverted styles to the link.\n * @values true, false\n */\n inverted: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Descriptive label for the navigation content.\n */\n ariaLabel: {\n type: String,\n default: 'breadcrumb',\n },\n },\n\n data () {\n return {\n BREADCRUMBS_INVERTED_MODIFIER,\n };\n },\n\n methods: {\n getBreadcrumbItemKey (index) {\n return `breadcrumbs-item-${index}-${utils.getUniqueString()}`;\n },\n },\n};\n</script>\n"],"names":["
|
|
1
|
+
{"version":3,"file":"breadcrumbs.js","sources":["../../components/breadcrumbs/breadcrumbs_constants.js","../../components/breadcrumbs/breadcrumb_item.vue","../../components/breadcrumbs/breadcrumbs.vue"],"sourcesContent":["export const BREADCRUMB_ITEM_SELECTED_MODIFIER = 'd-breadcrumbs__item--selected';\nexport const BREADCRUMBS_INVERTED_MODIFIER = 'd-breadcrumbs--inverted';\n","<template>\n <li\n data-qa=\"dt-breadcrumb-item\"\n :class=\"[\n 'd-breadcrumbs__item',\n { [BREADCRUMB_ITEM_SELECTED_MODIFIER]: selected },\n ]\"\n >\n <dt-link\n :kind=\"linkKind\"\n :aria-current=\"ariaCurrent\"\n data-qa=\"breadcrumb-item\"\n v-bind=\"$attrs\"\n >\n <!-- @slot default slot for breadcrumb item's label -->\n <slot>\n {{ label }}\n </slot>\n </dt-link>\n </li>\n</template>\n\n<script>\nimport { BREADCRUMB_ITEM_SELECTED_MODIFIER } from './breadcrumbs_constants';\nimport { DtLink } from '../link';\nimport { INVERTED, MUTED } from '../link/link_constants';\n\nexport default {\n name: 'DtBreadcrumbItem',\n\n components: {\n DtLink,\n },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Passed through to link. If true, applies inverted styles to the link.\n */\n inverted: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Applies selected styles to the breadcrumb\n */\n selected: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Describes the breadcrumb. Overridden by default slot\n */\n label: {\n type: String,\n default: '',\n },\n },\n\n data () {\n return {\n BREADCRUMB_ITEM_SELECTED_MODIFIER,\n };\n },\n\n computed: {\n linkKind () {\n return this.inverted ? INVERTED : MUTED;\n },\n\n ariaCurrent () {\n return this.selected ? 'location' : undefined;\n },\n },\n};\n</script>\n","<template>\n <nav\n :aria-label=\"ariaLabel\"\n data-qa=\"dt-breadcrumbs\"\n :class=\"[\n 'd-breadcrumbs',\n { [BREADCRUMBS_INVERTED_MODIFIER]: inverted },\n ]\"\n >\n <ol>\n <!-- @slot default slot for breadcrumbs content -->\n <slot>\n <dt-breadcrumb-item\n v-for=\"(item, index) in breadcrumbs\"\n :key=\"getBreadcrumbItemKey(index)\"\n :inverted=\"inverted\"\n v-bind=\"item\"\n v-on=\"$listeners\"\n />\n </slot>\n </ol>\n </nav>\n</template>\n\n<script>\nimport { BREADCRUMBS_INVERTED_MODIFIER } from './breadcrumbs_constants';\nimport DtBreadcrumbItem from './breadcrumb_item.vue';\nimport utils from '@/common/utils';\n\n/**\n * Breadcrumbs are links used to provide context for the currently-viewed page\n * and where it is located within the overall site structure.\n * @see https://dialtone.dialpad.com/components/breadcrumbs.html\n */\nexport default {\n name: 'DtBreadcrumbs',\n\n components: {\n DtBreadcrumbItem,\n },\n\n props: {\n /**\n * A provided list of breadcrumbs. Overridden by default slot\n */\n breadcrumbs: {\n type: Array,\n default: () => [],\n validate (breadcrumbs) {\n return breadcrumbs.every(({ href, label }) => {\n return href !== undefined && label !== undefined;\n });\n },\n },\n\n /**\n * Passed through to link. If true, applies inverted styles to the link.\n * @values true, false\n */\n inverted: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Descriptive label for the navigation content.\n */\n ariaLabel: {\n type: String,\n default: 'breadcrumb',\n },\n },\n\n data () {\n return {\n BREADCRUMBS_INVERTED_MODIFIER,\n };\n },\n\n methods: {\n getBreadcrumbItemKey (index) {\n return `breadcrumbs-item-${index}-${utils.getUniqueString()}`;\n },\n },\n};\n</script>\n"],"names":["_sfc_main","breadcrumbs"],"mappings":";;;;;;AAAY,MAAC,oCAAoC;AACrC,MAAC,gCAAgC;AC0B7C,MAAAA,cAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,WAAA;AACA,aAAA,KAAA,WAAA,WAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,aAAA,KAAA,WAAA,aAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;AC3CA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA,CAAA;AAAA,MACA,SAAAC,cAAA;AACA,eAAAA,aAAA,MAAA,CAAA,EAAA,MAAA,MAAA,MAAA;AACA,iBAAA,SAAA,UAAA,UAAA;AAAA,QACA,CAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,qBAAA,OAAA;AACA,aAAA,oBAAA,KAAA,IAAA,MAAA,gBAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;"}
|