@dialpad/dialtone 9.103.0 → 9.104.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/dist/css/dialtone-default-theme.css +41 -0
  2. package/dist/css/dialtone-default-theme.min.css +1 -1
  3. package/dist/css/dialtone.css +41 -0
  4. package/dist/css/dialtone.min.css +1 -1
  5. package/dist/tokens/doc.json +23832 -23832
  6. package/dist/vue2/component-documentation.json +1 -1
  7. package/dist/vue2/components/popover/popover.vue.cjs +2 -2
  8. package/dist/vue2/components/popover/popover.vue.cjs.map +1 -1
  9. package/dist/vue2/components/popover/popover.vue.js +2 -2
  10. package/dist/vue2/components/popover/popover.vue.js.map +1 -1
  11. package/dist/vue2/dialtone-vue.cjs +2 -0
  12. package/dist/vue2/dialtone-vue.cjs.map +1 -1
  13. package/dist/vue2/dialtone-vue.js +42 -40
  14. package/dist/vue2/dialtone-vue.js.map +1 -1
  15. package/dist/vue2/lib/callbar-button-with-dropdown.cjs +5 -0
  16. package/dist/vue2/lib/callbar-button-with-dropdown.cjs.map +1 -0
  17. package/dist/vue2/lib/callbar-button-with-dropdown.js +5 -0
  18. package/dist/vue2/lib/callbar-button-with-dropdown.js.map +1 -0
  19. package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.cjs +9 -1
  20. package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.cjs.map +1 -1
  21. package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.js +9 -1
  22. package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.js.map +1 -1
  23. package/dist/vue2/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.cjs +258 -0
  24. package/dist/vue2/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.cjs.map +1 -0
  25. package/dist/vue2/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.js +258 -0
  26. package/dist/vue2/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.js.map +1 -0
  27. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.cjs +9 -1
  28. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.cjs.map +1 -1
  29. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js +9 -1
  30. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js.map +1 -1
  31. package/dist/vue2/types/index.d.ts +1 -0
  32. package/dist/vue2/types/recipes/buttons/callbar_button/callbar_button.vue.d.ts +9 -0
  33. package/dist/vue2/types/recipes/buttons/callbar_button/callbar_button.vue.d.ts.map +1 -1
  34. package/dist/vue2/types/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.d.ts +167 -0
  35. package/dist/vue2/types/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.d.ts.map +1 -0
  36. package/dist/vue2/types/recipes/buttons/callbar_button_with_dropdown/index.d.ts +2 -0
  37. package/dist/vue2/types/recipes/buttons/callbar_button_with_dropdown/index.d.ts.map +1 -0
  38. package/dist/vue2/types/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.d.ts +9 -0
  39. package/dist/vue2/types/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.d.ts.map +1 -1
  40. package/dist/vue3/component-documentation.json +1 -1
  41. package/dist/vue3/components/popover/popover.vue.cjs +2 -2
  42. package/dist/vue3/components/popover/popover.vue.cjs.map +1 -1
  43. package/dist/vue3/components/popover/popover.vue.js +2 -2
  44. package/dist/vue3/components/popover/popover.vue.js.map +1 -1
  45. package/dist/vue3/dialtone-vue.cjs +2 -0
  46. package/dist/vue3/dialtone-vue.cjs.map +1 -1
  47. package/dist/vue3/dialtone-vue.js +42 -40
  48. package/dist/vue3/dialtone-vue.js.map +1 -1
  49. package/dist/vue3/lib/callbar-button-with-dropdown.cjs +5 -0
  50. package/dist/vue3/lib/callbar-button-with-dropdown.cjs.map +1 -0
  51. package/dist/vue3/lib/callbar-button-with-dropdown.js +5 -0
  52. package/dist/vue3/lib/callbar-button-with-dropdown.js.map +1 -0
  53. package/dist/vue3/recipes/buttons/callbar_button/callbar_button.vue.cjs +10 -1
  54. package/dist/vue3/recipes/buttons/callbar_button/callbar_button.vue.cjs.map +1 -1
  55. package/dist/vue3/recipes/buttons/callbar_button/callbar_button.vue.js +10 -1
  56. package/dist/vue3/recipes/buttons/callbar_button/callbar_button.vue.js.map +1 -1
  57. package/dist/vue3/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.cjs +321 -0
  58. package/dist/vue3/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.cjs.map +1 -0
  59. package/dist/vue3/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.js +321 -0
  60. package/dist/vue3/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.js.map +1 -0
  61. package/dist/vue3/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.cjs +10 -1
  62. package/dist/vue3/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.cjs.map +1 -1
  63. package/dist/vue3/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js +10 -1
  64. package/dist/vue3/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js.map +1 -1
  65. package/dist/vue3/types/index.d.ts +1 -0
  66. package/dist/vue3/types/recipes/buttons/callbar_button/callbar_button.vue.d.ts +9 -0
  67. package/dist/vue3/types/recipes/buttons/callbar_button/callbar_button.vue.d.ts.map +1 -1
  68. package/dist/vue3/types/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.d.ts +180 -0
  69. package/dist/vue3/types/recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.d.ts.map +1 -0
  70. package/dist/vue3/types/recipes/buttons/callbar_button_with_dropdown/index.d.ts +2 -0
  71. package/dist/vue3/types/recipes/buttons/callbar_button_with_dropdown/index.d.ts.map +1 -0
  72. package/dist/vue3/types/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.d.ts +9 -0
  73. package/dist/vue3/types/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.d.ts.map +1 -1
  74. package/package.json +3 -3
@@ -106,34 +106,35 @@ import { default as default66 } from "./directives/scrollbar/scrollbar.js";
106
106
  import { default as default67 } from "./recipes/buttons/callbar_button/callbar_button.vue.js";
107
107
  import { CALLBAR_BUTTON_VALID_WIDTH_SIZE } from "./recipes/buttons/callbar_button/callbar_button_constants.js";
108
108
  import { default as default68 } from "./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js";
109
- import { default as default69 } from "./recipes/cards/ivr_node/ivr_node.vue.js";
109
+ import { default as default69 } from "./recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.js";
110
+ import { default as default70 } from "./recipes/cards/ivr_node/ivr_node.vue.js";
110
111
  import { IVR_NODE_ASSIGN, IVR_NODE_BRANCH, IVR_NODE_CUSTOMER_DATA, IVR_NODE_EXPERT, IVR_NODE_GO_TO, IVR_NODE_HANGUP, IVR_NODE_ICON_TYPES, IVR_NODE_LABELS, IVR_NODE_PROMPT_COLLECT, IVR_NODE_PROMPT_MENU, IVR_NODE_PROMPT_PLAY, IVR_NODE_TRANSFER } from "./recipes/cards/ivr_node/ivr_node_constants.js";
111
- import { default as default70 } from "./recipes/chips/grouped_chip/grouped_chip.vue.js";
112
- import { default as default71 } from "./recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.js";
112
+ import { default as default71 } from "./recipes/chips/grouped_chip/grouped_chip.vue.js";
113
+ import { default as default72 } from "./recipes/comboboxes/combobox_multi_select/combobox_multi_select.vue.js";
113
114
  import { CHIP_SIZES, CHIP_TOP_POSITION, MULTI_SELECT_SIZES } from "./recipes/comboboxes/combobox_multi_select/combobox_multi_select_constants.js";
114
- import { default as default72 } from "./recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue.js";
115
- import { default as default73 } from "./recipes/conversation_view/attachment_carousel/attachment_carousel.vue.js";
116
- import { default as default74 } from "./recipes/conversation_view/editor/editor.vue.js";
117
- import { default as default75 } from "./recipes/conversation_view/emoji_row/emoji_row.vue.js";
115
+ import { default as default73 } from "./recipes/comboboxes/combobox_with_popover/combobox_with_popover.vue.js";
116
+ import { default as default74 } from "./recipes/conversation_view/attachment_carousel/attachment_carousel.vue.js";
117
+ import { default as default75 } from "./recipes/conversation_view/editor/editor.vue.js";
118
+ import { default as default76 } from "./recipes/conversation_view/emoji_row/emoji_row.vue.js";
118
119
  import { REACTIONS_ATTRIBUTES } from "./recipes/conversation_view/emoji_row/emoji_row_constants.js";
119
- import { default as default76 } from "./recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js";
120
+ import { default as default77 } from "./recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js";
120
121
  import { FEED_ITEM_PILL_BORDER_COLORS } from "./recipes/conversation_view/feed_item_pill/feed_item_pill_constants.js";
121
- import { default as default77 } from "./recipes/conversation_view/feed_item_row/feed_item_row.vue.js";
122
+ import { default as default78 } from "./recipes/conversation_view/feed_item_row/feed_item_row.vue.js";
122
123
  import { DEFAULT_FEED_ROW_STATE, FEED_ROW_STATE_BACKGROUND_COLOR } from "./recipes/conversation_view/feed_item_row/feed_item_row_constants.js";
123
- import { default as default78 } from "./recipes/conversation_view/message_input/message_input.vue.js";
124
- import { default as default79 } from "./recipes/conversation_view/time_pill/time_pill.vue.js";
125
- import { default as default80 } from "./recipes/header/settings_menu_button/settings_menu_button.vue.js";
126
- import { default as default81 } from "./recipes/item_layout/contact_info/contact_info.vue.js";
127
- import { default as default82 } from "./recipes/leftbar/callbox/callbox.vue.js";
124
+ import { default as default79 } from "./recipes/conversation_view/message_input/message_input.vue.js";
125
+ import { default as default80 } from "./recipes/conversation_view/time_pill/time_pill.vue.js";
126
+ import { default as default81 } from "./recipes/header/settings_menu_button/settings_menu_button.vue.js";
127
+ import { default as default82 } from "./recipes/item_layout/contact_info/contact_info.vue.js";
128
+ import { default as default83 } from "./recipes/leftbar/callbox/callbox.vue.js";
128
129
  import { CALLBOX_BADGE_COLORS, CALLBOX_BORDER_COLORS } from "./recipes/leftbar/callbox/callbox_constants.js";
129
- import { default as default83 } from "./recipes/leftbar/contact_centers_row/contact_centers_row.vue.js";
130
- import { default as default84 } from "./recipes/leftbar/contact_row/contact_row.vue.js";
131
- import { default as default85 } from "./recipes/leftbar/general_row/general_row.vue.js";
130
+ import { default as default84 } from "./recipes/leftbar/contact_centers_row/contact_centers_row.vue.js";
131
+ import { default as default85 } from "./recipes/leftbar/contact_row/contact_row.vue.js";
132
+ import { default as default86 } from "./recipes/leftbar/general_row/general_row.vue.js";
132
133
  import { LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS, LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR, LEFTBAR_GENERAL_ROW_ICON_SIZES, LEFTBAR_GENERAL_ROW_TYPES } from "./recipes/leftbar/general_row/general_row_constants.js";
133
- import { default as default86 } from "./recipes/leftbar/group_row/group_row.vue.js";
134
- import { default as default87 } from "./recipes/leftbar/unread_pill/unread_pill.vue.js";
134
+ import { default as default87 } from "./recipes/leftbar/group_row/group_row.vue.js";
135
+ import { default as default88 } from "./recipes/leftbar/unread_pill/unread_pill.vue.js";
135
136
  import { UNREAD_PILL_DIRECTIONS, UNREAD_PILL_KINDS } from "./recipes/leftbar/unread_pill/unread_pill_constants.js";
136
- import { default as default88 } from "./recipes/notices/top_banner_info/top_banner_info.vue.js";
137
+ import { default as default89 } from "./recipes/notices/top_banner_info/top_banner_info.vue.js";
137
138
  import { COLOR_CODES } from "./recipes/notices/top_banner_info/top_banner_info_constants.js";
138
139
  export {
139
140
  ARROW_KEYS,
@@ -223,28 +224,29 @@ export {
223
224
  default44 as DtPresence,
224
225
  default45 as DtRadio,
225
226
  default46 as DtRadioGroup,
226
- default73 as DtRecipeAttachmentCarousel,
227
+ default74 as DtRecipeAttachmentCarousel,
227
228
  default67 as DtRecipeCallbarButton,
229
+ default69 as DtRecipeCallbarButtonWithDropdown,
228
230
  default68 as DtRecipeCallbarButtonWithPopover,
229
- default82 as DtRecipeCallbox,
230
- default71 as DtRecipeComboboxMultiSelect,
231
- default72 as DtRecipeComboboxWithPopover,
232
- default83 as DtRecipeContactCentersRow,
233
- default81 as DtRecipeContactInfo,
234
- default84 as DtRecipeContactRow,
235
- default75 as DtRecipeEmojiRow,
236
- default76 as DtRecipeFeedItemPill,
237
- default77 as DtRecipeFeedItemRow,
238
- default85 as DtRecipeGeneralRow,
239
- default86 as DtRecipeGroupRow,
240
- default70 as DtRecipeGroupedChip,
241
- default69 as DtRecipeIvrNode,
242
- default78 as DtRecipeMessageInput,
243
- default80 as DtRecipeSettingsMenuButton,
244
- default79 as DtRecipeTimePill,
245
- default88 as DtRecipeTopBannerInfo,
246
- default87 as DtRecipeUnreadPill,
247
- default74 as DtRecipeWysiwygEditor,
231
+ default83 as DtRecipeCallbox,
232
+ default72 as DtRecipeComboboxMultiSelect,
233
+ default73 as DtRecipeComboboxWithPopover,
234
+ default84 as DtRecipeContactCentersRow,
235
+ default82 as DtRecipeContactInfo,
236
+ default85 as DtRecipeContactRow,
237
+ default76 as DtRecipeEmojiRow,
238
+ default77 as DtRecipeFeedItemPill,
239
+ default78 as DtRecipeFeedItemRow,
240
+ default86 as DtRecipeGeneralRow,
241
+ default87 as DtRecipeGroupRow,
242
+ default71 as DtRecipeGroupedChip,
243
+ default70 as DtRecipeIvrNode,
244
+ default79 as DtRecipeMessageInput,
245
+ default81 as DtRecipeSettingsMenuButton,
246
+ default80 as DtRecipeTimePill,
247
+ default89 as DtRecipeTopBannerInfo,
248
+ default88 as DtRecipeUnreadPill,
249
+ default75 as DtRecipeWysiwygEditor,
248
250
  default47 as DtRichTextEditor,
249
251
  default48 as DtRootLayout,
250
252
  default66 as DtScrollbarDirective,
@@ -1 +1 @@
1
- {"version":3,"file":"dialtone-vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"dialtone-vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const callbar_button_with_dropdown = require("../recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.cjs");
4
+ exports.DtRecipeCallbarButtonWithDropdown = callbar_button_with_dropdown.default;
5
+ //# sourceMappingURL=callbar-button-with-dropdown.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"callbar-button-with-dropdown.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -0,0 +1,5 @@
1
+ import { default as default2 } from "../recipes/buttons/callbar_button_with_dropdown/callbar_button_with_dropdown.vue.js";
2
+ export {
3
+ default2 as DtRecipeCallbarButtonWithDropdown
4
+ };
5
+ //# sourceMappingURL=callbar-button-with-dropdown.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"callbar-button-with-dropdown.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -122,6 +122,14 @@ const _sfc_main = {
122
122
  tooltipText: {
123
123
  type: String,
124
124
  default: void 0
125
+ },
126
+ /**
127
+ * Whether there is a delay before the tooltip shows on hover/focus.
128
+ * @values true, false
129
+ */
130
+ tooltipDelay: {
131
+ type: Boolean,
132
+ default: void 0
125
133
  }
126
134
  },
127
135
  emits: [
@@ -182,6 +190,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
182
190
  return vue.openBlock(), vue.createBlock(_component_dt_tooltip, {
183
191
  id: $props.id,
184
192
  inverted: $props.invertedTooltip,
193
+ delay: $props.tooltipDelay,
185
194
  show: $props.showTooltip,
186
195
  offset: [0, 24]
187
196
  }, {
@@ -215,7 +224,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
215
224
  ])
216
225
  ]),
217
226
  _: 3
218
- }, 8, ["id", "inverted", "show"]);
227
+ }, 8, ["id", "inverted", "delay", "show"]);
219
228
  }
220
229
  const DtRecipeCallbarButton = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render]]);
221
230
  exports.default = DtRecipeCallbarButton;
@@ -1 +1 @@
1
- {"version":3,"file":"callbar_button.vue.cjs","sources":["../../../../recipes/buttons/callbar_button/callbar_button.vue"],"sourcesContent":["<template>\n <dt-tooltip\n :id=\"id\"\n :inverted=\"invertedTooltip\"\n :show=\"showTooltip\"\n :offset=\"[0, 24]\"\n >\n <template #anchor>\n <span\n :class=\"{ 'd-recipe-callbar-button--disabled': disabled }\"\n >\n <dt-button\n :importance=\"buttonImportance\"\n kind=\"muted\"\n icon-position=\"top\"\n :aria-disabled=\"disabled\"\n :aria-label=\"ariaLabel\"\n :label-class=\"callbarButtonTextClass\"\n :width=\"buttonWidth\"\n :class=\"callbarButtonClass\"\n v-bind=\"$attrs\"\n v-on=\"callbarButtonListeners\"\n >\n <slot />\n <template #icon>\n <slot name=\"icon\" />\n </template>\n </dt-button>\n </span>\n </template>\n <slot name=\"tooltip\">\n {{ tooltipText }}\n </slot>\n </dt-tooltip>\n</template>\n\n<script>\nimport { CALLBAR_BUTTON_VALID_WIDTH_SIZE } from './callbar_button_constants';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport utils, { extractVueListeners } from '@/common/utils';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtRecipeCallbarButton',\n\n components: { DtButton, DtTooltip },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Id for the item.\n */\n id: {\n type: String,\n default () {\n return utils.getUniqueString();\n },\n },\n\n /**\n * Determines whether the button should have active styling\n * default is false.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n active: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Determines whether the button should have danger styling\n * default is false.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n danger: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Determines whether the button should be disabled\n * default is false.\n * @values true, false\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Whether the button is a circle or not.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n circle: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Aria label for the button. If empty, it takes its value from the default slot.\n */\n ariaLabel: {\n type: String,\n default: null,\n validator: (label) => {\n return label || this.$slots.default;\n },\n },\n\n /**\n * Additional class name for the button wrapper element.\n */\n buttonClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the button text.\n */\n textClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /*\n * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.\n */\n buttonWidthSize: {\n type: String,\n default: 'xl',\n validator: size => CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(size),\n },\n\n /**\n * The fill and outline of the button associated with its visual importance.\n * @values clear, outlined, primary\n */\n importance: {\n type: String,\n default: '',\n },\n\n /**\n * Whether the tooltip has an inverted background color.\n * @values true, false\n */\n invertedTooltip: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Use this if you would like to manually override the logic for when the tooltip shows.\n * Otherwise it will just show on hover/focus.\n * @values null, true, false\n */\n showTooltip: {\n type: Boolean,\n default: null,\n },\n\n /**\n * The message that displays in the tooltip. This will be overridden by the tooltip slot.\n */\n tooltipText: {\n type: String,\n default: undefined,\n },\n\n },\n\n emits: [\n /**\n * Native click event\n *\n * @event click\n * @type {PointerEvent | KeyboardEvent}\n */\n 'click',\n ],\n\n computed: {\n callbarButtonClass () {\n return [\n this.buttonClass,\n 'd-recipe-callbar-button',\n {\n 'd-recipe-callbar-button--circle': this.circle,\n 'd-recipe-callbar-button--active': this.active,\n 'd-recipe-callbar-button--danger': this.danger,\n 'd-btn--disabled': this.disabled,\n }];\n },\n\n callbarButtonTextClass () {\n return [\n 'd-recipe-callbar-button__text',\n this.textClass,\n ];\n },\n\n buttonWidth () {\n switch (this.buttonWidthSize) {\n case 'sm':\n return '4.5rem';\n case 'md':\n return '6rem';\n default:\n return '8.4rem';\n }\n },\n\n buttonImportance () {\n if (this.importance) {\n return this.importance;\n }\n return this.circle ? 'outlined' : 'clear';\n },\n\n callbarButtonListeners () {\n return {\n ...extractVueListeners(this.$attrs),\n click: (event) => this.$emit('click', event),\n };\n },\n },\n};\n</script>\n"],"names":["DtButton","DtTooltip","utils","this","CALLBAR_BUTTON_VALID_WIDTH_SIZE","extractVueListeners","_createBlock","_createElementVNode","_normalizeClass","_createVNode","_mergeProps","_toHandlers","_renderSlot","_withCtx","_createTextVNode","_toDisplayString"],"mappings":"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"}
1
+ {"version":3,"file":"callbar_button.vue.cjs","sources":["../../../../recipes/buttons/callbar_button/callbar_button.vue"],"sourcesContent":["<template>\n <dt-tooltip\n :id=\"id\"\n :inverted=\"invertedTooltip\"\n :delay=\"tooltipDelay\"\n :show=\"showTooltip\"\n :offset=\"[0, 24]\"\n >\n <template #anchor>\n <span\n :class=\"{ 'd-recipe-callbar-button--disabled': disabled }\"\n >\n <dt-button\n :importance=\"buttonImportance\"\n kind=\"muted\"\n icon-position=\"top\"\n :aria-disabled=\"disabled\"\n :aria-label=\"ariaLabel\"\n :label-class=\"callbarButtonTextClass\"\n :width=\"buttonWidth\"\n :class=\"callbarButtonClass\"\n v-bind=\"$attrs\"\n v-on=\"callbarButtonListeners\"\n >\n <slot />\n <template #icon>\n <slot name=\"icon\" />\n </template>\n </dt-button>\n </span>\n </template>\n <slot name=\"tooltip\">\n {{ tooltipText }}\n </slot>\n </dt-tooltip>\n</template>\n\n<script>\nimport { CALLBAR_BUTTON_VALID_WIDTH_SIZE } from './callbar_button_constants';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport utils, { extractVueListeners } from '@/common/utils';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtRecipeCallbarButton',\n\n components: { DtButton, DtTooltip },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Id for the item.\n */\n id: {\n type: String,\n default () {\n return utils.getUniqueString();\n },\n },\n\n /**\n * Determines whether the button should have active styling\n * default is false.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n active: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Determines whether the button should have danger styling\n * default is false.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n danger: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Determines whether the button should be disabled\n * default is false.\n * @values true, false\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Whether the button is a circle or not.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n circle: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Aria label for the button. If empty, it takes its value from the default slot.\n */\n ariaLabel: {\n type: String,\n default: null,\n validator: (label) => {\n return label || this.$slots.default;\n },\n },\n\n /**\n * Additional class name for the button wrapper element.\n */\n buttonClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the button text.\n */\n textClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /*\n * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.\n */\n buttonWidthSize: {\n type: String,\n default: 'xl',\n validator: size => CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(size),\n },\n\n /**\n * The fill and outline of the button associated with its visual importance.\n * @values clear, outlined, primary\n */\n importance: {\n type: String,\n default: '',\n },\n\n /**\n * Whether the tooltip has an inverted background color.\n * @values true, false\n */\n invertedTooltip: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Use this if you would like to manually override the logic for when the tooltip shows.\n * Otherwise it will just show on hover/focus.\n * @values null, true, false\n */\n showTooltip: {\n type: Boolean,\n default: null,\n },\n\n /**\n * The message that displays in the tooltip. This will be overridden by the tooltip slot.\n */\n tooltipText: {\n type: String,\n default: undefined,\n },\n\n /**\n * Whether there is a delay before the tooltip shows on hover/focus.\n * @values true, false\n */\n tooltipDelay: {\n type: Boolean,\n default: undefined,\n },\n },\n\n emits: [\n /**\n * Native click event\n *\n * @event click\n * @type {PointerEvent | KeyboardEvent}\n */\n 'click',\n ],\n\n computed: {\n callbarButtonClass () {\n return [\n this.buttonClass,\n 'd-recipe-callbar-button',\n {\n 'd-recipe-callbar-button--circle': this.circle,\n 'd-recipe-callbar-button--active': this.active,\n 'd-recipe-callbar-button--danger': this.danger,\n 'd-btn--disabled': this.disabled,\n }];\n },\n\n callbarButtonTextClass () {\n return [\n 'd-recipe-callbar-button__text',\n this.textClass,\n ];\n },\n\n buttonWidth () {\n switch (this.buttonWidthSize) {\n case 'sm':\n return '4.5rem';\n case 'md':\n return '6rem';\n default:\n return '8.4rem';\n }\n },\n\n buttonImportance () {\n if (this.importance) {\n return this.importance;\n }\n return this.circle ? 'outlined' : 'clear';\n },\n\n callbarButtonListeners () {\n return {\n ...extractVueListeners(this.$attrs),\n click: (event) => this.$emit('click', event),\n };\n },\n },\n};\n</script>\n"],"names":["DtButton","DtTooltip","utils","this","CALLBAR_BUTTON_VALID_WIDTH_SIZE","extractVueListeners","_createBlock","_createElementVNode","_normalizeClass","_createVNode","_mergeProps","_toHandlers","_renderSlot","_withCtx","_createTextVNode","_toDisplayString"],"mappings":";;;;;;;;AA2CA,MAAK,YAAU;AAAA,EACb,cAAc,EAAE,MAAM,EAAG;AAAA,EACzB,MAAM;AAAA,EAEN,YAAY,EAAA,UAAEA,OAAQ,SAAA,WAAEC,gBAAW;AAAA,EAEnC,cAAc;AAAA,EAEd,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,IAAI;AAAA,MACF,MAAM;AAAA,MACN,UAAW;AACT,eAAOC,aAAAA,QAAM;MACd;AAAA,IACF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAU;AACpB,eAAO,SAASC,SAAK,OAAO;AAAA,MAC7B;AAAA,IACF;AAAA;AAAA;AAAA;AAAA,IAKD,aAAa;AAAA,MACX,MAAM,CAAC,QAAQ,OAAO,MAAM;AAAA,MAC5B,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,IAKD,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,UAAQC,yDAAgC,SAAS,IAAI;AAAA,IACjE;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,cAAc;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOL;AAAA,EACD;AAAA,EAED,UAAU;AAAA,IACR,qBAAsB;AACpB,aAAO;AAAA,QACL,KAAK;AAAA,QACL;AAAA,QACA;AAAA,UACE,mCAAmC,KAAK;AAAA,UACxC,mCAAmC,KAAK;AAAA,UACxC,mCAAmC,KAAK;AAAA,UACxC,mBAAmB,KAAK;AAAA,QAC1B;AAAA,MAAC;AAAA,IACJ;AAAA,IAED,yBAA0B;AACxB,aAAO;AAAA,QACL;AAAA,QACA,KAAK;AAAA;IAER;AAAA,IAED,cAAe;AACb,cAAQ,KAAK,iBAAe;AAAA,QAC1B,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT;AACE,iBAAO;AAAA,MACX;AAAA,IACD;AAAA,IAED,mBAAoB;AAClB,UAAI,KAAK,YAAY;AACnB,eAAO,KAAK;AAAA,MACd;AACA,aAAO,KAAK,SAAS,aAAa;AAAA,IACnC;AAAA,IAED,yBAA0B;AACxB,aAAO;AAAA,QACL,GAAGC,aAAmB,oBAAC,KAAK,MAAM;AAAA,QAClC,OAAO,CAAC,UAAU,KAAK,MAAM,SAAS,KAAK;AAAA;IAE9C;AAAA,EACF;AACH;;;;0BAhPEC,IAiCa,YAAA,uBAAA;AAAA,IAhCV,IAAI,OAAE;AAAA,IACN,UAAU,OAAe;AAAA,IACzB,OAAO,OAAY;AAAA,IACnB,MAAM,OAAW;AAAA,IACjB,QAAQ,CAAO,GAAA,EAAA;AAAA;IAEL,oBACT,MAoBO;AAAA,MApBPC,IAAAA,mBAoBO,QAAA;AAAA,QAnBJ,OAVTC,IAAAA,sDAUuD,OAAQ,SAAA,CAAA;AAAA;QAEvDC,IAAA,YAgBY,sBAhBZC,eAgBY;AAAA,UAfT,YAAY,SAAgB;AAAA,UAC7B,MAAK;AAAA,UACL,iBAAc;AAAA,UACb,iBAAe,OAAQ;AAAA,UACvB,cAAY,OAAS;AAAA,UACrB,eAAa,SAAsB;AAAA,UACnC,OAAO,SAAW;AAAA,UAClB,OAAO,SAAkB;AAAA,WAClB,KAAM,QACdC,IAAAA,WAAM,SAAsB,sBAAA,CAAA,GAAA;AAAA,UAGjB,kBACT,MAAoB;AAAA,YAApBC,eAAoB,KAAA,QAAA,MAAA;AAAA;UA1BhC,SAAAC,IAAA,QAwBU,MAAQ;AAAA,YAARD,eAAQ,KAAA,QAAA,SAAA;AAAA;UAxBlB,GAAA;AAAA;;;IAAA,SAAAC,IAAA,QA+BI,MAEO;AAAA,MAFPD,IAAAA,WAEO,4BAFP,MAEO;AAAA,QAjCXE,IAAAA,gBAAAC,IAAAA,gBAgCS,OAAW,WAAA,GAAA,CAAA;AAAA;;IAhCpB,GAAA;AAAA;;;;"}
@@ -120,6 +120,14 @@ const _sfc_main = {
120
120
  tooltipText: {
121
121
  type: String,
122
122
  default: void 0
123
+ },
124
+ /**
125
+ * Whether there is a delay before the tooltip shows on hover/focus.
126
+ * @values true, false
127
+ */
128
+ tooltipDelay: {
129
+ type: Boolean,
130
+ default: void 0
123
131
  }
124
132
  },
125
133
  emits: [
@@ -180,6 +188,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
180
188
  return openBlock(), createBlock(_component_dt_tooltip, {
181
189
  id: $props.id,
182
190
  inverted: $props.invertedTooltip,
191
+ delay: $props.tooltipDelay,
183
192
  show: $props.showTooltip,
184
193
  offset: [0, 24]
185
194
  }, {
@@ -213,7 +222,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
213
222
  ])
214
223
  ]),
215
224
  _: 3
216
- }, 8, ["id", "inverted", "show"]);
225
+ }, 8, ["id", "inverted", "delay", "show"]);
217
226
  }
218
227
  const DtRecipeCallbarButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
219
228
  export {
@@ -1 +1 @@
1
- {"version":3,"file":"callbar_button.vue.js","sources":["../../../../recipes/buttons/callbar_button/callbar_button.vue"],"sourcesContent":["<template>\n <dt-tooltip\n :id=\"id\"\n :inverted=\"invertedTooltip\"\n :show=\"showTooltip\"\n :offset=\"[0, 24]\"\n >\n <template #anchor>\n <span\n :class=\"{ 'd-recipe-callbar-button--disabled': disabled }\"\n >\n <dt-button\n :importance=\"buttonImportance\"\n kind=\"muted\"\n icon-position=\"top\"\n :aria-disabled=\"disabled\"\n :aria-label=\"ariaLabel\"\n :label-class=\"callbarButtonTextClass\"\n :width=\"buttonWidth\"\n :class=\"callbarButtonClass\"\n v-bind=\"$attrs\"\n v-on=\"callbarButtonListeners\"\n >\n <slot />\n <template #icon>\n <slot name=\"icon\" />\n </template>\n </dt-button>\n </span>\n </template>\n <slot name=\"tooltip\">\n {{ tooltipText }}\n </slot>\n </dt-tooltip>\n</template>\n\n<script>\nimport { CALLBAR_BUTTON_VALID_WIDTH_SIZE } from './callbar_button_constants';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport utils, { extractVueListeners } from '@/common/utils';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtRecipeCallbarButton',\n\n components: { DtButton, DtTooltip },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Id for the item.\n */\n id: {\n type: String,\n default () {\n return utils.getUniqueString();\n },\n },\n\n /**\n * Determines whether the button should have active styling\n * default is false.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n active: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Determines whether the button should have danger styling\n * default is false.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n danger: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Determines whether the button should be disabled\n * default is false.\n * @values true, false\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Whether the button is a circle or not.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n circle: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Aria label for the button. If empty, it takes its value from the default slot.\n */\n ariaLabel: {\n type: String,\n default: null,\n validator: (label) => {\n return label || this.$slots.default;\n },\n },\n\n /**\n * Additional class name for the button wrapper element.\n */\n buttonClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the button text.\n */\n textClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /*\n * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.\n */\n buttonWidthSize: {\n type: String,\n default: 'xl',\n validator: size => CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(size),\n },\n\n /**\n * The fill and outline of the button associated with its visual importance.\n * @values clear, outlined, primary\n */\n importance: {\n type: String,\n default: '',\n },\n\n /**\n * Whether the tooltip has an inverted background color.\n * @values true, false\n */\n invertedTooltip: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Use this if you would like to manually override the logic for when the tooltip shows.\n * Otherwise it will just show on hover/focus.\n * @values null, true, false\n */\n showTooltip: {\n type: Boolean,\n default: null,\n },\n\n /**\n * The message that displays in the tooltip. This will be overridden by the tooltip slot.\n */\n tooltipText: {\n type: String,\n default: undefined,\n },\n\n },\n\n emits: [\n /**\n * Native click event\n *\n * @event click\n * @type {PointerEvent | KeyboardEvent}\n */\n 'click',\n ],\n\n computed: {\n callbarButtonClass () {\n return [\n this.buttonClass,\n 'd-recipe-callbar-button',\n {\n 'd-recipe-callbar-button--circle': this.circle,\n 'd-recipe-callbar-button--active': this.active,\n 'd-recipe-callbar-button--danger': this.danger,\n 'd-btn--disabled': this.disabled,\n }];\n },\n\n callbarButtonTextClass () {\n return [\n 'd-recipe-callbar-button__text',\n this.textClass,\n ];\n },\n\n buttonWidth () {\n switch (this.buttonWidthSize) {\n case 'sm':\n return '4.5rem';\n case 'md':\n return '6rem';\n default:\n return '8.4rem';\n }\n },\n\n buttonImportance () {\n if (this.importance) {\n return this.importance;\n }\n return this.circle ? 'outlined' : 'clear';\n },\n\n callbarButtonListeners () {\n return {\n ...extractVueListeners(this.$attrs),\n click: (event) => this.$emit('click', event),\n };\n },\n },\n};\n</script>\n"],"names":["this","_createBlock","_createElementVNode","_normalizeClass","_createVNode","_mergeProps","_toHandlers","_renderSlot","_withCtx","_createTextVNode","_toDisplayString"],"mappings":";;;;;;AA0CA,MAAK,YAAU;AAAA,EACb,cAAc,EAAE,MAAM,EAAG;AAAA,EACzB,MAAM;AAAA,EAEN,YAAY,EAAE,UAAU,UAAW;AAAA,EAEnC,cAAc;AAAA,EAEd,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,IAAI;AAAA,MACF,MAAM;AAAA,MACN,UAAW;AACT,eAAO,MAAM;MACd;AAAA,IACF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,CAAC,UAAU;AACpB,eAAO,SAASA,SAAK,OAAO;AAAA,MAC7B;AAAA,IACF;AAAA;AAAA;AAAA;AAAA,IAKD,aAAa;AAAA,MACX,MAAM,CAAC,QAAQ,OAAO,MAAM;AAAA,MAC5B,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,IAKD,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,UAAQ,gCAAgC,SAAS,IAAI;AAAA,IACjE;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EAEF;AAAA,EAED,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOL;AAAA,EACD;AAAA,EAED,UAAU;AAAA,IACR,qBAAsB;AACpB,aAAO;AAAA,QACL,KAAK;AAAA,QACL;AAAA,QACA;AAAA,UACE,mCAAmC,KAAK;AAAA,UACxC,mCAAmC,KAAK;AAAA,UACxC,mCAAmC,KAAK;AAAA,UACxC,mBAAmB,KAAK;AAAA,QAC1B;AAAA,MAAC;AAAA,IACJ;AAAA,IAED,yBAA0B;AACxB,aAAO;AAAA,QACL;AAAA,QACA,KAAK;AAAA;IAER;AAAA,IAED,cAAe;AACb,cAAQ,KAAK,iBAAe;AAAA,QAC1B,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT;AACE,iBAAO;AAAA,MACX;AAAA,IACD;AAAA,IAED,mBAAoB;AAClB,UAAI,KAAK,YAAY;AACnB,eAAO,KAAK;AAAA,MACd;AACA,aAAO,KAAK,SAAS,aAAa;AAAA,IACnC;AAAA,IAED,yBAA0B;AACxB,aAAO;AAAA,QACL,GAAG,oBAAoB,KAAK,MAAM;AAAA,QAClC,OAAO,CAAC,UAAU,KAAK,MAAM,SAAS,KAAK;AAAA;IAE9C;AAAA,EACF;AACH;;;;sBAvOEC,YAgCa,uBAAA;AAAA,IA/BV,IAAI,OAAE;AAAA,IACN,UAAU,OAAe;AAAA,IACzB,MAAM,OAAW;AAAA,IACjB,QAAQ,CAAO,GAAA,EAAA;AAAA;IAEL,gBACT,MAoBO;AAAA,MApBPC,mBAoBO,QAAA;AAAA,QAnBJ,OATTC,sDASuD,OAAQ,SAAA,CAAA;AAAA;QAEvDC,YAgBY,sBAhBZC,WAgBY;AAAA,UAfT,YAAY,SAAgB;AAAA,UAC7B,MAAK;AAAA,UACL,iBAAc;AAAA,UACb,iBAAe,OAAQ;AAAA,UACvB,cAAY,OAAS;AAAA,UACrB,eAAa,SAAsB;AAAA,UACnC,OAAO,SAAW;AAAA,UAClB,OAAO,SAAkB;AAAA,WAClB,KAAM,QACdC,WAAM,SAAsB,sBAAA,CAAA,GAAA;AAAA,UAGjB,cACT,MAAoB;AAAA,YAApBC,WAAoB,KAAA,QAAA,MAAA;AAAA;UAzBhC,SAAAC,QAuBU,MAAQ;AAAA,YAARD,WAAQ,KAAA,QAAA,SAAA;AAAA;UAvBlB,GAAA;AAAA;;;IAAA,SAAAC,QA8BI,MAEO;AAAA,MAFPD,WAEO,4BAFP,MAEO;AAAA,QAhCXE,gBAAAC,gBA+BS,OAAW,WAAA,GAAA,CAAA;AAAA;;IA/BpB,GAAA;AAAA;;;"}
1
+ {"version":3,"file":"callbar_button.vue.js","sources":["../../../../recipes/buttons/callbar_button/callbar_button.vue"],"sourcesContent":["<template>\n <dt-tooltip\n :id=\"id\"\n :inverted=\"invertedTooltip\"\n :delay=\"tooltipDelay\"\n :show=\"showTooltip\"\n :offset=\"[0, 24]\"\n >\n <template #anchor>\n <span\n :class=\"{ 'd-recipe-callbar-button--disabled': disabled }\"\n >\n <dt-button\n :importance=\"buttonImportance\"\n kind=\"muted\"\n icon-position=\"top\"\n :aria-disabled=\"disabled\"\n :aria-label=\"ariaLabel\"\n :label-class=\"callbarButtonTextClass\"\n :width=\"buttonWidth\"\n :class=\"callbarButtonClass\"\n v-bind=\"$attrs\"\n v-on=\"callbarButtonListeners\"\n >\n <slot />\n <template #icon>\n <slot name=\"icon\" />\n </template>\n </dt-button>\n </span>\n </template>\n <slot name=\"tooltip\">\n {{ tooltipText }}\n </slot>\n </dt-tooltip>\n</template>\n\n<script>\nimport { CALLBAR_BUTTON_VALID_WIDTH_SIZE } from './callbar_button_constants';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport utils, { extractVueListeners } from '@/common/utils';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtRecipeCallbarButton',\n\n components: { DtButton, DtTooltip },\n\n inheritAttrs: false,\n\n props: {\n /**\n * Id for the item.\n */\n id: {\n type: String,\n default () {\n return utils.getUniqueString();\n },\n },\n\n /**\n * Determines whether the button should have active styling\n * default is false.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n active: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Determines whether the button should have danger styling\n * default is false.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n danger: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Determines whether the button should be disabled\n * default is false.\n * @values true, false\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Whether the button is a circle or not.\n * @values true, false\n * @see https://dialtone.dialpad.com/components/button/\n */\n circle: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Aria label for the button. If empty, it takes its value from the default slot.\n */\n ariaLabel: {\n type: String,\n default: null,\n validator: (label) => {\n return label || this.$slots.default;\n },\n },\n\n /**\n * Additional class name for the button wrapper element.\n */\n buttonClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the button text.\n */\n textClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /*\n * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.\n */\n buttonWidthSize: {\n type: String,\n default: 'xl',\n validator: size => CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(size),\n },\n\n /**\n * The fill and outline of the button associated with its visual importance.\n * @values clear, outlined, primary\n */\n importance: {\n type: String,\n default: '',\n },\n\n /**\n * Whether the tooltip has an inverted background color.\n * @values true, false\n */\n invertedTooltip: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Use this if you would like to manually override the logic for when the tooltip shows.\n * Otherwise it will just show on hover/focus.\n * @values null, true, false\n */\n showTooltip: {\n type: Boolean,\n default: null,\n },\n\n /**\n * The message that displays in the tooltip. This will be overridden by the tooltip slot.\n */\n tooltipText: {\n type: String,\n default: undefined,\n },\n\n /**\n * Whether there is a delay before the tooltip shows on hover/focus.\n * @values true, false\n */\n tooltipDelay: {\n type: Boolean,\n default: undefined,\n },\n },\n\n emits: [\n /**\n * Native click event\n *\n * @event click\n * @type {PointerEvent | KeyboardEvent}\n */\n 'click',\n ],\n\n computed: {\n callbarButtonClass () {\n return [\n this.buttonClass,\n 'd-recipe-callbar-button',\n {\n 'd-recipe-callbar-button--circle': this.circle,\n 'd-recipe-callbar-button--active': this.active,\n 'd-recipe-callbar-button--danger': this.danger,\n 'd-btn--disabled': this.disabled,\n }];\n },\n\n callbarButtonTextClass () {\n return [\n 'd-recipe-callbar-button__text',\n this.textClass,\n ];\n },\n\n buttonWidth () {\n switch (this.buttonWidthSize) {\n case 'sm':\n return '4.5rem';\n case 'md':\n return '6rem';\n default:\n return '8.4rem';\n }\n },\n\n buttonImportance () {\n if (this.importance) {\n return this.importance;\n }\n return this.circle ? 'outlined' : 'clear';\n },\n\n callbarButtonListeners () {\n return {\n ...extractVueListeners(this.$attrs),\n click: (event) => this.$emit('click', event),\n };\n },\n },\n};\n</script>\n"],"names":["this","_createBlock","_createElementVNode","_normalizeClass","_createVNode","_mergeProps","_toHandlers","_renderSlot","_withCtx","_createTextVNode","_toDisplayString"],"mappings":"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"}
@@ -0,0 +1,321 @@
1
+ "use strict";
2
+ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
3
+ const vue3 = require("@dialpad/dialtone-icons/vue3");
4
+ const common_utils = require("../../../common/utils.cjs");
5
+ const vue = require("vue");
6
+ const _pluginVue_exportHelper = require("../../../_virtual/_plugin-vue_export-helper.cjs");
7
+ const callbar_button = require("../callbar_button/callbar_button.vue.cjs");
8
+ const dropdown = require("../../../components/dropdown/dropdown.vue.cjs");
9
+ const button = require("../../../components/button/button.vue.cjs");
10
+ const callbar_button_constants = require("../callbar_button/callbar_button_constants.cjs");
11
+ const _sfc_main = {
12
+ name: "DtRecipeCallbarButtonWithDropdown",
13
+ components: { DtRecipeCallbarButton: callbar_button.default, DtDropdown: dropdown.default, DtButton: button.default, DtIconChevronUp: vue3.DtIconChevronUp },
14
+ /* inheritAttrs: false is generally an option we want to set on library
15
+ components. This allows any attributes passed in that are not recognized
16
+ as props to be passed down to another element or component using v-bind:$attrs
17
+ more info: https://vuejs.org/v2/api/#inheritAttrs */
18
+ inheritAttrs: false,
19
+ props: {
20
+ /**
21
+ * Id for the item.
22
+ */
23
+ id: {
24
+ type: String,
25
+ default() {
26
+ return common_utils.default.getUniqueString();
27
+ }
28
+ },
29
+ /**
30
+ * Aria label for the button. If empty, it takes its value from the default slot.
31
+ */
32
+ ariaLabel: {
33
+ type: String,
34
+ default: null,
35
+ validator: (label) => {
36
+ return label || (void 0).$slots.default;
37
+ }
38
+ },
39
+ /**
40
+ * Aria label for the arrow. Cannot be empty.
41
+ */
42
+ arrowButtonLabel: {
43
+ type: String,
44
+ required: true,
45
+ validator: (label) => {
46
+ return !!label;
47
+ }
48
+ },
49
+ /**
50
+ * The direction the dropdown displays relative to the anchor.
51
+ * @values 'bottom', 'bottom-start', 'bottom-end',
52
+ * 'right', 'right-start', 'right-end',
53
+ * 'left', 'left-start', 'left-end',
54
+ * 'top', 'top-start', 'top-end'
55
+ * @default 'top'
56
+ */
57
+ placement: {
58
+ type: String,
59
+ default: "top"
60
+ },
61
+ /**
62
+ * If the dropdown does not fit in the direction described by "placement",
63
+ * it will attempt to change it's direction to the "fallbackPlacements".
64
+ *
65
+ * @values top, top-start, top-end,
66
+ * right, right-start, right-end,
67
+ * left, left-start, left-end,
68
+ * bottom, bottom-start, bottom-end,
69
+ * auto, auto-start, auto-end
70
+ * */
71
+ fallbackPlacements: {
72
+ type: Array,
73
+ default: () => {
74
+ return ["auto"];
75
+ }
76
+ },
77
+ /**
78
+ * Determines whether the button should be disabled
79
+ * default is false.
80
+ * @values true, false
81
+ */
82
+ disabled: {
83
+ type: Boolean,
84
+ default: false
85
+ },
86
+ /**
87
+ * Forces showing the arrow, even if the button is disabled.
88
+ * default is false
89
+ * @values true, false
90
+ */
91
+ forceShowArrow: {
92
+ type: Boolean,
93
+ default: false
94
+ },
95
+ /**
96
+ * Determines whether the button should have active styling
97
+ * default is false.
98
+ * @values true, false
99
+ * @see https://dialtone.dialpad.com/components/button/
100
+ */
101
+ active: {
102
+ type: Boolean,
103
+ default: false
104
+ },
105
+ /**
106
+ * Determines whether the button should have danger styling
107
+ * default is false.
108
+ * @values true, false
109
+ * @see https://dialtone.dialpad.com/components/button/
110
+ */
111
+ danger: {
112
+ type: Boolean,
113
+ default: false
114
+ },
115
+ /**
116
+ * We need this declaration because of how Vue3 informs the component about a listener.
117
+ * Spoiler alert: it doesn't.
118
+ * Vue3 intends to work as a real pub-sub, meaning the publisher has not a clue of who the subscribers are.
119
+ * This makes it impossible from the regular declaration (emits: ['click']) to check whether
120
+ * we actually have a click handler or not.
121
+ * We're hacking it by adding an onClick prop: https://github.com/vuejs/core/issues/5220
122
+ */
123
+ /* eslint-disable-next-line vue/no-unused-properties */
124
+ onClick: {
125
+ type: Function,
126
+ default: null
127
+ },
128
+ /**
129
+ * Additional class name for the button wrapper element.
130
+ */
131
+ buttonClass: {
132
+ type: [String, Array, Object],
133
+ default: ""
134
+ },
135
+ /**
136
+ * Additional class name for the button text.
137
+ */
138
+ textClass: {
139
+ type: [String, Array, Object],
140
+ default: ""
141
+ },
142
+ /*
143
+ * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.
144
+ */
145
+ buttonWidthSize: {
146
+ type: String,
147
+ default: "xl",
148
+ validator: (size) => callbar_button_constants.CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(size)
149
+ },
150
+ /**
151
+ * Whether the tooltip has an inverted background color.
152
+ * @values true, false
153
+ */
154
+ invertedTooltip: {
155
+ type: Boolean,
156
+ default: false
157
+ },
158
+ /**
159
+ * Use this if you would like to manually override the logic for when the tooltip shows.
160
+ * Otherwise it will just show on hover/focus.
161
+ * @values null, true, false
162
+ */
163
+ showTooltip: {
164
+ type: Boolean,
165
+ default: null
166
+ },
167
+ /**
168
+ * The message that displays in the tooltip. This will be overridden by the tooltip slot.
169
+ */
170
+ tooltipText: {
171
+ type: String,
172
+ default: void 0
173
+ },
174
+ /**
175
+ * Whether there is a delay before the tooltip shows on hover/focus.
176
+ * @values true, false
177
+ */
178
+ tooltipDelay: {
179
+ type: Boolean,
180
+ default: void 0
181
+ }
182
+ },
183
+ emits: [
184
+ /**
185
+ * Emitted when the arrow is clicked
186
+ */
187
+ "arrow-click",
188
+ /**
189
+ * Native click event
190
+ *
191
+ * @event click
192
+ * @type {PointerEvent | KeyboardEvent}
193
+ */
194
+ "click",
195
+ /**
196
+ * Emitted when modal dropdown is opened or closed.
197
+ */
198
+ "opened"
199
+ ],
200
+ data() {
201
+ return {
202
+ open: false
203
+ };
204
+ },
205
+ computed: {
206
+ showArrowButton() {
207
+ return this.forceShowArrow || !this.disabled;
208
+ },
209
+ isCompactMode() {
210
+ return this.buttonWidthSize === "sm" || this.buttonWidthSize === "md";
211
+ },
212
+ showDropdown() {
213
+ if (!this.openDropdown || this.open) {
214
+ this.syncOpenState();
215
+ return false;
216
+ }
217
+ return this.toggleOpen();
218
+ }
219
+ },
220
+ mounted() {
221
+ common_utils.warnIfUnmounted(this.$el, this.$options.name);
222
+ },
223
+ methods: {
224
+ arrowClick(ev) {
225
+ this.$emit("arrow-click", ev);
226
+ return this.toggleOpen();
227
+ },
228
+ toggleOpen() {
229
+ return this.open = !this.open;
230
+ },
231
+ syncOpenState() {
232
+ this.open = this.openDropdown;
233
+ },
234
+ buttonClick(ev) {
235
+ if (!this.$props.onClick) {
236
+ this.arrowClick(ev);
237
+ } else {
238
+ this.$emit("click", ev);
239
+ }
240
+ },
241
+ onModalIsOpened(isOpened) {
242
+ this.open = isOpened;
243
+ this.$emit("opened", isOpened);
244
+ }
245
+ }
246
+ };
247
+ const _hoisted_1 = { class: "dt-recipe--callbar-button-with-dropdown" };
248
+ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
249
+ const _component_dt_recipe_callbar_button = vue.resolveComponent("dt-recipe-callbar-button");
250
+ const _component_dt_icon_chevron_up = vue.resolveComponent("dt-icon-chevron-up");
251
+ const _component_dt_button = vue.resolveComponent("dt-button");
252
+ const _component_dt_dropdown = vue.resolveComponent("dt-dropdown");
253
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
254
+ vue.createVNode(_component_dt_recipe_callbar_button, {
255
+ "aria-label": $props.ariaLabel,
256
+ disabled: $props.disabled,
257
+ active: $props.active,
258
+ danger: $props.danger,
259
+ "button-class": $props.buttonClass,
260
+ "button-width-size": $props.buttonWidthSize,
261
+ "text-class": $props.textClass,
262
+ "inverted-tooltip": $props.invertedTooltip,
263
+ "show-tooltip": $props.showTooltip,
264
+ "tooltip-text": $props.tooltipText,
265
+ "tooltip-delay": $props.tooltipDelay,
266
+ class: "dt-recipe--callbar-button-with-dropdown--main-button",
267
+ onClick: $options.buttonClick
268
+ }, {
269
+ icon: vue.withCtx(() => [
270
+ vue.renderSlot(_ctx.$slots, "icon")
271
+ ]),
272
+ tooltip: vue.withCtx(() => [
273
+ vue.renderSlot(_ctx.$slots, "tooltip")
274
+ ]),
275
+ default: vue.withCtx(() => [
276
+ vue.renderSlot(_ctx.$slots, "default")
277
+ ]),
278
+ _: 3
279
+ }, 8, ["aria-label", "disabled", "active", "danger", "button-class", "button-width-size", "text-class", "inverted-tooltip", "show-tooltip", "tooltip-text", "tooltip-delay", "onClick"]),
280
+ $options.showArrowButton ? (vue.openBlock(), vue.createBlock(_component_dt_dropdown, vue.mergeProps({
281
+ key: 0,
282
+ id: $props.id,
283
+ open: $data.open,
284
+ placement: $props.placement,
285
+ "fallback-placements": $props.fallbackPlacements,
286
+ padding: "none",
287
+ class: "dt-recipe--callbar-button-with-dropdown--dropdown-wrapper"
288
+ }, _ctx.$attrs, { onOpened: $options.onModalIsOpened }), {
289
+ anchor: vue.withCtx(() => [
290
+ vue.createVNode(_component_dt_button, {
291
+ circle: "",
292
+ importance: "clear",
293
+ size: "lg",
294
+ class: vue.normalizeClass([
295
+ "dt-recipe--callbar-button-with-dropdown--arrow",
296
+ { "dt-recipe--callbar-button-with-dropdown--arrow--large": !$options.isCompactMode }
297
+ ]),
298
+ width: "2rem",
299
+ "aria-label": $props.arrowButtonLabel,
300
+ active: $data.open,
301
+ onClick: $options.arrowClick
302
+ }, {
303
+ icon: vue.withCtx(() => [
304
+ vue.createVNode(_component_dt_icon_chevron_up, {
305
+ class: "dt-recipe--callbar-button-with-dropdown--arrow__icon",
306
+ size: "200"
307
+ })
308
+ ]),
309
+ _: 1
310
+ }, 8, ["class", "aria-label", "active", "onClick"])
311
+ ]),
312
+ list: vue.withCtx(() => [
313
+ vue.renderSlot(_ctx.$slots, "list")
314
+ ]),
315
+ _: 3
316
+ }, 16, ["id", "open", "placement", "fallback-placements", "onOpened"])) : vue.createCommentVNode("", true)
317
+ ]);
318
+ }
319
+ const callbar_button_with_dropdown = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render]]);
320
+ exports.default = callbar_button_with_dropdown;
321
+ //# sourceMappingURL=callbar_button_with_dropdown.vue.cjs.map