@dialpad/dialtone-vue 2.65.0-beta.1 → 2.65.0

package/CHANGELOG.md

@@ -1,8 +1,14 @@
-# [2.65.0-beta.1](https://github.com/dialpad/dialtone-vue/compare/v2.64.0...v2.65.0-beta.1) (2023-03-09)
+# [2.65.0](https://github.com/dialpad/dialtone-vue/compare/v2.64.0...v2.65.0) (2023-03-13)
+
+
+### Bug Fixes
+
+* **Avatar:** initials are not available until image loads ([#803](https://github.com/dialpad/dialtone-vue/issues/803)) ([1fbedd3](https://github.com/dialpad/dialtone-vue/commit/1fbedd3c20b610d5744d41b4fe3ddc7197267b44))
 
 
 ### Features
 
+* **Leftbar:** fixes and additions to leftbar row components ([#804](https://github.com/dialpad/dialtone-vue/issues/804)) ([0bb19a5](https://github.com/dialpad/dialtone-vue/commit/0bb19a547554781c5a7a7db388ef705e21a5cdd8))
 * **Theme:** update leftbar theme vars ([#800](https://github.com/dialpad/dialtone-vue/issues/800)) ([62898a6](https://github.com/dialpad/dialtone-vue/commit/62898a67d96ad0d56f254fdbc9607d71f8a453ea))
 
 # [2.64.0](https://github.com/dialpad/dialtone-vue/compare/v2.63.0...v2.64.0) (2023-03-06)

package/dist/dialtone-vue.common.js

@@ -2375,8 +2375,8 @@ if (typeof window !== 'undefined') {
 // Indicate to webpack that this file can be concatenated
 /* harmony default export */ const setPublicPath = (null);
 
-;// 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!./components/avatar/avatar.vue?vue&type=template&id=8bf1cd1a&
-var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.avatarClasses,style:(_vm.initialKindStyle),attrs:{"id":_vm.id,"data-qa":"dt-avatar"}},[_c('div',{ref:"canvas",staticClass:"d-avatar__canvas"},[(_vm.showDefaultSlot)?_vm._t("default"):(_vm.showInitials)?_c('span',{class:_vm.AVATAR_KIND_MODIFIERS.initials},[_vm._v(" "+_vm._s(_vm.formattedInitials)+" ")]):_vm._e()],2),(_vm.showGroup)?_c('span',{staticClass:"d-avatar__count",attrs:{"data-qa":"dt-avatar-count"}},[_vm._v(_vm._s(_vm.formattedGroup))]):_vm._e(),(_vm.presence && !_vm.showGroup)?_c('dt-presence',_vm._b({class:[
+;// 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!./components/avatar/avatar.vue?vue&type=template&id=0071818a&
+var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.avatarClasses,style:(_vm.initialKindStyle),attrs:{"id":_vm.id,"data-qa":"dt-avatar"}},[_c('div',{ref:"canvas",staticClass:"d-avatar__canvas"},[(_vm.showDefaultSlot)?_vm._t("default"):_vm._e(),(_vm.showInitials)?_c('span',{staticClass:"d-ps-absolute d-zi-base",class:_vm.AVATAR_KIND_MODIFIERS.initials},[_vm._v(" "+_vm._s(_vm.formattedInitials)+" ")]):_vm._e()],2),(_vm.showGroup)?_c('span',{staticClass:"d-avatar__count d-zi-base1",attrs:{"data-qa":"dt-avatar-count"}},[_vm._v(_vm._s(_vm.formattedGroup))]):_vm._e(),(_vm.presence && !_vm.showGroup)?_c('dt-presence',_vm._b({staticClass:"d-zi-base1",class:[
       'd-avatar__presence',
       _vm.AVATAR_PRESENCE_SIZE_MODIFIERS[_vm.size] ],attrs:{"presence":_vm.presence,"data-qa":"dt-presence"}},'dt-presence',_vm.presenceProps,false)):_vm._e()],1)}
 var staticRenderFns = []
@@ -2459,7 +2459,8 @@ var external_commonjs_vue_commonjs2_vue_root_Vue_default = /*#__PURE__*/__webpac
 
 const seedrandom = __webpack_require__(377);
 
-let UNIQUE_ID_COUNTER = 0; // selector to find focusable not hidden inputs
+let UNIQUE_ID_COUNTER = 0;
+let TIMER; // selector to find focusable not hidden inputs
 
 const FOCUSABLE_SELECTOR_NOT_HIDDEN = 'input:not([type=hidden]):not(:disabled)'; // selector to find focusable not disables elements
 
@@ -2581,7 +2582,7 @@ const flushPromises = () => {
  */
 
 const kebabCaseToPascalCase = string => {
-  return string.toLowerCase().split('-').map(word => word.charAt(0).toUpperCase() + word.slice(1)).join('');
+  return string === null || string === void 0 ? void 0 : string.toLowerCase().split('-').map(word => word.charAt(0).toUpperCase() + word.slice(1)).join('');
 };
 /**
  * Transform a string from PascalCase to kebab-case
@@ -2592,6 +2593,17 @@ const kebabCaseToPascalCase = string => {
 const pascalCaseToKebabCase = string => {
   return string.replace(/\.?([A-Z0-9]+)/g, (x, y) => '-' + y.toLowerCase()).replace(/^-/, '');
 };
+/*
+* Set's a global timer to debounce the execution of a function.
+* @param { object } func - the function that is going to be called after timeout
+* @param { number } [timeout=300] timeout
+* */
+
+function debounce(func) {
+  let timeout = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 300;
+  clearTimeout(TIMER);
+  TIMER = setTimeout(func, timeout);
+}
 /* harmony default export */ const utils = ({
   getUniqueString,
   getRandomElement,
@@ -2601,7 +2613,8 @@ const pascalCaseToKebabCase = string => {
   getValidationState,
   htmlFragment,
   flushPromises,
-  kebabCaseToPascalCase
+  kebabCaseToPascalCase,
+  debounce
 });
 ;// 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!./components/presence/presence.vue?vue&type=template&id=77957bb3&
 var presencevue_type_template_id_77957bb3_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"d-presence",attrs:{"data-qa":"dt-presence","role":"status","aria-live":_vm.$attrs.ariaLive || 'off'}},[(_vm.srText)?_c('span',{staticClass:"sr-only",attrs:{"data-qa":"dt-presence-sr-text"}},[_vm._v(_vm._s(_vm.srText)+" ")]):_vm._e(),_c('div',{staticClass:"d-presence__inner",class:{
@@ -2885,6 +2898,8 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
 //
 //
 //
+//
+//
 
 
 
@@ -2991,13 +3006,14 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
   data() {
     return {
       // initials, image or icon
-      kind: 'image',
+      kind: null,
       AVATAR_SIZE_MODIFIERS: AVATAR_SIZE_MODIFIERS,
       AVATAR_KIND_MODIFIERS: AVATAR_KIND_MODIFIERS,
       AVATAR_PRESENCE_SIZE_MODIFIERS: AVATAR_PRESENCE_SIZE_MODIFIERS,
       imageLoadedSuccessfully: null,
       slottedInitials: '',
-      formattedInitials: ''
+      formattedInitials: '',
+      initializing: false
     };
   },
 
@@ -3010,11 +3026,11 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
     },
 
     showDefaultSlot() {
-      return this.kind !== 'initials' && this.imageLoadedSuccessfully !== false;
+      return this.kind !== 'initials' || this.kind === 'image' && this.imageLoadedSuccessfully === true;
     },
 
     showInitials() {
-      return this.kind === 'initials' || this.initials;
+      return this.kind === 'initials' || this.kind === 'image' && this.initials;
     },
 
     showGroup() {
@@ -3047,28 +3063,27 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
   },
 
   updated() {
-    if (this.kind === 'initials') {
-      this.slottedInitials = this.$slots.default[0].text || this.$slots.default[0].textContent;
-      this.formatInitials(this.slottedInitials);
-    }
+    this.init();
   },
 
   methods: {
-    init() {
-      const firstChild = this.$refs.canvas.firstChild;
-
-      if (!firstChild) {
-        return;
-      }
-
+    async init() {
+      if (this.initializing) return;
+      this.kind = null;
+      await this.$nextTick();
+      const firstChild = this.$refs.canvas.firstElementChild || this.$refs.canvas;
+      this.formatInitials(this.initials);
       this.setKind(firstChild);
       this.kindHandler(firstChild);
+      this.initializing = true;
+      await this.$nextTick();
+      this.initializing = false;
     },
 
     kindHandler(el) {
       switch (this.kind) {
         case 'image':
-          el.classList.add('d-avatar__image');
+          el.classList.add('d-avatar__image', 'd-zi-base1');
           this.validateImageAttrsPresence();
           this.setImageListeners(el);
           break;
@@ -3079,24 +3094,25 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
 
         case 'initials':
           this.slottedInitials = el.text || el.textContent;
-          this.formatInitials(this.slottedInitials);
+          this.formatInitials(this.slottedInitials.trim() || this.initials);
           break;
       }
     },
 
     setImageListeners(el) {
-      el.addEventListener('error', () => {
-        this.formatInitials(this.initials);
-        this.imageLoadedSuccessfully = false;
+      el.addEventListener('load', () => this._loadedImageEventHandler(el), {
+        once: true
       });
-      el.addEventListener('load', () => {
-        el.classList.add('d-avatar--image-loaded');
-        this.imageLoadedSuccessfully = true;
+      el.addEventListener('error', () => this._erroredImageEventHandler(el), {
+        once: true
       });
     },
 
     formatInitials(initials) {
-      if (!initials) return;
+      if (!initials) {
+        this.formattedInitials = '';
+        return;
+      }
 
       if (this.validatedSize === 'xs') {
         this.formattedInitials = '';
@@ -3108,7 +3124,7 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
     },
 
     setKind(element) {
-      if (this.isSvgType(element)) {
+      if (this.isIconType(element)) {
         this.kind = 'icon';
         return;
       }
@@ -3121,7 +3137,7 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
       this.kind = 'initials';
     },
 
-    isSvgType(element) {
+    isIconType(element) {
       var _element$tagName;
 
       return (element === null || element === void 0 ? void 0 : (_element$tagName = element.tagName) === null || _element$tagName === void 0 ? void 0 : _element$tagName.toUpperCase()) === 'SVG';
@@ -3167,6 +3183,18 @@ const AVATAR_GROUP_VALIDATOR = group => group > 1;
       if (isSrcMissing || isAltMissing) {
         external_commonjs_vue_commonjs2_vue_root_Vue_default().util.warn('src and alt attributes are required for image avatars', this);
       }
+    },
+
+    _loadedImageEventHandler(el) {
+      this.imageLoadedSuccessfully = true;
+      el.classList.remove('d-d-none');
+      el.classList.add('d-avatar--image-loaded');
+    },
+
+    _erroredImageEventHandler(el) {
+      this.imageLoadedSuccessfully = false;
+      el.classList.remove('d-avatar--image-loaded');
+      el.classList.add('d-d-none');
     }
 
   }
@@ -8611,7 +8639,7 @@ function orderModifiers(modifiers) {
   }, []);
 }
 ;// CONCATENATED MODULE: ./node_modules/@popperjs/core/lib/utils/debounce.js
-function debounce(fn) {
+function debounce_debounce(fn) {
   var pending;
   return function () {
     if (!pending) {
@@ -8796,7 +8824,7 @@ function popperGenerator(generatorOptions) {
       },
       // Async and optimistically optimized update – it will not be executed if
       // not necessary (debounced to run at most once-per-tick)
-      update: debounce(function () {
+      update: debounce_debounce(function () {
         return new Promise(function (resolve) {
           instance.forceUpdate();
           resolve(state);
@@ -23348,9 +23376,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=18766278&
-var general_rowvue_type_template_id_18766278_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","aria-label":_vm.getAriaLabel,"title":_vm.description}},'button',_vm.$attrs,false),_vm.$listeners),[_c('div',{staticClass:"dt-leftbar-row__alpha"},[(_vm.isTyping)?_c('div',{staticClass:"dt-leftbar-row__is-typing"},[_c('span'),_c('span'),_c('span')]):_vm._t("left",function(){return [_c('dt-recipe-leftbar-general-row-icon',{class:{ 'd-o50': _vm.isTyping },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('dt-tooltip',{attrs:{"placement":"top","message":_vm.dndTextTooltip},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('div',{staticClass:"dt-leftbar-row__dnd"},[_vm._v(" "+_vm._s(_vm.dndText)+" ")])]},proxy:true}],null,false,1506147022)}):(_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-tooltip',{attrs:{"message":_vm.unreadCountTooltip,"placement":"top"},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-badge',{attrs:{"kind":"count","type":"bulletin","data-qa":"dt-leftbar-row-unread-badge"}},[_vm._v(" "+_vm._s(_vm.unreadCount)+" ")])]},proxy:true}])}):_vm._e()],1)]),(_vm.hasCallButton)?_c('div',{staticClass:"dt-leftbar-row__action",attrs:{"data-qa":"dt-leftbar-row-action"}},[_c('dt-tooltip',{attrs:{"message":_vm.callButtonTooltip,"placement":"top"},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_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},"mouseleave":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)})]},proxy:true}],null,false,2110922487)})],1):_vm._e()])}
-var general_rowvue_type_template_id_18766278_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=31787490&
+var general_rowvue_type_template_id_31787490_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","aria-label":_vm.getAriaLabel,"title":_vm.description}},'button',_vm.$attrs,false),_vm.$listeners),[_c('div',{staticClass:"dt-leftbar-row__alpha"},[(_vm.isTyping)?_c('div',{staticClass:"dt-leftbar-row__is-typing"},[_c('span'),_c('span'),_c('span')]):_vm._t("left",function(){return [_c('dt-recipe-leftbar-general-row-icon',{class:{ 'd-o50': _vm.isTyping },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('dt-tooltip',{attrs:{"placement":"top","message":_vm.dndTextTooltip},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('div',{staticClass:"dt-leftbar-row__dnd"},[_vm._v(" "+_vm._s(_vm.dndText)+" ")])]},proxy:true}],null,false,1506147022)}):(_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-tooltip',{attrs:{"message":_vm.unreadCountTooltip,"placement":"top"},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-badge',{attrs:{"kind":"count","type":"bulletin","data-qa":"dt-leftbar-row-unread-badge"}},[_vm._v(" "+_vm._s(_vm.unreadCount)+" ")])]},proxy:true}])}):_vm._e()],1)]),(_vm.hasCallButton)?_c('div',{staticClass:"dt-leftbar-row__action",attrs:{"data-qa":"dt-leftbar-row-action"}},[_c('dt-tooltip',{attrs:{"message":_vm.callButtonTooltip,"placement":"top"},scopedSlots:_vm._u([{key:"anchor",fn:function(){return [_c('dt-button',{staticClass:"dt-leftbar-row__action-button",attrs:{"data-qa":"dt-leftbar-row-action-call-button","circle":"","size":"xs","kind":"inverted","aria-label":_vm.callButtonTooltip},on:{"focus":function($event){_vm.actionFocused = true},"blur":function($event){_vm.actionFocused = false},"mouseleave":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)})]},proxy:true}],null,false,4111698736)})],1):_vm._e()])}
+var general_rowvue_type_template_id_31787490_staticRenderFns = []
 
 
 ;// CONCATENATED MODULE: ./recipes/leftbar/general_row/general_row_constants.js
@@ -23928,27 +23956,27 @@ var emoji_text_wrapper_component = normalizeComponent(
 )
 
 /* harmony default export */ const emoji_text_wrapper = (emoji_text_wrapper_component.exports);
-;// 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/leftbar_general_row_icon.vue?vue&type=template&id=06ed62b0&
-var leftbar_general_row_iconvue_type_template_id_06ed62b0_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.isIconType)?_c('dt-icon',{attrs:{"name":_vm.getIconName,"size":"300"}}):(_vm.isContactCenterType)?_c('div',{class:_vm.contactCenterIconClasses}):(_vm.isDialbotType)?_c('div',{class:_vm.dialbotClasses},[_c('icon-dialpad-glyph',{staticClass:"d-svg--size18",attrs:{"color":"white"}})],1):_vm._e()}
-var leftbar_general_row_iconvue_type_template_id_06ed62b0_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/leftbar_general_row_icon.vue?vue&type=template&id=42d6843e&
+var leftbar_general_row_iconvue_type_template_id_42d6843e_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.isIconType)?_c('dt-icon',{attrs:{"name":_vm.getIconName,"size":"300"}}):(_vm.isContactCenterType)?_c('div',{class:_vm.contactCenterIconClasses}):(_vm.isDialbotType)?_c('div',{class:_vm.dialbotClasses},[_c('icon-dialbot',{staticClass:"d-svg--size18"})],1):_vm._e()}
+var leftbar_general_row_iconvue_type_template_id_42d6843e_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!./node_modules/@dialpad/dialtone/lib/dist/vue/icons/IconDialpadGlyph.vue?vue&type=template&id=85d2b6f4&
-var IconDialpadGlyphvue_type_template_id_85d2b6f4_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('svg',{staticClass:"d-svg d-svg--system d-svg__dialpadGlyph",attrs:{"aria-hidden":"true","focusable":"false","aria-label":"Dialpad Glyph","viewBox":"0 0 24 24"}},[_c('path',{attrs:{"fill-rule":"evenodd","clip-rule":"evenodd","d":"M12.025 11.197V4.18a.077.077 0 0 0-.132-.053L8.91 7.204a5.095 5.095 0 0 0-7.08 4.693 5.095 5.095 0 0 0 5.096 5.094 5.096 5.096 0 0 0 5.049-4.394v7.019c0 .069.083.102.131.053l2.982-3.079c.61.258 1.28.4 1.984.4a5.095 5.095 0 0 0 5.096-5.093 5.095 5.095 0 0 0-5.096-5.093 5.096 5.096 0 0 0-5.048 4.393Z"}})])}
-var IconDialpadGlyphvue_type_template_id_85d2b6f4_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!./node_modules/@dialpad/dialtone/lib/dist/vue/icons/IconDialbot.vue?vue&type=template&id=afc48fb0&
+var IconDialbotvue_type_template_id_afc48fb0_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('svg',{staticClass:"d-svg d-svg--native d-svg__dialbot",attrs:{"aria-hidden":"true","focusable":"false","aria-label":"Dialbot","width":"358","height":"358","viewBox":"0 0 358 358","fill":"none"}},[_c('circle',{attrs:{"cx":"179","cy":"179","r":"179","fill":"url(#paint0_linear_1957_89480)"}}),_c('path',{attrs:{"d":"M179 268.5v-11.933V268.5Zm86.517 0v11.933h19.308l-8.635-17.27-10.673 5.337Zm-16.73-33.459-9.3-7.478-4.797 5.967 3.424 6.848 10.673-5.337ZM179 101.433c42.839 0 77.567 34.728 77.567 77.567h23.866c0-56.02-45.413-101.433-101.433-101.433v23.866ZM101.433 179c0-42.839 34.728-77.567 77.567-77.567V77.567C122.98 77.567 77.567 122.98 77.567 179h23.866ZM179 256.567c-42.839 0-77.567-34.728-77.567-77.567H77.567c0 56.02 45.413 101.433 101.433 101.433v-23.866Zm86.517 0H179v23.866h86.517v-23.866Zm-27.403-16.189 16.729 33.459 21.347-10.674-16.729-33.459-21.347 10.674ZM256.567 179c0 18.396-6.39 35.268-17.08 48.563l18.6 14.955c13.975-17.38 22.346-39.488 22.346-63.518h-23.866Z","fill":"white"}}),_c('path',{attrs:{"d":"M226.733 202.867c-6.527 5.701-13.942 10.11-22.243 13.226-8.302 3.116-16.781 4.674-25.437 4.674-8.727 0-17.241-1.558-25.543-4.674-8.301-3.116-15.716-7.525-22.243-13.226v-11.933c4.399 2.651 9.365 4.939 14.9 6.861a112.143 112.143 0 0 0 16.816 4.674c5.747 1.127 11.104 1.691 16.07 1.691 5.038 0 10.395-.564 16.071-1.691a112.209 112.209 0 0 0 16.816-4.674c5.534-1.922 10.465-4.21 14.793-6.861v11.933Z","fill":"white"}}),_c('defs',[_c('linearGradient',{attrs:{"id":"paint0_linear_1957_89480","x1":"0","y1":"0","x2":"358","y2":"358","gradientUnits":"userSpaceOnUse"}},[_c('stop',{attrs:{"stop-color":"#7C52FF"}}),_c('stop',{attrs:{"offset":"1","stop-color":"#F9008E"}})],1)],1)])}
+var IconDialbotvue_type_template_id_afc48fb0_staticRenderFns = []
 
 
-;// CONCATENATED MODULE: ./node_modules/@dialpad/dialtone/lib/dist/vue/icons/IconDialpadGlyph.vue
+;// CONCATENATED MODULE: ./node_modules/@dialpad/dialtone/lib/dist/vue/icons/IconDialbot.vue
 
 var script = {}
 
 
 /* normalize component */
 ;
-var IconDialpadGlyph_component = normalizeComponent(
+var IconDialbot_component = normalizeComponent(
   script,
-  IconDialpadGlyphvue_type_template_id_85d2b6f4_render,
-  IconDialpadGlyphvue_type_template_id_85d2b6f4_staticRenderFns,
+  IconDialbotvue_type_template_id_afc48fb0_render,
+  IconDialbotvue_type_template_id_afc48fb0_staticRenderFns,
   false,
   null,
   null,
@@ -23956,7 +23984,7 @@ var IconDialpadGlyph_component = normalizeComponent(
   
 )
 
-/* harmony default export */ const IconDialpadGlyph = (IconDialpadGlyph_component.exports);
+/* harmony default export */ const IconDialbot = (IconDialbot_component.exports);
 ;// 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/general_row/leftbar_general_row_icon.vue?vue&type=script&lang=js&
 //
 //
@@ -23978,7 +24006,6 @@ var IconDialpadGlyph_component = normalizeComponent(
 //
 //
 //
-//
 
 
 
@@ -23986,7 +24013,7 @@ var IconDialpadGlyph_component = normalizeComponent(
   name: 'DtRecipeLeftbarGeneralRowIcon',
   components: {
     DtIcon: icon,
-    IconDialpadGlyph: IconDialpadGlyph
+    IconDialbot: IconDialbot
   },
   props: {
     type: {
@@ -24020,7 +24047,7 @@ var IconDialpadGlyph_component = normalizeComponent(
     },
 
     dialbotClasses() {
-      return ['d-bar-circle', 'd-bgc-purple-400', 'd-w24', 'd-h24', 'd-d-flex', 'd-ai-center', 'd-jc-center'];
+      return ['d-w24', 'd-h24', 'd-d-flex', 'd-ai-center', 'd-jc-center'];
     }
 
   }
@@ -24037,8 +24064,8 @@ var IconDialpadGlyph_component = normalizeComponent(
 ;
 var leftbar_general_row_icon_component = normalizeComponent(
   general_row_leftbar_general_row_iconvue_type_script_lang_js_,
-  leftbar_general_row_iconvue_type_template_id_06ed62b0_render,
-  leftbar_general_row_iconvue_type_template_id_06ed62b0_staticRenderFns,
+  leftbar_general_row_iconvue_type_template_id_42d6843e_render,
+  leftbar_general_row_iconvue_type_template_id_42d6843e_staticRenderFns,
   false,
   null,
   null,
@@ -24168,6 +24195,7 @@ var leftbar_general_row_icon_component = normalizeComponent(
 //
 //
 //
+//
 
 
 
@@ -24406,8 +24434,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_18766278_render,
-  general_rowvue_type_template_id_18766278_staticRenderFns,
+  general_rowvue_type_template_id_31787490_render,
+  general_rowvue_type_template_id_31787490_staticRenderFns,
   false,
   null,
   null,
@@ -24578,9 +24606,9 @@ 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=483627f3&
-var contact_rowvue_type_template_id_483627f3_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,"description":(_vm.name + " " + _vm.presenceText + " " + _vm.userStatus),"has-unreads":_vm.hasUnreads,"selected":_vm.selected,"has-call-button":true,"muted":_vm.muted,"is-typing":_vm.isTyping,"call-button-tooltip":_vm.callButtonTooltip,"unread-count-tooltip":_vm.unreadCountTooltip},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_483627f3_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/contact_row/contact_row.vue?vue&type=template&id=4a456732&
+var contact_rowvue_type_template_id_4a456732_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,"description":(_vm.name + " " + _vm.presenceText + " " + _vm.userStatus),"has-unreads":_vm.hasUnreads,"selected":_vm.selected,"has-call-button":true,"muted":_vm.muted,"is-typing":_vm.isTyping,"call-button-tooltip":_vm.callButtonTooltip,"unread-count-tooltip":_vm.unreadCountTooltip},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_4a456732_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&
@@ -24677,6 +24705,7 @@ var contact_rowvue_type_template_id_483627f3_staticRenderFns = []
      * 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
+     * @default active
      */
     avatarPresence: {
       type: String,
@@ -24835,8 +24864,8 @@ var contact_rowvue_type_template_id_483627f3_staticRenderFns = []
 ;
 var contact_row_component = normalizeComponent(
   contact_row_contact_rowvue_type_script_lang_js_,
-  contact_rowvue_type_template_id_483627f3_render,
-  contact_rowvue_type_template_id_483627f3_staticRenderFns,
+  contact_rowvue_type_template_id_4a456732_render,
+  contact_rowvue_type_template_id_4a456732_staticRenderFns,
   false,
   null,
   null,