@dialpad/dialtone 9.83.2 → 9.84.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 (76) hide show
  1. package/dist/css/dialtone-default-theme.css +24 -24
  2. package/dist/css/dialtone-default-theme.min.css +1 -1
  3. package/dist/css/dialtone.css +24 -24
  4. package/dist/css/dialtone.min.css +1 -1
  5. package/dist/tokens/doc.json +11963 -11963
  6. package/dist/vue2/common/emoji.cjs +6 -0
  7. package/dist/vue2/common/emoji.cjs.map +1 -1
  8. package/dist/vue2/common/emoji.js +6 -0
  9. package/dist/vue2/common/emoji.js.map +1 -1
  10. package/dist/vue2/components/emoji_picker/emoji_picker.vue.cjs.map +1 -1
  11. package/dist/vue2/components/emoji_picker/emoji_picker.vue.js.map +1 -1
  12. package/dist/vue2/components/emoji_picker/modules/emoji_search.vue.cjs +2 -2
  13. package/dist/vue2/components/emoji_picker/modules/emoji_search.vue.cjs.map +1 -1
  14. package/dist/vue2/components/emoji_picker/modules/emoji_search.vue.js +3 -3
  15. package/dist/vue2/components/emoji_picker/modules/emoji_search.vue.js.map +1 -1
  16. package/dist/vue2/components/emoji_text_wrapper/emoji_text_wrapper.vue.cjs +7 -5
  17. package/dist/vue2/components/emoji_text_wrapper/emoji_text_wrapper.vue.cjs.map +1 -1
  18. package/dist/vue2/components/emoji_text_wrapper/emoji_text_wrapper.vue.js +8 -6
  19. package/dist/vue2/components/emoji_text_wrapper/emoji_text_wrapper.vue.js.map +1 -1
  20. package/dist/vue2/components/keyboard_shortcut/keyboard_shortcut.vue.cjs.map +1 -1
  21. package/dist/vue2/components/keyboard_shortcut/keyboard_shortcut.vue.js.map +1 -1
  22. package/dist/vue2/dialtone-vue.cjs +1 -0
  23. package/dist/vue2/dialtone-vue.cjs.map +1 -1
  24. package/dist/vue2/dialtone-vue.js +2 -1
  25. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.cjs.map +1 -1
  26. package/dist/vue2/recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue.js.map +1 -1
  27. package/dist/vue2/recipes/leftbar/general_row/leftbar_general_row_icon.vue.cjs.map +1 -1
  28. package/dist/vue2/recipes/leftbar/general_row/leftbar_general_row_icon.vue.js.map +1 -1
  29. package/dist/vue2/style.css +1 -1
  30. package/dist/vue2/types/common/emoji/index.d.ts +1 -0
  31. package/dist/vue2/types/common/emoji/index.d.ts.map +1 -1
  32. package/dist/vue2/types/components/emoji_picker/emoji_picker.vue.d.ts.map +1 -1
  33. package/dist/vue2/types/components/emoji_text_wrapper/emoji_text_wrapper.vue.d.ts.map +1 -1
  34. package/dist/vue3/common/emoji.cjs +6 -0
  35. package/dist/vue3/common/emoji.cjs.map +1 -1
  36. package/dist/vue3/common/emoji.js +6 -0
  37. package/dist/vue3/common/emoji.js.map +1 -1
  38. package/dist/vue3/component-documentation.json +1 -1
  39. package/dist/vue3/components/emoji_picker/emoji_picker.vue.cjs.map +1 -1
  40. package/dist/vue3/components/emoji_picker/emoji_picker.vue.js.map +1 -1
  41. package/dist/vue3/components/emoji_picker/modules/emoji_search.vue.cjs +2 -3
  42. package/dist/vue3/components/emoji_picker/modules/emoji_search.vue.cjs.map +1 -1
  43. package/dist/vue3/components/emoji_picker/modules/emoji_search.vue.js +4 -5
  44. package/dist/vue3/components/emoji_picker/modules/emoji_search.vue.js.map +1 -1
  45. package/dist/vue3/components/emoji_text_wrapper/emoji_text_wrapper.vue.cjs +7 -5
  46. package/dist/vue3/components/emoji_text_wrapper/emoji_text_wrapper.vue.cjs.map +1 -1
  47. package/dist/vue3/components/emoji_text_wrapper/emoji_text_wrapper.vue.js +8 -6
  48. package/dist/vue3/components/emoji_text_wrapper/emoji_text_wrapper.vue.js.map +1 -1
  49. package/dist/vue3/components/illustration/illustration.vue.cjs +4 -2
  50. package/dist/vue3/components/illustration/illustration.vue.cjs.map +1 -1
  51. package/dist/vue3/components/illustration/illustration.vue.js +4 -2
  52. package/dist/vue3/components/illustration/illustration.vue.js.map +1 -1
  53. package/dist/vue3/components/item_layout/item_layout.vue.cjs +4 -1
  54. package/dist/vue3/components/item_layout/item_layout.vue.cjs.map +1 -1
  55. package/dist/vue3/components/item_layout/item_layout.vue.js +4 -1
  56. package/dist/vue3/components/item_layout/item_layout.vue.js.map +1 -1
  57. package/dist/vue3/components/keyboard_shortcut/keyboard_shortcut.vue.cjs.map +1 -1
  58. package/dist/vue3/components/keyboard_shortcut/keyboard_shortcut.vue.js.map +1 -1
  59. package/dist/vue3/dialtone-vue.cjs +1 -0
  60. package/dist/vue3/dialtone-vue.cjs.map +1 -1
  61. package/dist/vue3/dialtone-vue.js +2 -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.map +1 -1
  64. package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.cjs +1 -1
  65. package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.cjs.map +1 -1
  66. package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.js +1 -1
  67. package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.js.map +1 -1
  68. package/dist/vue3/recipes/leftbar/general_row/leftbar_general_row_icon.vue.cjs.map +1 -1
  69. package/dist/vue3/recipes/leftbar/general_row/leftbar_general_row_icon.vue.js.map +1 -1
  70. package/dist/vue3/style.css +9 -9
  71. package/dist/vue3/types/common/emoji/index.d.ts +1 -0
  72. package/dist/vue3/types/common/emoji/index.d.ts.map +1 -1
  73. package/dist/vue3/types/components/emoji_picker/emoji_picker.vue.d.ts.map +1 -1
  74. package/dist/vue3/types/components/emoji_text_wrapper/emoji_text_wrapper.vue.d.ts.map +1 -1
  75. package/dist/vue3/types/components/item_layout/item_layout.vue.d.ts.map +1 -1
  76. package/package.json +7 -5
@@ -1 +1 @@
1
- {"version":3,"file":"callbar_button_with_popover.vue.cjs","sources":["../../../../recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue"],"sourcesContent":["<template>\n <div\n class=\"dt-recipe--callbar-button-with-popover\"\n >\n <dt-recipe-callbar-button\n :aria-label=\"ariaLabel\"\n :disabled=\"disabled\"\n :active=\"active\"\n :danger=\"danger\"\n :button-class=\"buttonClass\"\n :button-width-size=\"buttonWidthSize\"\n :text-class=\"textClass\"\n class=\"dt-recipe--callbar-button-with-popover--main-button\"\n @click=\"buttonClick\"\n >\n <template #icon>\n <slot name=\"icon\" />\n </template>\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n <slot />\n </dt-recipe-callbar-button>\n <dt-popover\n v-if=\"showArrowButton\"\n :id=\"id\"\n :modal=\"false\"\n :open=\"open\"\n :placement=\"placement\"\n :initial-focus-element=\"initialFocusElement\"\n :show-close-button=\"showCloseButton\"\n :offset=\"offset\"\n padding=\"none\"\n class=\"dt-recipe--callbar-button-with-popover--popover-wrapper\"\n :dialog-class=\"['dt-recipe--callbar-button-with-popover--popover', contentClass]\"\n header-class=\"d-d-flex d-ai-center d-fw-normal d-px12\"\n v-bind=\"$attrs\"\n :open-popover=\"showPopover\"\n @opened=\"onModalIsOpened\"\n >\n <template #anchor>\n <dt-button\n circle\n importance=\"clear\"\n size=\"lg\"\n :class=\"['dt-recipe--callbar-button-with-popover--arrow',\n { 'dt-recipe--callbar-button-with-popover--arrow--large': !isCompactMode }]\"\n width=\"2rem\"\n :aria-label=\"arrowButtonLabel\"\n :active=\"open\"\n @click=\"arrowClick\"\n >\n <template #icon>\n <dt-icon-chevron-up\n class=\"dt-recipe--callbar-button-with-popover--arrow__icon\"\n size=\"200\"\n />\n </template>\n </dt-button>\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n </div>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtPopover } from '@/components/popover';\nimport { DtIconChevronUp } from '@dialpad/dialtone-icons/vue3';\nimport { DtRecipeCallbarButton, CALLBAR_BUTTON_VALID_WIDTH_SIZE } from '../callbar_button';\nimport utils, { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n name: 'DtRecipeCallbarButtonWithPopover',\n\n components: { DtRecipeCallbarButton, DtPopover, DtButton, DtIconChevronUp },\n\n /* inheritAttrs: false is generally an option we want to set on library\n components. This allows any attributes passed in that are not recognized\n as props to be passed down to another element or component using v-bind:$attrs\n more info: https://vuejs.org/v2/api/#inheritAttrs */\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 * 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 * Aria label for the arrow. Cannot be empty.\n */\n arrowButtonLabel: {\n type: String,\n required: true,\n validator: (label) => {\n return !!label;\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @values 'bottom', 'bottom-start', 'bottom-end',\n * 'right', 'right-start', 'right-end',\n * 'left', 'left-start', 'left-end',\n * 'top', 'top-start', 'top-end'\n * @default 'top'\n */\n placement: {\n type: String,\n default: 'top',\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * <a\n * class=\"d-link\"\n * href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n * target=\"_blank\"\n * >\n * Tippy.js docs\n * </a>\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The element that is focused when the popover is opened. This can be an\n * HTMLElement within the popover, a string starting with '#' which will\n * find the element by ID. 'first' which will automatically focus\n * the first element, or 'dialog' which will focus the dialog window itself.\n * If the dialog is modal this prop cannot be 'none'.\n */\n initialFocusElement: {\n type: String,\n default: 'first',\n },\n\n /**\n * Determines visibility for close button\n */\n showCloseButton: {\n type: Boolean,\n default: true,\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 * Forces showing the arrow, even if the button is disabled.\n * default is false\n * @values true, false\n */\n forceShowArrow: {\n type: Boolean,\n default: false,\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 * We need this declaration because of how Vue3 informs the component about a listener.\n * Spoiler alert: it doesn't.\n * Vue3 intends to work as a real pub-sub, meaning the publisher has not a clue of who the subscribers are.\n * This makes it impossible from the regular declaration (emits: ['click']) to check whether\n * we actually have a click handler or not.\n * We're hacking it by adding an onClick prop: https://github.com/vuejs/core/issues/5220\n */\n /* eslint-disable-next-line vue/no-unused-properties */\n onClick: {\n type: Function,\n default: null,\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 * Additional class name for the popover content wrapper element.\n */\n contentClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * To auto open the modal popover.\n */\n openPopover: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n /**\n * Emitted when the arrow is clicked\n */\n 'arrow-click',\n\n /**\n * Native click event\n *\n * @event click\n * @type {PointerEvent | KeyboardEvent}\n */\n 'click',\n\n /**\n * Emitted when modal popover is opened or closed.\n */\n 'opened',\n ],\n\n data () {\n return {\n open: false,\n };\n },\n\n computed: {\n showArrowButton () {\n return this.forceShowArrow || !this.disabled;\n },\n\n isCompactMode () {\n return this.buttonWidthSize === 'sm' || this.buttonWidthSize === 'md';\n },\n\n showPopover () {\n if (!this.openPopover || this.open) {\n this.syncOpenState();\n return false;\n }\n\n return this.toggleOpen();\n },\n },\n\n mounted () {\n warnIfUnmounted(this.$el, this.$options.name);\n },\n\n methods: {\n arrowClick (ev) {\n this.$emit('arrow-click', ev);\n return this.toggleOpen();\n },\n\n toggleOpen () {\n return (this.open = !this.open);\n },\n\n syncOpenState () {\n this.open = this.openPopover;\n },\n\n buttonClick (ev) {\n // If no listener for the click event, the button click opens the popover\n // the same as if the arrow was clicked.\n if (!this.$props.onClick) {\n this.arrowClick(ev);\n } else {\n this.$emit('click', ev);\n }\n },\n\n onModalIsOpened (isOpened) {\n this.open = isOpened;\n this.$emit('opened', isOpened);\n },\n },\n\n};\n</script>\n\n<style lang=\"less\">\n.dt-recipe--callbar-button-with-popover--arrow {\n margin-top: var(--dt-space-450);\n margin-left: calc(var(--dt-space-300-negative) * 5);\n width: var(--dt-size-500);\n height: var(--dt-size-500);\n padding: var(--dt-space-400);\n border-radius: var(--dt-size-300);\n\n &.d-btn--active {\n background: var(--dt-color-surface-moderate-opaque);\n }\n\n &--large {\n margin-left: var(--dt-space-550-negative);\n }\n\n &__icon {\n color: var(--dt-color-black-800);\n }\n}\n\n.dt-recipe--callbar-button-with-popover--popover {\n .d-popover__header {\n background: var(--dt-color-surface-contrast);\n color: var(--dt-color-foreground-primary-inverted);\n\n .d-btn {\n color: var(--dt-color-foreground-primary-inverted);\n }\n }\n}\n\n.dt-recipe--callbar-button-with-popover--button .d-tab--selected::after,\n.dt-recipe--callbar-button-with-popover--button .d-tab--selected:hover::after {\n --tab--bgc: var(--dt-color-surface-contrast);\n}\n.dt-recipe--callbar-button-with-popover--button .tab-group {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.dt-recipe--callbar-button-with-popover--button .tab-content {\n flex: 1 1 100%;\n overflow-y: auto;\n}\n\n.dt-recipe--callbar-button-with-popover {\n display: flex;\n align-items: start;\n}\n</style>\n"],"names":["DtRecipeCallbarButton","DtPopover","DtButton","DtIconChevronUp","utils","this","CALLBAR_BUTTON_VALID_WIDTH_SIZE","warnIfUnmounted","_openBlock","_createElementBlock","_createVNode","_renderSlot","_withCtx","_createBlock","_mergeProps","_normalizeClass","_createCommentVNode"],"mappings":";;;;;;;;;;;AAgFA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EAEN,YAAY,EAAA,uBAAEA,eAAqB,SAAA,WAAEC,iBAAWC,UAAAA,OAAAA,SAAUC,iBAAAA,KAAAA,gBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,EAM3E,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,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,kBAAkB;AAAA,MAChB,MAAM;AAAA,MACN,UAAU;AAAA,MACV,WAAW,CAAC,UAAU;AACpB,eAAO,CAAC,CAAC;AAAA,MACV;AAAA,IACF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUD,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAaD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS,MAAM,CAAC,GAAG,EAAE;AAAA,IACtB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASD,qBAAqB;AAAA,MACnB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,iBAAiB;AAAA,MACf,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,gBAAgB;AAAA,MACd,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;AAAA,IAQD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWD,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACV;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,IAKD,cAAc;AAAA,MACZ,MAAM,CAAC,QAAQ,OAAO,MAAM;AAAA,MAC5B,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA;AAAA;AAAA;AAAA;AAAA,IAKA;AAAA,EACD;AAAA,EAED,OAAQ;AACN,WAAO;AAAA,MACL,MAAM;AAAA;EAET;AAAA,EAED,UAAU;AAAA,IACR,kBAAmB;AACjB,aAAO,KAAK,kBAAkB,CAAC,KAAK;AAAA,IACrC;AAAA,IAED,gBAAiB;AACf,aAAO,KAAK,oBAAoB,QAAQ,KAAK,oBAAoB;AAAA,IAClE;AAAA,IAED,cAAe;AACb,UAAI,CAAC,KAAK,eAAe,KAAK,MAAM;AAClC,aAAK,cAAa;AAClB,eAAO;AAAA,MACT;AAEA,aAAO,KAAK;IACb;AAAA,EACF;AAAA,EAED,UAAW;AACTC,iBAAe,gBAAC,KAAK,KAAK,KAAK,SAAS,IAAI;AAAA,EAC7C;AAAA,EAED,SAAS;AAAA,IACP,WAAY,IAAI;AACd,WAAK,MAAM,eAAe,EAAE;AAC5B,aAAO,KAAK;IACb;AAAA,IAED,aAAc;AACZ,aAAQ,KAAK,OAAO,CAAC,KAAK;AAAA,IAC3B;AAAA,IAED,gBAAiB;AACf,WAAK,OAAO,KAAK;AAAA,IAClB;AAAA,IAED,YAAa,IAAI;AAGf,UAAI,CAAC,KAAK,OAAO,SAAS;AACxB,aAAK,WAAW,EAAE;AAAA,aACb;AACL,aAAK,MAAM,SAAS,EAAE;AAAA,MACxB;AAAA,IACD;AAAA,IAED,gBAAiB,UAAU;AACzB,WAAK,OAAO;AACZ,WAAK,MAAM,UAAU,QAAQ;AAAA,IAC9B;AAAA,EACF;AAEH;AA5VI,MAAA,aAAA,EAAA,OAAM,yCAAwC;;;;;;AADhD,SAAAC,cAAA,GAAAC,uBAqEM,OArEN,YAqEM;AAAA,IAlEJC,IAAAA,YAkB2B,qCAAA;AAAA,MAjBxB,cAAY,OAAS;AAAA,MACrB,UAAU,OAAQ;AAAA,MAClB,QAAQ,OAAM;AAAA,MACd,QAAQ,OAAM;AAAA,MACd,gBAAc,OAAW;AAAA,MACzB,qBAAmB,OAAe;AAAA,MAClC,cAAY,OAAS;AAAA,MACtB,OAAM;AAAA,MACL,SAAO,SAAW;AAAA;MAER,kBACT,MAAoB;AAAA,QAApBC,eAAoB,KAAA,QAAA,MAAA;AAAA;MAEX,qBACT,MAAuB;AAAA,QAAvBA,eAAuB,KAAA,QAAA,SAAA;AAAA;MAnB/B,SAAAC,IAAA,QAqBM,MAAQ;AAAA,QAARD,eAAQ,KAAA,QAAA,SAAA;AAAA;MArBd,GAAA;AAAA;IAwBY,SAAe,mBADvBH,IAAAA,aAAAK,IAAAA,YA8Ca,uBA9CbC,eA8Ca;AAAA,MArEjB,KAAA;AAAA,MAyBO,IAAI,OAAE;AAAA,MACN,OAAO;AAAA,MACP,MAAM,MAAI;AAAA,MACV,WAAW,OAAS;AAAA,MACpB,yBAAuB,OAAmB;AAAA,MAC1C,qBAAmB,OAAe;AAAA,MAClC,QAAQ,OAAM;AAAA,MACf,SAAQ;AAAA,MACR,OAAM;AAAA,MACL,oEAAkE,OAAY,YAAA;AAAA,MAC/E,gBAAa;AAAA,OACL,KAAM,QAAA;AAAA,MACb,gBAAc,SAAW;AAAA,MACzB,UAAQ,SAAe;AAAA;MAEb,oBACT,MAiBY;AAAA,QAjBZJ,IAAAA,YAiBY,sBAAA;AAAA,UAhBV,QAAA;AAAA,UACA,YAAW;AAAA,UACX,MAAK;AAAA,UACJ,OA7CXK,IAAA,eAAA;AAAA,YAAA;AAAA,uEA6CkJ,SAAa,cAAA;AAAA,UAAA,CAAA;AAAA,UAErJ,OAAM;AAAA,UACL,cAAY,OAAgB;AAAA,UAC5B,QAAQ,MAAI;AAAA,UACZ,SAAO,SAAU;AAAA;UAEP,kBACT,MAGE;AAAA,YAHFL,IAAAA,YAGE,+BAAA;AAAA,cAFA,OAAM;AAAA,cACN,MAAK;AAAA;;UAvDnB,GAAA;AAAA;;MA4DiB,qBACT,MAAuB;AAAA,QAAvBC,eAAuB,KAAA,QAAA,SAAA;AAAA;MAEd,2BACT,MAA6B;AAAA,QAA7BA,eAA6B,KAAA,QAAA,eAAA;AAAA;MAEpB,2BACT,MAA6B;AAAA,QAA7BA,eAA6B,KAAA,QAAA,eAAA;AAAA;MAnErC,GAAA;AAAA,+IAAAK,IAAA,mBAAA,IAAA,IAAA;AAAA;;;;"}
1
+ {"version":3,"file":"callbar_button_with_popover.vue.cjs","sources":["../../../../recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue"],"sourcesContent":["<template>\n <div\n class=\"dt-recipe--callbar-button-with-popover\"\n >\n <dt-recipe-callbar-button\n :aria-label=\"ariaLabel\"\n :disabled=\"disabled\"\n :active=\"active\"\n :danger=\"danger\"\n :button-class=\"buttonClass\"\n :button-width-size=\"buttonWidthSize\"\n :text-class=\"textClass\"\n class=\"dt-recipe--callbar-button-with-popover--main-button\"\n @click=\"buttonClick\"\n >\n <template #icon>\n <slot name=\"icon\" />\n </template>\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n <slot />\n </dt-recipe-callbar-button>\n <dt-popover\n v-if=\"showArrowButton\"\n :id=\"id\"\n :modal=\"false\"\n :open=\"open\"\n :placement=\"placement\"\n :initial-focus-element=\"initialFocusElement\"\n :show-close-button=\"showCloseButton\"\n :offset=\"offset\"\n padding=\"none\"\n class=\"dt-recipe--callbar-button-with-popover--popover-wrapper\"\n :dialog-class=\"['dt-recipe--callbar-button-with-popover--popover', contentClass]\"\n header-class=\"d-d-flex d-ai-center d-fw-normal d-px12\"\n v-bind=\"$attrs\"\n :open-popover=\"showPopover\"\n @opened=\"onModalIsOpened\"\n >\n <template #anchor>\n <dt-button\n circle\n importance=\"clear\"\n size=\"lg\"\n :class=\"['dt-recipe--callbar-button-with-popover--arrow',\n { 'dt-recipe--callbar-button-with-popover--arrow--large': !isCompactMode }]\"\n width=\"2rem\"\n :aria-label=\"arrowButtonLabel\"\n :active=\"open\"\n @click=\"arrowClick\"\n >\n <template #icon>\n <dt-icon-chevron-up\n class=\"dt-recipe--callbar-button-with-popover--arrow__icon\"\n size=\"200\"\n />\n </template>\n </dt-button>\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n </div>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtPopover } from '@/components/popover';\nimport { DtIconChevronUp } from '@dialpad/dialtone-icons/vue3';\nimport { DtRecipeCallbarButton, CALLBAR_BUTTON_VALID_WIDTH_SIZE } from '../callbar_button';\nimport utils, { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n name: 'DtRecipeCallbarButtonWithPopover',\n\n components: { DtRecipeCallbarButton, DtPopover, DtButton, DtIconChevronUp },\n\n /* inheritAttrs: false is generally an option we want to set on library\n components. This allows any attributes passed in that are not recognized\n as props to be passed down to another element or component using v-bind:$attrs\n more info: https://vuejs.org/v2/api/#inheritAttrs */\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 * 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 * Aria label for the arrow. Cannot be empty.\n */\n arrowButtonLabel: {\n type: String,\n required: true,\n validator: (label) => {\n return !!label;\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @values 'bottom', 'bottom-start', 'bottom-end',\n * 'right', 'right-start', 'right-end',\n * 'left', 'left-start', 'left-end',\n * 'top', 'top-start', 'top-end'\n * @default 'top'\n */\n placement: {\n type: String,\n default: 'top',\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * <a\n * class=\"d-link\"\n * href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n * target=\"_blank\"\n * >\n * Tippy.js docs\n * </a>\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The element that is focused when the popover is opened. This can be an\n * HTMLElement within the popover, a string starting with '#' which will\n * find the element by ID. 'first' which will automatically focus\n * the first element, or 'dialog' which will focus the dialog window itself.\n * If the dialog is modal this prop cannot be 'none'.\n */\n initialFocusElement: {\n type: String,\n default: 'first',\n },\n\n /**\n * Determines visibility for close button\n */\n showCloseButton: {\n type: Boolean,\n default: true,\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 * Forces showing the arrow, even if the button is disabled.\n * default is false\n * @values true, false\n */\n forceShowArrow: {\n type: Boolean,\n default: false,\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 * We need this declaration because of how Vue3 informs the component about a listener.\n * Spoiler alert: it doesn't.\n * Vue3 intends to work as a real pub-sub, meaning the publisher has not a clue of who the subscribers are.\n * This makes it impossible from the regular declaration (emits: ['click']) to check whether\n * we actually have a click handler or not.\n * We're hacking it by adding an onClick prop: https://github.com/vuejs/core/issues/5220\n */\n /* eslint-disable-next-line vue/no-unused-properties */\n onClick: {\n type: Function,\n default: null,\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 * Additional class name for the popover content wrapper element.\n */\n contentClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * To auto open the modal popover.\n */\n openPopover: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n /**\n * Emitted when the arrow is clicked\n */\n 'arrow-click',\n\n /**\n * Native click event\n *\n * @event click\n * @type {PointerEvent | KeyboardEvent}\n */\n 'click',\n\n /**\n * Emitted when modal popover is opened or closed.\n */\n 'opened',\n ],\n\n data () {\n return {\n open: false,\n };\n },\n\n computed: {\n showArrowButton () {\n return this.forceShowArrow || !this.disabled;\n },\n\n isCompactMode () {\n return this.buttonWidthSize === 'sm' || this.buttonWidthSize === 'md';\n },\n\n showPopover () {\n if (!this.openPopover || this.open) {\n this.syncOpenState();\n return false;\n }\n\n return this.toggleOpen();\n },\n },\n\n mounted () {\n warnIfUnmounted(this.$el, this.$options.name);\n },\n\n methods: {\n arrowClick (ev) {\n this.$emit('arrow-click', ev);\n return this.toggleOpen();\n },\n\n toggleOpen () {\n return (this.open = !this.open);\n },\n\n syncOpenState () {\n this.open = this.openPopover;\n },\n\n buttonClick (ev) {\n // If no listener for the click event, the button click opens the popover\n // the same as if the arrow was clicked.\n if (!this.$props.onClick) {\n this.arrowClick(ev);\n } else {\n this.$emit('click', ev);\n }\n },\n\n onModalIsOpened (isOpened) {\n this.open = isOpened;\n this.$emit('opened', isOpened);\n },\n },\n\n};\n</script>\n\n<style lang=\"less\">\n.dt-recipe--callbar-button-with-popover--arrow {\n margin-top: var(--dt-space-450);\n margin-left: calc(var(--dt-space-300-negative) * 5);\n width: var(--dt-size-500);\n height: var(--dt-size-500);\n padding: var(--dt-space-400);\n border-radius: var(--dt-size-300);\n\n &.d-btn--active {\n background: var(--dt-color-surface-moderate-opaque);\n }\n\n &--large {\n margin-left: var(--dt-space-550-negative);\n }\n\n &__icon {\n color: var(--dt-color-black-800);\n }\n}\n\n.dt-recipe--callbar-button-with-popover--popover {\n .d-popover__header {\n background: var(--dt-color-surface-contrast);\n color: var(--dt-color-foreground-primary-inverted);\n\n .d-btn {\n color: var(--dt-color-foreground-primary-inverted);\n }\n }\n}\n\n.dt-recipe--callbar-button-with-popover--button .d-tab--selected::after,\n.dt-recipe--callbar-button-with-popover--button .d-tab--selected:hover::after {\n --tab--bgc: var(--dt-color-surface-contrast);\n}\n.dt-recipe--callbar-button-with-popover--button .tab-group {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.dt-recipe--callbar-button-with-popover--button .tab-content {\n flex: 1 1 100%;\n overflow-y: auto;\n}\n\n.dt-recipe--callbar-button-with-popover {\n display: flex;\n align-items: flex-start;\n}\n</style>\n"],"names":["DtRecipeCallbarButton","DtPopover","DtButton","DtIconChevronUp","utils","this","CALLBAR_BUTTON_VALID_WIDTH_SIZE","warnIfUnmounted","_openBlock","_createElementBlock","_createVNode","_renderSlot","_withCtx","_createBlock","_mergeProps","_normalizeClass","_createCommentVNode"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"callbar_button_with_popover.vue.js","sources":["../../../../recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue"],"sourcesContent":["<template>\n <div\n class=\"dt-recipe--callbar-button-with-popover\"\n >\n <dt-recipe-callbar-button\n :aria-label=\"ariaLabel\"\n :disabled=\"disabled\"\n :active=\"active\"\n :danger=\"danger\"\n :button-class=\"buttonClass\"\n :button-width-size=\"buttonWidthSize\"\n :text-class=\"textClass\"\n class=\"dt-recipe--callbar-button-with-popover--main-button\"\n @click=\"buttonClick\"\n >\n <template #icon>\n <slot name=\"icon\" />\n </template>\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n <slot />\n </dt-recipe-callbar-button>\n <dt-popover\n v-if=\"showArrowButton\"\n :id=\"id\"\n :modal=\"false\"\n :open=\"open\"\n :placement=\"placement\"\n :initial-focus-element=\"initialFocusElement\"\n :show-close-button=\"showCloseButton\"\n :offset=\"offset\"\n padding=\"none\"\n class=\"dt-recipe--callbar-button-with-popover--popover-wrapper\"\n :dialog-class=\"['dt-recipe--callbar-button-with-popover--popover', contentClass]\"\n header-class=\"d-d-flex d-ai-center d-fw-normal d-px12\"\n v-bind=\"$attrs\"\n :open-popover=\"showPopover\"\n @opened=\"onModalIsOpened\"\n >\n <template #anchor>\n <dt-button\n circle\n importance=\"clear\"\n size=\"lg\"\n :class=\"['dt-recipe--callbar-button-with-popover--arrow',\n { 'dt-recipe--callbar-button-with-popover--arrow--large': !isCompactMode }]\"\n width=\"2rem\"\n :aria-label=\"arrowButtonLabel\"\n :active=\"open\"\n @click=\"arrowClick\"\n >\n <template #icon>\n <dt-icon-chevron-up\n class=\"dt-recipe--callbar-button-with-popover--arrow__icon\"\n size=\"200\"\n />\n </template>\n </dt-button>\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n </div>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtPopover } from '@/components/popover';\nimport { DtIconChevronUp } from '@dialpad/dialtone-icons/vue3';\nimport { DtRecipeCallbarButton, CALLBAR_BUTTON_VALID_WIDTH_SIZE } from '../callbar_button';\nimport utils, { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n name: 'DtRecipeCallbarButtonWithPopover',\n\n components: { DtRecipeCallbarButton, DtPopover, DtButton, DtIconChevronUp },\n\n /* inheritAttrs: false is generally an option we want to set on library\n components. This allows any attributes passed in that are not recognized\n as props to be passed down to another element or component using v-bind:$attrs\n more info: https://vuejs.org/v2/api/#inheritAttrs */\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 * 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 * Aria label for the arrow. Cannot be empty.\n */\n arrowButtonLabel: {\n type: String,\n required: true,\n validator: (label) => {\n return !!label;\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @values 'bottom', 'bottom-start', 'bottom-end',\n * 'right', 'right-start', 'right-end',\n * 'left', 'left-start', 'left-end',\n * 'top', 'top-start', 'top-end'\n * @default 'top'\n */\n placement: {\n type: String,\n default: 'top',\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * <a\n * class=\"d-link\"\n * href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n * target=\"_blank\"\n * >\n * Tippy.js docs\n * </a>\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The element that is focused when the popover is opened. This can be an\n * HTMLElement within the popover, a string starting with '#' which will\n * find the element by ID. 'first' which will automatically focus\n * the first element, or 'dialog' which will focus the dialog window itself.\n * If the dialog is modal this prop cannot be 'none'.\n */\n initialFocusElement: {\n type: String,\n default: 'first',\n },\n\n /**\n * Determines visibility for close button\n */\n showCloseButton: {\n type: Boolean,\n default: true,\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 * Forces showing the arrow, even if the button is disabled.\n * default is false\n * @values true, false\n */\n forceShowArrow: {\n type: Boolean,\n default: false,\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 * We need this declaration because of how Vue3 informs the component about a listener.\n * Spoiler alert: it doesn't.\n * Vue3 intends to work as a real pub-sub, meaning the publisher has not a clue of who the subscribers are.\n * This makes it impossible from the regular declaration (emits: ['click']) to check whether\n * we actually have a click handler or not.\n * We're hacking it by adding an onClick prop: https://github.com/vuejs/core/issues/5220\n */\n /* eslint-disable-next-line vue/no-unused-properties */\n onClick: {\n type: Function,\n default: null,\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 * Additional class name for the popover content wrapper element.\n */\n contentClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * To auto open the modal popover.\n */\n openPopover: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n /**\n * Emitted when the arrow is clicked\n */\n 'arrow-click',\n\n /**\n * Native click event\n *\n * @event click\n * @type {PointerEvent | KeyboardEvent}\n */\n 'click',\n\n /**\n * Emitted when modal popover is opened or closed.\n */\n 'opened',\n ],\n\n data () {\n return {\n open: false,\n };\n },\n\n computed: {\n showArrowButton () {\n return this.forceShowArrow || !this.disabled;\n },\n\n isCompactMode () {\n return this.buttonWidthSize === 'sm' || this.buttonWidthSize === 'md';\n },\n\n showPopover () {\n if (!this.openPopover || this.open) {\n this.syncOpenState();\n return false;\n }\n\n return this.toggleOpen();\n },\n },\n\n mounted () {\n warnIfUnmounted(this.$el, this.$options.name);\n },\n\n methods: {\n arrowClick (ev) {\n this.$emit('arrow-click', ev);\n return this.toggleOpen();\n },\n\n toggleOpen () {\n return (this.open = !this.open);\n },\n\n syncOpenState () {\n this.open = this.openPopover;\n },\n\n buttonClick (ev) {\n // If no listener for the click event, the button click opens the popover\n // the same as if the arrow was clicked.\n if (!this.$props.onClick) {\n this.arrowClick(ev);\n } else {\n this.$emit('click', ev);\n }\n },\n\n onModalIsOpened (isOpened) {\n this.open = isOpened;\n this.$emit('opened', isOpened);\n },\n },\n\n};\n</script>\n\n<style lang=\"less\">\n.dt-recipe--callbar-button-with-popover--arrow {\n margin-top: var(--dt-space-450);\n margin-left: calc(var(--dt-space-300-negative) * 5);\n width: var(--dt-size-500);\n height: var(--dt-size-500);\n padding: var(--dt-space-400);\n border-radius: var(--dt-size-300);\n\n &.d-btn--active {\n background: var(--dt-color-surface-moderate-opaque);\n }\n\n &--large {\n margin-left: var(--dt-space-550-negative);\n }\n\n &__icon {\n color: var(--dt-color-black-800);\n }\n}\n\n.dt-recipe--callbar-button-with-popover--popover {\n .d-popover__header {\n background: var(--dt-color-surface-contrast);\n color: var(--dt-color-foreground-primary-inverted);\n\n .d-btn {\n color: var(--dt-color-foreground-primary-inverted);\n }\n }\n}\n\n.dt-recipe--callbar-button-with-popover--button .d-tab--selected::after,\n.dt-recipe--callbar-button-with-popover--button .d-tab--selected:hover::after {\n --tab--bgc: var(--dt-color-surface-contrast);\n}\n.dt-recipe--callbar-button-with-popover--button .tab-group {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.dt-recipe--callbar-button-with-popover--button .tab-content {\n flex: 1 1 100%;\n overflow-y: auto;\n}\n\n.dt-recipe--callbar-button-with-popover {\n display: flex;\n align-items: start;\n}\n</style>\n"],"names":["this","_openBlock","_createElementBlock","_createVNode","_renderSlot","_withCtx","_createBlock","_mergeProps","_normalizeClass","_createCommentVNode"],"mappings":"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"}
1
+ {"version":3,"file":"callbar_button_with_popover.vue.js","sources":["../../../../recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue"],"sourcesContent":["<template>\n <div\n class=\"dt-recipe--callbar-button-with-popover\"\n >\n <dt-recipe-callbar-button\n :aria-label=\"ariaLabel\"\n :disabled=\"disabled\"\n :active=\"active\"\n :danger=\"danger\"\n :button-class=\"buttonClass\"\n :button-width-size=\"buttonWidthSize\"\n :text-class=\"textClass\"\n class=\"dt-recipe--callbar-button-with-popover--main-button\"\n @click=\"buttonClick\"\n >\n <template #icon>\n <slot name=\"icon\" />\n </template>\n <template #tooltip>\n <slot name=\"tooltip\" />\n </template>\n <slot />\n </dt-recipe-callbar-button>\n <dt-popover\n v-if=\"showArrowButton\"\n :id=\"id\"\n :modal=\"false\"\n :open=\"open\"\n :placement=\"placement\"\n :initial-focus-element=\"initialFocusElement\"\n :show-close-button=\"showCloseButton\"\n :offset=\"offset\"\n padding=\"none\"\n class=\"dt-recipe--callbar-button-with-popover--popover-wrapper\"\n :dialog-class=\"['dt-recipe--callbar-button-with-popover--popover', contentClass]\"\n header-class=\"d-d-flex d-ai-center d-fw-normal d-px12\"\n v-bind=\"$attrs\"\n :open-popover=\"showPopover\"\n @opened=\"onModalIsOpened\"\n >\n <template #anchor>\n <dt-button\n circle\n importance=\"clear\"\n size=\"lg\"\n :class=\"['dt-recipe--callbar-button-with-popover--arrow',\n { 'dt-recipe--callbar-button-with-popover--arrow--large': !isCompactMode }]\"\n width=\"2rem\"\n :aria-label=\"arrowButtonLabel\"\n :active=\"open\"\n @click=\"arrowClick\"\n >\n <template #icon>\n <dt-icon-chevron-up\n class=\"dt-recipe--callbar-button-with-popover--arrow__icon\"\n size=\"200\"\n />\n </template>\n </dt-button>\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n </div>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtPopover } from '@/components/popover';\nimport { DtIconChevronUp } from '@dialpad/dialtone-icons/vue3';\nimport { DtRecipeCallbarButton, CALLBAR_BUTTON_VALID_WIDTH_SIZE } from '../callbar_button';\nimport utils, { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n name: 'DtRecipeCallbarButtonWithPopover',\n\n components: { DtRecipeCallbarButton, DtPopover, DtButton, DtIconChevronUp },\n\n /* inheritAttrs: false is generally an option we want to set on library\n components. This allows any attributes passed in that are not recognized\n as props to be passed down to another element or component using v-bind:$attrs\n more info: https://vuejs.org/v2/api/#inheritAttrs */\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 * 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 * Aria label for the arrow. Cannot be empty.\n */\n arrowButtonLabel: {\n type: String,\n required: true,\n validator: (label) => {\n return !!label;\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @values 'bottom', 'bottom-start', 'bottom-end',\n * 'right', 'right-start', 'right-end',\n * 'left', 'left-start', 'left-end',\n * 'top', 'top-start', 'top-end'\n * @default 'top'\n */\n placement: {\n type: String,\n default: 'top',\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * <a\n * class=\"d-link\"\n * href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n * target=\"_blank\"\n * >\n * Tippy.js docs\n * </a>\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The element that is focused when the popover is opened. This can be an\n * HTMLElement within the popover, a string starting with '#' which will\n * find the element by ID. 'first' which will automatically focus\n * the first element, or 'dialog' which will focus the dialog window itself.\n * If the dialog is modal this prop cannot be 'none'.\n */\n initialFocusElement: {\n type: String,\n default: 'first',\n },\n\n /**\n * Determines visibility for close button\n */\n showCloseButton: {\n type: Boolean,\n default: true,\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 * Forces showing the arrow, even if the button is disabled.\n * default is false\n * @values true, false\n */\n forceShowArrow: {\n type: Boolean,\n default: false,\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 * We need this declaration because of how Vue3 informs the component about a listener.\n * Spoiler alert: it doesn't.\n * Vue3 intends to work as a real pub-sub, meaning the publisher has not a clue of who the subscribers are.\n * This makes it impossible from the regular declaration (emits: ['click']) to check whether\n * we actually have a click handler or not.\n * We're hacking it by adding an onClick prop: https://github.com/vuejs/core/issues/5220\n */\n /* eslint-disable-next-line vue/no-unused-properties */\n onClick: {\n type: Function,\n default: null,\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 * Additional class name for the popover content wrapper element.\n */\n contentClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * To auto open the modal popover.\n */\n openPopover: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n /**\n * Emitted when the arrow is clicked\n */\n 'arrow-click',\n\n /**\n * Native click event\n *\n * @event click\n * @type {PointerEvent | KeyboardEvent}\n */\n 'click',\n\n /**\n * Emitted when modal popover is opened or closed.\n */\n 'opened',\n ],\n\n data () {\n return {\n open: false,\n };\n },\n\n computed: {\n showArrowButton () {\n return this.forceShowArrow || !this.disabled;\n },\n\n isCompactMode () {\n return this.buttonWidthSize === 'sm' || this.buttonWidthSize === 'md';\n },\n\n showPopover () {\n if (!this.openPopover || this.open) {\n this.syncOpenState();\n return false;\n }\n\n return this.toggleOpen();\n },\n },\n\n mounted () {\n warnIfUnmounted(this.$el, this.$options.name);\n },\n\n methods: {\n arrowClick (ev) {\n this.$emit('arrow-click', ev);\n return this.toggleOpen();\n },\n\n toggleOpen () {\n return (this.open = !this.open);\n },\n\n syncOpenState () {\n this.open = this.openPopover;\n },\n\n buttonClick (ev) {\n // If no listener for the click event, the button click opens the popover\n // the same as if the arrow was clicked.\n if (!this.$props.onClick) {\n this.arrowClick(ev);\n } else {\n this.$emit('click', ev);\n }\n },\n\n onModalIsOpened (isOpened) {\n this.open = isOpened;\n this.$emit('opened', isOpened);\n },\n },\n\n};\n</script>\n\n<style lang=\"less\">\n.dt-recipe--callbar-button-with-popover--arrow {\n margin-top: var(--dt-space-450);\n margin-left: calc(var(--dt-space-300-negative) * 5);\n width: var(--dt-size-500);\n height: var(--dt-size-500);\n padding: var(--dt-space-400);\n border-radius: var(--dt-size-300);\n\n &.d-btn--active {\n background: var(--dt-color-surface-moderate-opaque);\n }\n\n &--large {\n margin-left: var(--dt-space-550-negative);\n }\n\n &__icon {\n color: var(--dt-color-black-800);\n }\n}\n\n.dt-recipe--callbar-button-with-popover--popover {\n .d-popover__header {\n background: var(--dt-color-surface-contrast);\n color: var(--dt-color-foreground-primary-inverted);\n\n .d-btn {\n color: var(--dt-color-foreground-primary-inverted);\n }\n }\n}\n\n.dt-recipe--callbar-button-with-popover--button .d-tab--selected::after,\n.dt-recipe--callbar-button-with-popover--button .d-tab--selected:hover::after {\n --tab--bgc: var(--dt-color-surface-contrast);\n}\n.dt-recipe--callbar-button-with-popover--button .tab-group {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n.dt-recipe--callbar-button-with-popover--button .tab-content {\n flex: 1 1 100%;\n overflow-y: auto;\n}\n\n.dt-recipe--callbar-button-with-popover {\n display: flex;\n align-items: flex-start;\n}\n</style>\n"],"names":["this","_openBlock","_createElementBlock","_createVNode","_renderSlot","_withCtx","_createBlock","_mergeProps","_normalizeClass","_createCommentVNode"],"mappings":"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"}
@@ -211,6 +211,6 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
211
211
  } : void 0
212
212
  ]), 1032, ["role"]);
213
213
  }
214
- const contact_info = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-89401231"]]);
214
+ const contact_info = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-42a664ff"]]);
215
215
  exports.default = contact_info;
216
216
  //# sourceMappingURL=contact_info.vue.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"contact_info.vue.cjs","sources":["../../../../recipes/item_layout/contact_info/contact_info.vue"],"sourcesContent":["<template>\n <dt-item-layout\n :role=\"role\"\n data-qa=\"contact-info\"\n class=\"dt-contact-info\"\n >\n <template\n v-if=\"showAvatar\"\n #left\n >\n <button\n class=\"dt-contact-info__left\"\n data-qa=\"contact-info-left\"\n :aria-labelledby=\"avatarLabelledBy\"\n @click=\"avatarClick\"\n >\n <span\n v-if=\"avatarList\"\n class=\"dt-contact-info--avatars\"\n >\n <dt-avatar\n v-for=\"(avatar, index) in avatarList\"\n :key=\"index\"\n :size=\"avatarSize\"\n :seed=\"avatar.seed\"\n :full-name=\"avatar.fullName\"\n :image-src=\"avatar.src\"\n image-alt=\"\"\n :overlay-text=\"avatar.text\"\n :avatar-class=\"[{ 'd-mln24': index > 0, 'd-bc-brand': !!avatar.halo }]\"\n >\n <template\n #icon=\"{ iconSize }\"\n >\n <!-- @slot Slot for avatar icon in a list -->\n <slot\n name=\"avatarIcon\"\n :icon-size=\"iconSize\"\n />\n </template>\n <template\n v-if=\"avatar.icon\"\n #overlayIcon\n >\n <component :is=\"avatar.icon\" />\n </template>\n </dt-avatar>\n </span>\n <dt-avatar\n v-else\n :size=\"avatarSize\"\n :full-name=\"avatarFullName\"\n :image-src=\"avatarSrc\"\n image-alt=\"\"\n :seed=\"avatarSeed\"\n :color=\"avatarColor\"\n :presence=\"presence\"\n >\n <template\n #icon=\"{ iconSize }\"\n >\n <!-- @slot Slot for avatar icon in a list -->\n <slot\n name=\"avatarIcon\"\n :icon-size=\"iconSize\"\n />\n </template>\n </dt-avatar>\n </button>\n </template>\n <template #default>\n <div data-qa=\"contact-info-header\">\n <!-- @slot Slot for header information -->\n <slot name=\"header\" />\n </div>\n </template>\n\n <template #subtitle>\n <div data-qa=\"contact-info-subtitle\">\n <!-- @slot Slot for subtitle information -->\n <slot name=\"subtitle\" />\n </div>\n </template>\n\n <template\n v-if=\"$slots.bottom\"\n #bottom\n >\n <div data-qa=\"contact-info-bottom\">\n <!-- @slot Slot for information at the bottom -->\n <slot name=\"bottom\" />\n </div>\n </template>\n\n <template\n v-if=\"$slots.right\"\n #right\n >\n <div data-qa=\"contact-info-right\">\n <!-- @slot Slot for the right content -->\n <slot name=\"right\" />\n </div>\n </template>\n </dt-item-layout>\n</template>\n\n<script>\nimport DtItemLayout from '@/components/item_layout/item_layout.vue';\nimport DtAvatar from '@/components/avatar/avatar.vue';\nimport { hasSlotContent } from '@/common/utils/index.js';\n\nexport default {\n name: 'DtRecipeContactInfo',\n\n components: {\n DtAvatar,\n DtItemLayout,\n },\n\n /* inheritAttrs: false is generally an option we want to set on library\n components. This allows any attributes passed in that are not recognized\n as props to be passed down to another element or component using v-bind:$attrs\n more info: https://vuejs.org/v2/api/#inheritAttrs */\n // inheritAttrs: false,\n\n props: {\n /**\n * String to use for the item's role.\n */\n role: {\n type: String,\n default: '',\n },\n\n /**\n * Display avatar if `showAvatar` property is true.\n */\n showAvatar: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Optional avatar image url.\n */\n avatarSrc: {\n type: String,\n default: '',\n },\n\n /**\n * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.\n */\n avatarSeed: {\n type: String,\n default: null,\n },\n\n /**\n * Avatar's full name, used to extract initials\n * to display in avatar if `avatarSrc` and `avatarIcon` are empty.\n */\n avatarFullName: {\n type: String,\n default: '',\n },\n\n /**\n * The size of the avatar\n * @values xs, sm, md, lg, xl\n */\n avatarSize: {\n type: String,\n default: 'lg',\n },\n\n /**\n * The aria-labelledby of the button containing avatars\n */\n avatarLabelledBy: {\n type: String,\n default: '',\n },\n\n /**\n * Avatar color to display if `avatarSrc` is empty.\n */\n avatarColor: {\n type: String,\n default: null,\n },\n\n /**\n * Determines whether to show the presence indicator for\n * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',\n * or 'active'. By default, it's null and nothing is shown.\n * @values null, busy, away, offline, active\n */\n presence: {\n type: String,\n default: null,\n },\n\n /**\n * Showing multiple avatars in contact info.\n * The props of array items are: <br>\n * `src` - avatar image url (optional) <br>\n * `fullName` - full name, used to extract initials to display in avatar<br>\n * if `avatarSrc` and `avatarIcon` are empty<br>\n * `seed` - determines uniqueness of avatar background <br>\n * `text` - text that overlays the avatar (optional) <br>\n * `icon` - icon that overlays the avatar (optional) <br>\n * `halo` - halo highlight around the avatar. boolean true/false\n */\n avatarList: {\n type: Array,\n default: null,\n },\n },\n\n emits: ['avatar-click'],\n\n methods: {\n avatarClick () {\n this.$emit('avatar-click');\n },\n },\n};\n</script>\n\n<style lang=\"less\" scoped>\n.dt-contact-info {\n --contact-info-avatar-border-color: var(--dt-color-surface-primary);\n\n display: flex;\n\n &:deep(.dt-item-layout) {\n flex: 1 1 0;\n }\n\n &:deep(.dt-item-layout--content) {\n /*\n DP-74536: Add `min-width` to make the width of \"contact info\" adjustable.\n */\n min-width: var(--dt-space-825);\n }\n\n &:deep(.dt-item-layout--left) {\n /*\n DP-74536: To make 'Avatar' in fixed position when resizing the window.\n */\n min-width: var(--dt-space-650);\n justify-content: flex-start;\n align-items: center;\n }\n\n &:deep(.dt-item-layout--right) {\n /*\n DP-74536: Remove `min-width` which cause extra unused empty space on the right of \"contact info\".\n */\n min-width: 0;\n align-items: center;\n }\n\n &__left {\n position: relative;\n background-color: transparent;\n background-image: none;\n border-width: 0;\n cursor: pointer;\n }\n\n &--avatars {\n margin-right: var(--dt-space-300-negative);\n display: flex;\n flex-direction: row;\n\n .d-avatar {\n border-radius: var(--dt-size-radius-pill);\n border: var(--dt-size-300) solid var(--contact-info-avatar-border-color);\n box-sizing: unset;\n }\n }\n}\n</style>\n"],"names":["DtAvatar","DtItemLayout","_createBlock","_createSlots","_createElementVNode","_renderSlot","_withCtx","_openBlock","_createElementBlock","_Fragment","_renderList","avatar","_resolveDynamicComponent"],"mappings":"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"}
1
+ {"version":3,"file":"contact_info.vue.cjs","sources":["../../../../recipes/item_layout/contact_info/contact_info.vue"],"sourcesContent":["<template>\n <dt-item-layout\n :role=\"role\"\n data-qa=\"contact-info\"\n class=\"dt-contact-info\"\n >\n <template\n v-if=\"showAvatar\"\n #left\n >\n <button\n class=\"dt-contact-info__left\"\n data-qa=\"contact-info-left\"\n :aria-labelledby=\"avatarLabelledBy\"\n @click=\"avatarClick\"\n >\n <span\n v-if=\"avatarList\"\n class=\"dt-contact-info--avatars\"\n >\n <dt-avatar\n v-for=\"(avatar, index) in avatarList\"\n :key=\"index\"\n :size=\"avatarSize\"\n :seed=\"avatar.seed\"\n :full-name=\"avatar.fullName\"\n :image-src=\"avatar.src\"\n image-alt=\"\"\n :overlay-text=\"avatar.text\"\n :avatar-class=\"[{ 'd-mln24': index > 0, 'd-bc-brand': !!avatar.halo }]\"\n >\n <template\n #icon=\"{ iconSize }\"\n >\n <!-- @slot Slot for avatar icon in a list -->\n <slot\n name=\"avatarIcon\"\n :icon-size=\"iconSize\"\n />\n </template>\n <template\n v-if=\"avatar.icon\"\n #overlayIcon\n >\n <component :is=\"avatar.icon\" />\n </template>\n </dt-avatar>\n </span>\n <dt-avatar\n v-else\n :size=\"avatarSize\"\n :full-name=\"avatarFullName\"\n :image-src=\"avatarSrc\"\n image-alt=\"\"\n :seed=\"avatarSeed\"\n :color=\"avatarColor\"\n :presence=\"presence\"\n >\n <template\n #icon=\"{ iconSize }\"\n >\n <!-- @slot Slot for avatar icon in a list -->\n <slot\n name=\"avatarIcon\"\n :icon-size=\"iconSize\"\n />\n </template>\n </dt-avatar>\n </button>\n </template>\n <template #default>\n <div data-qa=\"contact-info-header\">\n <!-- @slot Slot for header information -->\n <slot name=\"header\" />\n </div>\n </template>\n\n <template #subtitle>\n <div data-qa=\"contact-info-subtitle\">\n <!-- @slot Slot for subtitle information -->\n <slot name=\"subtitle\" />\n </div>\n </template>\n\n <template\n v-if=\"$slots.bottom\"\n #bottom\n >\n <div data-qa=\"contact-info-bottom\">\n <!-- @slot Slot for information at the bottom -->\n <slot name=\"bottom\" />\n </div>\n </template>\n\n <template\n v-if=\"$slots.right\"\n #right\n >\n <div data-qa=\"contact-info-right\">\n <!-- @slot Slot for the right content -->\n <slot name=\"right\" />\n </div>\n </template>\n </dt-item-layout>\n</template>\n\n<script>\nimport DtItemLayout from '@/components/item_layout/item_layout.vue';\nimport DtAvatar from '@/components/avatar/avatar.vue';\n\nexport default {\n name: 'DtRecipeContactInfo',\n\n components: {\n DtAvatar,\n DtItemLayout,\n },\n\n /* inheritAttrs: false is generally an option we want to set on library\n components. This allows any attributes passed in that are not recognized\n as props to be passed down to another element or component using v-bind:$attrs\n more info: https://vuejs.org/v2/api/#inheritAttrs */\n // inheritAttrs: false,\n\n props: {\n /**\n * String to use for the item's role.\n */\n role: {\n type: String,\n default: '',\n },\n\n /**\n * Display avatar if `showAvatar` property is true.\n */\n showAvatar: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Optional avatar image url.\n */\n avatarSrc: {\n type: String,\n default: '',\n },\n\n /**\n * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.\n */\n avatarSeed: {\n type: String,\n default: null,\n },\n\n /**\n * Avatar's full name, used to extract initials\n * to display in avatar if `avatarSrc` and `avatarIcon` are empty.\n */\n avatarFullName: {\n type: String,\n default: '',\n },\n\n /**\n * The size of the avatar\n * @values xs, sm, md, lg, xl\n */\n avatarSize: {\n type: String,\n default: 'lg',\n },\n\n /**\n * The aria-labelledby of the button containing avatars\n */\n avatarLabelledBy: {\n type: String,\n default: '',\n },\n\n /**\n * Avatar color to display if `avatarSrc` is empty.\n */\n avatarColor: {\n type: String,\n default: null,\n },\n\n /**\n * Determines whether to show the presence indicator for\n * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',\n * or 'active'. By default, it's null and nothing is shown.\n * @values null, busy, away, offline, active\n */\n presence: {\n type: String,\n default: null,\n },\n\n /**\n * Showing multiple avatars in contact info.\n * The props of array items are: <br>\n * `src` - avatar image url (optional) <br>\n * `fullName` - full name, used to extract initials to display in avatar<br>\n * if `avatarSrc` and `avatarIcon` are empty<br>\n * `seed` - determines uniqueness of avatar background <br>\n * `text` - text that overlays the avatar (optional) <br>\n * `icon` - icon that overlays the avatar (optional) <br>\n * `halo` - halo highlight around the avatar. boolean true/false\n */\n avatarList: {\n type: Array,\n default: null,\n },\n },\n\n emits: ['avatar-click'],\n\n methods: {\n avatarClick () {\n this.$emit('avatar-click');\n },\n },\n};\n</script>\n\n<style lang=\"less\" scoped>\n.dt-contact-info {\n --contact-info-avatar-border-color: var(--dt-color-surface-primary);\n\n display: flex;\n\n &:deep(.dt-item-layout) {\n flex: 1 1 0;\n }\n\n &:deep(.dt-item-layout--content) {\n /*\n DP-74536: Add `min-width` to make the width of \"contact info\" adjustable.\n */\n min-width: var(--dt-space-825);\n }\n\n &:deep(.dt-item-layout--left) {\n /*\n DP-74536: To make 'Avatar' in fixed position when resizing the window.\n */\n min-width: var(--dt-space-650);\n justify-content: flex-start;\n align-items: center;\n }\n\n &:deep(.dt-item-layout--right) {\n /*\n DP-74536: Remove `min-width` which cause extra unused empty space on the right of \"contact info\".\n */\n min-width: 0;\n align-items: center;\n }\n\n &__left {\n position: relative;\n background-color: transparent;\n background-image: none;\n border-width: 0;\n cursor: pointer;\n }\n\n &--avatars {\n margin-right: var(--dt-space-300-negative);\n display: flex;\n flex-direction: row;\n\n .d-avatar {\n border-radius: var(--dt-size-radius-pill);\n border: var(--dt-size-300) solid var(--contact-info-avatar-border-color);\n box-sizing: unset;\n }\n }\n}\n</style>\n"],"names":["DtAvatar","DtItemLayout","_createBlock","_createSlots","_createElementVNode","_renderSlot","_withCtx","_openBlock","_createElementBlock","_Fragment","_renderList","avatar","_resolveDynamicComponent"],"mappings":"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"}
@@ -209,7 +209,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
209
209
  } : void 0
210
210
  ]), 1032, ["role"]);
211
211
  }
212
- const contact_info = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-89401231"]]);
212
+ const contact_info = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-42a664ff"]]);
213
213
  export {
214
214
  contact_info as default
215
215
  };
@@ -1 +1 @@
1
- {"version":3,"file":"contact_info.vue.js","sources":["../../../../recipes/item_layout/contact_info/contact_info.vue"],"sourcesContent":["<template>\n <dt-item-layout\n :role=\"role\"\n data-qa=\"contact-info\"\n class=\"dt-contact-info\"\n >\n <template\n v-if=\"showAvatar\"\n #left\n >\n <button\n class=\"dt-contact-info__left\"\n data-qa=\"contact-info-left\"\n :aria-labelledby=\"avatarLabelledBy\"\n @click=\"avatarClick\"\n >\n <span\n v-if=\"avatarList\"\n class=\"dt-contact-info--avatars\"\n >\n <dt-avatar\n v-for=\"(avatar, index) in avatarList\"\n :key=\"index\"\n :size=\"avatarSize\"\n :seed=\"avatar.seed\"\n :full-name=\"avatar.fullName\"\n :image-src=\"avatar.src\"\n image-alt=\"\"\n :overlay-text=\"avatar.text\"\n :avatar-class=\"[{ 'd-mln24': index > 0, 'd-bc-brand': !!avatar.halo }]\"\n >\n <template\n #icon=\"{ iconSize }\"\n >\n <!-- @slot Slot for avatar icon in a list -->\n <slot\n name=\"avatarIcon\"\n :icon-size=\"iconSize\"\n />\n </template>\n <template\n v-if=\"avatar.icon\"\n #overlayIcon\n >\n <component :is=\"avatar.icon\" />\n </template>\n </dt-avatar>\n </span>\n <dt-avatar\n v-else\n :size=\"avatarSize\"\n :full-name=\"avatarFullName\"\n :image-src=\"avatarSrc\"\n image-alt=\"\"\n :seed=\"avatarSeed\"\n :color=\"avatarColor\"\n :presence=\"presence\"\n >\n <template\n #icon=\"{ iconSize }\"\n >\n <!-- @slot Slot for avatar icon in a list -->\n <slot\n name=\"avatarIcon\"\n :icon-size=\"iconSize\"\n />\n </template>\n </dt-avatar>\n </button>\n </template>\n <template #default>\n <div data-qa=\"contact-info-header\">\n <!-- @slot Slot for header information -->\n <slot name=\"header\" />\n </div>\n </template>\n\n <template #subtitle>\n <div data-qa=\"contact-info-subtitle\">\n <!-- @slot Slot for subtitle information -->\n <slot name=\"subtitle\" />\n </div>\n </template>\n\n <template\n v-if=\"$slots.bottom\"\n #bottom\n >\n <div data-qa=\"contact-info-bottom\">\n <!-- @slot Slot for information at the bottom -->\n <slot name=\"bottom\" />\n </div>\n </template>\n\n <template\n v-if=\"$slots.right\"\n #right\n >\n <div data-qa=\"contact-info-right\">\n <!-- @slot Slot for the right content -->\n <slot name=\"right\" />\n </div>\n </template>\n </dt-item-layout>\n</template>\n\n<script>\nimport DtItemLayout from '@/components/item_layout/item_layout.vue';\nimport DtAvatar from '@/components/avatar/avatar.vue';\nimport { hasSlotContent } from '@/common/utils/index.js';\n\nexport default {\n name: 'DtRecipeContactInfo',\n\n components: {\n DtAvatar,\n DtItemLayout,\n },\n\n /* inheritAttrs: false is generally an option we want to set on library\n components. This allows any attributes passed in that are not recognized\n as props to be passed down to another element or component using v-bind:$attrs\n more info: https://vuejs.org/v2/api/#inheritAttrs */\n // inheritAttrs: false,\n\n props: {\n /**\n * String to use for the item's role.\n */\n role: {\n type: String,\n default: '',\n },\n\n /**\n * Display avatar if `showAvatar` property is true.\n */\n showAvatar: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Optional avatar image url.\n */\n avatarSrc: {\n type: String,\n default: '',\n },\n\n /**\n * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.\n */\n avatarSeed: {\n type: String,\n default: null,\n },\n\n /**\n * Avatar's full name, used to extract initials\n * to display in avatar if `avatarSrc` and `avatarIcon` are empty.\n */\n avatarFullName: {\n type: String,\n default: '',\n },\n\n /**\n * The size of the avatar\n * @values xs, sm, md, lg, xl\n */\n avatarSize: {\n type: String,\n default: 'lg',\n },\n\n /**\n * The aria-labelledby of the button containing avatars\n */\n avatarLabelledBy: {\n type: String,\n default: '',\n },\n\n /**\n * Avatar color to display if `avatarSrc` is empty.\n */\n avatarColor: {\n type: String,\n default: null,\n },\n\n /**\n * Determines whether to show the presence indicator for\n * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',\n * or 'active'. By default, it's null and nothing is shown.\n * @values null, busy, away, offline, active\n */\n presence: {\n type: String,\n default: null,\n },\n\n /**\n * Showing multiple avatars in contact info.\n * The props of array items are: <br>\n * `src` - avatar image url (optional) <br>\n * `fullName` - full name, used to extract initials to display in avatar<br>\n * if `avatarSrc` and `avatarIcon` are empty<br>\n * `seed` - determines uniqueness of avatar background <br>\n * `text` - text that overlays the avatar (optional) <br>\n * `icon` - icon that overlays the avatar (optional) <br>\n * `halo` - halo highlight around the avatar. boolean true/false\n */\n avatarList: {\n type: Array,\n default: null,\n },\n },\n\n emits: ['avatar-click'],\n\n methods: {\n avatarClick () {\n this.$emit('avatar-click');\n },\n },\n};\n</script>\n\n<style lang=\"less\" scoped>\n.dt-contact-info {\n --contact-info-avatar-border-color: var(--dt-color-surface-primary);\n\n display: flex;\n\n &:deep(.dt-item-layout) {\n flex: 1 1 0;\n }\n\n &:deep(.dt-item-layout--content) {\n /*\n DP-74536: Add `min-width` to make the width of \"contact info\" adjustable.\n */\n min-width: var(--dt-space-825);\n }\n\n &:deep(.dt-item-layout--left) {\n /*\n DP-74536: To make 'Avatar' in fixed position when resizing the window.\n */\n min-width: var(--dt-space-650);\n justify-content: flex-start;\n align-items: center;\n }\n\n &:deep(.dt-item-layout--right) {\n /*\n DP-74536: Remove `min-width` which cause extra unused empty space on the right of \"contact info\".\n */\n min-width: 0;\n align-items: center;\n }\n\n &__left {\n position: relative;\n background-color: transparent;\n background-image: none;\n border-width: 0;\n cursor: pointer;\n }\n\n &--avatars {\n margin-right: var(--dt-space-300-negative);\n display: flex;\n flex-direction: row;\n\n .d-avatar {\n border-radius: var(--dt-size-radius-pill);\n border: var(--dt-size-300) solid var(--contact-info-avatar-border-color);\n box-sizing: unset;\n }\n }\n}\n</style>\n"],"names":["_createBlock","_createSlots","_createElementVNode","_renderSlot","_withCtx","_openBlock","_createElementBlock","_Fragment","_renderList","_resolveDynamicComponent"],"mappings":"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"}
1
+ {"version":3,"file":"contact_info.vue.js","sources":["../../../../recipes/item_layout/contact_info/contact_info.vue"],"sourcesContent":["<template>\n <dt-item-layout\n :role=\"role\"\n data-qa=\"contact-info\"\n class=\"dt-contact-info\"\n >\n <template\n v-if=\"showAvatar\"\n #left\n >\n <button\n class=\"dt-contact-info__left\"\n data-qa=\"contact-info-left\"\n :aria-labelledby=\"avatarLabelledBy\"\n @click=\"avatarClick\"\n >\n <span\n v-if=\"avatarList\"\n class=\"dt-contact-info--avatars\"\n >\n <dt-avatar\n v-for=\"(avatar, index) in avatarList\"\n :key=\"index\"\n :size=\"avatarSize\"\n :seed=\"avatar.seed\"\n :full-name=\"avatar.fullName\"\n :image-src=\"avatar.src\"\n image-alt=\"\"\n :overlay-text=\"avatar.text\"\n :avatar-class=\"[{ 'd-mln24': index > 0, 'd-bc-brand': !!avatar.halo }]\"\n >\n <template\n #icon=\"{ iconSize }\"\n >\n <!-- @slot Slot for avatar icon in a list -->\n <slot\n name=\"avatarIcon\"\n :icon-size=\"iconSize\"\n />\n </template>\n <template\n v-if=\"avatar.icon\"\n #overlayIcon\n >\n <component :is=\"avatar.icon\" />\n </template>\n </dt-avatar>\n </span>\n <dt-avatar\n v-else\n :size=\"avatarSize\"\n :full-name=\"avatarFullName\"\n :image-src=\"avatarSrc\"\n image-alt=\"\"\n :seed=\"avatarSeed\"\n :color=\"avatarColor\"\n :presence=\"presence\"\n >\n <template\n #icon=\"{ iconSize }\"\n >\n <!-- @slot Slot for avatar icon in a list -->\n <slot\n name=\"avatarIcon\"\n :icon-size=\"iconSize\"\n />\n </template>\n </dt-avatar>\n </button>\n </template>\n <template #default>\n <div data-qa=\"contact-info-header\">\n <!-- @slot Slot for header information -->\n <slot name=\"header\" />\n </div>\n </template>\n\n <template #subtitle>\n <div data-qa=\"contact-info-subtitle\">\n <!-- @slot Slot for subtitle information -->\n <slot name=\"subtitle\" />\n </div>\n </template>\n\n <template\n v-if=\"$slots.bottom\"\n #bottom\n >\n <div data-qa=\"contact-info-bottom\">\n <!-- @slot Slot for information at the bottom -->\n <slot name=\"bottom\" />\n </div>\n </template>\n\n <template\n v-if=\"$slots.right\"\n #right\n >\n <div data-qa=\"contact-info-right\">\n <!-- @slot Slot for the right content -->\n <slot name=\"right\" />\n </div>\n </template>\n </dt-item-layout>\n</template>\n\n<script>\nimport DtItemLayout from '@/components/item_layout/item_layout.vue';\nimport DtAvatar from '@/components/avatar/avatar.vue';\n\nexport default {\n name: 'DtRecipeContactInfo',\n\n components: {\n DtAvatar,\n DtItemLayout,\n },\n\n /* inheritAttrs: false is generally an option we want to set on library\n components. This allows any attributes passed in that are not recognized\n as props to be passed down to another element or component using v-bind:$attrs\n more info: https://vuejs.org/v2/api/#inheritAttrs */\n // inheritAttrs: false,\n\n props: {\n /**\n * String to use for the item's role.\n */\n role: {\n type: String,\n default: '',\n },\n\n /**\n * Display avatar if `showAvatar` property is true.\n */\n showAvatar: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Optional avatar image url.\n */\n avatarSrc: {\n type: String,\n default: '',\n },\n\n /**\n * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.\n */\n avatarSeed: {\n type: String,\n default: null,\n },\n\n /**\n * Avatar's full name, used to extract initials\n * to display in avatar if `avatarSrc` and `avatarIcon` are empty.\n */\n avatarFullName: {\n type: String,\n default: '',\n },\n\n /**\n * The size of the avatar\n * @values xs, sm, md, lg, xl\n */\n avatarSize: {\n type: String,\n default: 'lg',\n },\n\n /**\n * The aria-labelledby of the button containing avatars\n */\n avatarLabelledBy: {\n type: String,\n default: '',\n },\n\n /**\n * Avatar color to display if `avatarSrc` is empty.\n */\n avatarColor: {\n type: String,\n default: null,\n },\n\n /**\n * Determines whether to show the presence indicator for\n * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',\n * or 'active'. By default, it's null and nothing is shown.\n * @values null, busy, away, offline, active\n */\n presence: {\n type: String,\n default: null,\n },\n\n /**\n * Showing multiple avatars in contact info.\n * The props of array items are: <br>\n * `src` - avatar image url (optional) <br>\n * `fullName` - full name, used to extract initials to display in avatar<br>\n * if `avatarSrc` and `avatarIcon` are empty<br>\n * `seed` - determines uniqueness of avatar background <br>\n * `text` - text that overlays the avatar (optional) <br>\n * `icon` - icon that overlays the avatar (optional) <br>\n * `halo` - halo highlight around the avatar. boolean true/false\n */\n avatarList: {\n type: Array,\n default: null,\n },\n },\n\n emits: ['avatar-click'],\n\n methods: {\n avatarClick () {\n this.$emit('avatar-click');\n },\n },\n};\n</script>\n\n<style lang=\"less\" scoped>\n.dt-contact-info {\n --contact-info-avatar-border-color: var(--dt-color-surface-primary);\n\n display: flex;\n\n &:deep(.dt-item-layout) {\n flex: 1 1 0;\n }\n\n &:deep(.dt-item-layout--content) {\n /*\n DP-74536: Add `min-width` to make the width of \"contact info\" adjustable.\n */\n min-width: var(--dt-space-825);\n }\n\n &:deep(.dt-item-layout--left) {\n /*\n DP-74536: To make 'Avatar' in fixed position when resizing the window.\n */\n min-width: var(--dt-space-650);\n justify-content: flex-start;\n align-items: center;\n }\n\n &:deep(.dt-item-layout--right) {\n /*\n DP-74536: Remove `min-width` which cause extra unused empty space on the right of \"contact info\".\n */\n min-width: 0;\n align-items: center;\n }\n\n &__left {\n position: relative;\n background-color: transparent;\n background-image: none;\n border-width: 0;\n cursor: pointer;\n }\n\n &--avatars {\n margin-right: var(--dt-space-300-negative);\n display: flex;\n flex-direction: row;\n\n .d-avatar {\n border-radius: var(--dt-size-radius-pill);\n border: var(--dt-size-300) solid var(--contact-info-avatar-border-color);\n box-sizing: unset;\n }\n }\n}\n</style>\n"],"names":["_createBlock","_createSlots","_createElementVNode","_renderSlot","_withCtx","_openBlock","_createElementBlock","_Fragment","_renderList","_resolveDynamicComponent"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"leftbar_general_row_icon.vue.cjs","sources":["../../../../recipes/leftbar/general_row/leftbar_general_row_icon.vue"],"sourcesContent":["<template>\n <component\n v-if=\"isIconType\"\n :is=\"getIconName\"\n :size=\"iconSize\"\n />\n <div\n v-else-if=\"isContactCenterType\"\n :class=\"contactCenterIconClasses\"\n />\n <div\n v-else-if=\"isDialbotType\"\n :class=\"dialbotClasses\"\n data-qa=\"general-row-dialbot\"\n >\n <dt-icon-dialbot\n size=\"500\"\n />\n </div>\n</template>\n\n<script>\nimport {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n} from '@dialpad/dialtone-icons/vue3';\nimport {\n LEFTBAR_GENERAL_ROW_TYPES as TYPES,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as COLORS,\n} from '@/recipes/leftbar/general_row/general_row_constants';\n\nconst typeToIcon = new Map([\n [TYPES.INBOX, DtIconInbox],\n [TYPES.CONTACTS, DtIconContacts],\n [TYPES.CHANNELS, DtIconHash],\n [TYPES.THREADS, DtIconThread],\n [TYPES.LAUNCHPAD, DtIconLayoutTemplate],\n [TYPES.LOCKED_CHANNEL, DtIconLock],\n [TYPES.QUICK_START, DtIconSparkle],\n [TYPES.COACHING_GROUP, DtIconUsers],\n [TYPES.COACHING_CENTER, DtIconExternalLink],\n ['locked channel unread', DtIconLockFilled],\n ['channel unread', DtIconHashBold],\n [TYPES.ASSIGNED, DtIconAtSign],\n [TYPES.DIGITAL, DtIconLaptop2],\n [TYPES.SCHEDULED, DtIconCalendarClock],\n]);\n\nexport default {\n name: 'DtRecipeLeftbarGeneralRowIcon',\n components: {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n },\n\n props: {\n type: {\n type: String,\n default: null,\n },\n\n color: {\n type: String,\n default: null,\n },\n\n iconSize: {\n type: String,\n default: '300',\n },\n },\n\n computed: {\n isIconType () {\n return ![TYPES.DIALBOT, TYPES.CONTACT_CENTER].includes(this.type);\n },\n\n isContactCenterType () {\n return this.type === TYPES.CONTACT_CENTER;\n },\n\n isDialbotType () {\n return this.type === TYPES.DIALBOT;\n },\n\n getIconName () {\n return typeToIcon.get(this.type);\n },\n\n contactCenterIconClasses () {\n return [\n 'dt-leftbar-row__icon-cc',\n COLORS[this.color],\n ];\n },\n\n dialbotClasses () {\n return [\n 'd-d-flex',\n 'd-ai-center',\n 'd-jc-center',\n ];\n },\n },\n};\n</script>\n"],"names":["TYPES","DtIconInbox","DtIconContacts","DtIconHash","DtIconThread","DtIconLayoutTemplate","DtIconLock","DtIconSparkle","DtIconUsers","DtIconExternalLink","DtIconLockFilled","DtIconHashBold","DtIconAtSign","DtIconLaptop2","DtIconCalendarClock","DtIconDialbot","COLORS","_createBlock","_resolveDynamicComponent","_createElementBlock","_normalizeClass","_createVNode","_createCommentVNode"],"mappings":";;;;;;AA4CA,MAAM,aAAa,oBAAI,IAAI;AAAA,EACzB,CAACA,sBAAK,0BAAC,OAAOC,gBAAW;AAAA,EACzB,CAACD,sBAAK,0BAAC,UAAUE,mBAAc;AAAA,EAC/B,CAACF,sBAAK,0BAAC,UAAUG,eAAU;AAAA,EAC3B,CAACH,sBAAK,0BAAC,SAASI,iBAAY;AAAA,EAC5B,CAACJ,sBAAK,0BAAC,WAAWK,yBAAoB;AAAA,EACtC,CAACL,sBAAK,0BAAC,gBAAgBM,eAAU;AAAA,EACjC,CAACN,sBAAK,0BAAC,aAAaO,kBAAa;AAAA,EACjC,CAACP,sBAAK,0BAAC,gBAAgBQ,gBAAW;AAAA,EAClC,CAACR,sBAAK,0BAAC,iBAAiBS,uBAAkB;AAAA,EAC1C,CAAC,yBAAyBC,KAAAA,gBAAgB;AAAA,EAC1C,CAAC,kBAAkBC,KAAAA,cAAc;AAAA,EACjC,CAACX,sBAAK,0BAAC,UAAUY,iBAAY;AAAA,EAC7B,CAACZ,sBAAK,0BAAC,SAASa,kBAAa;AAAA,EAC7B,CAACb,sBAAK,0BAAC,WAAWc,wBAAmB;AACvC,CAAC;AAED,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,YAAY;AAAA,mBACVC,KAAa;AAAA,iBACbd,KAAW;AAAA,IACX,gBAAAC,KAAc;AAAA,gBACdC,KAAU;AAAA,kBACVC,KAAY;AAAA,IACZ,sBAAAC,KAAoB;AAAA,gBACpBC,KAAU;AAAA,mBACVC,KAAa;AAAA,iBACbC,KAAW;AAAA,IACX,oBAAAC,KAAkB;AAAA,IAClB,kBAAAC,KAAgB;AAAA,IAChB,gBAAAC,KAAc;AAAA,kBACdC,KAAY;AAAA,mBACZC,KAAa;AAAA,IACb,qBAAAC,KAAmB;AAAA,EACpB;AAAA,EAED,OAAO;AAAA,IACL,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,IAED,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,IAED,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,UAAU;AAAA,IACR,aAAc;AACZ,aAAO,CAAC,CAACd,gDAAM,SAASA,sBAAK,0BAAC,cAAc,EAAE,SAAS,KAAK,IAAI;AAAA,IACjE;AAAA,IAED,sBAAuB;AACrB,aAAO,KAAK,SAASA,sBAAK,0BAAC;AAAA,IAC5B;AAAA,IAED,gBAAiB;AACf,aAAO,KAAK,SAASA,sBAAK,0BAAC;AAAA,IAC5B;AAAA,IAED,cAAe;AACb,aAAO,WAAW,IAAI,KAAK,IAAI;AAAA,IAChC;AAAA,IAED,2BAA4B;AAC1B,aAAO;AAAA,QACL;AAAA,QACAgB,sBAAM,0CAAC,KAAK,KAAK;AAAA;IAEpB;AAAA,IAED,iBAAkB;AAChB,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA;IAEH;AAAA,EACF;AACH;;;SAhIU,SAAU,+BADlBC,IAIE,YALJC,4BAGS,SAAW,WAAA,GAAA;AAAA,IAHpB,KAAA;AAAA,IAIK,MAAM,OAAQ;AAAA,2BAGJ,SAAmB,wCADhCC,IAGE,mBAAA,OAAA;AAAA,IATJ,KAAA;AAAA,IAQK,OARLC,IAAAA,eAQY,SAAwB,wBAAA;AAAA,iBAGrB,SAAa,kCAD1BD,IAQM,mBAAA,OAAA;AAAA,IAlBR,KAAA;AAAA,IAYK,OAZLC,IAAAA,eAYY,SAAc,cAAA;AAAA,IACtB,WAAQ;AAAA;IAERC,IAAAA,YAEE,4BAAA,EADA,MAAK,MAAK,CAAA;AAAA,WAhBhBC,IAAA,mBAAA,IAAA,IAAA;;;;"}
1
+ {"version":3,"file":"leftbar_general_row_icon.vue.cjs","sources":["../../../../recipes/leftbar/general_row/leftbar_general_row_icon.vue"],"sourcesContent":["<template>\n <component\n :is=\"getIconName\"\n v-if=\"isIconType\"\n :size=\"iconSize\"\n />\n <div\n v-else-if=\"isContactCenterType\"\n :class=\"contactCenterIconClasses\"\n />\n <div\n v-else-if=\"isDialbotType\"\n :class=\"dialbotClasses\"\n data-qa=\"general-row-dialbot\"\n >\n <dt-icon-dialbot\n size=\"500\"\n />\n </div>\n</template>\n\n<script>\nimport {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n} from '@dialpad/dialtone-icons/vue3';\nimport {\n LEFTBAR_GENERAL_ROW_TYPES as TYPES,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as COLORS,\n} from '@/recipes/leftbar/general_row/general_row_constants';\n\nconst typeToIcon = new Map([\n [TYPES.INBOX, DtIconInbox],\n [TYPES.CONTACTS, DtIconContacts],\n [TYPES.CHANNELS, DtIconHash],\n [TYPES.THREADS, DtIconThread],\n [TYPES.LAUNCHPAD, DtIconLayoutTemplate],\n [TYPES.LOCKED_CHANNEL, DtIconLock],\n [TYPES.QUICK_START, DtIconSparkle],\n [TYPES.COACHING_GROUP, DtIconUsers],\n [TYPES.COACHING_CENTER, DtIconExternalLink],\n ['locked channel unread', DtIconLockFilled],\n ['channel unread', DtIconHashBold],\n [TYPES.ASSIGNED, DtIconAtSign],\n [TYPES.DIGITAL, DtIconLaptop2],\n [TYPES.SCHEDULED, DtIconCalendarClock],\n]);\n\nexport default {\n name: 'DtRecipeLeftbarGeneralRowIcon',\n components: {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n },\n\n props: {\n type: {\n type: String,\n default: null,\n },\n\n color: {\n type: String,\n default: null,\n },\n\n iconSize: {\n type: String,\n default: '300',\n },\n },\n\n computed: {\n isIconType () {\n return ![TYPES.DIALBOT, TYPES.CONTACT_CENTER].includes(this.type);\n },\n\n isContactCenterType () {\n return this.type === TYPES.CONTACT_CENTER;\n },\n\n isDialbotType () {\n return this.type === TYPES.DIALBOT;\n },\n\n getIconName () {\n return typeToIcon.get(this.type);\n },\n\n contactCenterIconClasses () {\n return [\n 'dt-leftbar-row__icon-cc',\n COLORS[this.color],\n ];\n },\n\n dialbotClasses () {\n return [\n 'd-d-flex',\n 'd-ai-center',\n 'd-jc-center',\n ];\n },\n },\n};\n</script>\n"],"names":["TYPES","DtIconInbox","DtIconContacts","DtIconHash","DtIconThread","DtIconLayoutTemplate","DtIconLock","DtIconSparkle","DtIconUsers","DtIconExternalLink","DtIconLockFilled","DtIconHashBold","DtIconAtSign","DtIconLaptop2","DtIconCalendarClock","DtIconDialbot","COLORS","_createBlock","_resolveDynamicComponent","_createElementBlock","_normalizeClass","_createVNode","_createCommentVNode"],"mappings":";;;;;;AA4CA,MAAM,aAAa,oBAAI,IAAI;AAAA,EACzB,CAACA,sBAAK,0BAAC,OAAOC,gBAAW;AAAA,EACzB,CAACD,sBAAK,0BAAC,UAAUE,mBAAc;AAAA,EAC/B,CAACF,sBAAK,0BAAC,UAAUG,eAAU;AAAA,EAC3B,CAACH,sBAAK,0BAAC,SAASI,iBAAY;AAAA,EAC5B,CAACJ,sBAAK,0BAAC,WAAWK,yBAAoB;AAAA,EACtC,CAACL,sBAAK,0BAAC,gBAAgBM,eAAU;AAAA,EACjC,CAACN,sBAAK,0BAAC,aAAaO,kBAAa;AAAA,EACjC,CAACP,sBAAK,0BAAC,gBAAgBQ,gBAAW;AAAA,EAClC,CAACR,sBAAK,0BAAC,iBAAiBS,uBAAkB;AAAA,EAC1C,CAAC,yBAAyBC,KAAAA,gBAAgB;AAAA,EAC1C,CAAC,kBAAkBC,KAAAA,cAAc;AAAA,EACjC,CAACX,sBAAK,0BAAC,UAAUY,iBAAY;AAAA,EAC7B,CAACZ,sBAAK,0BAAC,SAASa,kBAAa;AAAA,EAC7B,CAACb,sBAAK,0BAAC,WAAWc,wBAAmB;AACvC,CAAC;AAED,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,YAAY;AAAA,mBACVC,KAAa;AAAA,iBACbd,KAAW;AAAA,IACX,gBAAAC,KAAc;AAAA,gBACdC,KAAU;AAAA,kBACVC,KAAY;AAAA,IACZ,sBAAAC,KAAoB;AAAA,gBACpBC,KAAU;AAAA,mBACVC,KAAa;AAAA,iBACbC,KAAW;AAAA,IACX,oBAAAC,KAAkB;AAAA,IAClB,kBAAAC,KAAgB;AAAA,IAChB,gBAAAC,KAAc;AAAA,kBACdC,KAAY;AAAA,mBACZC,KAAa;AAAA,IACb,qBAAAC,KAAmB;AAAA,EACpB;AAAA,EAED,OAAO;AAAA,IACL,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,IAED,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,IAED,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,UAAU;AAAA,IACR,aAAc;AACZ,aAAO,CAAC,CAACd,gDAAM,SAASA,sBAAK,0BAAC,cAAc,EAAE,SAAS,KAAK,IAAI;AAAA,IACjE;AAAA,IAED,sBAAuB;AACrB,aAAO,KAAK,SAASA,sBAAK,0BAAC;AAAA,IAC5B;AAAA,IAED,gBAAiB;AACf,aAAO,KAAK,SAASA,sBAAK,0BAAC;AAAA,IAC5B;AAAA,IAED,cAAe;AACb,aAAO,WAAW,IAAI,KAAK,IAAI;AAAA,IAChC;AAAA,IAED,2BAA4B;AAC1B,aAAO;AAAA,QACL;AAAA,QACAgB,sBAAM,0CAAC,KAAK,KAAK;AAAA;IAEpB;AAAA,IAED,iBAAkB;AAChB,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA;IAEH;AAAA,EACF;AACH;;;SA/HU,SAAU,+BAFlBC,IAIE,YALJC,4BAES,SAAW,WAAA,GAAA;AAAA,IAFpB,KAAA;AAAA,IAIK,MAAM,OAAQ;AAAA,2BAGJ,SAAmB,wCADhCC,IAGE,mBAAA,OAAA;AAAA,IATJ,KAAA;AAAA,IAQK,OARLC,IAAAA,eAQY,SAAwB,wBAAA;AAAA,iBAGrB,SAAa,kCAD1BD,IAQM,mBAAA,OAAA;AAAA,IAlBR,KAAA;AAAA,IAYK,OAZLC,IAAAA,eAYY,SAAc,cAAA;AAAA,IACtB,WAAQ;AAAA;IAERC,IAAAA,YAEE,4BAAA,EADA,MAAK,MAAK,CAAA;AAAA,WAhBhBC,IAAA,mBAAA,IAAA,IAAA;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"leftbar_general_row_icon.vue.js","sources":["../../../../recipes/leftbar/general_row/leftbar_general_row_icon.vue"],"sourcesContent":["<template>\n <component\n v-if=\"isIconType\"\n :is=\"getIconName\"\n :size=\"iconSize\"\n />\n <div\n v-else-if=\"isContactCenterType\"\n :class=\"contactCenterIconClasses\"\n />\n <div\n v-else-if=\"isDialbotType\"\n :class=\"dialbotClasses\"\n data-qa=\"general-row-dialbot\"\n >\n <dt-icon-dialbot\n size=\"500\"\n />\n </div>\n</template>\n\n<script>\nimport {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n} from '@dialpad/dialtone-icons/vue3';\nimport {\n LEFTBAR_GENERAL_ROW_TYPES as TYPES,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as COLORS,\n} from '@/recipes/leftbar/general_row/general_row_constants';\n\nconst typeToIcon = new Map([\n [TYPES.INBOX, DtIconInbox],\n [TYPES.CONTACTS, DtIconContacts],\n [TYPES.CHANNELS, DtIconHash],\n [TYPES.THREADS, DtIconThread],\n [TYPES.LAUNCHPAD, DtIconLayoutTemplate],\n [TYPES.LOCKED_CHANNEL, DtIconLock],\n [TYPES.QUICK_START, DtIconSparkle],\n [TYPES.COACHING_GROUP, DtIconUsers],\n [TYPES.COACHING_CENTER, DtIconExternalLink],\n ['locked channel unread', DtIconLockFilled],\n ['channel unread', DtIconHashBold],\n [TYPES.ASSIGNED, DtIconAtSign],\n [TYPES.DIGITAL, DtIconLaptop2],\n [TYPES.SCHEDULED, DtIconCalendarClock],\n]);\n\nexport default {\n name: 'DtRecipeLeftbarGeneralRowIcon',\n components: {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n },\n\n props: {\n type: {\n type: String,\n default: null,\n },\n\n color: {\n type: String,\n default: null,\n },\n\n iconSize: {\n type: String,\n default: '300',\n },\n },\n\n computed: {\n isIconType () {\n return ![TYPES.DIALBOT, TYPES.CONTACT_CENTER].includes(this.type);\n },\n\n isContactCenterType () {\n return this.type === TYPES.CONTACT_CENTER;\n },\n\n isDialbotType () {\n return this.type === TYPES.DIALBOT;\n },\n\n getIconName () {\n return typeToIcon.get(this.type);\n },\n\n contactCenterIconClasses () {\n return [\n 'dt-leftbar-row__icon-cc',\n COLORS[this.color],\n ];\n },\n\n dialbotClasses () {\n return [\n 'd-d-flex',\n 'd-ai-center',\n 'd-jc-center',\n ];\n },\n },\n};\n</script>\n"],"names":["TYPES","COLORS","_createBlock","_resolveDynamicComponent","_createElementBlock","_normalizeClass","_createVNode","_createCommentVNode"],"mappings":";;;;AA4CA,MAAM,aAAa,oBAAI,IAAI;AAAA,EACzB,CAACA,0BAAM,OAAO,WAAW;AAAA,EACzB,CAACA,0BAAM,UAAU,cAAc;AAAA,EAC/B,CAACA,0BAAM,UAAU,UAAU;AAAA,EAC3B,CAACA,0BAAM,SAAS,YAAY;AAAA,EAC5B,CAACA,0BAAM,WAAW,oBAAoB;AAAA,EACtC,CAACA,0BAAM,gBAAgB,UAAU;AAAA,EACjC,CAACA,0BAAM,aAAa,aAAa;AAAA,EACjC,CAACA,0BAAM,gBAAgB,WAAW;AAAA,EAClC,CAACA,0BAAM,iBAAiB,kBAAkB;AAAA,EAC1C,CAAC,yBAAyB,gBAAgB;AAAA,EAC1C,CAAC,kBAAkB,cAAc;AAAA,EACjC,CAACA,0BAAM,UAAU,YAAY;AAAA,EAC7B,CAACA,0BAAM,SAAS,aAAa;AAAA,EAC7B,CAACA,0BAAM,WAAW,mBAAmB;AACvC,CAAC;AAED,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAAA,EAED,OAAO;AAAA,IACL,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,IAED,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,IAED,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,UAAU;AAAA,IACR,aAAc;AACZ,aAAO,CAAC,CAACA,0BAAM,SAASA,0BAAM,cAAc,EAAE,SAAS,KAAK,IAAI;AAAA,IACjE;AAAA,IAED,sBAAuB;AACrB,aAAO,KAAK,SAASA,0BAAM;AAAA,IAC5B;AAAA,IAED,gBAAiB;AACf,aAAO,KAAK,SAASA,0BAAM;AAAA,IAC5B;AAAA,IAED,cAAe;AACb,aAAO,WAAW,IAAI,KAAK,IAAI;AAAA,IAChC;AAAA,IAED,2BAA4B;AAC1B,aAAO;AAAA,QACL;AAAA,QACAC,0CAAO,KAAK,KAAK;AAAA;IAEpB;AAAA,IAED,iBAAkB;AAChB,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA;IAEH;AAAA,EACF;AACH;;;SAhIU,SAAU,2BADlBC,YADFC,wBAGS,SAAW,WAAA,GAAA;AAAA,IAHpB,KAAA;AAAA,IAIK,MAAM,OAAQ;AAAA,2BAGJ,SAAmB,oCADhCC,mBAGE,OAAA;AAAA,IATJ,KAAA;AAAA,IAQK,OARLC,eAQY,SAAwB,wBAAA;AAAA,iBAGrB,SAAa,8BAD1BD,mBAQM,OAAA;AAAA,IAlBR,KAAA;AAAA,IAYK,OAZLC,eAYY,SAAc,cAAA;AAAA,IACtB,WAAQ;AAAA;IAERC,YAEE,4BAAA,EADA,MAAK,MAAK,CAAA;AAAA,WAhBhBC,mBAAA,IAAA,IAAA;;;"}
1
+ {"version":3,"file":"leftbar_general_row_icon.vue.js","sources":["../../../../recipes/leftbar/general_row/leftbar_general_row_icon.vue"],"sourcesContent":["<template>\n <component\n :is=\"getIconName\"\n v-if=\"isIconType\"\n :size=\"iconSize\"\n />\n <div\n v-else-if=\"isContactCenterType\"\n :class=\"contactCenterIconClasses\"\n />\n <div\n v-else-if=\"isDialbotType\"\n :class=\"dialbotClasses\"\n data-qa=\"general-row-dialbot\"\n >\n <dt-icon-dialbot\n size=\"500\"\n />\n </div>\n</template>\n\n<script>\nimport {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n} from '@dialpad/dialtone-icons/vue3';\nimport {\n LEFTBAR_GENERAL_ROW_TYPES as TYPES,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as COLORS,\n} from '@/recipes/leftbar/general_row/general_row_constants';\n\nconst typeToIcon = new Map([\n [TYPES.INBOX, DtIconInbox],\n [TYPES.CONTACTS, DtIconContacts],\n [TYPES.CHANNELS, DtIconHash],\n [TYPES.THREADS, DtIconThread],\n [TYPES.LAUNCHPAD, DtIconLayoutTemplate],\n [TYPES.LOCKED_CHANNEL, DtIconLock],\n [TYPES.QUICK_START, DtIconSparkle],\n [TYPES.COACHING_GROUP, DtIconUsers],\n [TYPES.COACHING_CENTER, DtIconExternalLink],\n ['locked channel unread', DtIconLockFilled],\n ['channel unread', DtIconHashBold],\n [TYPES.ASSIGNED, DtIconAtSign],\n [TYPES.DIGITAL, DtIconLaptop2],\n [TYPES.SCHEDULED, DtIconCalendarClock],\n]);\n\nexport default {\n name: 'DtRecipeLeftbarGeneralRowIcon',\n components: {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n },\n\n props: {\n type: {\n type: String,\n default: null,\n },\n\n color: {\n type: String,\n default: null,\n },\n\n iconSize: {\n type: String,\n default: '300',\n },\n },\n\n computed: {\n isIconType () {\n return ![TYPES.DIALBOT, TYPES.CONTACT_CENTER].includes(this.type);\n },\n\n isContactCenterType () {\n return this.type === TYPES.CONTACT_CENTER;\n },\n\n isDialbotType () {\n return this.type === TYPES.DIALBOT;\n },\n\n getIconName () {\n return typeToIcon.get(this.type);\n },\n\n contactCenterIconClasses () {\n return [\n 'dt-leftbar-row__icon-cc',\n COLORS[this.color],\n ];\n },\n\n dialbotClasses () {\n return [\n 'd-d-flex',\n 'd-ai-center',\n 'd-jc-center',\n ];\n },\n },\n};\n</script>\n"],"names":["TYPES","COLORS","_createBlock","_resolveDynamicComponent","_createElementBlock","_normalizeClass","_createVNode","_createCommentVNode"],"mappings":";;;;AA4CA,MAAM,aAAa,oBAAI,IAAI;AAAA,EACzB,CAACA,0BAAM,OAAO,WAAW;AAAA,EACzB,CAACA,0BAAM,UAAU,cAAc;AAAA,EAC/B,CAACA,0BAAM,UAAU,UAAU;AAAA,EAC3B,CAACA,0BAAM,SAAS,YAAY;AAAA,EAC5B,CAACA,0BAAM,WAAW,oBAAoB;AAAA,EACtC,CAACA,0BAAM,gBAAgB,UAAU;AAAA,EACjC,CAACA,0BAAM,aAAa,aAAa;AAAA,EACjC,CAACA,0BAAM,gBAAgB,WAAW;AAAA,EAClC,CAACA,0BAAM,iBAAiB,kBAAkB;AAAA,EAC1C,CAAC,yBAAyB,gBAAgB;AAAA,EAC1C,CAAC,kBAAkB,cAAc;AAAA,EACjC,CAACA,0BAAM,UAAU,YAAY;AAAA,EAC7B,CAACA,0BAAM,SAAS,aAAa;AAAA,EAC7B,CAACA,0BAAM,WAAW,mBAAmB;AACvC,CAAC;AAED,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAAA,EAED,OAAO;AAAA,IACL,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,IAED,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,IAED,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,UAAU;AAAA,IACR,aAAc;AACZ,aAAO,CAAC,CAACA,0BAAM,SAASA,0BAAM,cAAc,EAAE,SAAS,KAAK,IAAI;AAAA,IACjE;AAAA,IAED,sBAAuB;AACrB,aAAO,KAAK,SAASA,0BAAM;AAAA,IAC5B;AAAA,IAED,gBAAiB;AACf,aAAO,KAAK,SAASA,0BAAM;AAAA,IAC5B;AAAA,IAED,cAAe;AACb,aAAO,WAAW,IAAI,KAAK,IAAI;AAAA,IAChC;AAAA,IAED,2BAA4B;AAC1B,aAAO;AAAA,QACL;AAAA,QACAC,0CAAO,KAAK,KAAK;AAAA;IAEpB;AAAA,IAED,iBAAkB;AAChB,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA;IAEH;AAAA,EACF;AACH;;;SA/HU,SAAU,2BAFlBC,YADFC,wBAES,SAAW,WAAA,GAAA;AAAA,IAFpB,KAAA;AAAA,IAIK,MAAM,OAAQ;AAAA,2BAGJ,SAAmB,oCADhCC,mBAGE,OAAA;AAAA,IATJ,KAAA;AAAA,IAQK,OARLC,eAQY,SAAwB,wBAAA;AAAA,iBAGrB,SAAa,8BAD1BD,mBAQM,OAAA;AAAA,IAlBR,KAAA;AAAA,IAYK,OAZLC,eAYY,SAAc,cAAA;AAAA,IACtB,WAAQ;AAAA;IAERC,YAEE,4BAAA,EADA,MAAK,MAAK,CAAA;AAAA,WAhBhBC,mBAAA,IAAA,IAAA;;;"}
@@ -330,7 +330,7 @@
330
330
  }
331
331
  .dt-recipe--callbar-button-with-popover {
332
332
  display: flex;
333
- align-items: start;
333
+ align-items: flex-start;
334
334
  }
335
335
  .ivr_node {
336
336
  width: 280px;
@@ -901,20 +901,20 @@
901
901
  background-color: hsla(var(--dt-color-blue-200-hsl) / 50%);
902
902
  color: var(--dt-theme-topbar-button-color-foreground-hover);
903
903
  }
904
- .dt-contact-info[data-v-89401231] {
904
+ .dt-contact-info[data-v-42a664ff] {
905
905
  --contact-info-avatar-border-color: var(--dt-color-surface-primary);
906
906
  display: flex;
907
907
  }
908
- .dt-contact-info[data-v-89401231] .dt-item-layout {
908
+ .dt-contact-info[data-v-42a664ff] .dt-item-layout {
909
909
  flex: 1 1 0;
910
910
  }
911
- .dt-contact-info[data-v-89401231] .dt-item-layout--content {
911
+ .dt-contact-info[data-v-42a664ff] .dt-item-layout--content {
912
912
  /*
913
913
  DP-74536: Add `min-width` to make the width of "contact info" adjustable.
914
914
  */
915
915
  min-width: var(--dt-space-825);
916
916
  }
917
- .dt-contact-info[data-v-89401231] .dt-item-layout--left {
917
+ .dt-contact-info[data-v-42a664ff] .dt-item-layout--left {
918
918
  /*
919
919
  DP-74536: To make 'Avatar' in fixed position when resizing the window.
920
920
  */
@@ -922,26 +922,26 @@
922
922
  justify-content: flex-start;
923
923
  align-items: center;
924
924
  }
925
- .dt-contact-info[data-v-89401231] .dt-item-layout--right {
925
+ .dt-contact-info[data-v-42a664ff] .dt-item-layout--right {
926
926
  /*
927
927
  DP-74536: Remove `min-width` which cause extra unused empty space on the right of "contact info".
928
928
  */
929
929
  min-width: 0;
930
930
  align-items: center;
931
931
  }
932
- .dt-contact-info__left[data-v-89401231] {
932
+ .dt-contact-info__left[data-v-42a664ff] {
933
933
  position: relative;
934
934
  background-color: transparent;
935
935
  background-image: none;
936
936
  border-width: 0;
937
937
  cursor: pointer;
938
938
  }
939
- .dt-contact-info--avatars[data-v-89401231] {
939
+ .dt-contact-info--avatars[data-v-42a664ff] {
940
940
  margin-right: var(--dt-space-300-negative);
941
941
  display: flex;
942
942
  flex-direction: row;
943
943
  }
944
- .dt-contact-info--avatars .d-avatar[data-v-89401231] {
944
+ .dt-contact-info--avatars .d-avatar[data-v-42a664ff] {
945
945
  border-radius: var(--dt-size-radius-pill);
946
946
  border: var(--dt-size-300) solid var(--contact-info-avatar-border-color);
947
947
  box-sizing: unset;
@@ -29627,6 +29627,7 @@ export function stringToUnicode(str: any): string;
29627
29627
  export function codeToEmojiData(code: any): any;
29628
29628
  export function findShortCodes(textContent: any): Set<any>;
29629
29629
  export function filterValidShortCodes(shortcodes: any): Set<any>;
29630
+ export function findEmojis(textContent: any): Set<any>;
29630
29631
  export const emojiRegex: RegExp;
29631
29632
  export const emojiVersion: "8.0";
29632
29633
  export const defaultEmojiAssetUrl: string;