UNPKG

@dialpad/dialtone

Version:

Dialpad's Dialtone design system monorepo

3 lines (2 loc) 9.56 kB
"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"),o=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 o.extractVueListeners(this.$attrs)},getAriaLabel(){return this.ariaLabel?this.ariaLabel:o.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 o.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(o.returnFirstEl(this.$el)),this.adjustLabelWidth()},beforeUnmount:function(){this.resizeObserver.disconnect()},methods:{removeClassStyleAttrs:o.removeClassStyleAttrs,addClassStyleAttrs:o.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=o.returnFirstEl(this.$el))==null?void 0:l.querySelector(".d-recipe-leftbar-row__primary"))==null?void 0:t.clientWidth)||0,a=((c=(d=o.returnFirstEl(this.$el))==null?void 0:d.querySelector(".d-recipe-leftbar-row__omega"))==null?void 0:c.clientWidth)||0,r=((u=(s=o.returnFirstEl(this.$el))==null?void 0:s.querySelector(".d-recipe-leftbar-row__alpha"))==null?void 0:u.clientWidth)||0,h=16;this.labelWidth=n-(a+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=e.createElementVNode("span",null,null,-1),B=e.createElementVNode("span",null,null,-1),k=e.createElementVNode("span",null,null,-1),V=[S,B,k],D={key:0,class:"d-recipe-leftbar-row__omega"},W={key:1,class:"d-recipe-leftbar-row__active-voice"},U={key:3,class:"d-recipe-leftbar-row__action","data-qa":"dt-recipe-leftbar-row-action"};function q(n,a,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,V)),[[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",D,[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",W,[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",U,[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:a[0]||(a[0]=_=>l.actionFocused=!0),onBlur:a[1]||(a[1]=_=>l.actionFocused=!1),onClick:a[2]||(a[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 x=w._(R,[["render",q]]);exports.default=x; //# sourceMappingURL=general-row.cjs.map