@dialpad/dialtone-vue 3.218.3 → 3.219.0-next.2

package/dist/lib/general-row/general-row.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("./general-row-constants.cjs"),b=require("@dialpad/dialtone-icons/vue3"),T=require("./leftbar-general-row-icon.cjs"),a=require("../../common/utils/index.cjs"),E=require("../../localization/index.cjs"),e=require("vue"),w=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),y=require("../tooltip/tooltip.cjs"),g=require("../button/button.cjs"),N=require("../badge/badge.cjs"),v=require("../emoji-text-wrapper/emoji-text-wrapper.cjs"),R={compatConfig:{MODE:3},name:"DtRecipeGeneralRow",components:{DtEmojiTextWrapper:v.default,DtBadge:N.default,DtButton:g.default,DtTooltip:y.default,DtIconPhone:b.DtIconPhone,DtIconWaveform:b.DtIconWaveform,DtRecipeLeftbarGeneralRowIcon:T.default},inheritAttrs:!1,props:{type:{type:String,default:"inbox",validator:n=>Object.values(i.LEFTBAR_GENERAL_ROW_TYPES).includes(n)},ariaLabel:{type:String,default:""},description:{type:String,required:!0},color:{type:String,default:null,validator:n=>Object.keys(i.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(n)},channelSetting:{type:String,default:null},hasUnreads:{type:Boolean,default:!1},unreadCount:{type:String,default:null},unreadMentionCount:{type:String,default:null},selected:{type:Boolean,default:!1},muted:{type:Boolean,default:!1},activeVoiceChat:{type:Boolean,default:!1},dndText:{type:String,default:""},hasCallButton:{type:Boolean,default:!1},isTyping:{type:Boolean,default:!1},iconSize:{type:String,default:"300",validator:n=>i.LEFTBAR_GENERAL_ROW_ICON_SIZES.includes(n)}},emits:["call"],data(){return{actionFocused:!1,labelWidth:"100%",i18n:new E.DialtoneLocalization}},computed:{leftbarGeneralRowClasses(){return["d-recipe-leftbar-row",{"d-recipe-leftbar-row--no-action":!this.hasCallButton,"d-recipe-leftbar-row--has-unread":this.hasUnreads,"d-recipe-leftbar-row__unread-count":this.showUnreadCount||this.showUnreadMentionCount,"d-recipe-leftbar-row--selected":this.selected,"d-recipe-leftbar-row--muted":this.muted,"d-recipe-leftbar-row--action-focused":this.actionFocused}]},getIcon(){switch(this.type){case i.LEFTBAR_GENERAL_ROW_TYPES.CHANNELS:if(this.hasUnreads)return"channel unread";break;case i.LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL:if(this.hasUnreads)return"locked channel unread";break}return this.type},generalRowListeners(){return a.extractVueListeners(this.$attrs)},getAriaLabel(){return this.ariaLabel?this.ariaLabel:a.safeConcatStrings([this.typingTooltip,this.description,this.unreadCountTooltip,this.dndTextTooltip,this.activeVoiceChatTooltip])},hasActions(){return this.dndText||this.activeVoiceChat||this.showUnreadCount||this.hasCallButton||this.showUnreadMentionCount},showUnreadCount(){return!!this.unreadCount&&this.hasUnreads},showUnreadMentionCount(){return!!this.unreadMentionCount&&this.hasUnreads},hasUnreadCount(){return this.unreadCount!==null},hasUnreadMentionCount(){return this.unreadMentionCount!==null},shouldApplyCustomStyleForCountBadge(){return this.hasUnreadCount&&this.hasUnreadMentionCount},shouldApplyCustomStyleForMentionOnly(){return this.channelSetting==="always"&&!this.hasUnreadCount&&this.hasUnreadMentionCount},messageCount(){return isNaN(this.unreadCount)?this.unreadCount:Number(this.unreadCount)},mentionCount(){return isNaN(this.unreadMentionCount)?this.unreadMentionCount:Number(this.unreadMentionCount)},unreadCountTooltip(){return a.safeConcatStrings([this.unreadCount&&this.i18n.$t("DIALTONE_UNREAD_MESSAGE_COUNT_TEXT",{unreadCount:this.messageCount}),this.unreadMentionCount&&this.i18n.$t("DIALTONE_UNREAD_MENTION_COUNT_TEXT",{unreadCount:this.mentionCount})])},dndTextTooltip(){return this.dndText&&this.i18n.$t("DIALTONE_GENERAL_ROW_DND_TEXT_TOOLTIP")},activeVoiceChatTooltip(){return this.activeVoiceChat&&this.i18n.$t("DIALTONE_GENERAL_ROW_ACTIVE_VOICE_CHAT_TEXT")},callButtonTooltip(){return this.i18n.$t("DIALTONE_GENERAL_ROW_CALL_BUTTON_TOOLTIP")},typingTooltip(){return this.isTyping&&this.i18n.$t("DIALTONE_TYPING_TEXT")}},watch:{$props:{immediate:!0,deep:!0,async handler(){this.validateProps(),await this.$nextTick(),this.adjustLabelWidth()}}},mounted(){this.resizeObserver=new ResizeObserver(this.adjustLabelWidth),this.resizeObserver.observe(a.returnFirstEl(this.$el)),this.adjustLabelWidth()},beforeUnmount:function(){this.resizeObserver.disconnect()},methods:{removeClassStyleAttrs:a.removeClassStyleAttrs,addClassStyleAttrs:a.addClassStyleAttrs,validateProps(){this.type===i.LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER&&!Object.keys(i.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)&&console.error(i.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR)},adjustLabelWidth(){var l,t,d,c,s,u;const n=((t=(l=a.returnFirstEl(this.$el))==null?void 0:l.querySelector(".d-recipe-leftbar-row__primary"))==null?void 0:t.clientWidth)||0,o=((c=(d=a.returnFirstEl(this.$el))==null?void 0:d.querySelector(".d-recipe-leftbar-row__omega"))==null?void 0:c.clientWidth)||0,r=((u=(s=a.returnFirstEl(this.$el))==null?void 0:s.querySelector(".d-recipe-leftbar-row__alpha"))==null?void 0:u.clientWidth)||0,h=16;this.labelWidth=n-(o+r+h)+"px"}}},A=["data-qa","aria-label","title","href"],L={class:"d-recipe-leftbar-row__alpha"},O={key:0,class:"d-recipe-leftbar-row__is-typing"},S={key:0,class:"d-recipe-leftbar-row__omega"},B={key:1,class:"d-recipe-leftbar-row__active-voice"},k={key:3,class:"d-recipe-leftbar-row__action","data-qa":"dt-recipe-leftbar-row-action"};function V(n,o,r,h,l,t){const d=e.resolveComponent("dt-recipe-leftbar-general-row-icon"),c=e.resolveComponent("dt-emoji-text-wrapper"),s=e.resolveComponent("dt-tooltip"),u=e.resolveComponent("dt-icon-waveform"),p=e.resolveComponent("dt-badge"),m=e.resolveComponent("dt-icon-phone"),f=e.resolveComponent("dt-button"),C=e.resolveDirective("dt-tooltip");return e.openBlock(),e.createElementBlock("div",e.mergeProps({class:t.leftbarGeneralRowClasses},t.addClassStyleAttrs(n.$attrs),{"data-qa":"dt-recipe-leftbar-row"}),[e.createElementVNode("a",e.mergeProps({class:"d-recipe-leftbar-row__primary","data-qa":"data-qa"in n.$attrs?n.$attrs["data-qa"]:"d-recipe-leftbar-row-link","aria-label":t.getAriaLabel,title:r.description,href:"href"in n.$attrs?n.$attrs.href:"javascript:void(0)"},t.removeClassStyleAttrs(n.$attrs),e.toHandlers(t.generalRowListeners,!0)),[e.createElementVNode("div",L,[r.isTyping?e.withDirectives((e.openBlock(),e.createElementBlock("div",O,[...o[3]||(o[3]=[e.createElementVNode("span",null,null,-1),e.createElementVNode("span",null,null,-1),e.createElementVNode("span",null,null,-1)])])),[[C,t.typingTooltip]]):e.renderSlot(n.$slots,"left",{key:1},()=>[e.createVNode(d,{type:t.getIcon,color:r.color,"icon-size":r.iconSize,"data-qa":"dt-recipe-leftbar-row-icon"},null,8,["type","color","icon-size"])])]),e.createElementVNode("div",{class:"d-recipe-leftbar-row__label",style:e.normalizeStyle(`flex-basis: ${l.labelWidth}`)},[e.renderSlot(n.$slots,"label",{},()=>[e.createVNode(c,{class:"d-recipe-leftbar-row__description","data-qa":"dt-recipe-leftbar-row-description",size:"200"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.description),1)]),_:1})])],4)],16,A),t.hasActions?(e.openBlock(),e.createElementBlock("div",S,[r.dndText?(e.openBlock(),e.createBlock(s,{key:0,placement:"top",message:t.dndTextTooltip},{anchor:e.withCtx(()=>[e.createElementVNode("div",{ref:"d-recipe-leftbar-row-dnd",class:"d-recipe-leftbar-row__dnd","data-qa":"dt-recipe-leftbar-row-dnd"},e.toDisplayString(r.dndText),513)]),_:1},8,["message"])):e.createCommentVNode("",!0),r.activeVoiceChat?e.withDirectives((e.openBlock(),e.createElementBlock("div",B,[e.createVNode(u,{size:"300"})])),[[C,t.activeVoiceChatTooltip]]):t.showUnreadCount||t.showUnreadMentionCount?(e.openBlock(),e.createBlock(s,{key:2,message:t.unreadCountTooltip,placement:"top"},{anchor:e.withCtx(()=>[t.showUnreadCount?(e.openBlock(),e.createBlock(p,{key:0,kind:"count",type:"bulletin","data-qa":"dt-recipe-leftbar-row-unread-badge",class:e.normalizeClass(["d-recipe-leftbar-row__unread-badge",{"d-recipe-leftbar-row__unread-count-badge":t.shouldApplyCustomStyleForCountBadge}])},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.unreadCount),1)]),_:1},8,["class"])):e.createCommentVNode("",!0),t.showUnreadMentionCount?(e.openBlock(),e.createBlock(p,{key:1,kind:"count",type:"bulletin","data-qa":"dt-recipe-leftbar-row-unread-mention-badge",class:e.normalizeClass(["d-recipe-leftbar-row__unread-badge",{"d-recipe-leftbar-row__unread-mention-count-badge":t.shouldApplyCustomStyleForCountBadge},{"d-recipe-leftbar-row__unread-mention-only-count-badge":t.shouldApplyCustomStyleForMentionOnly}])},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.unreadMentionCount),1)]),_:1},8,["class"])):e.createCommentVNode("",!0)]),_:1},8,["message"])):e.createCommentVNode("",!0),r.hasCallButton?(e.openBlock(),e.createElementBlock("div",k,[e.createVNode(s,{message:t.callButtonTooltip,placement:"top"},{anchor:e.withCtx(()=>[e.createVNode(f,{class:"d-recipe-leftbar-row__action-button","data-qa":"dt-recipe-leftbar-row-action-call-button",circle:"",size:"xs",kind:"inverted","aria-label":t.callButtonTooltip,onFocus:o[0]||(o[0]=_=>l.actionFocused=!0),onBlur:o[1]||(o[1]=_=>l.actionFocused=!1),onClick:o[2]||(o[2]=e.withModifiers(_=>n.$emit("call",_),["stop"]))},{icon:e.withCtx(()=>[e.createVNode(m,{size:"200"})]),_:1},8,["aria-label"])]),_:1},8,["message"])])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],16)}const D=w._(R,[["render",V]]);exports.default=D;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./general-row-constants.cjs"),a=require("@dialpad/dialtone-icons/vue"),R=require("./leftbar-general-row-icon.cjs"),l=require("../../common/utils/index.cjs"),f=require("../../localization/index.cjs"),e=require("vue"),A=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),N=require("../avatar/avatar.cjs"),L=require("../tooltip/tooltip.cjs"),y=require("../button/button.cjs"),w=require("../badge/badge.cjs"),O=require("../emoji-text-wrapper/emoji-text-wrapper.cjs"),S=new Map([[n.LEFTBAR_GENERAL_ROW_TYPES.INBOX,a.DtIconInbox],[n.LEFTBAR_GENERAL_ROW_TYPES.CONTACTS,a.DtIconContacts],[n.LEFTBAR_GENERAL_ROW_TYPES.CHANNELS,a.DtIconHash],[n.LEFTBAR_GENERAL_ROW_TYPES.THREADS,a.DtIconThread],[n.LEFTBAR_GENERAL_ROW_TYPES.LAUNCHPAD,a.DtIconLayoutTemplate],[n.LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL,a.DtIconLock],[n.LEFTBAR_GENERAL_ROW_TYPES.QUICK_START,a.DtIconSparkle],[n.LEFTBAR_GENERAL_ROW_TYPES.COACHING_GROUP,a.DtIconUsers],[n.LEFTBAR_GENERAL_ROW_TYPES.COACHING_CENTER,a.DtIconExternalLink],["locked channel unread",a.DtIconLockFilled],["channel unread",a.DtIconHashBold],[n.LEFTBAR_GENERAL_ROW_TYPES.ASSIGNED,a.DtIconAtSign],[n.LEFTBAR_GENERAL_ROW_TYPES.DIGITAL,a.DtIconLaptop2],[n.LEFTBAR_GENERAL_ROW_TYPES.SCHEDULED,a.DtIconCalendarClock]]),B={compatConfig:{MODE:3},name:"DtRecipeGeneralRow",components:{DtEmojiTextWrapper:O.default,DtBadge:w.default,DtButton:y.default,DtTooltip:L.default,DtIconPhone:a.DtIconPhone,DtIconWaveform:a.DtIconWaveform,DtIconDialbot:a.DtIconDialbot,DtAvatar:N.default,DtRecipeLeftbarGeneralRowIcon:R.default},inheritAttrs:!1,props:{type:{type:String,default:"inbox",validator:o=>Object.values(n.LEFTBAR_GENERAL_ROW_TYPES).includes(o)},ariaLabel:{type:String,default:""},description:{type:String,required:!0},color:{type:String,default:null,validator:o=>Object.keys(n.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(o)},channelSetting:{type:String,default:null},hasUnreads:{type:Boolean,default:!1},unreadCount:{type:String,default:null},unreadMentionCount:{type:String,default:null},selected:{type:Boolean,default:!1},muted:{type:Boolean,default:!1},activeVoiceChat:{type:Boolean,default:!1},dndText:{type:String,default:""},hasCallButton:{type:Boolean,default:!1},isTyping:{type:Boolean,default:!1},iconSize:{type:String,default:"300",validator:o=>n.LEFTBAR_GENERAL_ROW_ICON_SIZES.includes(o)}},emits:["call"],data(){return{actionFocused:!1,labelWidth:"100%",i18n:new f.DialtoneLocalization}},computed:{leftbarGeneralRowClasses(){return["d-recipe-leftbar-row",{"d-recipe-leftbar-row--no-action":!this.hasCallButton,"d-recipe-leftbar-row--has-unread":this.hasUnreads,"d-recipe-leftbar-row__unread-count":this.showUnreadCount||this.showUnreadMentionCount,"d-recipe-leftbar-row--selected":this.selected,"d-recipe-leftbar-row--muted":this.muted,"d-recipe-leftbar-row--action-focused":this.actionFocused}]},getIcon(){switch(this.type){case n.LEFTBAR_GENERAL_ROW_TYPES.CHANNELS:if(this.hasUnreads)return"channel unread";break;case n.LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL:if(this.hasUnreads)return"locked channel unread";break}return this.type},getIconComponent(){return S.get(this.getIcon)},isDialbotType(){return this.type===n.LEFTBAR_GENERAL_ROW_TYPES.DIALBOT},isContactCenterType(){return this.type===n.LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER},contactCenterIconClasses(){return["d-recipe-leftbar-row__icon-cc",n.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS[this.color]]},avatarSize(){return this.iconSize},generalRowListeners(){return l.extractVueListeners(this.$attrs)},getAriaLabel(){return this.ariaLabel?this.ariaLabel:l.safeConcatStrings([this.typingTooltip,this.description,this.unreadCountTooltip,this.dndTextTooltip,this.activeVoiceChatTooltip])},hasActions(){return this.dndText||this.activeVoiceChat||this.showUnreadCount||this.hasCallButton||this.showUnreadMentionCount},showUnreadCount(){return!!this.unreadCount&&this.hasUnreads},showUnreadMentionCount(){return!!this.unreadMentionCount&&this.hasUnreads},hasUnreadCount(){return this.unreadCount!==null},hasUnreadMentionCount(){return this.unreadMentionCount!==null},shouldApplyCustomStyleForCountBadge(){return this.hasUnreadCount&&this.hasUnreadMentionCount},shouldApplyCustomStyleForMentionOnly(){return this.channelSetting==="always"&&!this.hasUnreadCount&&this.hasUnreadMentionCount},messageCount(){return isNaN(this.unreadCount)?this.unreadCount:Number(this.unreadCount)},mentionCount(){return isNaN(this.unreadMentionCount)?this.unreadMentionCount:Number(this.unreadMentionCount)},unreadCountTooltip(){return l.safeConcatStrings([this.unreadCount&&this.i18n.$t("DIALTONE_UNREAD_MESSAGE_COUNT_TEXT",{unreadCount:this.messageCount}),this.unreadMentionCount&&this.i18n.$t("DIALTONE_UNREAD_MENTION_COUNT_TEXT",{unreadCount:this.mentionCount})])},dndTextTooltip(){return this.dndText&&this.i18n.$t("DIALTONE_GENERAL_ROW_DND_TEXT_TOOLTIP")},activeVoiceChatTooltip(){return this.activeVoiceChat&&this.i18n.$t("DIALTONE_GENERAL_ROW_ACTIVE_VOICE_CHAT_TEXT")},callButtonTooltip(){return this.i18n.$t("DIALTONE_GENERAL_ROW_CALL_BUTTON_TOOLTIP")},typingTooltip(){return this.isTyping&&this.i18n.$t("DIALTONE_TYPING_TEXT")}},watch:{$props:{immediate:!0,deep:!0,async handler(){this.validateProps(),await this.$nextTick(),this.adjustLabelWidth()}}},mounted(){this.resizeObserver=new ResizeObserver(this.adjustLabelWidth),this.resizeObserver.observe(l.returnFirstEl(this.$el)),this.adjustLabelWidth()},beforeUnmount:function(){this.resizeObserver.disconnect()},methods:{removeClassStyleAttrs:l.removeClassStyleAttrs,addClassStyleAttrs:l.addClassStyleAttrs,validateProps(){this.type===n.LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER&&!Object.keys(n.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)&&console.error(n.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR)},adjustLabelWidth(){var s,t,u,_,h,d;const o=((t=(s=l.returnFirstEl(this.$el))==null?void 0:s.querySelector(".d-recipe-leftbar-row__primary"))==null?void 0:t.clientWidth)||0,i=((_=(u=l.returnFirstEl(this.$el))==null?void 0:u.querySelector(".d-recipe-leftbar-row__omega"))==null?void 0:_.clientWidth)||0,r=((d=(h=l.returnFirstEl(this.$el))==null?void 0:h.querySelector(".d-recipe-leftbar-row__alpha"))==null?void 0:d.clientWidth)||0,p=16;this.labelWidth=o-(i+r+p)+"px"}}},g=["data-qa","aria-label","title","href"],v={class:"d-recipe-leftbar-row__alpha"},D={key:0,class:"d-recipe-leftbar-row__is-typing"},k={key:0,class:"d-recipe-leftbar-general-row__icon","data-qa":"dt-recipe-leftbar-row-icon"},I={key:2,"data-qa":"dt-recipe-leftbar-row-icon"},W={key:0,class:"d-recipe-leftbar-row__omega"},F={key:1,class:"d-recipe-leftbar-row__active-voice"},G={key:3,class:"d-recipe-leftbar-row__action","data-qa":"dt-recipe-leftbar-row-action"};function V(o,i,r,p,s,t){const u=e.resolveComponent("dt-icon-dialbot"),_=e.resolveComponent("dt-avatar"),h=e.resolveComponent("dt-emoji-text-wrapper"),d=e.resolveComponent("dt-tooltip"),T=e.resolveComponent("dt-icon-waveform"),E=e.resolveComponent("dt-badge"),m=e.resolveComponent("dt-icon-phone"),b=e.resolveComponent("dt-button"),C=e.resolveDirective("dt-tooltip");return e.openBlock(),e.createElementBlock("div",e.mergeProps({class:t.leftbarGeneralRowClasses},t.addClassStyleAttrs(o.$attrs),{"data-qa":"dt-recipe-leftbar-row"}),[e.createElementVNode("a",e.mergeProps({class:"d-recipe-leftbar-row__primary","data-qa":"data-qa"in o.$attrs?o.$attrs["data-qa"]:"d-recipe-leftbar-row-link","aria-label":t.getAriaLabel,title:r.description,href:"href"in o.$attrs?o.$attrs.href:"javascript:void(0)"},t.removeClassStyleAttrs(o.$attrs),e.toHandlers(t.generalRowListeners,!0)),[e.createElementVNode("div",v,[r.isTyping?e.withDirectives((e.openBlock(),e.createElementBlock("div",D,[...i[3]||(i[3]=[e.createElementVNode("span",null,null,-1),e.createElementVNode("span",null,null,-1),e.createElementVNode("span",null,null,-1)])])),[[C,t.typingTooltip]]):o.$slots.start?e.renderSlot(o.$slots,"start",{key:1}):o.$slots.left?e.renderSlot(o.$slots,"left",{key:2}):(e.openBlock(),e.createElementBlock(e.Fragment,{key:3},[t.isDialbotType?(e.openBlock(),e.createElementBlock("div",k,[e.createVNode(u,{size:"500"})])):t.isContactCenterType?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(t.contactCenterIconClasses),"data-qa":"dt-recipe-leftbar-row-icon"},null,2)):(e.openBlock(),e.createElementBlock("div",I,[e.createVNode(_,{"icon-only":"",size:t.avatarSize},{icon:e.withCtx(({iconSize:c})=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.getIconComponent),{size:c},null,8,["size"]))]),_:1},8,["size"])]))],64))]),e.createElementVNode("div",{class:"d-recipe-leftbar-row__label",style:e.normalizeStyle(`flex-basis: ${s.labelWidth}`)},[e.renderSlot(o.$slots,"label",{},()=>[e.createVNode(h,{class:"d-recipe-leftbar-row__description","data-qa":"dt-recipe-leftbar-row-description",size:"200"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.description),1)]),_:1})])],4)],16,g),t.hasActions?(e.openBlock(),e.createElementBlock("div",W,[r.dndText?(e.openBlock(),e.createBlock(d,{key:0,placement:"top",message:t.dndTextTooltip},{anchor:e.withCtx(()=>[e.createElementVNode("div",{ref:"d-recipe-leftbar-row-dnd",class:"d-recipe-leftbar-row__dnd","data-qa":"dt-recipe-leftbar-row-dnd"},e.toDisplayString(r.dndText),513)]),_:1},8,["message"])):e.createCommentVNode("",!0),r.activeVoiceChat?e.withDirectives((e.openBlock(),e.createElementBlock("div",F,[e.createVNode(T,{size:"300"})])),[[C,t.activeVoiceChatTooltip]]):t.showUnreadCount||t.showUnreadMentionCount?(e.openBlock(),e.createBlock(d,{key:2,message:t.unreadCountTooltip,placement:"top"},{anchor:e.withCtx(()=>[t.showUnreadCount?(e.openBlock(),e.createBlock(E,{key:0,kind:"count",type:"bulletin","data-qa":"dt-recipe-leftbar-row-unread-badge",class:e.normalizeClass(["d-recipe-leftbar-row__unread-badge",{"d-recipe-leftbar-row__unread-count-badge":t.shouldApplyCustomStyleForCountBadge}])},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.unreadCount),1)]),_:1},8,["class"])):e.createCommentVNode("",!0),t.showUnreadMentionCount?(e.openBlock(),e.createBlock(E,{key:1,kind:"count",type:"bulletin","data-qa":"dt-recipe-leftbar-row-unread-mention-badge",class:e.normalizeClass(["d-recipe-leftbar-row__unread-badge",{"d-recipe-leftbar-row__unread-mention-count-badge":t.shouldApplyCustomStyleForCountBadge},{"d-recipe-leftbar-row__unread-mention-only-count-badge":t.shouldApplyCustomStyleForMentionOnly}])},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.unreadMentionCount),1)]),_:1},8,["class"])):e.createCommentVNode("",!0)]),_:1},8,["message"])):e.createCommentVNode("",!0),r.hasCallButton?(e.openBlock(),e.createElementBlock("div",G,[e.createVNode(d,{message:t.callButtonTooltip,placement:"top"},{anchor:e.withCtx(()=>[e.createVNode(b,{class:"d-recipe-leftbar-row__action-button","data-qa":"dt-recipe-leftbar-row-action-call-button",circle:"",size:100,kind:"inverted","aria-label":t.callButtonTooltip,onFocus:i[0]||(i[0]=c=>s.actionFocused=!0),onBlur:i[1]||(i[1]=c=>s.actionFocused=!1),onClick:i[2]||(i[2]=e.withModifiers(c=>o.$emit("call",c),["stop"]))},{icon:e.withCtx(()=>[e.createVNode(m,{size:"200"})]),_:1},8,["aria-label"])]),_:1},8,["message"])])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],16)}const U=A._(B,[["render",V]]);exports.default=U;
 //# sourceMappingURL=general-row.cjs.map

package/dist/lib/general-row/general-row.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"general-row.cjs","sources":["../../../recipes/leftbar/general_row/general_row.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"leftbarGeneralRowClasses\"\n    v-bind=\"addClassStyleAttrs($attrs)\"\n    data-qa=\"dt-recipe-leftbar-row\"\n  >\n    <a\n      class=\"d-recipe-leftbar-row__primary\"\n      :data-qa=\"'data-qa' in $attrs ? $attrs['data-qa'] : 'd-recipe-leftbar-row-link'\"\n      :aria-label=\"getAriaLabel\"\n      :title=\"description\"\n      :href=\"'href' in $attrs ? $attrs.href : 'javascript:void(0)'\"\n      v-bind=\"removeClassStyleAttrs($attrs)\"\n      v-on=\"generalRowListeners\"\n    >\n      <div\n        class=\"d-recipe-leftbar-row__alpha\"\n      >\n        <div\n          v-if=\"isTyping\"\n          v-dt-tooltip=\"typingTooltip\"\n          class=\"d-recipe-leftbar-row__is-typing\"\n        >\n          <span /><span /><span />\n        </div>\n        <slot\n          v-else\n          name=\"left\"\n        >\n          <dt-recipe-leftbar-general-row-icon\n            :type=\"getIcon\"\n            :color=\"color\"\n            :icon-size=\"iconSize\"\n            data-qa=\"dt-recipe-leftbar-row-icon\"\n          />\n        </slot>\n      </div>\n      <div\n        class=\"d-recipe-leftbar-row__label\"\n        :style=\"`flex-basis: ${labelWidth}`\"\n      >\n        <slot name=\"label\">\n          <dt-emoji-text-wrapper\n            class=\"d-recipe-leftbar-row__description\"\n            data-qa=\"dt-recipe-leftbar-row-description\"\n            size=\"200\"\n          >\n            {{ description }}\n          </dt-emoji-text-wrapper>\n        </slot>\n      </div>\n    </a>\n    <div\n      v-if=\"hasActions\"\n      class=\"d-recipe-leftbar-row__omega\"\n    >\n      <dt-tooltip\n        v-if=\"dndText\"\n        placement=\"top\"\n        :message=\"dndTextTooltip\"\n      >\n        <template #anchor>\n          <div\n            ref=\"d-recipe-leftbar-row-dnd\"\n            class=\"d-recipe-leftbar-row__dnd\"\n            data-qa=\"dt-recipe-leftbar-row-dnd\"\n          >\n            {{ dndText }}\n          </div>\n        </template>\n      </dt-tooltip>\n      <div\n        v-if=\"activeVoiceChat\"\n        v-dt-tooltip=\"activeVoiceChatTooltip\"\n        class=\"d-recipe-leftbar-row__active-voice\"\n      >\n        <dt-icon-waveform\n          size=\"300\"\n        />\n      </div>\n      <dt-tooltip\n        v-else-if=\"showUnreadCount || showUnreadMentionCount\"\n        :message=\"unreadCountTooltip\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-badge\n            v-if=\"showUnreadCount\"\n            kind=\"count\"\n            type=\"bulletin\"\n            data-qa=\"dt-recipe-leftbar-row-unread-badge\"\n            :class=\"['d-recipe-leftbar-row__unread-badge', {\n              'd-recipe-leftbar-row__unread-count-badge':\n                shouldApplyCustomStyleForCountBadge,\n            }]\"\n          >\n            {{ unreadCount }}\n          </dt-badge>\n          <dt-badge\n            v-if=\"showUnreadMentionCount\"\n            kind=\"count\"\n            type=\"bulletin\"\n            data-qa=\"dt-recipe-leftbar-row-unread-mention-badge\"\n            :class=\"['d-recipe-leftbar-row__unread-badge',\n                     { 'd-recipe-leftbar-row__unread-mention-count-badge': shouldApplyCustomStyleForCountBadge },\n                     { 'd-recipe-leftbar-row__unread-mention-only-count-badge': shouldApplyCustomStyleForMentionOnly },\n            ]\"\n          >\n            {{ unreadMentionCount }}\n          </dt-badge>\n        </template>\n      </dt-tooltip>\n      <div\n        v-if=\"hasCallButton\"\n        class=\"d-recipe-leftbar-row__action\"\n        data-qa=\"dt-recipe-leftbar-row-action\"\n      >\n        <dt-tooltip\n          :message=\"callButtonTooltip\"\n          placement=\"top\"\n        >\n          <template #anchor>\n            <dt-button\n              class=\"d-recipe-leftbar-row__action-button\"\n              data-qa=\"dt-recipe-leftbar-row-action-call-button\"\n              circle\n              size=\"xs\"\n              kind=\"inverted\"\n              :aria-label=\"callButtonTooltip\"\n              @focus=\"actionFocused = true\"\n              @blur=\"actionFocused = false\"\n              @click.stop=\"$emit('call', $event)\"\n            >\n              <template #icon>\n                <dt-icon-phone\n                  size=\"200\"\n                />\n              </template>\n            </dt-button>\n          </template>\n        </dt-tooltip>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport {\n  LEFTBAR_GENERAL_ROW_TYPES,\n  LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS,\n  LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR,\n  LEFTBAR_GENERAL_ROW_ICON_SIZES,\n} from './general_row_constants';\nimport { DtBadge } from '@/components/badge';\nimport { DtIconPhone, DtIconWaveform } from '@dialpad/dialtone-icons/vue3';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport { DtEmojiTextWrapper } from '@/components/emoji_text_wrapper';\nimport DtRecipeLeftbarGeneralRowIcon from './leftbar_general_row_icon.vue';\nimport { extractVueListeners, safeConcatStrings, removeClassStyleAttrs, returnFirstEl, addClassStyleAttrs } from '@/common/utils';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeGeneralRow',\n\n  components: {\n    DtEmojiTextWrapper,\n    DtBadge,\n    DtButton,\n    DtTooltip,\n    DtIconPhone,\n    DtIconWaveform,\n    DtRecipeLeftbarGeneralRowIcon,\n  },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Determines the icon to show.\n     * If type is contact center, the color prop must be provided and will determine the color of the icon\n     */\n    type: {\n      type: String,\n      default: 'inbox',\n      validator: (type) => {\n        return Object.values(LEFTBAR_GENERAL_ROW_TYPES).includes(type);\n      },\n    },\n\n    /**\n     * Will be read out by a screen reader upon focus of this row. If not defined \"description\" will be read.\n     */\n    ariaLabel: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Text displayed next to the icon. Required. Even if you are overriding this field using the label slot\n     * you still must input this as it will be displayed as the \"title\" attribute for the row.\n     */\n    description: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Determines the color of the contact center icon\n     */\n    color: {\n      type: String,\n      default: null,\n      validator: (color) => {\n        return Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(color);\n      },\n    },\n\n    /**\n     * The channel setting, either 'mention' or 'always'.\n     * @values 'mention', 'always', null.\n     */\n    channelSetting: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Styles the row with an increased font weight to convey it has unreads. This must be true to see\n     * the unread count badge.\n     */\n    hasUnreads: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Number of unread messages\n     */\n    unreadCount: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Number of unread mention messages\n     */\n    unreadMentionCount: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Determines if the row is selected\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Gives a faded style to be used when muted\n     */\n    muted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Shows styling to represent an active voice chat. This will display over unreadCount.\n     */\n    activeVoiceChat: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Acronym used to represent \"Do not Disturb\" state. If entered will display the entered text alongside\n     * unreadCount.\n     */\n    dndText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Whether the row should have a call button. Usually only applicable to individual contact rows.\n     */\n    hasCallButton: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Shows an \"is typing\" animation over the avatar when true.\n     */\n    isTyping: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Sets the size of the icon.\n     */\n    iconSize: {\n      type: String,\n      default: '300',\n      validator: (size) => {\n        return LEFTBAR_GENERAL_ROW_ICON_SIZES.includes(size);\n      },\n    },\n  },\n\n  emits: [\n    /**\n     * Call button clicked\n     *\n     * @event call\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'call',\n  ],\n\n  data () {\n    return {\n      actionFocused: false,\n      labelWidth: '100%',\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    leftbarGeneralRowClasses () {\n      return [\n        'd-recipe-leftbar-row',\n        {\n          'd-recipe-leftbar-row--no-action': !this.hasCallButton,\n          'd-recipe-leftbar-row--has-unread': this.hasUnreads,\n          'd-recipe-leftbar-row__unread-count': this.showUnreadCount || this.showUnreadMentionCount,\n          'd-recipe-leftbar-row--selected': this.selected,\n          'd-recipe-leftbar-row--muted': this.muted,\n          'd-recipe-leftbar-row--action-focused': this.actionFocused,\n        },\n      ];\n    },\n\n    getIcon () {\n      switch (this.type) {\n        case LEFTBAR_GENERAL_ROW_TYPES.CHANNELS:\n          if (this.hasUnreads) return 'channel unread';\n          break;\n        case LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL:\n          if (this.hasUnreads) return 'locked channel unread';\n          break;\n      }\n      return this.type;\n    },\n\n    generalRowListeners () {\n      return extractVueListeners(this.$attrs);\n    },\n\n    getAriaLabel () {\n      if (this.ariaLabel) return this.ariaLabel;\n\n      return safeConcatStrings([\n        this.typingTooltip,\n        this.description,\n        this.unreadCountTooltip,\n        this.dndTextTooltip,\n        this.activeVoiceChatTooltip,\n      ]);\n    },\n\n    hasActions () {\n      return this.dndText || this.activeVoiceChat || this.showUnreadCount || this.hasCallButton ||\n        this.showUnreadMentionCount;\n    },\n\n    showUnreadCount () {\n      return !!this.unreadCount && this.hasUnreads;\n    },\n\n    showUnreadMentionCount () {\n      return !!this.unreadMentionCount && this.hasUnreads;\n    },\n\n    hasUnreadCount () {\n      return this.unreadCount !== null;\n    },\n\n    hasUnreadMentionCount () {\n      return this.unreadMentionCount !== null;\n    },\n\n    shouldApplyCustomStyleForCountBadge () {\n      return this.hasUnreadCount && this.hasUnreadMentionCount;\n    },\n\n    /**\n     * When a channel in 'always' setting, meaning the user should see both unread count and unread mention count,\n     * if there are only mention messages, we should apply the theme design tokens var(--dt-theme-mention-color-[background||foreground]-strong).\n     * @returns {boolean}\n     */\n    shouldApplyCustomStyleForMentionOnly () {\n      return this.channelSetting === 'always' && !this.hasUnreadCount && this.hasUnreadMentionCount;\n    },\n\n    messageCount () {\n      return isNaN(this.unreadCount)\n        ? this.unreadCount\n        : Number(this.unreadCount);\n    },\n\n    mentionCount () {\n      return isNaN(this.unreadMentionCount)\n        ? this.unreadMentionCount\n        : Number(this.unreadMentionCount);\n    },\n\n    unreadCountTooltip () {\n      return safeConcatStrings([\n        this.unreadCount && this.i18n.$t('DIALTONE_UNREAD_MESSAGE_COUNT_TEXT', { unreadCount: this.messageCount }),\n        this.unreadMentionCount && this.i18n.$t('DIALTONE_UNREAD_MENTION_COUNT_TEXT', { unreadCount: this.mentionCount }),\n      ]);\n    },\n\n    dndTextTooltip () {\n      return this.dndText && this.i18n.$t('DIALTONE_GENERAL_ROW_DND_TEXT_TOOLTIP');\n    },\n\n    activeVoiceChatTooltip () {\n      return this.activeVoiceChat && this.i18n.$t('DIALTONE_GENERAL_ROW_ACTIVE_VOICE_CHAT_TEXT');\n    },\n\n    callButtonTooltip () {\n      return this.i18n.$t('DIALTONE_GENERAL_ROW_CALL_BUTTON_TOOLTIP');\n    },\n\n    typingTooltip () {\n      return this.isTyping && this.i18n.$t('DIALTONE_TYPING_TEXT');\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      deep: true,\n      async handler () {\n        this.validateProps();\n        await this.$nextTick();\n        this.adjustLabelWidth();\n      },\n    },\n  },\n\n  mounted () {\n    this.resizeObserver = new ResizeObserver(this.adjustLabelWidth);\n    this.resizeObserver.observe(returnFirstEl(this.$el));\n    this.adjustLabelWidth();\n  },\n\n  beforeUnmount: function () {\n    this.resizeObserver.disconnect();\n  },\n\n  methods: {\n    removeClassStyleAttrs,\n    addClassStyleAttrs,\n\n    validateProps () {\n      if (this.type === LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER &&\n        !Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)) {\n        console.error(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR);\n      }\n    },\n\n    adjustLabelWidth () {\n      const labelWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__primary')?.clientWidth || 0;\n      const omegaWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__omega')?.clientWidth || 0;\n      const alphaWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__alpha')?.clientWidth || 0;\n      const paddings = 16;\n      this.labelWidth = labelWidth - (omegaWidth + alphaWidth + paddings) + 'px';\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtEmojiTextWrapper","DtBadge","DtButton","DtTooltip","DtIconPhone","DtIconWaveform","DtRecipeLeftbarGeneralRowIcon","type","LEFTBAR_GENERAL_ROW_TYPES","color","LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS","size","LEFTBAR_GENERAL_ROW_ICON_SIZES","DialtoneLocalization","extractVueListeners","safeConcatStrings","returnFirstEl","removeClassStyleAttrs","addClassStyleAttrs","LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR","labelWidth","omegaWidth","alphaWidth","paddings","_hoisted_2","_openBlock","_createElementBlock","_mergeProps","$options","_ctx","_createElementVNode","$props","_toHandlers","_withDirectives","_hoisted_3","_cache","_renderSlot","_createVNode","_component_dt_recipe_leftbar_general_row_icon","$data","_component_dt_emoji_text_wrapper","_hoisted_4","_createBlock","_component_dt_tooltip","_hoisted_5","_component_dt_icon_waveform","_component_dt_badge","_normalizeClass","_hoisted_6","_component_dt_button","_withModifiers","$event","_component_dt_icon_phone"],"mappings":"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"}
+{"version":3,"file":"general-row.cjs","sources":["../../../recipes/leftbar/general_row/general_row.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"leftbarGeneralRowClasses\"\n    v-bind=\"addClassStyleAttrs($attrs)\"\n    data-qa=\"dt-recipe-leftbar-row\"\n  >\n    <a\n      class=\"d-recipe-leftbar-row__primary\"\n      :data-qa=\"'data-qa' in $attrs ? $attrs['data-qa'] : 'd-recipe-leftbar-row-link'\"\n      :aria-label=\"getAriaLabel\"\n      :title=\"description\"\n      :href=\"'href' in $attrs ? $attrs.href : 'javascript:void(0)'\"\n      v-bind=\"removeClassStyleAttrs($attrs)\"\n      v-on=\"generalRowListeners\"\n    >\n      <div\n        class=\"d-recipe-leftbar-row__alpha\"\n      >\n        <div\n          v-if=\"isTyping\"\n          v-dt-tooltip=\"typingTooltip\"\n          class=\"d-recipe-leftbar-row__is-typing\"\n        >\n          <span /><span /><span />\n        </div>\n        <!-- @slot Slot for start content -->\n        <template v-else-if=\"$slots.start\">\n          <slot name=\"start\" />\n        </template>\n        <!-- @slot @deprecated Use start -->\n        <template v-else-if=\"$slots.left\">\n          <slot name=\"left\" />\n        </template>\n        <template v-else>\n          <div\n            v-if=\"isDialbotType\"\n            class=\"d-recipe-leftbar-general-row__icon\"\n            data-qa=\"dt-recipe-leftbar-row-icon\"\n          >\n            <dt-icon-dialbot size=\"500\" />\n          </div>\n          <div\n            v-else-if=\"isContactCenterType\"\n            :class=\"contactCenterIconClasses\"\n            data-qa=\"dt-recipe-leftbar-row-icon\"\n          />\n          <div\n            v-else\n            data-qa=\"dt-recipe-leftbar-row-icon\"\n          >\n            <dt-avatar\n              icon-only\n              :size=\"avatarSize\"\n            >\n              <template #icon=\"{ iconSize: slotIconSize }\">\n                <component\n                  :is=\"getIconComponent\"\n                  :size=\"slotIconSize\"\n                />\n              </template>\n            </dt-avatar>\n          </div>\n        </template>\n      </div>\n      <div\n        class=\"d-recipe-leftbar-row__label\"\n        :style=\"`flex-basis: ${labelWidth}`\"\n      >\n        <slot name=\"label\">\n          <dt-emoji-text-wrapper\n            class=\"d-recipe-leftbar-row__description\"\n            data-qa=\"dt-recipe-leftbar-row-description\"\n            size=\"200\"\n          >\n            {{ description }}\n          </dt-emoji-text-wrapper>\n        </slot>\n      </div>\n    </a>\n    <div\n      v-if=\"hasActions\"\n      class=\"d-recipe-leftbar-row__omega\"\n    >\n      <dt-tooltip\n        v-if=\"dndText\"\n        placement=\"top\"\n        :message=\"dndTextTooltip\"\n      >\n        <template #anchor>\n          <div\n            ref=\"d-recipe-leftbar-row-dnd\"\n            class=\"d-recipe-leftbar-row__dnd\"\n            data-qa=\"dt-recipe-leftbar-row-dnd\"\n          >\n            {{ dndText }}\n          </div>\n        </template>\n      </dt-tooltip>\n      <div\n        v-if=\"activeVoiceChat\"\n        v-dt-tooltip=\"activeVoiceChatTooltip\"\n        class=\"d-recipe-leftbar-row__active-voice\"\n      >\n        <dt-icon-waveform\n          size=\"300\"\n        />\n      </div>\n      <dt-tooltip\n        v-else-if=\"showUnreadCount || showUnreadMentionCount\"\n        :message=\"unreadCountTooltip\"\n        placement=\"top\"\n      >\n        <template #anchor>\n          <dt-badge\n            v-if=\"showUnreadCount\"\n            kind=\"count\"\n            type=\"bulletin\"\n            data-qa=\"dt-recipe-leftbar-row-unread-badge\"\n            :class=\"['d-recipe-leftbar-row__unread-badge', {\n              'd-recipe-leftbar-row__unread-count-badge':\n                shouldApplyCustomStyleForCountBadge,\n            }]\"\n          >\n            {{ unreadCount }}\n          </dt-badge>\n          <dt-badge\n            v-if=\"showUnreadMentionCount\"\n            kind=\"count\"\n            type=\"bulletin\"\n            data-qa=\"dt-recipe-leftbar-row-unread-mention-badge\"\n            :class=\"['d-recipe-leftbar-row__unread-badge',\n                     { 'd-recipe-leftbar-row__unread-mention-count-badge': shouldApplyCustomStyleForCountBadge },\n                     { 'd-recipe-leftbar-row__unread-mention-only-count-badge': shouldApplyCustomStyleForMentionOnly },\n            ]\"\n          >\n            {{ unreadMentionCount }}\n          </dt-badge>\n        </template>\n      </dt-tooltip>\n      <div\n        v-if=\"hasCallButton\"\n        class=\"d-recipe-leftbar-row__action\"\n        data-qa=\"dt-recipe-leftbar-row-action\"\n      >\n        <dt-tooltip\n          :message=\"callButtonTooltip\"\n          placement=\"top\"\n        >\n          <template #anchor>\n            <dt-button\n              class=\"d-recipe-leftbar-row__action-button\"\n              data-qa=\"dt-recipe-leftbar-row-action-call-button\"\n              circle\n              :size=\"100\"\n              kind=\"inverted\"\n              :aria-label=\"callButtonTooltip\"\n              @focus=\"actionFocused = true\"\n              @blur=\"actionFocused = false\"\n              @click.stop=\"$emit('call', $event)\"\n            >\n              <template #icon>\n                <dt-icon-phone\n                  size=\"200\"\n                />\n              </template>\n            </dt-button>\n          </template>\n        </dt-tooltip>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport {\n  LEFTBAR_GENERAL_ROW_TYPES,\n  LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS,\n  LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR,\n  LEFTBAR_GENERAL_ROW_ICON_SIZES,\n} from './general_row_constants';\nimport { DtBadge } from '@/components/badge';\nimport {\n  DtIconPhone,\n  DtIconWaveform,\n  DtIconDialbot,\n  DtIconInbox,\n  DtIconContacts,\n  DtIconHash,\n  DtIconThread,\n  DtIconLayoutTemplate,\n  DtIconLock,\n  DtIconSparkle,\n  DtIconUsers,\n  DtIconExternalLink,\n  DtIconLockFilled,\n  DtIconHashBold,\n  DtIconAtSign,\n  DtIconLaptop2,\n  DtIconCalendarClock,\n} from '@dialpad/dialtone-icons/vue';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport { DtEmojiTextWrapper } from '@/components/emoji_text_wrapper';\nimport { DtAvatar } from '@/components/avatar';\nimport DtRecipeLeftbarGeneralRowIcon from './leftbar_general_row_icon.vue';\nimport { extractVueListeners, safeConcatStrings, removeClassStyleAttrs, returnFirstEl, addClassStyleAttrs } from '@/common/utils';\nimport { DialtoneLocalization } from '@/localization';\n\nconst TYPE_TO_ICON = new Map([\n  [LEFTBAR_GENERAL_ROW_TYPES.INBOX, DtIconInbox],\n  [LEFTBAR_GENERAL_ROW_TYPES.CONTACTS, DtIconContacts],\n  [LEFTBAR_GENERAL_ROW_TYPES.CHANNELS, DtIconHash],\n  [LEFTBAR_GENERAL_ROW_TYPES.THREADS, DtIconThread],\n  [LEFTBAR_GENERAL_ROW_TYPES.LAUNCHPAD, DtIconLayoutTemplate],\n  [LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL, DtIconLock],\n  [LEFTBAR_GENERAL_ROW_TYPES.QUICK_START, DtIconSparkle],\n  [LEFTBAR_GENERAL_ROW_TYPES.COACHING_GROUP, DtIconUsers],\n  [LEFTBAR_GENERAL_ROW_TYPES.COACHING_CENTER, DtIconExternalLink],\n  ['locked channel unread', DtIconLockFilled],\n  ['channel unread', DtIconHashBold],\n  [LEFTBAR_GENERAL_ROW_TYPES.ASSIGNED, DtIconAtSign],\n  [LEFTBAR_GENERAL_ROW_TYPES.DIGITAL, DtIconLaptop2],\n  [LEFTBAR_GENERAL_ROW_TYPES.SCHEDULED, DtIconCalendarClock],\n]);\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeGeneralRow',\n\n  components: {\n    DtEmojiTextWrapper,\n    DtBadge,\n    DtButton,\n    DtTooltip,\n    DtIconPhone,\n    DtIconWaveform,\n    DtIconDialbot,\n    DtAvatar,\n    DtRecipeLeftbarGeneralRowIcon,\n  },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Determines the icon to show.\n     * If type is contact center, the color prop must be provided and will determine the color of the icon\n     */\n    type: {\n      type: String,\n      default: 'inbox',\n      validator: (type) => {\n        return Object.values(LEFTBAR_GENERAL_ROW_TYPES).includes(type);\n      },\n    },\n\n    /**\n     * Will be read out by a screen reader upon focus of this row. If not defined \"description\" will be read.\n     */\n    ariaLabel: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Text displayed next to the icon. Required. Even if you are overriding this field using the label slot\n     * you still must input this as it will be displayed as the \"title\" attribute for the row.\n     */\n    description: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Determines the color of the contact center icon\n     */\n    color: {\n      type: String,\n      default: null,\n      validator: (color) => {\n        return Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(color);\n      },\n    },\n\n    /**\n     * The channel setting, either 'mention' or 'always'.\n     * @values 'mention', 'always', null.\n     */\n    channelSetting: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Styles the row with an increased font weight to convey it has unreads. This must be true to see\n     * the unread count badge.\n     */\n    hasUnreads: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Number of unread messages\n     */\n    unreadCount: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Number of unread mention messages\n     */\n    unreadMentionCount: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Determines if the row is selected\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Gives a faded style to be used when muted\n     */\n    muted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Shows styling to represent an active voice chat. This will display over unreadCount.\n     */\n    activeVoiceChat: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Acronym used to represent \"Do not Disturb\" state. If entered will display the entered text alongside\n     * unreadCount.\n     */\n    dndText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Whether the row should have a call button. Usually only applicable to individual contact rows.\n     */\n    hasCallButton: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Shows an \"is typing\" animation over the avatar when true.\n     */\n    isTyping: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Sets the size of the icon.\n     */\n    iconSize: {\n      type: String,\n      default: '300',\n      validator: (size) => {\n        return LEFTBAR_GENERAL_ROW_ICON_SIZES.includes(size);\n      },\n    },\n  },\n\n  emits: [\n    /**\n     * Call button clicked\n     *\n     * @event call\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'call',\n  ],\n\n  data () {\n    return {\n      actionFocused: false,\n      labelWidth: '100%',\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    leftbarGeneralRowClasses () {\n      return [\n        'd-recipe-leftbar-row',\n        {\n          'd-recipe-leftbar-row--no-action': !this.hasCallButton,\n          'd-recipe-leftbar-row--has-unread': this.hasUnreads,\n          'd-recipe-leftbar-row__unread-count': this.showUnreadCount || this.showUnreadMentionCount,\n          'd-recipe-leftbar-row--selected': this.selected,\n          'd-recipe-leftbar-row--muted': this.muted,\n          'd-recipe-leftbar-row--action-focused': this.actionFocused,\n        },\n      ];\n    },\n\n    getIcon () {\n      switch (this.type) {\n        case LEFTBAR_GENERAL_ROW_TYPES.CHANNELS:\n          if (this.hasUnreads) return 'channel unread';\n          break;\n        case LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL:\n          if (this.hasUnreads) return 'locked channel unread';\n          break;\n      }\n      return this.type;\n    },\n\n    getIconComponent () {\n      return TYPE_TO_ICON.get(this.getIcon);\n    },\n\n    isDialbotType () {\n      return this.type === LEFTBAR_GENERAL_ROW_TYPES.DIALBOT;\n    },\n\n    isContactCenterType () {\n      return this.type === LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER;\n    },\n\n    contactCenterIconClasses () {\n      return [\n        'd-recipe-leftbar-row__icon-cc',\n        LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS[this.color],\n      ];\n    },\n\n    avatarSize () {\n      // Map icon sizes to avatar sizes\n      // iconSize '300' -> avatar size 300\n      // iconSize '200' -> avatar size 200\n      return this.iconSize;\n    },\n\n    generalRowListeners () {\n      return extractVueListeners(this.$attrs);\n    },\n\n    getAriaLabel () {\n      if (this.ariaLabel) return this.ariaLabel;\n\n      return safeConcatStrings([\n        this.typingTooltip,\n        this.description,\n        this.unreadCountTooltip,\n        this.dndTextTooltip,\n        this.activeVoiceChatTooltip,\n      ]);\n    },\n\n    hasActions () {\n      return this.dndText || this.activeVoiceChat || this.showUnreadCount || this.hasCallButton ||\n        this.showUnreadMentionCount;\n    },\n\n    showUnreadCount () {\n      return !!this.unreadCount && this.hasUnreads;\n    },\n\n    showUnreadMentionCount () {\n      return !!this.unreadMentionCount && this.hasUnreads;\n    },\n\n    hasUnreadCount () {\n      return this.unreadCount !== null;\n    },\n\n    hasUnreadMentionCount () {\n      return this.unreadMentionCount !== null;\n    },\n\n    shouldApplyCustomStyleForCountBadge () {\n      return this.hasUnreadCount && this.hasUnreadMentionCount;\n    },\n\n    /**\n     * When a channel in 'always' setting, meaning the user should see both unread count and unread mention count,\n     * if there are only mention messages, we should apply the theme design tokens var(--dt-theme-mention-color-[background||foreground]-strong).\n     * @returns {boolean}\n     */\n    shouldApplyCustomStyleForMentionOnly () {\n      return this.channelSetting === 'always' && !this.hasUnreadCount && this.hasUnreadMentionCount;\n    },\n\n    messageCount () {\n      return isNaN(this.unreadCount)\n        ? this.unreadCount\n        : Number(this.unreadCount);\n    },\n\n    mentionCount () {\n      return isNaN(this.unreadMentionCount)\n        ? this.unreadMentionCount\n        : Number(this.unreadMentionCount);\n    },\n\n    unreadCountTooltip () {\n      return safeConcatStrings([\n        this.unreadCount && this.i18n.$t('DIALTONE_UNREAD_MESSAGE_COUNT_TEXT', { unreadCount: this.messageCount }),\n        this.unreadMentionCount && this.i18n.$t('DIALTONE_UNREAD_MENTION_COUNT_TEXT', { unreadCount: this.mentionCount }),\n      ]);\n    },\n\n    dndTextTooltip () {\n      return this.dndText && this.i18n.$t('DIALTONE_GENERAL_ROW_DND_TEXT_TOOLTIP');\n    },\n\n    activeVoiceChatTooltip () {\n      return this.activeVoiceChat && this.i18n.$t('DIALTONE_GENERAL_ROW_ACTIVE_VOICE_CHAT_TEXT');\n    },\n\n    callButtonTooltip () {\n      return this.i18n.$t('DIALTONE_GENERAL_ROW_CALL_BUTTON_TOOLTIP');\n    },\n\n    typingTooltip () {\n      return this.isTyping && this.i18n.$t('DIALTONE_TYPING_TEXT');\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      deep: true,\n      async handler () {\n        this.validateProps();\n        await this.$nextTick();\n        this.adjustLabelWidth();\n      },\n    },\n  },\n\n  mounted () {\n    this.resizeObserver = new ResizeObserver(this.adjustLabelWidth);\n    this.resizeObserver.observe(returnFirstEl(this.$el));\n    this.adjustLabelWidth();\n  },\n\n  beforeUnmount: function () {\n    this.resizeObserver.disconnect();\n  },\n\n  methods: {\n    removeClassStyleAttrs,\n    addClassStyleAttrs,\n\n    validateProps () {\n      if (this.type === LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER &&\n        !Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)) {\n        console.error(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR);\n      }\n    },\n\n    adjustLabelWidth () {\n      const labelWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__primary')?.clientWidth || 0;\n      const omegaWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__omega')?.clientWidth || 0;\n      const alphaWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__alpha')?.clientWidth || 0;\n      const paddings = 16;\n      this.labelWidth = labelWidth - (omegaWidth + alphaWidth + paddings) + 'px';\n    },\n  },\n};\n</script>\n"],"names":["TYPE_TO_ICON","LEFTBAR_GENERAL_ROW_TYPES","DtIconInbox","DtIconContacts","DtIconHash","DtIconThread","DtIconLayoutTemplate","DtIconLock","DtIconSparkle","DtIconUsers","DtIconExternalLink","DtIconLockFilled","DtIconHashBold","DtIconAtSign","DtIconLaptop2","DtIconCalendarClock","_sfc_main","DtEmojiTextWrapper","DtBadge","DtButton","DtTooltip","DtIconPhone","DtIconWaveform","DtIconDialbot","DtAvatar","DtRecipeLeftbarGeneralRowIcon","type","color","LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS","size","LEFTBAR_GENERAL_ROW_ICON_SIZES","DialtoneLocalization","extractVueListeners","safeConcatStrings","returnFirstEl","removeClassStyleAttrs","addClassStyleAttrs","LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR","labelWidth","omegaWidth","alphaWidth","paddings","_hoisted_2","_openBlock","_createElementBlock","_mergeProps","$options","_ctx","_createElementVNode","$props","_toHandlers","_withDirectives","_hoisted_3","_cache","_renderSlot","_Fragment","_hoisted_4","_createVNode","_component_dt_icon_dialbot","_hoisted_5","_component_dt_avatar","_withCtx","slotIconSize","_createBlock","_resolveDynamicComponent","$data","_component_dt_emoji_text_wrapper","_hoisted_6","_component_dt_tooltip","_hoisted_7","_component_dt_icon_waveform","_component_dt_badge","_normalizeClass","_hoisted_8","_component_dt_button","_withModifiers","$event","_component_dt_icon_phone"],"mappings":"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"}

package/dist/lib/general-row/general-row.js

@@ -1,25 +1,43 @@
-import { LEFTBAR_GENERAL_ROW_TYPES as C, LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as N, LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR as D, LEFTBAR_GENERAL_ROW_ICON_SIZES as k } from "./general-row-constants.js";
-import { DtIconWaveform as M, DtIconPhone as W } from "@dialpad/dialtone-icons/vue3";
-import I from "./leftbar-general-row-icon.js";
-import { addClassStyleAttrs as q, removeClassStyleAttrs as z, returnFirstEl as b, safeConcatStrings as v, extractVueListeners as F } from "../../common/utils/index.js";
-import { DialtoneLocalization as V } from "../../localization/index.js";
-import { resolveComponent as o, resolveDirective as G, openBlock as a, createElementBlock as h, mergeProps as O, createElementVNode as i, toHandlers as x, withDirectives as L, renderSlot as R, createVNode as u, normalizeStyle as j, withCtx as s, createTextVNode as w, toDisplayString as m, createBlock as T, createCommentVNode as c, normalizeClass as S, withModifiers as P } from "vue";
-import { _ as X } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-import H from "../tooltip/tooltip.js";
-import Y from "../button/button.js";
-import K from "../badge/badge.js";
-import Z from "../emoji-text-wrapper/emoji-text-wrapper.js";
-const J = {
+import { LEFTBAR_GENERAL_ROW_TYPES as n, LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as w, LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR as U, LEFTBAR_GENERAL_ROW_ICON_SIZES as B } from "./general-row-constants.js";
+import { DtIconDialbot as M, DtIconWaveform as W, DtIconPhone as z, DtIconInbox as G, DtIconContacts as q, DtIconHash as F, DtIconThread as V, DtIconLayoutTemplate as H, DtIconLock as j, DtIconSparkle as x, DtIconUsers as P, DtIconExternalLink as X, DtIconLockFilled as K, DtIconHashBold as Y, DtIconAtSign as Q, DtIconLaptop2 as Z, DtIconCalendarClock as J } from "@dialpad/dialtone-icons/vue";
+import $ from "./leftbar-general-row-icon.js";
+import { addClassStyleAttrs as ee, removeClassStyleAttrs as te, returnFirstEl as T, safeConcatStrings as L, extractVueListeners as ne } from "../../common/utils/index.js";
+import { DialtoneLocalization as ae } from "../../localization/index.js";
+import { resolveComponent as s, resolveDirective as re, openBlock as a, createElementBlock as i, mergeProps as O, createElementVNode as d, toHandlers as oe, withDirectives as I, renderSlot as E, Fragment as ie, createVNode as c, normalizeClass as g, withCtx as l, createBlock as C, resolveDynamicComponent as se, normalizeStyle as le, createTextVNode as A, toDisplayString as y, createCommentVNode as p, withModifiers as de } from "vue";
+import { _ as ce } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+import ue from "../avatar/avatar.js";
+import he from "../tooltip/tooltip.js";
+import pe from "../button/button.js";
+import _e from "../badge/badge.js";
+import Ce from "../emoji-text-wrapper/emoji-text-wrapper.js";
+const fe = /* @__PURE__ */ new Map([
+  [n.INBOX, G],
+  [n.CONTACTS, q],
+  [n.CHANNELS, F],
+  [n.THREADS, V],
+  [n.LAUNCHPAD, H],
+  [n.LOCKED_CHANNEL, j],
+  [n.QUICK_START, x],
+  [n.COACHING_GROUP, P],
+  [n.COACHING_CENTER, X],
+  ["locked channel unread", K],
+  ["channel unread", Y],
+  [n.ASSIGNED, Q],
+  [n.DIGITAL, Z],
+  [n.SCHEDULED, J]
+]), me = {
   compatConfig: { MODE: 3 },
   name: "DtRecipeGeneralRow",
   components: {
-    DtEmojiTextWrapper: Z,
-    DtBadge: K,
-    DtButton: Y,
-    DtTooltip: H,
-    DtIconPhone: W,
-    DtIconWaveform: M,
-    DtRecipeLeftbarGeneralRowIcon: I
+    DtEmojiTextWrapper: Ce,
+    DtBadge: _e,
+    DtButton: pe,
+    DtTooltip: he,
+    DtIconPhone: z,
+    DtIconWaveform: W,
+    DtIconDialbot: M,
+    DtAvatar: ue,
+    DtRecipeLeftbarGeneralRowIcon: $
   },
   inheritAttrs: !1,
   props: {
@@ -30,7 +48,7 @@ const J = {
     type: {
       type: String,
       default: "inbox",
-      validator: (t) => Object.values(C).includes(t)
+      validator: (t) => Object.values(n).includes(t)
     },
     /**
      * Will be read out by a screen reader upon focus of this row. If not defined "description" will be read.
@@ -53,7 +71,7 @@ const J = {
     color: {
       type: String,
       default: null,
-      validator: (t) => Object.keys(N).includes(t)
+      validator: (t) => Object.keys(w).includes(t)
     },
     /**
      * The channel setting, either 'mention' or 'always'.
@@ -134,7 +152,7 @@ const J = {
     iconSize: {
       type: String,
       default: "300",
-      validator: (t) => k.includes(t)
+      validator: (t) => B.includes(t)
     }
   },
   emits: [
@@ -150,7 +168,7 @@ const J = {
     return {
       actionFocused: !1,
       labelWidth: "100%",
-      i18n: new V()
+      i18n: new ae()
     };
   },
   computed: {
@@ -169,20 +187,38 @@ const J = {
     },
     getIcon() {
       switch (this.type) {
-        case C.CHANNELS:
+        case n.CHANNELS:
           if (this.hasUnreads) return "channel unread";
           break;
-        case C.LOCKED_CHANNEL:
+        case n.LOCKED_CHANNEL:
           if (this.hasUnreads) return "locked channel unread";
           break;
       }
       return this.type;
     },
+    getIconComponent() {
+      return fe.get(this.getIcon);
+    },
+    isDialbotType() {
+      return this.type === n.DIALBOT;
+    },
+    isContactCenterType() {
+      return this.type === n.CONTACT_CENTER;
+    },
+    contactCenterIconClasses() {
+      return [
+        "d-recipe-leftbar-row__icon-cc",
+        w[this.color]
+      ];
+    },
+    avatarSize() {
+      return this.iconSize;
+    },
     generalRowListeners() {
-      return F(this.$attrs);
+      return ne(this.$attrs);
     },
     getAriaLabel() {
-      return this.ariaLabel ? this.ariaLabel : v([
+      return this.ariaLabel ? this.ariaLabel : L([
         this.typingTooltip,
         this.description,
         this.unreadCountTooltip,
@@ -223,7 +259,7 @@ const J = {
       return isNaN(this.unreadMentionCount) ? this.unreadMentionCount : Number(this.unreadMentionCount);
     },
     unreadCountTooltip() {
-      return v([
+      return L([
         this.unreadCount && this.i18n.$t("DIALTONE_UNREAD_MESSAGE_COUNT_TEXT", { unreadCount: this.messageCount }),
         this.unreadMentionCount && this.i18n.$t("DIALTONE_UNREAD_MENTION_COUNT_TEXT", { unreadCount: this.mentionCount })
       ]);
@@ -251,170 +287,188 @@ const J = {
     }
   },
   mounted() {
-    this.resizeObserver = new ResizeObserver(this.adjustLabelWidth), this.resizeObserver.observe(b(this.$el)), this.adjustLabelWidth();
+    this.resizeObserver = new ResizeObserver(this.adjustLabelWidth), this.resizeObserver.observe(T(this.$el)), this.adjustLabelWidth();
   },
   beforeUnmount: function() {
     this.resizeObserver.disconnect();
   },
   methods: {
-    removeClassStyleAttrs: z,
-    addClassStyleAttrs: q,
+    removeClassStyleAttrs: te,
+    addClassStyleAttrs: ee,
     validateProps() {
-      this.type === C.CONTACT_CENTER && !Object.keys(N).includes(this.color) && console.error(D);
+      this.type === n.CONTACT_CENTER && !Object.keys(w).includes(this.color) && console.error(U);
     },
     adjustLabelWidth() {
-      var l, e, _, p, d, f;
-      const t = ((e = (l = b(this.$el)) == null ? void 0 : l.querySelector(".d-recipe-leftbar-row__primary")) == null ? void 0 : e.clientWidth) || 0, n = ((p = (_ = b(this.$el)) == null ? void 0 : _.querySelector(".d-recipe-leftbar-row__omega")) == null ? void 0 : p.clientWidth) || 0, r = ((f = (d = b(this.$el)) == null ? void 0 : d.querySelector(".d-recipe-leftbar-row__alpha")) == null ? void 0 : f.clientWidth) || 0, g = 16;
-      this.labelWidth = t - (n + r + g) + "px";
+      var u, e, f, m, b, h;
+      const t = ((e = (u = T(this.$el)) == null ? void 0 : u.querySelector(".d-recipe-leftbar-row__primary")) == null ? void 0 : e.clientWidth) || 0, o = ((m = (f = T(this.$el)) == null ? void 0 : f.querySelector(".d-recipe-leftbar-row__omega")) == null ? void 0 : m.clientWidth) || 0, r = ((h = (b = T(this.$el)) == null ? void 0 : b.querySelector(".d-recipe-leftbar-row__alpha")) == null ? void 0 : h.clientWidth) || 0, N = 16;
+      this.labelWidth = t - (o + r + N) + "px";
     }
   }
-}, Q = ["data-qa", "aria-label", "title", "href"], $ = { class: "d-recipe-leftbar-row__alpha" }, ee = {
+}, be = ["data-qa", "aria-label", "title", "href"], Te = { class: "d-recipe-leftbar-row__alpha" }, ye = {
   key: 0,
   class: "d-recipe-leftbar-row__is-typing"
-}, te = {
+}, we = {
+  key: 0,
+  class: "d-recipe-leftbar-general-row__icon",
+  "data-qa": "dt-recipe-leftbar-row-icon"
+}, Ee = {
+  key: 2,
+  "data-qa": "dt-recipe-leftbar-row-icon"
+}, ge = {
   key: 0,
   class: "d-recipe-leftbar-row__omega"
-}, re = {
+}, Ae = {
   key: 1,
   class: "d-recipe-leftbar-row__active-voice"
-}, ne = {
+}, Ne = {
   key: 3,
   class: "d-recipe-leftbar-row__action",
   "data-qa": "dt-recipe-leftbar-row-action"
 };
-function ae(t, n, r, g, l, e) {
-  const _ = o("dt-recipe-leftbar-general-row-icon"), p = o("dt-emoji-text-wrapper"), d = o("dt-tooltip"), f = o("dt-icon-waveform"), E = o("dt-badge"), U = o("dt-icon-phone"), B = o("dt-button"), A = G("dt-tooltip");
-  return a(), h("div", O({ class: e.leftbarGeneralRowClasses }, e.addClassStyleAttrs(t.$attrs), { "data-qa": "dt-recipe-leftbar-row" }), [
-    i("a", O({
+function De(t, o, r, N, u, e) {
+  const f = s("dt-icon-dialbot"), m = s("dt-avatar"), b = s("dt-emoji-text-wrapper"), h = s("dt-tooltip"), S = s("dt-icon-waveform"), D = s("dt-badge"), R = s("dt-icon-phone"), k = s("dt-button"), v = re("dt-tooltip");
+  return a(), i("div", O({ class: e.leftbarGeneralRowClasses }, e.addClassStyleAttrs(t.$attrs), { "data-qa": "dt-recipe-leftbar-row" }), [
+    d("a", O({
       class: "d-recipe-leftbar-row__primary",
       "data-qa": "data-qa" in t.$attrs ? t.$attrs["data-qa"] : "d-recipe-leftbar-row-link",
       "aria-label": e.getAriaLabel,
       title: r.description,
       href: "href" in t.$attrs ? t.$attrs.href : "javascript:void(0)"
-    }, e.removeClassStyleAttrs(t.$attrs), x(e.generalRowListeners, !0)), [
-      i("div", $, [
-        r.isTyping ? L((a(), h("div", ee, [...n[3] || (n[3] = [
-          i("span", null, null, -1),
-          i("span", null, null, -1),
-          i("span", null, null, -1)
+    }, e.removeClassStyleAttrs(t.$attrs), oe(e.generalRowListeners, !0)), [
+      d("div", Te, [
+        r.isTyping ? I((a(), i("div", ye, [...o[3] || (o[3] = [
+          d("span", null, null, -1),
+          d("span", null, null, -1),
+          d("span", null, null, -1)
         ])])), [
-          [A, e.typingTooltip]
-        ]) : R(t.$slots, "left", { key: 1 }, () => [
-          u(_, {
-            type: e.getIcon,
-            color: r.color,
-            "icon-size": r.iconSize,
+          [v, e.typingTooltip]
+        ]) : t.$slots.start ? E(t.$slots, "start", { key: 1 }) : t.$slots.left ? E(t.$slots, "left", { key: 2 }) : (a(), i(ie, { key: 3 }, [
+          e.isDialbotType ? (a(), i("div", we, [
+            c(f, { size: "500" })
+          ])) : e.isContactCenterType ? (a(), i("div", {
+            key: 1,
+            class: g(e.contactCenterIconClasses),
             "data-qa": "dt-recipe-leftbar-row-icon"
-          }, null, 8, ["type", "color", "icon-size"])
-        ])
+          }, null, 2)) : (a(), i("div", Ee, [
+            c(m, {
+              "icon-only": "",
+              size: e.avatarSize
+            }, {
+              icon: l(({ iconSize: _ }) => [
+                (a(), C(se(e.getIconComponent), { size: _ }, null, 8, ["size"]))
+              ]),
+              _: 1
+            }, 8, ["size"])
+          ]))
+        ], 64))
       ]),
-      i("div", {
+      d("div", {
         class: "d-recipe-leftbar-row__label",
-        style: j(`flex-basis: ${l.labelWidth}`)
+        style: le(`flex-basis: ${u.labelWidth}`)
       }, [
-        R(t.$slots, "label", {}, () => [
-          u(p, {
+        E(t.$slots, "label", {}, () => [
+          c(b, {
             class: "d-recipe-leftbar-row__description",
             "data-qa": "dt-recipe-leftbar-row-description",
             size: "200"
           }, {
-            default: s(() => [
-              w(m(r.description), 1)
+            default: l(() => [
+              A(y(r.description), 1)
             ]),
             _: 1
           })
         ])
       ], 4)
-    ], 16, Q),
-    e.hasActions ? (a(), h("div", te, [
-      r.dndText ? (a(), T(d, {
+    ], 16, be),
+    e.hasActions ? (a(), i("div", ge, [
+      r.dndText ? (a(), C(h, {
         key: 0,
         placement: "top",
         message: e.dndTextTooltip
       }, {
-        anchor: s(() => [
-          i("div", {
+        anchor: l(() => [
+          d("div", {
             ref: "d-recipe-leftbar-row-dnd",
             class: "d-recipe-leftbar-row__dnd",
             "data-qa": "dt-recipe-leftbar-row-dnd"
-          }, m(r.dndText), 513)
+          }, y(r.dndText), 513)
         ]),
         _: 1
-      }, 8, ["message"])) : c("", !0),
-      r.activeVoiceChat ? L((a(), h("div", re, [
-        u(f, { size: "300" })
+      }, 8, ["message"])) : p("", !0),
+      r.activeVoiceChat ? I((a(), i("div", Ae, [
+        c(S, { size: "300" })
       ])), [
-        [A, e.activeVoiceChatTooltip]
-      ]) : e.showUnreadCount || e.showUnreadMentionCount ? (a(), T(d, {
+        [v, e.activeVoiceChatTooltip]
+      ]) : e.showUnreadCount || e.showUnreadMentionCount ? (a(), C(h, {
         key: 2,
         message: e.unreadCountTooltip,
         placement: "top"
       }, {
-        anchor: s(() => [
-          e.showUnreadCount ? (a(), T(E, {
+        anchor: l(() => [
+          e.showUnreadCount ? (a(), C(D, {
             key: 0,
             kind: "count",
             type: "bulletin",
             "data-qa": "dt-recipe-leftbar-row-unread-badge",
-            class: S(["d-recipe-leftbar-row__unread-badge", {
+            class: g(["d-recipe-leftbar-row__unread-badge", {
               "d-recipe-leftbar-row__unread-count-badge": e.shouldApplyCustomStyleForCountBadge
             }])
           }, {
-            default: s(() => [
-              w(m(r.unreadCount), 1)
+            default: l(() => [
+              A(y(r.unreadCount), 1)
             ]),
             _: 1
-          }, 8, ["class"])) : c("", !0),
-          e.showUnreadMentionCount ? (a(), T(E, {
+          }, 8, ["class"])) : p("", !0),
+          e.showUnreadMentionCount ? (a(), C(D, {
             key: 1,
             kind: "count",
             type: "bulletin",
             "data-qa": "dt-recipe-leftbar-row-unread-mention-badge",
-            class: S([
+            class: g([
               "d-recipe-leftbar-row__unread-badge",
               { "d-recipe-leftbar-row__unread-mention-count-badge": e.shouldApplyCustomStyleForCountBadge },
               { "d-recipe-leftbar-row__unread-mention-only-count-badge": e.shouldApplyCustomStyleForMentionOnly }
             ])
           }, {
-            default: s(() => [
-              w(m(r.unreadMentionCount), 1)
+            default: l(() => [
+              A(y(r.unreadMentionCount), 1)
             ]),
             _: 1
-          }, 8, ["class"])) : c("", !0)
+          }, 8, ["class"])) : p("", !0)
         ]),
         _: 1
-      }, 8, ["message"])) : c("", !0),
-      r.hasCallButton ? (a(), h("div", ne, [
-        u(d, {
+      }, 8, ["message"])) : p("", !0),
+      r.hasCallButton ? (a(), i("div", Ne, [
+        c(h, {
           message: e.callButtonTooltip,
           placement: "top"
         }, {
-          anchor: s(() => [
-            u(B, {
+          anchor: l(() => [
+            c(k, {
               class: "d-recipe-leftbar-row__action-button",
               "data-qa": "dt-recipe-leftbar-row-action-call-button",
               circle: "",
-              size: "xs",
+              size: 100,
               kind: "inverted",
               "aria-label": e.callButtonTooltip,
-              onFocus: n[0] || (n[0] = (y) => l.actionFocused = !0),
-              onBlur: n[1] || (n[1] = (y) => l.actionFocused = !1),
-              onClick: n[2] || (n[2] = P((y) => t.$emit("call", y), ["stop"]))
+              onFocus: o[0] || (o[0] = (_) => u.actionFocused = !0),
+              onBlur: o[1] || (o[1] = (_) => u.actionFocused = !1),
+              onClick: o[2] || (o[2] = de((_) => t.$emit("call", _), ["stop"]))
             }, {
-              icon: s(() => [
-                u(U, { size: "200" })
+              icon: l(() => [
+                c(R, { size: "200" })
               ]),
               _: 1
             }, 8, ["aria-label"])
           ]),
           _: 1
         }, 8, ["message"])
-      ])) : c("", !0)
-    ])) : c("", !0)
+      ])) : p("", !0)
+    ])) : p("", !0)
   ], 16);
 }
-const Ce = /* @__PURE__ */ X(J, [["render", ae]]);
+const Ge = /* @__PURE__ */ ce(me, [["render", De]]);
 export {
-  Ce as default
+  Ge as default
 };
 //# sourceMappingURL=general-row.js.map