@dialpad/dialtone-vue 3.61.3 → 3.61.4

package/dist/dialtone-vue.common.js

@@ -1298,20 +1298,16 @@ if (typeof window !== 'undefined') {
 
 ;// CONCATENATED MODULE: external {"commonjs":"vue","commonjs2":"vue","root":"Vue"}
 const external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject = require("vue");
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/avatar/avatar.vue?vue&type=template&id=6e4423a1
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/avatar/avatar.vue?vue&type=template&id=3f59de3c
 
 const _hoisted_1 = ["id"];
 const _hoisted_2 = {
-  key: 0,
-  class: "d-bgc-black-900 d-o70 d-ps-absolute d-w100p d-h100p d-mn4 d-ba d-baw4 d-bc-white d-bar-pill d-d-flex d-ai-center d-zi-base"
-};
-const _hoisted_3 = {
   key: 1,
   class: "d-fs-200 d-fw-bold d-fc-white d-w100p d-ta-center"
 };
-const _hoisted_4 = {
+const _hoisted_3 = {
   key: 1,
-  class: "d-avatar__count d-zi-base1",
+  class: "d-avatar__count d-zi-base",
   "data-qa": "dt-avatar-count"
 };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
@@ -1332,19 +1328,22 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   }) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $options.showInitials ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", {
     key: 1,
     class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)(["d-ps-absolute d-zi-base", $data.AVATAR_KIND_MODIFIERS.initials])
-  }, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($data.formattedInitials), 3)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)], 2), $props.overlayIcon || $props.overlayText ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", _hoisted_2, [$props.overlayIcon ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_icon, {
+  }, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($data.formattedInitials), 3)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)], 2), $props.overlayIcon || $props.overlayText ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", {
+    key: 0,
+    class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)($options.overlayClasses)
+  }, [$props.overlayIcon ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_icon, {
     key: 0,
     class: "d-fc-white d-w100p",
     name: $props.overlayIcon
-  }, null, 8, ["name"])) : $props.overlayText ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("p", _hoisted_3, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($props.overlayText), 1)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $options.showGroup ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", _hoisted_4, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($options.formattedGroup), 1)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $props.presence && !$options.showGroup ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_presence, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.mergeProps)({
+  }, null, 8, ["name"])) : $props.overlayText ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("p", _hoisted_2, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($props.overlayText), 1)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)], 2)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $options.showGroup ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", _hoisted_3, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($options.formattedGroup), 1)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $props.presence && !$options.showGroup ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_presence, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.mergeProps)({
     key: 2,
     presence: $props.presence,
-    class: ["d-zi-base1", ['d-avatar__presence', $data.AVATAR_PRESENCE_SIZE_MODIFIERS[$props.size]]]
+    class: ["d-zi-base", ['d-avatar__presence', $data.AVATAR_PRESENCE_SIZE_MODIFIERS[$props.size]]]
   }, $props.presenceProps, {
     "data-qa": "dt-presence"
   }), null, 16, ["presence", "class"])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)], 14, _hoisted_1);
 }
-;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=template&id=6e4423a1
+;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=template&id=3f59de3c
 
 ;// CONCATENATED MODULE: ./common/constants.js
 /* TODO: Move and sort these in a constants directory
@@ -1964,6 +1963,14 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
     overlayText: {
       type: String,
       default: ''
+    },
+
+    /**
+     * Used to customize the avatar overlay
+     */
+    overlayClass: {
+      type: [String, Array, Object],
+      default: ''
     }
   },
 
@@ -1989,12 +1996,16 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
       }];
     },
 
+    overlayClasses() {
+      return ['d-bgc-black-900 d-o70 d-ps-absolute d-w100p d-h100p d-d-flex d-ai-center d-bar-circle d-zi-base', this.overlayClass];
+    },
+
     showDefaultSlot() {
       return this.kind !== 'initials' || this.kind === 'image' && this.imageLoadedSuccessfully === true;
     },
 
     showInitials() {
-      return this.kind === 'initials' || this.kind === 'image' && this.initials;
+      return this.kind === 'initials' || this.kind === 'image' && this.initials && this.imageLoadedSuccessfully !== true;
     },
 
     showGroup() {
@@ -2050,13 +2061,11 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
       this.initializing = false;
     },
 
+    // eslint-disable-next-line complexity
     kindHandler(el) {
       switch (this.kind) {
         case 'image':
-          if (this.showInitials) {
-            el.classList.add('d-avatar__image', 'd-zi-base1');
-          }
-
+          el.classList.add('d-avatar__image');
           this.validateImageAttrsPresence();
           this.setImageListeners(el);
           break;
@@ -2083,12 +2092,7 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
     },
 
     formatInitials(initials) {
-      if (!initials) {
-        this.formattedInitials = '';
-        return;
-      }
-
-      if (this.validatedSize === 'xs') {
+      if (!initials || this.validatedSize === 'xs') {
         this.formattedInitials = '';
       } else if (this.validatedSize === 'sm') {
         this.formattedInitials = initials.trim()[0];
@@ -2146,8 +2150,7 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
       }
 
       const rng = seedrandom_default()(this.seed);
-      const shuffledColors = Array.from(colors).sort(() => 0.5 - rng());
-      return shuffledColors;
+      return Array.from(colors).sort(() => 0.5 - rng()); // shuffle colors
     },
 
     validateImageAttrsPresence() {
@@ -2155,7 +2158,7 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
       // image is already described by something else (ex: visible description)
       // eslint-disable-next-line no-unneeded-ternary
 
-      const isAltMissing = this.$refs.canvas.children[0].getAttribute('alt') === null ? true : false;
+      const isAltMissing = this.$refs.canvas.children[0].getAttribute('alt') === null;
 
       if (isSrcMissing || isAltMissing) {
         (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.warn)('src and alt attributes are required for image avatars', this);
@@ -2178,10 +2181,10 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
 });
 ;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=script&lang=js
  
-;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-32.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/avatar/avatar.vue?vue&type=style&index=0&id=6e4423a1&lang=less
+;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-32.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/avatar/avatar.vue?vue&type=style&index=0&id=3f59de3c&lang=less
 // extracted by mini-css-extract-plugin
 
-;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=style&index=0&id=6e4423a1&lang=less
+;// CONCATENATED MODULE: ./components/avatar/avatar.vue?vue&type=style&index=0&id=3f59de3c&lang=less
 
 ;// CONCATENATED MODULE: ./components/avatar/avatar.vue
 
@@ -2210,7 +2213,7 @@ const badgevue_type_template_id_e4533274_hoisted_2 = {
 const badgevue_type_template_id_e4533274_hoisted_3 = {
   class: "d-badge__label"
 };
-const badgevue_type_template_id_e4533274_hoisted_4 = {
+const _hoisted_4 = {
   key: 2,
   class: "d-badge__icon-right"
 };
@@ -2223,7 +2226,7 @@ function badgevue_type_template_id_e4533274_render(_ctx, _cache, $props, $setup,
   }, [$props.decoration ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", badgevue_type_template_id_e4533274_hoisted_1)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $props.iconLeft || $props.type === 'ai' ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", badgevue_type_template_id_e4533274_hoisted_2, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_icon, {
     name: $props.iconLeft || 'dialpad-ai',
     size: "200"
-  }, null, 8, ["name"])])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("span", badgevue_type_template_id_e4533274_hoisted_3, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "default", {}, () => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($props.text), 1)])]), $props.iconRight ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", badgevue_type_template_id_e4533274_hoisted_4, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_icon, {
+  }, null, 8, ["name"])])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("span", badgevue_type_template_id_e4533274_hoisted_3, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "default", {}, () => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($props.text), 1)])]), $props.iconRight ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("span", _hoisted_4, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_icon, {
     name: $props.iconRight,
     size: "200"
   }, null, 8, ["name"])])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)], 2);
@@ -21634,16 +21637,16 @@ const combobox_multi_select_exports_ = /*#__PURE__*/(0,exportHelper/* default */
 ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_multi_select/index.js
 
 
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button/callbar_button.vue?vue&type=template&id=3c417651
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button/callbar_button.vue?vue&type=template&id=480dd6bb
 
-function callbar_buttonvue_type_template_id_3c417651_render(_ctx, _cache, $props, $setup, $data, $options) {
+function callbar_buttonvue_type_template_id_480dd6bb_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dt_button = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-button");
 
   const _component_dt_tooltip = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-tooltip");
 
   return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_tooltip, {
     id: $props.id,
-    offset: [0, -12]
+    offset: [0, 8]
   }, {
     anchor: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("span", {
       class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)({
@@ -21666,7 +21669,7 @@ function callbar_buttonvue_type_template_id_3c417651_render(_ctx, _cache, $props
     _: 3
   }, 8, ["id"]);
 }
-;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/callbar_button.vue?vue&type=template&id=3c417651
+;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/callbar_button.vue?vue&type=template&id=480dd6bb
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button/callbar_button.vue?vue&type=script&lang=js
 
@@ -21821,10 +21824,10 @@ const VALID_WIDTH_SIZE = ['sm', 'md', 'lg', 'xl'];
 });
 ;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/callbar_button.vue?vue&type=script&lang=js
  
-;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-32.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button/callbar_button.vue?vue&type=style&index=0&id=3c417651&lang=less
+;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-32.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button/callbar_button.vue?vue&type=style&index=0&id=480dd6bb&lang=less
 // extracted by mini-css-extract-plugin
 
-;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/callbar_button.vue?vue&type=style&index=0&id=3c417651&lang=less
+;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/callbar_button.vue?vue&type=style&index=0&id=480dd6bb&lang=less
 
 ;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/callbar_button.vue
 
@@ -21834,17 +21837,17 @@ const VALID_WIDTH_SIZE = ['sm', 'md', 'lg', 'xl'];
 ;
 
 
-const callbar_button_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(callbar_buttonvue_type_script_lang_js, [['render',callbar_buttonvue_type_template_id_3c417651_render]])
+const callbar_button_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(callbar_buttonvue_type_script_lang_js, [['render',callbar_buttonvue_type_template_id_480dd6bb_render]])
 
 /* harmony default export */ const callbar_button = (callbar_button_exports_);
 ;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/index.js
 
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=563857c2
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=888f13cc
 
-const callbar_button_with_popovervue_type_template_id_563857c2_hoisted_1 = {
+const callbar_button_with_popovervue_type_template_id_888f13cc_hoisted_1 = {
   class: "d-d-flex d-ai-center"
 };
-function callbar_button_with_popovervue_type_template_id_563857c2_render(_ctx, _cache, $props, $setup, $data, $options) {
+function callbar_button_with_popovervue_type_template_id_888f13cc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dt_recipe_callbar_button = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-recipe-callbar-button");
 
   const _component_dt_icon = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-icon");
@@ -21853,7 +21856,7 @@ function callbar_button_with_popovervue_type_template_id_563857c2_render(_ctx, _
 
   const _component_dt_popover = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-popover");
 
-  return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", callbar_button_with_popovervue_type_template_id_563857c2_hoisted_1, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_recipe_callbar_button, {
+  return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", callbar_button_with_popovervue_type_template_id_888f13cc_hoisted_1, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_recipe_callbar_button, {
     "aria-label": $props.ariaLabel,
     disabled: $props.disabled,
     active: $props.active,
@@ -21875,6 +21878,7 @@ function callbar_button_with_popovervue_type_template_id_563857c2_render(_ctx, _
     placement: $props.placement,
     "initial-focus-element": $props.initialFocusElement,
     "show-close-button": $props.showCloseButton,
+    offset: [0, 16],
     padding: "none",
     class: "dt-recipe--callbar-button-with-popover--popover-wrapper",
     "dialog-class": ['dt-recipe--callbar-button-with-popover--popover', $props.contentClass],
@@ -21904,7 +21908,7 @@ function callbar_button_with_popovervue_type_template_id_563857c2_render(_ctx, _
     _: 3
   }, 16, ["id", "open", "placement", "initial-focus-element", "show-close-button", "dialog-class", "onOpened"])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)]);
 }
-;// CONCATENATED MODULE: ./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=563857c2
+;// CONCATENATED MODULE: ./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=888f13cc
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=script&lang=js
 
@@ -22137,10 +22141,10 @@ function callbar_button_with_popovervue_type_template_id_563857c2_render(_ctx, _
 });
 ;// CONCATENATED MODULE: ./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=script&lang=js
  
-;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-32.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=style&index=0&id=563857c2&lang=less
+;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-32.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=style&index=0&id=888f13cc&lang=less
 // extracted by mini-css-extract-plugin
 
-;// CONCATENATED MODULE: ./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=style&index=0&id=563857c2&lang=less
+;// CONCATENATED MODULE: ./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=style&index=0&id=888f13cc&lang=less
 
 ;// CONCATENATED MODULE: ./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue
 
@@ -22150,36 +22154,36 @@ function callbar_button_with_popovervue_type_template_id_563857c2_render(_ctx, _
 ;
 
 
-const callbar_button_with_popover_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(callbar_button_with_popovervue_type_script_lang_js, [['render',callbar_button_with_popovervue_type_template_id_563857c2_render]])
+const callbar_button_with_popover_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(callbar_button_with_popovervue_type_script_lang_js, [['render',callbar_button_with_popovervue_type_template_id_888f13cc_render]])
 
 /* harmony default export */ const callbar_button_with_popover = (callbar_button_with_popover_exports_);
 ;// CONCATENATED MODULE: ./recipes/buttons/callbar_button_with_popover/index.js
 
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/list_items/contact_info/contact_info.vue?vue&type=template&id=aa26d78e
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/list_items/contact_info/contact_info.vue?vue&type=template&id=2736e6a2
 
-const contact_infovue_type_template_id_aa26d78e_hoisted_1 = {
+const contact_infovue_type_template_id_2736e6a2_hoisted_1 = {
   class: "d-ps-relative",
   "data-qa": "contact-info-left"
 };
-const contact_infovue_type_template_id_aa26d78e_hoisted_2 = {
+const contact_infovue_type_template_id_2736e6a2_hoisted_2 = {
   key: 0,
   class: "d-mrn4 d-d-flex d-fd-row"
 };
-const contact_infovue_type_template_id_aa26d78e_hoisted_3 = ["src", "alt"];
-const contact_infovue_type_template_id_aa26d78e_hoisted_4 = ["src", "alt"];
-const contact_infovue_type_template_id_aa26d78e_hoisted_5 = {
+const contact_infovue_type_template_id_2736e6a2_hoisted_3 = ["src", "alt"];
+const contact_infovue_type_template_id_2736e6a2_hoisted_4 = ["src", "alt"];
+const contact_infovue_type_template_id_2736e6a2_hoisted_5 = {
   "data-qa": "contact-info-header"
 };
-const contact_infovue_type_template_id_aa26d78e_hoisted_6 = {
+const contact_infovue_type_template_id_2736e6a2_hoisted_6 = {
   "data-qa": "contact-info-subtitle"
 };
-const contact_infovue_type_template_id_aa26d78e_hoisted_7 = {
+const contact_infovue_type_template_id_2736e6a2_hoisted_7 = {
   "data-qa": "contact-info-bottom"
 };
-const contact_infovue_type_template_id_aa26d78e_hoisted_8 = {
+const contact_infovue_type_template_id_2736e6a2_hoisted_8 = {
   "data-qa": "contact-info-right"
 };
-function contact_infovue_type_template_id_aa26d78e_render(_ctx, _cache, $props, $setup, $data, $options) {
+function contact_infovue_type_template_id_2736e6a2_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dt_avatar = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-avatar");
 
   const _component_dt_list_item = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-list-item");
@@ -22190,7 +22194,7 @@ function contact_infovue_type_template_id_aa26d78e_render(_ctx, _cache, $props,
     "element-type": "div",
     "data-qa": "contact-info"
   }, {
-    left: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_aa26d78e_hoisted_1, [$props.avatarList ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", contact_infovue_type_template_id_aa26d78e_hoisted_2, [((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(true), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)(external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.Fragment, null, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderList)($props.avatarList, (avatar, index) => {
+    left: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_2736e6a2_hoisted_1, [$props.avatarList ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", contact_infovue_type_template_id_2736e6a2_hoisted_2, [((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(true), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)(external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.Fragment, null, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderList)($props.avatarList, (avatar, index) => {
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", {
         key: index
       }, [avatar.src ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_avatar, {
@@ -22198,6 +22202,7 @@ function contact_infovue_type_template_id_aa26d78e_render(_ctx, _cache, $props,
         size: $props.avatarSize,
         "overlay-icon": avatar.icon,
         "overlay-text": avatar.text,
+        "overlay-class": "d-mn4 d-ba d-baw4 d-bc-white d-box-unset",
         "avatar-class": ['d-ba d-baw4 d-bc-white d-bar-pill', {
           'd-mln24': index > 0
         }]
@@ -22206,13 +22211,14 @@ function contact_infovue_type_template_id_aa26d78e_render(_ctx, _cache, $props,
           "data-qa": "dt-contact-avatar",
           src: avatar.src,
           alt: avatar.initials
-        }, null, 8, contact_infovue_type_template_id_aa26d78e_hoisted_3)]),
+        }, null, 8, contact_infovue_type_template_id_2736e6a2_hoisted_3)]),
         _: 2
       }, 1032, ["size", "overlay-icon", "overlay-text", "avatar-class"])) : avatar.initials ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_avatar, {
         key: 1,
         size: $props.avatarSize,
         "overlay-icon": avatar.icon,
         "overlay-text": avatar.text,
+        "overlay-class": "d-mn4 d-ba d-baw4 d-bc-white d-box-unset",
         "avatar-class": ['d-ba d-baw4 d-bc-white d-bar-pill', {
           'd-mln24': index > 0
         }]
@@ -22229,7 +22235,7 @@ function contact_infovue_type_template_id_aa26d78e_render(_ctx, _cache, $props,
         "data-qa": "dt-contact-avatar",
         src: $props.avatarSrc,
         alt: $props.avatarInitials
-      }, null, 8, contact_infovue_type_template_id_aa26d78e_hoisted_4)]),
+      }, null, 8, contact_infovue_type_template_id_2736e6a2_hoisted_4)]),
       _: 1
     }, 8, ["size", "presence"])) : $props.avatarInitials ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createBlock)(_component_dt_avatar, {
       key: 2,
@@ -22239,14 +22245,14 @@ function contact_infovue_type_template_id_aa26d78e_render(_ctx, _cache, $props,
       default: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createTextVNode)((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)($props.avatarInitials), 1)]),
       _: 1
     }, 8, ["size", "presence"])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)])]),
-    default: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_aa26d78e_hoisted_5, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "header")])]),
-    subtitle: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_aa26d78e_hoisted_6, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "subtitle")])]),
-    bottom: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_aa26d78e_hoisted_7, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "bottom")])]),
-    right: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_aa26d78e_hoisted_8, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "right")])]),
+    default: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_2736e6a2_hoisted_5, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "header")])]),
+    subtitle: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_2736e6a2_hoisted_6, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "subtitle")])]),
+    bottom: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_2736e6a2_hoisted_7, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "bottom")])]),
+    right: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.withCtx)(() => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", contact_infovue_type_template_id_2736e6a2_hoisted_8, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "right")])]),
     _: 3
   }, 8, ["id", "role"]);
 }
-;// CONCATENATED MODULE: ./recipes/list_items/contact_info/contact_info.vue?vue&type=template&id=aa26d78e
+;// CONCATENATED MODULE: ./recipes/list_items/contact_info/contact_info.vue?vue&type=template&id=2736e6a2
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./recipes/list_items/contact_info/contact_info.vue?vue&type=script&lang=js
 
@@ -22346,7 +22352,7 @@ function contact_infovue_type_template_id_aa26d78e_render(_ctx, _cache, $props,
 
 
 ;
-const contact_info_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(contact_infovue_type_script_lang_js, [['render',contact_infovue_type_template_id_aa26d78e_render]])
+const contact_info_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(contact_infovue_type_script_lang_js, [['render',contact_infovue_type_template_id_2736e6a2_render]])
 
 /* harmony default export */ const contact_info = (contact_info_exports_);
 ;// CONCATENATED MODULE: ./recipes/list_items/contact_info/index.js