@dialpad/dialtone-vue 2.62.0 → 2.64.0

package/dist/dialtone-vue.common.js

@@ -402,7 +402,7 @@ __webpack_require__.r(__webpack_exports__);
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_vue_cli_service_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, ".dt-leftbar-row{--leftbar-row-color-foreground:var(--theme-sidebar-color);--leftbar-row-color-background:transparent;--leftbar-row-radius:100em;--leftbar-row-alpha-color-foreground:var(--theme-sidebar-icon-color);--leftbar-row-alpha-width:calc(var(--size-300)*10);--leftbar-row-alpha-height:calc(var(--size-300)*9);--leftbar-row-alpha-opacity:100%;--leftbar-row-omega-min-width:0;--leftbar-row-omega-height:var(--leftbar-row-alpha-height);--leftbar-row-omega-visibility:visible;--leftbar-row-description-font-weight:var(--fw-normal);--leftbar-row-description-font-size:var(--fs-200);--leftbar-row-description-line-height:var(--lh-200);--leftbar-row-description-opacity:100%;--leftbar-row-status-color-foreground:var(--theme-sidebar-status-color);--leftbar-row-status-font-size:var(--fs-100);--leftbar-row-status-line-height:var(--lh-100);--leftbar-row-action-position-right:var(--size-400);--leftbar-row-action-position-bottom:50%;--leftbar-row-action-width:calc(var(--size-300)*6);--leftbar-row-action-height:var(--leftbar-row-action-width);position:relative}.dt-leftbar-row:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-min-width:var(--leftbar-row-alpha-width)}.dt-leftbar-row--has-unread{--leftbar-row-description-font-weight:var(--fw-bold);--leftbar-row-alpha-color-foreground:var(--leftbar-row-color-foreground)}.dt-leftbar-row--has-unread:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row--muted{--leftbar-row-alpha-opacity:50%;--leftbar-row-description-opacity:60%}.dt-leftbar-row--selected{--leftbar-row-color-background:var(--theme-sidebar-active-row-color-background);--leftbar-row-color-foreground:var(--theme-sidebar-active-row-color)}.dt-leftbar-row--selected .d-avatar__count{--avatar-count-color-shadow:var(--theme-sidebar-active-row-color-background)}.dt-leftbar-row--action-focused{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row__primary{display:flex;align-items:center;flex:1;width:100%;text-align:left;color:var(--leftbar-row-color-foreground);text-decoration:none;background-color:var(--leftbar-row-color-background);border-radius:var(--leftbar-row-radius);transition-duration:var(--td200);transition-property:background-color,border,box-shadow;transition-timing-function:var(--ttf-out-quint);-webkit-appearance:none;appearance:none;font-size:inhert;line-height:inherit;margin:0;border:0;padding:0;cursor:pointer}.dt-leftbar-row__primary:hover{--leftbar-row-color-background:var(--theme-sidebar-row-color-background-hover)}.dt-leftbar-row__primary:active{--leftbar-row-color-background:var(--theme-sidebar-active-row-color-background)}.dt-leftbar-row__primary:focus-visible{box-shadow:var(--bs-focus-ring-inset)}.dt-leftbar-row__action{position:absolute;right:var(--leftbar-row-action-position-right);top:var(--leftbar-row-action-position-bottom);transform:translateY(calc(var(--leftbar-row-action-position-bottom)*-1));opacity:0}.dt-leftbar-row:hover .dt-leftbar-row__action,.dt-leftbar-row__action:focus,.dt-leftbar-row__action:focus-within{opacity:1}.dt-leftbar-row__action-button{width:var(--leftbar-row-action-width);height:var(--leftbar-row-action-height)}.dt-leftbar-row__alpha{color:var(--leftbar-row-alpha-color-foreground);display:flex;box-sizing:border-box;justify-content:center;align-items:center;padding-left:var(--space-400);padding-right:var(--space-400);width:var(--leftbar-row-alpha-width);height:var(--leftbar-row-alpha-height);opacity:var(--leftbar-row-alpha-opacity)}.dt-leftbar-row__label{flex:1;min-width:0}.dt-leftbar-row__omega{display:flex;gap:var(--space-300);justify-content:end;align-items:center;box-sizing:border-box;min-width:var(--leftbar-row-omega-min-width);height:var(--leftbar-row-omega-height);padding-left:var(--space-400);padding-right:var(--space-400);visibility:var(--leftbar-row-omega-visibility)}.dt-leftbar-row__active-voice{color:var(--fc-success);-webkit-animation-name:opacity-pulsate;-webkit-animation-duration:1s;-webkit-animation-iteration-count:infinite;-webkit-animation-fill-mode:both;-moz-animation-name:opacity-pulsate;-moz-animation-duration:1s;-moz-animation-iteration-count:infinite;-moz-animation-fill-mode:both;animation-name:opacity-pulsate;animation-duration:1s;animation-iteration-count:infinite;animation-fill-mode:both}.dt-leftbar-row__dnd{color:var(--black-600);font-size:var(--fs-100);font-weight:var(--fw-bold)}.dt-leftbar-row__description{font-weight:var(--leftbar-row-description-font-weight);font-size:var(--leftbar-row-description-font-size);line-height:var(--leftbar-row-description-line-height);opacity:var(--leftbar-row-description-opacity)}.dt-leftbar-row__description,.dt-leftbar-row__status{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-leftbar-row__status{color:var(--leftbar-row-status-color-foreground);font-size:var(--leftbar-row-status-font-size);line-height:var(--leftbar-row-status-line-height);padding-bottom:var(--space-100)}.dt-leftbar-row__meta-context~.dt-leftbar-row__meta-custom:not(:empty):before{content:\" • \";color:var(--theme-sidebar-status-color)}.dt-leftbar-row__icon-cc{border-radius:var(--size-200);width:calc(var(--size-300)*3.5);height:calc(var(--size-300)*3.5)}.opacity-pulsate{-webkit-animation-name:opacity-pulsate;-webkit-animation-duration:1s;-webkit-animation-iteration-count:infinite;-webkit-animation-fill-mode:both;-moz-animation-name:opacity-pulsate;-moz-animation-duration:1s;-moz-animation-iteration-count:infinite;-moz-animation-fill-mode:both;animation-name:opacity-pulsate;animation-duration:1s;animation-iteration-count:infinite;animation-fill-mode:both}@keyframes opacity-pulsate{0%,to{opacity:.2}50%{opacity:1}}", ""]);
+___CSS_LOADER_EXPORT___.push([module.id, ".dt-leftbar-row{--leftbar-row-color-foreground:var(--theme-sidebar-color);--leftbar-row-color-background:transparent;--leftbar-row-radius:100em;--leftbar-row-opacity:100%;--leftbar-row-alpha-color-foreground:var(--theme-sidebar-icon-color);--leftbar-row-alpha-width:calc(var(--size-300)*10);--leftbar-row-alpha-height:calc(var(--size-300)*9);--leftbar-row-omega-min-width:0;--leftbar-row-omega-height:var(--leftbar-row-alpha-height);--leftbar-row-omega-visibility:visible;--leftbar-row-description-font-weight:var(--fw-normal);--leftbar-row-description-font-size:var(--fs-200);--leftbar-row-description-line-height:var(--lh-200);--leftbar-row-status-color-foreground:var(--theme-sidebar-status-color);--leftbar-row-status-font-size:var(--fs-100);--leftbar-row-status-line-height:var(--lh-100);--leftbar-row-action-position-right:var(--size-400);--leftbar-row-action-position-bottom:50%;--leftbar-row-action-width:calc(var(--size-300)*6);--leftbar-row-action-height:var(--leftbar-row-action-width);position:relative;opacity:var(--leftbar-row-opacity)}.dt-leftbar-row:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-min-width:var(--leftbar-row-alpha-width)}.dt-leftbar-row--has-unread{--leftbar-row-description-font-weight:var(--fw-bold);--leftbar-row-alpha-color-foreground:var(--leftbar-row-color-foreground)}.dt-leftbar-row--has-unread:not(.dt-leftbar-row--no-action):hover{--leftbar-row-omega-visibility:hidden}.dt-leftbar-row--muted{--leftbar-row-opacity:50%}.dt-leftbar-row--selected{--leftbar-row-color-background:var(--theme-sidebar-active-row-color-background);--leftbar-row-color-foreground:var(--theme-sidebar-active-row-color)}.dt-leftbar-row--selected .d-avatar__count{--avatar-count-color-shadow:var(--theme-sidebar-active-row-color-background)}.dt-leftbar-row--action-focused{--leftbar-row-omega-visibility:hidden;--leftbar-row-omega-min-width:var(--leftbar-row-alpha-width)}.dt-leftbar-row__primary{display:flex;align-items:center;flex:1;width:100%;text-align:left;color:var(--leftbar-row-color-foreground);text-decoration:none;background-color:var(--leftbar-row-color-background);border-radius:var(--leftbar-row-radius);transition-duration:var(--td200);transition-property:background-color,border,box-shadow;transition-timing-function:var(--ttf-out-quint);-webkit-appearance:none;appearance:none;font-size:inhert;line-height:inherit;margin:0;border:0;padding:0;cursor:pointer}.dt-leftbar-row__primary:hover{--leftbar-row-color-background:var(--theme-sidebar-row-color-background-hover)}.dt-leftbar-row__primary:active{--leftbar-row-color-background:var(--theme-sidebar-active-row-color-background)}.dt-leftbar-row__primary:focus-visible{box-shadow:var(--bs-focus-ring-inset)}.dt-leftbar-row__action{position:absolute;right:var(--leftbar-row-action-position-right);top:var(--leftbar-row-action-position-bottom);transform:translateY(calc(var(--leftbar-row-action-position-bottom)*-1));opacity:0}.dt-leftbar-row:hover .dt-leftbar-row__action,.dt-leftbar-row__action:focus,.dt-leftbar-row__action:focus-within{opacity:1}.dt-leftbar-row__action-button{width:var(--leftbar-row-action-width);height:var(--leftbar-row-action-height)}.dt-leftbar-row__alpha{color:var(--leftbar-row-alpha-color-foreground);display:flex;box-sizing:border-box;justify-content:center;align-items:center;padding-left:var(--space-400);padding-right:var(--space-400);width:var(--leftbar-row-alpha-width);height:var(--leftbar-row-alpha-height)}.dt-leftbar-row__label{flex:1;min-width:0}.dt-leftbar-row__omega{display:flex;gap:var(--space-300);justify-content:end;align-items:center;box-sizing:border-box;min-width:var(--leftbar-row-omega-min-width);height:var(--leftbar-row-omega-height);padding-left:var(--space-400);padding-right:var(--space-400);visibility:var(--leftbar-row-omega-visibility)}.dt-leftbar-row__active-voice{color:var(--fc-success);-webkit-animation-name:opacity-pulsate;-webkit-animation-duration:1s;-webkit-animation-iteration-count:infinite;-webkit-animation-fill-mode:both;-moz-animation-name:opacity-pulsate;-moz-animation-duration:1s;-moz-animation-iteration-count:infinite;-moz-animation-fill-mode:both;animation-name:opacity-pulsate;animation-duration:1s;animation-iteration-count:infinite;animation-fill-mode:both}.dt-leftbar-row__dnd{padding-top:var(--space-200);padding-right:var(--space-300);color:var(--fc-tertiary);font-size:var(--fs-100);line-height:var(--lh-400);font-weight:var(--fw-medium)}.dt-leftbar-row__description{font-weight:var(--leftbar-row-description-font-weight);font-size:var(--leftbar-row-description-font-size);line-height:var(--leftbar-row-description-line-height)}.dt-leftbar-row__description,.dt-leftbar-row__status{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-leftbar-row__status{color:var(--leftbar-row-status-color-foreground);font-size:var(--leftbar-row-status-font-size);line-height:var(--leftbar-row-status-line-height);padding-bottom:var(--space-100)}.dt-leftbar-row__meta-context~.dt-leftbar-row__meta-custom:not(:empty):before{content:\" • \";color:var(--theme-sidebar-status-color)}.dt-leftbar-row__icon-cc{border-radius:var(--size-200);width:calc(var(--size-300)*3.5);height:calc(var(--size-300)*3.5)}.opacity-pulsate{-webkit-animation-name:opacity-pulsate;-webkit-animation-duration:1s;-webkit-animation-iteration-count:infinite;-webkit-animation-fill-mode:both;-moz-animation-name:opacity-pulsate;-moz-animation-duration:1s;-moz-animation-iteration-count:infinite;-moz-animation-fill-mode:both;animation-name:opacity-pulsate;animation-duration:1s;animation-iteration-count:infinite;animation-fill-mode:both}@keyframes opacity-pulsate{0%,to{opacity:.2}50%{opacity:1}}", ""]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -2279,6 +2279,7 @@ __webpack_require__.d(__webpack_exports__, {
   "DtRecipeComboboxMultiSelect": () => (/* reexport */ combobox_multi_select),
   "DtRecipeComboboxWithPopover": () => (/* reexport */ combobox_with_popover),
   "DtRecipeContactInfo": () => (/* reexport */ contact_info),
+  "DtRecipeContactRow": () => (/* reexport */ contact_row),
   "DtRecipeGeneralRow": () => (/* reexport */ general_row),
   "DtRecipeGroupRow": () => (/* reexport */ group_row),
   "DtRecipeGroupedChip": () => (/* reexport */ grouped_chip),
@@ -4415,6 +4416,7 @@ const focusableElementsList = `button,[href],input,select,textarea,details,[tabi
     _getFocusableElements() {
       let el = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.$el;
       let includeNegativeTabIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      if (!el) return [];
       const focusableContent = [...el.querySelectorAll(focusableElementsList)];
       return focusableContent.filter(fc => {
         const style = window.getComputedStyle(fc);
@@ -22152,9 +22154,9 @@ var combobox_multi_select_component = normalizeComponent(
 ;// CONCATENATED MODULE: ./recipes/comboboxes/combobox_multi_select/index.js
 
 
-;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/buttons/callbar_button/callbar_button.vue?vue&type=template&id=44881500&
-var callbar_buttonvue_type_template_id_44881500_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-tooltip',{attrs:{"id":_vm.id,"offset":[0, -12]},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',_vm._g({class:_vm.callbarButtonClass,attrs:{"importance":_vm.circle ? 'outlined' : 'clear',"kind":"muted","icon-position":"top","disabled":_vm.disabled,"aria-label":_vm.ariaLabel,"label-class":"d-fs-100","width":_vm.buttonWidth}},_vm.$listeners),[_vm._t("default"),_vm._t("icon",null,{"slot":"icon"})],2)]},proxy:true}],null,true)},[_vm._t("tooltip")],2)}
-var callbar_buttonvue_type_template_id_44881500_staticRenderFns = []
+;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/buttons/callbar_button/callbar_button.vue?vue&type=template&id=83ef55d6&
+var callbar_buttonvue_type_template_id_83ef55d6_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-tooltip',{attrs:{"id":_vm.id,"offset":[0, -12]},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',_vm._g({class:_vm.callbarButtonClass,attrs:{"importance":_vm.circle ? 'outlined' : 'clear',"kind":"muted","icon-position":"top","disabled":_vm.disabled,"aria-label":_vm.ariaLabel,"label-class":"d-fs-100","width":_vm.buttonWidth}},_vm.$listeners),[_vm._t("default"),_vm._t("icon",null,{"slot":"icon"})],2)]},proxy:true}],null,true)},[_vm._t("tooltip")],2)}
+var callbar_buttonvue_type_template_id_83ef55d6_staticRenderFns = []
 
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40[0].rules[0].use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/buttons/callbar_button/callbar_button.vue?vue&type=script&lang=js&
@@ -22300,10 +22302,9 @@ const VALID_WIDTH_SIZE = ['sm', 'md', 'lg', 'xl'];
     buttonWidth() {
       switch (this.buttonWidthSize) {
         case 'sm':
-        case 'md':
           return '4.5rem';
 
-        case 'lg':
+        case 'md':
           return '6rem';
 
         default:
@@ -22330,8 +22331,8 @@ var callbar_buttonvue_type_style_index_0_lang_less_ = __webpack_require__(759);
 
 var callbar_button_component = normalizeComponent(
   callbar_button_callbar_buttonvue_type_script_lang_js_,
-  callbar_buttonvue_type_template_id_44881500_render,
-  callbar_buttonvue_type_template_id_44881500_staticRenderFns,
+  callbar_buttonvue_type_template_id_83ef55d6_render,
+  callbar_buttonvue_type_template_id_83ef55d6_staticRenderFns,
   false,
   null,
   null,
@@ -22342,9 +22343,9 @@ var callbar_button_component = normalizeComponent(
 /* harmony default export */ const callbar_button = (callbar_button_component.exports);
 ;// CONCATENATED MODULE: ./recipes/buttons/callbar_button/index.js
 
-;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=428bc44b&
-var callbar_button_with_popovervue_type_template_id_428bc44b_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"d-d-flex d-ai-center"},[_c('dt-recipe-callbar-button',{staticClass:"dt-recipe--callbar-button-with-popover--main-button",attrs:{"aria-label":_vm.ariaLabel,"disabled":_vm.disabled,"active":_vm.active,"danger":_vm.danger,"button-class":_vm.buttonClass,"button-width-size":_vm.buttonWidthSize},on:{"click":_vm.buttonClick}},[_vm._t("icon",null,{"slot":"icon"}),_vm._t("tooltip",null,{"slot":"tooltip"}),_vm._t("default")],2),(_vm.showArrowButton)?_c('dt-popover',_vm._b({staticClass:"dt-recipe--callbar-button-with-popover--popover-wrapper",attrs:{"id":_vm.id,"open":_vm.open,"placement":_vm.placement,"initial-focus-element":_vm.initialFocusElement,"show-close-button":_vm.showCloseButton,"padding":"none","dialog-class":['dt-recipe--callbar-button-with-popover--popover', _vm.contentClass],"header-class":"d-d-flex d-ai-center d-fw-normal d-px12"},on:{"opened":_vm.onModalIsOpened},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',{class:['dt-recipe--callbar-button-with-popover--arrow', _vm.isCompactMode ? 'd-mln16' : 'd-mln24'],attrs:{"circle":"","importance":"clear","size":"lg","width":"2rem","aria-label":_vm.arrowButtonLabel,"active":_vm.open},on:{"click":_vm.arrowClick},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('dt-icon',{attrs:{"name":"chevron-up","size":"200"}})]},proxy:true}],null,false,3340821372)})]},proxy:true}],null,false,821174459)},'dt-popover',_vm.$attrs,false),[_vm._t("content",null,{"slot":"content"}),_vm._t("headerContent",null,{"slot":"headerContent"}),_vm._t("footerContent",null,{"slot":"footerContent"})],2):_vm._e()],1)}
-var callbar_button_with_popovervue_type_template_id_428bc44b_staticRenderFns = []
+;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=template&id=86437b7c&
+var callbar_button_with_popovervue_type_template_id_86437b7c_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"d-d-flex d-ai-center"},[_c('dt-recipe-callbar-button',{staticClass:"dt-recipe--callbar-button-with-popover--main-button",attrs:{"aria-label":_vm.ariaLabel,"disabled":_vm.disabled,"active":_vm.active,"danger":_vm.danger,"button-class":_vm.buttonClass,"button-width-size":_vm.buttonWidthSize},on:{"click":_vm.buttonClick}},[_vm._t("icon",null,{"slot":"icon"}),_vm._t("tooltip",null,{"slot":"tooltip"}),_vm._t("default")],2),(_vm.showArrowButton)?_c('dt-popover',_vm._b({staticClass:"dt-recipe--callbar-button-with-popover--popover-wrapper",attrs:{"id":_vm.id,"open":_vm.open,"placement":_vm.placement,"initial-focus-element":_vm.initialFocusElement,"show-close-button":_vm.showCloseButton,"padding":"none","dialog-class":['dt-recipe--callbar-button-with-popover--popover', _vm.contentClass],"header-class":"d-d-flex d-ai-center d-fw-normal d-px12"},on:{"opened":_vm.onModalIsOpened},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',{class:['dt-recipe--callbar-button-with-popover--arrow', _vm.isCompactMode ? 'd-mln16' : 'd-mln24'],attrs:{"circle":"","importance":"clear","size":"lg","width":"2rem","aria-label":_vm.arrowButtonLabel,"active":_vm.open},on:{"click":_vm.arrowClick},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('dt-icon',{attrs:{"name":"chevron-up","size":"200"}})]},proxy:true}],null,false,3340821372)})]},proxy:true}],null,false,821174459)},'dt-popover',_vm.$attrs,false),[_vm._t("content",null,{"slot":"content"}),_vm._t("headerContent",null,{"slot":"headerContent"}),_vm._t("footerContent",null,{"slot":"footerContent"})],2):_vm._e()],1)}
+var callbar_button_with_popovervue_type_template_id_86437b7c_staticRenderFns = []
 
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40[0].rules[0].use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/buttons/callbar_button_with_popover/callbar_button_with_popover.vue?vue&type=script&lang=js&
@@ -22600,7 +22601,7 @@ var callbar_button_with_popovervue_type_template_id_428bc44b_staticRenderFns = [
     },
 
     isCompactMode() {
-      return this.buttonWidthSize === 'sm' || this.buttonWidthSize === 'md';
+      return this.buttonWidthSize === 'sm';
     }
 
   },
@@ -22643,8 +22644,8 @@ var callbar_button_with_popovervue_type_style_index_0_lang_less_ = __webpack_req
 
 var callbar_button_with_popover_component = normalizeComponent(
   callbar_button_with_popover_callbar_button_with_popovervue_type_script_lang_js_,
-  callbar_button_with_popovervue_type_template_id_428bc44b_render,
-  callbar_button_with_popovervue_type_template_id_428bc44b_staticRenderFns,
+  callbar_button_with_popovervue_type_template_id_86437b7c_render,
+  callbar_button_with_popovervue_type_template_id_86437b7c_staticRenderFns,
   false,
   null,
   null,
@@ -23354,9 +23355,9 @@ var grouped_chip_component = normalizeComponent(
 /* harmony default export */ const grouped_chip = (grouped_chip_component.exports);
 ;// CONCATENATED MODULE: ./recipes/chips/grouped_chip/index.js
 
-;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/general_row/general_row.vue?vue&type=template&id=1889c7ad&
-var general_rowvue_type_template_id_1889c7ad_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.leftbarGeneralRowClasses,attrs:{"data-qa":"dt-leftbar-row"}},[_c('button',_vm._g(_vm._b({staticClass:"dt-leftbar-row__primary",attrs:{"data-qa":"dt-leftbar-row-link"}},'button',_vm.$attrs,false),_vm.$listeners),[_c('div',{staticClass:"dt-leftbar-row__alpha"},[_vm._t("left",function(){return [_c('dt-recipe-leftbar-general-row-icon',{attrs:{"type":_vm.getIcon,"color":_vm.color,"data-qa":"dt-leftbar-row-icon"}})]})],2),_c('div',{staticClass:"dt-leftbar-row__label"},[_c('dt-emoji-text-wrapper',{staticClass:"dt-leftbar-row__description",attrs:{"data-qa":"dt-leftbar-row-description"}},[_vm._v(" "+_vm._s(_vm.description)+" ")])],1),_c('div',{staticClass:"dt-leftbar-row__omega"},[(_vm.dndText)?_c('div',{staticClass:"dt-leftbar-row__dnd"},[_vm._v(" "+_vm._s(_vm.dndText)+" ")]):(_vm.activeVoiceChat)?_c('div',{staticClass:"dt-leftbar-row__active-voice"},[_c('dt-icon',{attrs:{"size":"300","name":"activity"}})],1):(_vm.hasUnreadMessages)?_c('dt-badge',{attrs:{"kind":"count","type":"bulletin","data-qa":"dt-leftbar-row-unread-badge"}},[_vm._v(" "+_vm._s(_vm.unreadCount)+" ")]):_vm._e()],1)])])}
-var general_rowvue_type_template_id_1889c7ad_staticRenderFns = []
+;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/general_row/general_row.vue?vue&type=template&id=37f653fe&
+var general_rowvue_type_template_id_37f653fe_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.leftbarGeneralRowClasses,attrs:{"data-qa":"dt-leftbar-row"}},[_c('button',_vm._g(_vm._b({staticClass:"dt-leftbar-row__primary",attrs:{"data-qa":"dt-leftbar-row-link"}},'button',_vm.$attrs,false),_vm.$listeners),[_c('div',{staticClass:"dt-leftbar-row__alpha"},[_vm._t("left",function(){return [_c('dt-recipe-leftbar-general-row-icon',{attrs:{"type":_vm.getIcon,"color":_vm.color,"data-qa":"dt-leftbar-row-icon"}})]})],2),_c('div',{staticClass:"dt-leftbar-row__label"},[_vm._t("label",function(){return [_c('dt-emoji-text-wrapper',{staticClass:"dt-leftbar-row__description",attrs:{"data-qa":"dt-leftbar-row-description"}},[_vm._v(" "+_vm._s(_vm.description)+" ")])]})],2),_c('div',{staticClass:"dt-leftbar-row__omega"},[(_vm.dndText)?_c('div',{staticClass:"dt-leftbar-row__dnd"},[_vm._v(" "+_vm._s(_vm.dndText)+" ")]):(_vm.activeVoiceChat)?_c('div',{staticClass:"dt-leftbar-row__active-voice"},[_c('dt-icon',{attrs:{"size":"300","name":"activity"}})],1):(!!_vm.unreadCount && _vm.hasUnreads)?_c('dt-badge',{attrs:{"kind":"count","type":"bulletin","data-qa":"dt-leftbar-row-unread-badge"}},[_vm._v(" "+_vm._s(_vm.unreadCount)+" ")]):_vm._e()],1)]),(_vm.hasCallButton)?_c('div',{staticClass:"dt-leftbar-row__action",attrs:{"data-qa":"dt-leftbar-row-action"}},[_c('dt-button',{staticClass:"dt-leftbar-row__action-button",attrs:{"data-qa":"dt-leftbar-row-action-call-button","circle":"","size":"xs","kind":"inverted"},on:{"focus":function($event){_vm.actionFocused = true},"blur":function($event){_vm.actionFocused = false},"mouseout":function($event){_vm.actionFocused = false},"click":function($event){$event.stopPropagation();return _vm.$emit('call', $event)}},scopedSlots:_vm._u([{key:"icon",fn:function(){return [_c('dt-icon',{attrs:{"name":"phone","size":"200"}})]},proxy:true}],null,false,990728611)})],1):_vm._e()])}
+var general_rowvue_type_template_id_37f653fe_staticRenderFns = []
 
 
 ;// CONCATENATED MODULE: ./recipes/leftbar/general_row/general_row_constants.js
@@ -23799,6 +23800,7 @@ var emoji_component = normalizeComponent(
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40[0].rules[0].use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./components/emoji_text_wrapper/emoji_text_wrapper.vue?vue&type=script&lang=js&
 
 
+
 /**
  * Wrapper to find and replace shortcodes like :smile: or unicode chars such as 😄 with our custom Emojis implementation.
  * @see https://dialpad.design/components/emoji_text_wrapper.html
@@ -23817,6 +23819,15 @@ var emoji_component = normalizeComponent(
     elementType: {
       type: String,
       default: 'div'
+    },
+
+    /**
+     * The icon size to render the emojis at: 100 to 800
+     */
+    size: {
+      type: String,
+      default: '500',
+      validator: t => Object.keys(ICON_SIZE_MODIFIERS).includes(t)
     }
   },
 
@@ -23846,6 +23857,7 @@ var emoji_component = normalizeComponent(
             },
             props: {
               code: item,
+              size: this.size,
               ...this.$attrs
             }
           });
@@ -24096,6 +24108,35 @@ var leftbar_general_row_icon_component = normalizeComponent(
 //
 //
 //
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+
 
 
 
@@ -24107,6 +24148,7 @@ var leftbar_general_row_icon_component = normalizeComponent(
     DtEmojiTextWrapper: emoji_text_wrapper,
     DtBadge: badge,
     DtIcon: icon,
+    DtButton: button_button,
     DtRecipeLeftbarGeneralRowIcon: leftbar_general_row_icon
   },
   inheritAttrs: false,
@@ -24142,6 +24184,15 @@ var leftbar_general_row_icon_component = normalizeComponent(
       }
     },
 
+    /**
+     * Styles the row with an increased font weight to convey it has unreads. This must be true to see
+     * the unread count badge.
+     */
+    hasUnreads: {
+      type: Boolean,
+      default: false
+    },
+
     /**
      * Number of unread messages
      */
@@ -24181,33 +24232,61 @@ var leftbar_general_row_icon_component = normalizeComponent(
     dndText: {
       type: String,
       default: ''
+    },
+
+    /**
+     * Whether the row should have a call button. Usually only applicable to individual contact rows.
+     */
+    hasCallButton: {
+      type: Boolean,
+      default: false
     }
   },
+  emits: [
+  /**
+   * Native click event on the row itself
+   *
+   * @event click
+   * @type {PointerEvent | KeyboardEvent}
+   */
+  'click',
+  /**
+   * Call button clicked
+   *
+   * @event call
+   * @type {PointerEvent | KeyboardEvent}
+   */
+  'call'],
+
+  data() {
+    return {
+      actionFocused: false
+    };
+  },
+
   computed: {
     leftbarGeneralRowClasses() {
-      return ['dt-leftbar-row', 'dt-leftbar-row--no-action', {
-        'dt-leftbar-row--has-unread': this.hasUnreadMessages,
+      return ['dt-leftbar-row', {
+        'dt-leftbar-row--no-action': !this.hasCallButton,
+        'dt-leftbar-row--has-unread': this.hasUnreads,
         'dt-leftbar-row--selected': this.selected,
-        'dt-leftbar-row--muted': this.muted
+        'dt-leftbar-row--muted': this.muted,
+        'dt-leftbar-row--action-focused': this.actionFocused
       }];
     },
 
     getIcon() {
       switch (this.type) {
         case LEFTBAR_GENERAL_ROW_TYPES.CHANNELS:
-          if (this.hasUnreadMessages) return 'channel unread';
+          if (this.hasUnreads) return 'channel unread';
           break;
 
         case LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL:
-          if (this.hasUnreadMessages) return 'locked channel unread';
+          if (this.hasUnreads) return 'locked channel unread';
           break;
       }
 
       return this.type;
-    },
-
-    hasUnreadMessages() {
-      return isNaN(Number(this.unreadCount)) ? !!this.unreadCount : Number(this.unreadCount) > 0;
     }
 
   },
@@ -24248,8 +24327,8 @@ var general_rowvue_type_style_index_0_lang_less_ = __webpack_require__(641);
 
 var general_row_component = normalizeComponent(
   general_row_general_rowvue_type_script_lang_js_,
-  general_rowvue_type_template_id_1889c7ad_render,
-  general_rowvue_type_template_id_1889c7ad_staticRenderFns,
+  general_rowvue_type_template_id_37f653fe_render,
+  general_rowvue_type_template_id_37f653fe_staticRenderFns,
   false,
   null,
   null,
@@ -24261,9 +24340,9 @@ var general_row_component = normalizeComponent(
 ;// CONCATENATED MODULE: ./recipes/leftbar/general_row/index.js
 
 
-;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/group_row/group_row.vue?vue&type=template&id=8a338828&
-var group_rowvue_type_template_id_8a338828_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-recipe-general-row',_vm._g({attrs:{"description":_vm.names,"unread-count":_vm.unreadCount,"selected":_vm.selected},scopedSlots:_vm._u([{key:"left",fn:function(){return [_c('dt-avatar',{attrs:{"initials":_vm.avatarInitials,"group":_vm.groupCount}},[_c('img',{attrs:{"data-qa":"dt-avatar-image","src":_vm.avatarSrc,"alt":_vm.avatarInitials}})])]},proxy:true}])},_vm.$listeners))}
-var group_rowvue_type_template_id_8a338828_staticRenderFns = []
+;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/group_row/group_row.vue?vue&type=template&id=4a86bd91&
+var group_rowvue_type_template_id_4a86bd91_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-recipe-general-row',_vm._g({attrs:{"description":_vm.names,"unread-count":_vm.unreadCount,"has-unreads":_vm.hasUnreads,"selected":_vm.selected},scopedSlots:_vm._u([{key:"left",fn:function(){return [_c('dt-avatar',{attrs:{"initials":_vm.avatarInitials,"group":_vm.groupCount}},[_c('img',{attrs:{"data-qa":"dt-avatar-image","src":_vm.avatarSrc,"alt":_vm.avatarInitials}})])]},proxy:true}])},_vm.$listeners))}
+var group_rowvue_type_template_id_4a86bd91_staticRenderFns = []
 
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40[0].rules[0].use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/group_row/group_row.vue?vue&type=script&lang=js&
@@ -24289,6 +24368,7 @@ var group_rowvue_type_template_id_8a338828_staticRenderFns = []
 //
 //
 //
+//
 
 
 /* harmony default export */ const group_rowvue_type_script_lang_js_ = ({
@@ -24342,6 +24422,15 @@ var group_rowvue_type_template_id_8a338828_staticRenderFns = []
       default: null
     },
 
+    /**
+     * Styles the row with an increased font weight to convey it has unreads. This must be true to see
+     * the unread count badge.
+     */
+    hasUnreads: {
+      type: Boolean,
+      default: false
+    },
+
     /**
      * Determines if the row is selected
      */
@@ -24349,7 +24438,15 @@ var group_rowvue_type_template_id_8a338828_staticRenderFns = []
       type: Boolean,
       default: false
     }
-  }
+  },
+  emits: [
+  /**
+   * Native click event on the row itself
+   *
+   * @event click
+   * @type {PointerEvent | KeyboardEvent}
+   */
+  'click']
 });
 ;// CONCATENATED MODULE: ./recipes/leftbar/group_row/group_row.vue?vue&type=script&lang=js&
  /* harmony default export */ const group_row_group_rowvue_type_script_lang_js_ = (group_rowvue_type_script_lang_js_); 
@@ -24363,8 +24460,8 @@ var group_rowvue_type_template_id_8a338828_staticRenderFns = []
 ;
 var group_row_component = normalizeComponent(
   group_row_group_rowvue_type_script_lang_js_,
-  group_rowvue_type_template_id_8a338828_render,
-  group_rowvue_type_template_id_8a338828_staticRenderFns,
+  group_rowvue_type_template_id_4a86bd91_render,
+  group_rowvue_type_template_id_4a86bd91_staticRenderFns,
   false,
   null,
   null,
@@ -24375,6 +24472,247 @@ var group_row_component = normalizeComponent(
 /* harmony default export */ const group_row = (group_row_component.exports);
 ;// CONCATENATED MODULE: ./recipes/leftbar/group_row/index.js
 
+;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/contact_row/contact_row.vue?vue&type=template&id=22dc813a&
+var contact_rowvue_type_template_id_22dc813a_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('dt-recipe-general-row',_vm._g({attrs:{"unread-count":_vm.unreadCount,"has-unreads":_vm.hasUnreads,"selected":_vm.selected,"has-call-button":true,"muted":_vm.muted},scopedSlots:_vm._u([{key:"left",fn:function(){return [_c('dt-avatar',{attrs:{"size":"sm","seed":_vm.avatarSeed,"presence":_vm.avatarPresence}},[(_vm.avatarSrc)?_c('img',{attrs:{"data-qa":"dt-avatar-image","src":_vm.avatarSrc,"alt":_vm.name}}):(_vm.noInitials)?[_c('dt-icon',{attrs:{"name":"user","size":"200"}})]:[_vm._v(" "+_vm._s(_vm.avatarInitial)+" ")]],2)]},proxy:true},{key:"label",fn:function(){return [_c('dt-emoji-text-wrapper',{staticClass:"dt-leftbar-row__description",attrs:{"data-qa":"dt-leftbar-row-description","size":"200"}},[_vm._v(" "+_vm._s(_vm.name)+" ")]),_c('div',{staticClass:"dt-leftbar-row__status"},[(_vm.presenceText)?_c('span',{class:['dt-leftbar-row__meta-context', _vm.presenceColorClass],attrs:{"data-qa":"dt-leftbar-row-presence-text"}},[_vm._v(" "+_vm._s(_vm.presenceText)+" ")]):_vm._e(),(_vm.userStatus)?_c('dt-emoji-text-wrapper',{staticClass:"dt-leftbar-row__meta-custom",attrs:{"size":"100","element-type":"span","data-qa":"dt-leftbar-row-user-status"}},[_vm._v(" "+_vm._s(_vm.userStatus)+" ")]):_vm._e()],1)]},proxy:true}])},_vm.$listeners))}
+var contact_rowvue_type_template_id_22dc813a_staticRenderFns = []
+
+
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40[0].rules[0].use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./recipes/leftbar/contact_row/contact_row.vue?vue&type=script&lang=js&
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+
+
+
+
+
+/* harmony default export */ const contact_rowvue_type_script_lang_js_ = ({
+  name: 'DtRecipeGroupRow',
+  components: {
+    DtAvatar: avatar,
+    DtIcon: icon,
+    DtRecipeGeneralRow: general_row,
+    DtEmojiTextWrapper: emoji_text_wrapper
+  },
+  props: {
+    /**
+     * Optional avatar image url.
+     * If not provided it will use the initial of the name.
+     */
+    avatarSrc: {
+      type: String,
+      default: ''
+    },
+
+    /**
+     * Determines whether to show the presence indicator for
+     * Avatar - accepts PRESENCE_STATES values: 'active', 'busy', 'away', 'offline'. defaults to active.
+     * @values active, busy, away, offline
+     */
+    avatarPresence: {
+      type: String,
+      default: PRESENCE_STATES.ACTIVE,
+      validator: role => {
+        return PRESENCE_STATES_LIST.includes(role);
+      }
+    },
+
+    /**
+     * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.
+     */
+    avatarSeed: {
+      type: String,
+      default: null
+    },
+
+    /**
+     * Text describing the user's presence, such as "in a meeting"
+     */
+    presenceText: {
+      type: String,
+      default: ''
+    },
+
+    /**
+     * Name of the contact
+     */
+    name: {
+      type: String,
+      required: true
+    },
+
+    /**
+     * Status as set by the user.
+     */
+    userStatus: {
+      type: String,
+      default: ''
+    },
+
+    /**
+     * Gives a faded style to be used when muted
+     */
+    muted: {
+      type: Boolean,
+      default: false
+    },
+
+    /**
+     * Number of unread messages
+     */
+    unreadCount: {
+      type: String,
+      default: null
+    },
+
+    /**
+     * Styles the row with an increased font weight to convey it has unreads. This must be true to see
+     * the unread count badge.
+     */
+    hasUnreads: {
+      type: Boolean,
+      default: false
+    },
+
+    /**
+     * Determines if the row is selected
+     */
+    selected: {
+      type: Boolean,
+      default: false
+    },
+
+    /**
+     * Initials will never be shown. Instead it will show a "User" icon.
+     */
+    noInitials: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: [
+  /**
+   * Native click event on the row itself
+   *
+   * @event click
+   * @type {PointerEvent | KeyboardEvent}
+   */
+  'click',
+  /**
+   * Call button clicked
+   *
+   * @event call
+   * @type {PointerEvent | KeyboardEvent}
+   */
+  'call'],
+  computed: {
+    presenceColorClass() {
+      switch (this.avatarPresence) {
+        case 'active':
+          return 'd-fc-success';
+
+        case 'busy':
+          return 'd-fc-critical';
+
+        case 'away':
+          return 'd-fc-warning';
+
+        default:
+          return undefined;
+      }
+    },
+
+    avatarInitial() {
+      var _this$name$;
+
+      return (_this$name$ = this.name[0]) !== null && _this$name$ !== void 0 ? _this$name$ : '';
+    }
+
+  }
+});
+;// CONCATENATED MODULE: ./recipes/leftbar/contact_row/contact_row.vue?vue&type=script&lang=js&
+ /* harmony default export */ const contact_row_contact_rowvue_type_script_lang_js_ = (contact_rowvue_type_script_lang_js_); 
+;// CONCATENATED MODULE: ./recipes/leftbar/contact_row/contact_row.vue
+
+
+
+
+
+/* normalize component */
+;
+var contact_row_component = normalizeComponent(
+  contact_row_contact_rowvue_type_script_lang_js_,
+  contact_rowvue_type_template_id_22dc813a_render,
+  contact_rowvue_type_template_id_22dc813a_staticRenderFns,
+  false,
+  null,
+  null,
+  null
+  
+)
+
+/* harmony default export */ const contact_row = (contact_row_component.exports);
+;// CONCATENATED MODULE: ./recipes/leftbar/contact_row/index.js
+
 ;// CONCATENATED MODULE: ./common/mixins/index.js
 
 
@@ -24429,6 +24767,7 @@ var group_row_component = normalizeComponent(
 
 
 
+
  // Mixins
 
  // Constants