@dialpad/dialtone 9.126.5 → 9.127.0

package/dist/vue3/lib/emoji-row/emoji-row.js.map

@@ -1 +1 @@
-{"version":3,"file":"emoji-row.js","sources":["../../../recipes/conversation_view/emoji_row/emoji_row.vue"],"sourcesContent":["<template>\n  <span class=\"d-recipe-emoji-row\">\n    <span\n      v-for=\"reaction in reactions\"\n      :key=\"reaction.unicodeOutput\"\n      :reaction=\"reaction\"\n    >\n      <dt-tooltip\n        class=\"d-recipe-emoji-row__tooltip\"\n        content-class=\"d-recipe-emoji-row__tooltip-content\"\n        sticky=\"popper\"\n        @shown=\"(shown) => emojiHovered(reaction, shown)\"\n      >\n        <span aria-hidden=\"true\">\n          <dt-emoji-text-wrapper size=\"200\">\n            {{ reaction.tooltip }}\n          </dt-emoji-text-wrapper>\n        </span>\n        <template #anchor=\"{ attrs }\">\n          <dt-button\n            importance=\"clear\"\n            size=\"sm\"\n            data-qa=\"feed-item-reaction-button\"\n            :class=\"[\n              'd-recipe-emoji-row__reaction',\n              reaction.isSelected ? 'd-recipe-emoji-row__reaction--selected' : '',\n            ]\"\n            :aria-label=\"reaction.ariaLabel\"\n            :attrs=\"attrs\"\n            @click=\"emojiClicked(reaction)\"\n          >\n            <span class=\"d-recipe-emoji-row__emoji\">\n              <dt-emoji\n                size=\"200\"\n                :code=\"reaction.emojiUnicodeOrShortname\"\n              />\n            </span>\n            <span class=\"d-recipe-emoji-row__reaction-number\">\n              {{ reaction.num }}\n            </span>\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </span>\n    <!-- @slot Slot for emoji picker component, including the anchor. -->\n    <slot name=\"picker\" />\n  </span>\n</template>\n\n<script>\nimport { REACTIONS_ATTRIBUTES } from './emoji_row_constants.js';\nimport { DtButton } from '../../../components/button';\nimport { DtTooltip } from '../../../components/tooltip';\nimport { DtEmoji } from '../../../components/emoji';\nimport { DtEmojiTextWrapper } from '../../../components/emoji_text_wrapper';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeEmojiRow',\n\n  components: { DtTooltip, DtButton, DtEmoji, DtEmojiTextWrapper },\n\n  mixins: [],\n\n  props: {\n    /**\n     * Provide an array of reaction objects to be shown.\n     */\n    reactions: {\n      type: Array,\n      default: () => [],\n      validator: (reactions) => {\n        for (const reaction of reactions) {\n          const validInput = REACTIONS_ATTRIBUTES.every((attribute) => reaction[attribute] !== undefined ?? false);\n          if (!validInput) return false;\n        }\n        return true;\n      },\n    },\n  },\n\n  emits: [\n    'emoji-clicked',\n    'emoji-hovered',\n  ],\n\n  methods: {\n    emojiClicked (reaction) {\n      this.$emit('emoji-clicked', reaction.emojiUnicodeOrShortname);\n    },\n\n    emojiHovered (reaction, state) {\n      this.$emit('emoji-hovered', {\n        reaction: reaction.emojiUnicodeOrShortname,\n        state,\n      });\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtTooltip","DtButton","DtEmoji","DtEmojiTextWrapper","reactions","reaction","REACTIONS_ATTRIBUTES","attribute","state","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_openBlock","_createElementBlock","_Fragment","_renderList","$props","_createVNode","_component_dt_tooltip","shown","$options","_withCtx","attrs","_component_dt_button","_normalizeClass","$event","_createElementVNode","_component_dt_emoji","_toDisplayString","_component_dt_emoji_text_wrapper","_createTextVNode","_renderSlot","_ctx"],"mappings":";;;;;;;AAwDA,MAAKA,IAAU;AAAA,EACb,cAAc,EAAE,MAAM,EAAG;AAAA,EACzB,MAAM;AAAA,EAEN,YAAY,EAAE,WAAAC,GAAW,UAAAC,GAAU,SAAAC,GAASC,oBAAAA,EAAoB;AAAA,EAEhE,QAAQ,CAAE;AAAA,EAEV,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS,MAAM,CAAE;AAAA,MACjB,WAAW,CAACC,MAAc;AACxB,mBAAWC,KAAYD;AAErB,cAAI,CADeE,EAAqB,MAAM,CAACC,MAAcF,EAASE,CAAS,MAAM,MAAkB,EACtF,QAAO;AAE1B,eAAO;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAAA,EAED,OAAO;AAAA,IACL;AAAA,IACA;AAAA,EACD;AAAA,EAED,SAAS;AAAA,IACP,aAAcF,GAAU;AACtB,WAAK,MAAM,iBAAiBA,EAAS,uBAAuB;AAAA,IAC7D;AAAA,IAED,aAAcA,GAAUG,GAAO;AAC7B,WAAK,MAAM,iBAAiB;AAAA,QAC1B,UAAUH,EAAS;AAAA,QACnB,OAAAG;AAAA,MACF,CAAC;AAAA,IACF;AAAA,EACF;AACH,GAjGQC,IAAA,EAAA,OAAM,qBAAoB,GADlCC,IAAA,CAAA,UAAA,GAacC,IAAA,EAAA,eAAY,OAAM,GAkBdC,IAAA,EAAA,OAAM,4BAA2B,GAMjCC,IAAA,EAAA,OAAM,sCAAqC;;;AApC3D,SAAAC,EAAA,GAAAC,EA6CO,QA7CPN,GA6CO;AAAA,KA5CLK,EAAA,EAAA,GAAAC,EAyCOC,GA3CX,MAAAC,EAGyBC,EAAS,WAHlC,CAGab,YADTU,EAyCO,QAAA;AAAA,MAvCJ,KAAKV,EAAS;AAAA,MACd,UAAUA;AAAA;MAEXc,EAmCaC,GAAA;AAAA,QAlCX,OAAM;AAAA,QACN,iBAAc;AAAA,QACd,QAAO;AAAA,QACN,UAAQC,MAAUC,eAAajB,GAAUgB,CAAK;AAAA;QAOpC,QAAME,EACf,CAqBY,EAtBO,OAAAC,QAAK;AAAA,UACxBL,EAqBYM,GAAA;AAAA,YApBV,YAAW;AAAA,YACX,MAAK;AAAA,YACL,WAAQ;AAAA,YACP,OAvBbC,EAAA;AAAA;cAuBkFrB,EAAS,aAAU,2CAAA;AAAA;YAIxF,cAAYA,EAAS;AAAA,YACrB,OAAOmB;AAAA,YACP,SAAK,CAAAG,MAAEL,EAAY,aAACjB,CAAQ;AAAA;YA7BzC,SAAAkB,EA+BY,MAKO;AAAA,cALPK,EAKO,QALPhB,GAKO;AAAA,gBAJLO,EAGEU,GAAA;AAAA,kBAFA,MAAK;AAAA,kBACJ,MAAMxB,EAAS;AAAA;;cAGpBuB,EAEO,QAFPf,GACKiB,EAAAzB,EAAS,GAAG,GAAA,CAAA;AAAA;YAtC7B,GAAA;AAAA;;QAAA,SAAAkB,EAaQ,MAIO;AAAA,UAJPK,EAIO,QAJPjB,GAIO;AAAA,YAHLQ,EAEwBY,GAAA,EAFD,MAAK,MAAK,GAAA;AAAA,cAd3C,SAAAR,EAeY,MAAsB;AAAA,gBAflCS,EAeeF,EAAAzB,EAAS,OAAO,GAAA,CAAA;AAAA;cAf/B,GAAA;AAAA;;;QAAA,GAAA;AAAA;IAAA,GAAA,GAAAK,CAAA;IA6CIuB,EAAsBC,EAAA,QAAA,QAAA;AAAA;;;"}
+{"version":3,"file":"emoji-row.js","sources":["../../../recipes/conversation_view/emoji_row/emoji_row.vue"],"sourcesContent":["<template>\n  <span class=\"d-recipe-emoji-row\">\n    <span\n      v-for=\"reaction in reactions\"\n      :key=\"reaction.unicodeOutput\"\n    >\n      <dt-tooltip\n        class=\"d-recipe-emoji-row__tooltip\"\n        content-class=\"d-recipe-emoji-row__tooltip-content\"\n        sticky=\"popper\"\n        @shown=\"(shown) => emojiHovered(reaction, shown)\"\n      >\n        <span aria-hidden=\"true\">\n          <dt-emoji-text-wrapper size=\"200\">\n            {{ reactionLabel(reaction) }}\n          </dt-emoji-text-wrapper>\n        </span>\n        <template #anchor=\"{ attrs }\">\n          <dt-button\n            importance=\"clear\"\n            size=\"sm\"\n            data-qa=\"feed-item-reaction-button\"\n            :class=\"[\n              'd-recipe-emoji-row__reaction',\n              reaction.isSelected ? 'd-recipe-emoji-row__reaction--selected' : '',\n            ]\"\n            :aria-label=\"reactionLabel(reaction)\"\n            :attrs=\"attrs\"\n            @click=\"emojiClicked(reaction)\"\n          >\n            <span class=\"d-recipe-emoji-row__emoji\">\n              <dt-emoji\n                size=\"200\"\n                :code=\"reaction.emojiUnicodeOrShortname\"\n              />\n            </span>\n            <span class=\"d-recipe-emoji-row__reaction-number\">\n              {{ reaction.num }}\n            </span>\n          </dt-button>\n        </template>\n      </dt-tooltip>\n    </span>\n    <!-- TODO: Replace picker slot with a button with localized text and emit any event needed -->\n    <!-- @slot Slot for emoji picker component, including the anchor. -->\n    <slot name=\"picker\" />\n  </span>\n</template>\n\n<script>\nimport { REACTIONS_ATTRIBUTES } from './emoji_row_constants.js';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport { DtEmoji } from '@/components/emoji';\nimport { DtEmojiTextWrapper } from '@/components/emoji_text_wrapper';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeEmojiRow',\n\n  components: { DtTooltip, DtButton, DtEmoji, DtEmojiTextWrapper },\n\n  props: {\n    /**\n     * Provide an array of reaction objects to be shown.\n     */\n    reactions: {\n      type: Array,\n      default: () => [],\n      validator: (reactions) => {\n        for (const reaction of reactions) {\n          const validInput = REACTIONS_ATTRIBUTES.every((attribute) => reaction[attribute] !== undefined ?? false);\n          if (!validInput) return false;\n        }\n        return true;\n      },\n    },\n  },\n\n  emits: [\n    'emoji-clicked',\n    'emoji-hovered',\n  ],\n\n  data () {\n    return {\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  methods: {\n    emojiClicked (reaction) {\n      this.$emit('emoji-clicked', reaction.emojiUnicodeOrShortname);\n    },\n\n    emojiHovered (reaction, state) {\n      this.$emit('emoji-hovered', {\n        reaction: reaction.emojiUnicodeOrShortname,\n        state,\n      });\n    },\n\n    reactionLabel (reaction) {\n      return this.i18n.$t('DIALTONE_EMOJI_ROW_REACTION_LABEL', {\n        names: reaction.names,\n        reaction: reaction.emojiUnicodeOrShortname,\n      });\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtTooltip","DtButton","DtEmoji","DtEmojiTextWrapper","reactions","reaction","REACTIONS_ATTRIBUTES","attribute","DialtoneLocalization","state","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_openBlock","_createElementBlock","_Fragment","_renderList","$props","_createVNode","_component_dt_tooltip","shown","$options","_withCtx","attrs","_component_dt_button","_normalizeClass","$event","_createElementVNode","_component_dt_emoji","_toDisplayString","_component_dt_emoji_text_wrapper","_createTextVNode","_renderSlot","_ctx"],"mappings":";;;;;;;;AAyDA,MAAKA,IAAU;AAAA,EACb,cAAc,EAAE,MAAM,EAAG;AAAA,EACzB,MAAM;AAAA,EAEN,YAAY,EAAE,WAAAC,GAAW,UAAAC,GAAU,SAAAC,GAASC,oBAAAA,EAAoB;AAAA,EAEhE,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS,MAAM,CAAE;AAAA,MACjB,WAAW,CAACC,MAAc;AACxB,mBAAWC,KAAYD;AAErB,cAAI,CADeE,EAAqB,MAAM,CAACC,MAAcF,EAASE,CAAS,MAAM,MAAkB,EACtF,QAAO;AAE1B,eAAO;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAAA,EAED,OAAO;AAAA,IACL;AAAA,IACA;AAAA,EACD;AAAA,EAED,OAAQ;AACN,WAAO;AAAA,MACL,MAAM,IAAIC,EAAsB;AAAA;EAEnC;AAAA,EAED,SAAS;AAAA,IACP,aAAcH,GAAU;AACtB,WAAK,MAAM,iBAAiBA,EAAS,uBAAuB;AAAA,IAC7D;AAAA,IAED,aAAcA,GAAUI,GAAO;AAC7B,WAAK,MAAM,iBAAiB;AAAA,QAC1B,UAAUJ,EAAS;AAAA,QACnB,OAAAI;AAAA,MACF,CAAC;AAAA,IACF;AAAA,IAED,cAAeJ,GAAU;AACvB,aAAO,KAAK,KAAK,GAAG,qCAAqC;AAAA,QACvD,OAAOA,EAAS;AAAA,QAChB,UAAUA,EAAS;AAAA,MACrB,CAAC;AAAA,IACF;AAAA,EACF;AACH,GA7GQK,IAAA,EAAA,OAAM,qBAAoB,GAWpBC,IAAA,EAAA,eAAY,OAAM,GAkBdC,IAAA,EAAA,OAAM,4BAA2B,GAMjCC,IAAA,EAAA,OAAM,sCAAqC;;;AAnC3D,SAAAC,EAAA,GAAAC,EA6CO,QA7CPL,GA6CO;AAAA,KA5CLI,EAAA,EAAA,GAAAC,EAwCOC,GA1CX,MAAAC,EAGyBC,EAAS,WAHlC,CAGab,YADTU,EAwCO,QAAA;AAAA,MAtCJ,KAAKV,EAAS;AAAA;MAEfc,EAmCaC,GAAA;AAAA,QAlCX,OAAM;AAAA,QACN,iBAAc;AAAA,QACd,QAAO;AAAA,QACN,UAAQC,MAAUC,eAAajB,GAAUgB,CAAK;AAAA;QAOpC,QAAME,EACf,CAqBY,EAtBO,OAAAC,QAAK;AAAA,UACxBL,EAqBYM,GAAA;AAAA,YApBV,YAAW;AAAA,YACX,MAAK;AAAA,YACL,WAAQ;AAAA,YACP,OAtBbC,EAAA;AAAA;cAsBkFrB,EAAS,aAAU,2CAAA;AAAA;YAIxF,cAAYiB,EAAa,cAACjB,CAAQ;AAAA,YAClC,OAAOmB;AAAA,YACP,SAAK,CAAAG,MAAEL,EAAY,aAACjB,CAAQ;AAAA;YA5BzC,SAAAkB,EA8BY,MAKO;AAAA,cALPK,EAKO,QALPhB,GAKO;AAAA,gBAJLO,EAGEU,GAAA;AAAA,kBAFA,MAAK;AAAA,kBACJ,MAAMxB,EAAS;AAAA;;cAGpBuB,EAEO,QAFPf,GACKiB,EAAAzB,EAAS,GAAG,GAAA,CAAA;AAAA;YArC7B,GAAA;AAAA;;QAAA,SAAAkB,EAYQ,MAIO;AAAA,UAJPK,EAIO,QAJPjB,GAIO;AAAA,YAHLQ,EAEwBY,GAAA,EAFD,MAAK,MAAK,GAAA;AAAA,cAb3C,SAAAR,EAcY,MAA6B;AAAA,gBAdzCS,EAceF,EAAAR,EAAA,cAAcjB,CAAQ,CAAA,GAAA,CAAA;AAAA;cAdrC,GAAA;AAAA;;;QAAA,GAAA;AAAA;;IA6CI4B,EAAsBC,EAAA,QAAA,QAAA;AAAA;;;"}

package/dist/vue3/lib/feed-item-pill/feed-item-pill.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./feed-item-pill-constants.cjs"),d=require("@dialpad/dialtone-icons/vue3"),e=require("vue"),u=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),p=require("../item-layout/item-layout.cjs"),m=require("../collapsible/collapsible.cjs"),_={compatConfig:{MODE:3},name:"DtRecipeFeedItemPill",components:{DtItemLayout:p.default,DtCollapsible:m.default},props:{title:{type:String,default:()=>""},wrapperClass:{type:[String,Array,Object],default:""},buttonClass:{type:[String,Array,Object],default:""},ariaLabel:{type:String,required:!0},toggleable:{type:Boolean,default:()=>!0},defaultToggled:{type:Boolean,default:()=>!1},borderColor:{type:String,default:"default",validator:t=>Object.keys(s.FEED_ITEM_PILL_BORDER_COLORS).includes(t)}},data(){return{hover:!1,expanded:this.defaultToggled}},computed:{toggleIcon(){return this.expanded?d.DtIconChevronDown:d.DtIconChevronRight},showChevronIcon(){return this.toggleable&&this.hover},toggleableClass(){return this.toggleable?"d-recipe-feed-item-pill--toggleable":""},borderClass(){return s.FEED_ITEM_PILL_BORDER_COLORS[this.borderColor]}},methods:{onClick(){this.toggleable&&(this.expanded=!this.expanded)}}},f={class:"d-recipe-feed-item-pill__wrapper"},b=["aria-label"],g={class:"d-recipe-feed-item-pill__title"},C={class:"d-recipe-feed-item-pill__icon","data-qa":"dt-recipe-feed-item-pill__icon"},h={class:"d-recipe-feed-item-pill__subtitle"},v={class:"d-recipe-feed-item-pill__bottom"},y={class:"d-recipe-feed-item-pill__right"},S={class:"d-recipe-feed-item-pill__content"};function E(t,l,r,I,i,o){const a=e.resolveComponent("dt-item-layout"),c=e.resolveComponent("dt-collapsible");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["d-recipe-feed-item-pill__border",o.borderClass,r.wrapperClass])},[e.createElementVNode("div",f,[e.createVNode(c,{open:i.expanded},e.createSlots({anchor:e.withCtx(()=>[e.createElementVNode("button",{"data-qa":"dt-recipe-feed-item-pill","aria-label":r.ariaLabel,class:e.normalizeClass(["d-recipe-feed-item-pill__button",o.toggleableClass,r.buttonClass]),onFocusin:l[0]||(l[0]=n=>i.hover=!0),onFocusout:l[1]||(l[1]=n=>i.hover=!1),onMouseenter:l[2]||(l[2]=n=>i.hover=!0),onMouseleave:l[3]||(l[3]=n=>i.hover=!1),onClick:l[4]||(l[4]=(...n)=>o.onClick&&o.onClick(...n))},[e.createVNode(a,{class:"d-recipe-feed-item-pill__layout",unstyled:""},e.createSlots({left:e.withCtx(()=>[e.createElementVNode("div",C,[o.showChevronIcon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.toggleIcon),{key:0,size:"300"})):e.renderSlot(t.$slots,"leftIcon",{key:1,iconSize:"300"})])]),default:e.withCtx(()=>[e.renderSlot(t.$slots,"title",{},()=>[e.createElementVNode("span",g,e.toDisplayString(r.title),1)])]),_:2},[t.$slots.subtitle?{name:"subtitle",fn:e.withCtx(()=>[e.createElementVNode("div",h,[e.renderSlot(t.$slots,"subtitle")])]),key:"0"}:void 0,t.$slots.bottom?{name:"bottom",fn:e.withCtx(()=>[e.createElementVNode("div",v,[e.renderSlot(t.$slots,"bottom")])]),key:"1"}:void 0,t.$slots.right?{name:"right",fn:e.withCtx(()=>[e.createElementVNode("div",y,[e.renderSlot(t.$slots,"right")])]),key:"2"}:void 0]),1024)],42,b)]),_:2},[t.$slots.content?{name:"content",fn:e.withCtx(()=>[e.createElementVNode("div",S,[e.renderSlot(t.$slots,"content")])]),key:"0"}:void 0]),1032,["open"])])],2)}const k=u._(_,[["render",E]]);exports.default=k;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./feed-item-pill-constants.cjs"),d=require("@dialpad/dialtone-icons/vue3"),u=require("../../localization/index.cjs"),e=require("vue"),p=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),_=require("../item-layout/item-layout.cjs"),m=require("../collapsible/collapsible.cjs"),f={compatConfig:{MODE:3},name:"DtRecipeFeedItemPill",components:{DtItemLayout:_.default,DtCollapsible:m.default},props:{title:{type:String,default:()=>""},wrapperClass:{type:[String,Array,Object],default:""},buttonClass:{type:[String,Array,Object],default:""},toggleable:{type:Boolean,default:()=>!0},defaultToggled:{type:Boolean,default:()=>!1},borderColor:{type:String,default:"default",validator:t=>Object.keys(s.FEED_ITEM_PILL_BORDER_COLORS).includes(t)}},data(){return{hover:!1,expanded:this.defaultToggled,i18n:new u.DialtoneLocalization}},computed:{toggleIcon(){return this.expanded?d.DtIconChevronDown:d.DtIconChevronRight},showChevronIcon(){return this.toggleable&&this.hover},toggleableClass(){return this.toggleable?"d-recipe-feed-item-pill--toggleable":""},borderClass(){return s.FEED_ITEM_PILL_BORDER_COLORS[this.borderColor]},anchorTitle(){return this.i18n.$t("DIALTONE_FEED_ITEM_PILL_ARIA_LABEL")}},methods:{onClick(){this.toggleable&&(this.expanded=!this.expanded)}}},b={class:"d-recipe-feed-item-pill__wrapper"},h=["aria-label","title"],g={class:"d-recipe-feed-item-pill__title"},C={class:"d-recipe-feed-item-pill__icon","data-qa":"dt-recipe-feed-item-pill__icon"},v={class:"d-recipe-feed-item-pill__subtitle"},y={class:"d-recipe-feed-item-pill__bottom"},E={class:"d-recipe-feed-item-pill__right"},I={class:"d-recipe-feed-item-pill__content"};function S(t,l,r,k,i,o){const a=e.resolveComponent("dt-item-layout"),c=e.resolveComponent("dt-collapsible");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["d-recipe-feed-item-pill__border",o.borderClass,r.wrapperClass])},[e.createElementVNode("div",b,[e.createVNode(c,{open:i.expanded},e.createSlots({anchor:e.withCtx(()=>[e.createElementVNode("button",{"data-qa":"dt-recipe-feed-item-pill",class:e.normalizeClass(["d-recipe-feed-item-pill__button",o.toggleableClass,r.buttonClass]),"aria-label":o.anchorTitle,title:o.anchorTitle,onFocusin:l[0]||(l[0]=n=>i.hover=!0),onFocusout:l[1]||(l[1]=n=>i.hover=!1),onMouseenter:l[2]||(l[2]=n=>i.hover=!0),onMouseleave:l[3]||(l[3]=n=>i.hover=!1),onClick:l[4]||(l[4]=(...n)=>o.onClick&&o.onClick(...n))},[e.createVNode(a,{class:"d-recipe-feed-item-pill__layout",unstyled:""},e.createSlots({left:e.withCtx(()=>[e.createElementVNode("div",C,[o.showChevronIcon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.toggleIcon),{key:0,size:"300"})):e.renderSlot(t.$slots,"leftIcon",{key:1,iconSize:"300"})])]),default:e.withCtx(()=>[e.renderSlot(t.$slots,"title",{},()=>[e.createElementVNode("span",g,e.toDisplayString(r.title),1)])]),_:2},[t.$slots.subtitle?{name:"subtitle",fn:e.withCtx(()=>[e.createElementVNode("div",v,[e.renderSlot(t.$slots,"subtitle")])]),key:"0"}:void 0,t.$slots.bottom?{name:"bottom",fn:e.withCtx(()=>[e.createElementVNode("div",y,[e.renderSlot(t.$slots,"bottom")])]),key:"1"}:void 0,t.$slots.right?{name:"right",fn:e.withCtx(()=>[e.createElementVNode("div",E,[e.renderSlot(t.$slots,"right")])]),key:"2"}:void 0]),1024)],42,h)]),_:2},[t.$slots.content?{name:"content",fn:e.withCtx(()=>[e.createElementVNode("div",I,[e.renderSlot(t.$slots,"content")])]),key:"0"}:void 0]),1032,["open"])])],2)}const D=p._(f,[["render",S]]);exports.default=D;
 //# sourceMappingURL=feed-item-pill.cjs.map

package/dist/vue3/lib/feed-item-pill/feed-item-pill.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"feed-item-pill.cjs","sources":["../../../recipes/conversation_view/feed_item_pill/feed_item_pill.vue"],"sourcesContent":["<template>\n  <div :class=\"['d-recipe-feed-item-pill__border', borderClass, wrapperClass]\">\n    <div class=\"d-recipe-feed-item-pill__wrapper\">\n      <dt-collapsible :open=\"expanded\">\n        <template #anchor>\n          <button\n            data-qa=\"dt-recipe-feed-item-pill\"\n            :aria-label=\"ariaLabel\"\n            :class=\"['d-recipe-feed-item-pill__button', toggleableClass, buttonClass]\"\n            @focusin=\"hover = true\"\n            @focusout=\"hover = false\"\n            @mouseenter=\"hover = true\"\n            @mouseleave=\"hover = false\"\n            @click=\"onClick\"\n          >\n            <dt-item-layout\n              class=\"d-recipe-feed-item-pill__layout\"\n              unstyled\n            >\n              <slot name=\"title\">\n                <span class=\"d-recipe-feed-item-pill__title\">{{ title }}</span>\n              </slot>\n              <template #left>\n                <div\n                  class=\"d-recipe-feed-item-pill__icon\"\n                  data-qa=\"dt-recipe-feed-item-pill__icon\"\n                >\n                  <component\n                    :is=\"toggleIcon\"\n                    v-if=\"showChevronIcon\"\n                    size=\"300\"\n                  />\n                  <!-- @slot Slot for left icon, icon-size slot prop defaults to '300' -->\n                  <slot\n                    v-else\n                    name=\"leftIcon\"\n                    :icon-size=\"'300'\"\n                  />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.subtitle\"\n                #subtitle\n              >\n                <div class=\"d-recipe-feed-item-pill__subtitle\">\n                  <slot name=\"subtitle\" />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.bottom\"\n                #bottom\n              >\n                <div class=\"d-recipe-feed-item-pill__bottom\">\n                  <slot name=\"bottom\" />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.right\"\n                #right\n              >\n                <div class=\"d-recipe-feed-item-pill__right\">\n                  <slot name=\"right\" />\n                </div>\n              </template>\n            </dt-item-layout>\n          </button>\n        </template>\n        <template\n          v-if=\"$slots.content\"\n          #content\n        >\n          <div class=\"d-recipe-feed-item-pill__content\">\n            <slot name=\"content\" />\n          </div>\n        </template>\n      </dt-collapsible>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { FEED_ITEM_PILL_BORDER_COLORS } from './feed_item_pill_constants';\nimport { DtItemLayout } from '@/components/item_layout';\nimport { DtCollapsible } from '@/components/collapsible';\nimport { DtIconChevronDown, DtIconChevronRight } from '@dialpad/dialtone-icons/vue3';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeFeedItemPill',\n\n  components: { DtItemLayout, DtCollapsible },\n\n  props: {\n    /**\n     * Bolded primary text\n     */\n    title: {\n      type: String,\n      default: () => '',\n    },\n\n    /**\n     * Additional styling around the pill\n     */\n    wrapperClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional styling for the pill\n     */\n    buttonClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Aria label for feed pill\n     */\n    ariaLabel: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Sets whether the pill can be toggled (Icon changing on hover, expanding and collapsing, pointer)\n     */\n    toggleable: {\n      type: Boolean,\n      default: () => true,\n    },\n\n    defaultToggled: {\n      type: Boolean,\n      default: () => false,\n    },\n\n    /**\n     * Callbox border color\n     * @values default, ai, critical\n     */\n    borderColor: {\n      type: String,\n      default: 'default',\n      validator: (color) => Object.keys(FEED_ITEM_PILL_BORDER_COLORS).includes(color),\n    },\n  },\n\n  data () {\n    return {\n      hover: false,\n      expanded: this.defaultToggled,\n    };\n  },\n\n  computed: {\n    toggleIcon () {\n      return this.expanded ? DtIconChevronDown : DtIconChevronRight;\n    },\n\n    showChevronIcon () {\n      return this.toggleable && this.hover;\n    },\n\n    toggleableClass () {\n      return this.toggleable ? 'd-recipe-feed-item-pill--toggleable' : '';\n    },\n\n    borderClass () {\n      return FEED_ITEM_PILL_BORDER_COLORS[this.borderColor];\n    },\n  },\n\n  methods: {\n    onClick () {\n      if (!this.toggleable) return;\n\n      this.expanded = !this.expanded;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtItemLayout","DtCollapsible","color","FEED_ITEM_PILL_BORDER_COLORS","DtIconChevronDown","DtIconChevronRight","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_createElementBlock","_normalizeClass","$options","$props","_createElementVNode","_createVNode","_component_dt_collapsible","$data","_createSlots","args","_component_dt_item_layout","_hoisted_4","_createBlock","_resolveDynamicComponent","_renderSlot","_ctx","_withCtx","_toDisplayString"],"mappings":"2WAsFKA,EAAU,CACb,aAAc,CAAE,KAAM,CAAG,EACzB,KAAM,uBAEN,WAAY,CAAA,aAAEC,EAAY,QAAA,cAAEC,SAAe,EAE3C,MAAO,CAIL,MAAO,CACL,KAAM,OACN,QAAS,IAAM,EAChB,EAKD,aAAc,CACZ,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,EACV,EAKD,YAAa,CACX,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,EACV,EAKD,UAAW,CACT,KAAM,OACN,SAAU,EACX,EAKD,WAAY,CACV,KAAM,QACN,QAAS,IAAM,EAChB,EAED,eAAgB,CACd,KAAM,QACN,QAAS,IAAM,EAChB,EAMD,YAAa,CACX,KAAM,OACN,QAAS,UACT,UAAYC,GAAU,OAAO,KAAKC,8BAA4B,EAAE,SAASD,CAAK,CAC/E,CACF,EAED,MAAQ,CACN,MAAO,CACL,MAAO,GACP,SAAU,KAAK,eAElB,EAED,SAAU,CACR,YAAc,CACZ,OAAO,KAAK,SAAWE,EAAkB,kBAAEC,oBAC5C,EAED,iBAAmB,CACjB,OAAO,KAAK,YAAc,KAAK,KAChC,EAED,iBAAmB,CACjB,OAAO,KAAK,WAAa,sCAAwC,EAClE,EAED,aAAe,CACb,OAAOF,EAA4B,6BAAC,KAAK,WAAW,CACrD,CACF,EAED,QAAS,CACP,SAAW,CACJ,KAAK,aAEV,KAAK,SAAW,CAAC,KAAK,SACvB,CACF,CACH,EAnLSG,EAAA,CAAA,MAAM,kCAAkC,EAFjDC,EAAA,CAAA,YAAA,EAoBsBC,EAAA,CAAA,MAAM,gCAAgC,KAI1C,MAAM,gCACN,UAAQ,kCAmBLC,EAAA,CAAA,MAAM,mCAAmC,EAQzCC,EAAA,CAAA,MAAM,iCAAiC,EAQvCC,EAAA,CAAA,MAAM,gCAAgC,EAW5CC,EAAA,CAAA,MAAM,kCAAkC,mIAtErDC,EA4EM,mBAAA,MAAA,CA5EA,MADRC,EAAA,eAAA,CAAA,kCACmDC,EAAW,YAAEC,EAAY,YAAA,CAAA,IACxEC,EAAA,mBA0EM,MA1ENX,EA0EM,CAzEJY,EAAA,YAwEiBC,EAxEA,CAAA,KAAMC,EAAA,QAH7B,EAAAC,cAAA,CAImB,iBACT,IA4DS,CA5DTJ,EAAAA,mBA4DS,SAAA,CA3DP,UAAQ,2BACP,aAAYD,EAAS,UACrB,MARbF,EAAA,eAAA,CAAA,kCAQwDC,EAAe,gBAAEC,EAAW,WAAA,CAAA,EACvE,yBAASI,EAAK,MAAA,IACd,0BAAUA,EAAK,MAAA,IACf,4BAAYA,EAAK,MAAA,IACjB,4BAAYA,EAAK,MAAA,IACjB,4BAAOL,EAAO,SAAAA,EAAA,QAAA,GAAAO,CAAA,KAEfJ,EAAAA,YAiDiBK,EAAA,CAhDf,MAAM,kCACN,SAAA,EAjBd,EAAAF,cAAA,CAsByB,eACT,IAeM,CAfNJ,EAAA,mBAeM,MAfNO,EAeM,CATIT,EAAe,+BAFvBU,EAIE,YA/BpBC,0BA4ByBX,EAAU,UAAA,EAAA,CA5BnC,IAAA,EA8BoB,KAAK,SAGPY,aAIEC,EAAA,OAAA,WAAA,CArCpB,IAAA,EAoCqB,SAAW,YApChC,QAAAC,EAAA,QAmBc,IAEO,CAFPF,EAAAA,WAEOC,oBAFP,IAEO,CADLX,EAA+D,mBAAA,OAA/DT,EAA+DsB,EAAAA,gBAAfd,EAAK,KAAA,EAAA,CAAA,MApBrE,EAAA,IAyCsBY,EAAA,OAAO,UAzC7B,KA0CiB,WA1CjB,GAAAC,EAAA,QA4CgB,IAEM,CAFNZ,EAAA,mBAEM,MAFNR,EAEM,CADJkB,aAAwBC,EAAA,OAAA,UAAA,MA7C1C,IAAA,KAAA,OAiDsBA,EAAA,OAAO,QAjD7B,KAkDiB,SAlDjB,GAAAC,EAAA,QAoDgB,IAEM,CAFNZ,EAAA,mBAEM,MAFNP,EAEM,CADJiB,aAAsBC,EAAA,OAAA,QAAA,MArDxC,IAAA,KAAA,OAyDsBA,EAAA,OAAO,OAzD7B,KA0DiB,QA1DjB,GAAAC,EAAA,QA4DgB,IAEM,CAFNZ,EAAA,mBAEM,MAFNN,EAEM,CADJgB,aAAqBC,EAAA,OAAA,OAAA,MA7DvC,IAAA,KAAA,cAAA,EAAA,GAAArB,CAAA,IAAA,EAAA,IAoEgBqB,EAAA,OAAO,SApEvB,KAqEW,UArEX,GAAAC,EAAA,QAuEU,IAEM,CAFNZ,EAAA,mBAEM,MAFNL,EAEM,CADJe,aAAuBC,EAAA,OAAA,SAAA,MAxEnC,IAAA,KAAA"}
+{"version":3,"file":"feed-item-pill.cjs","sources":["../../../recipes/conversation_view/feed_item_pill/feed_item_pill.vue"],"sourcesContent":["<template>\n  <div :class=\"['d-recipe-feed-item-pill__border', borderClass, wrapperClass]\">\n    <div class=\"d-recipe-feed-item-pill__wrapper\">\n      <dt-collapsible :open=\"expanded\">\n        <template #anchor>\n          <button\n            data-qa=\"dt-recipe-feed-item-pill\"\n            :class=\"['d-recipe-feed-item-pill__button', toggleableClass, buttonClass]\"\n            :aria-label=\"anchorTitle\"\n            :title=\"anchorTitle\"\n            @focusin=\"hover = true\"\n            @focusout=\"hover = false\"\n            @mouseenter=\"hover = true\"\n            @mouseleave=\"hover = false\"\n            @click=\"onClick\"\n          >\n            <dt-item-layout\n              class=\"d-recipe-feed-item-pill__layout\"\n              unstyled\n            >\n              <slot name=\"title\">\n                <span class=\"d-recipe-feed-item-pill__title\">{{ title }}</span>\n              </slot>\n              <template #left>\n                <div\n                  class=\"d-recipe-feed-item-pill__icon\"\n                  data-qa=\"dt-recipe-feed-item-pill__icon\"\n                >\n                  <component\n                    :is=\"toggleIcon\"\n                    v-if=\"showChevronIcon\"\n                    size=\"300\"\n                  />\n                  <!-- @slot Slot for left icon, icon-size slot prop defaults to '300' -->\n                  <slot\n                    v-else\n                    name=\"leftIcon\"\n                    :icon-size=\"'300'\"\n                  />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.subtitle\"\n                #subtitle\n              >\n                <div class=\"d-recipe-feed-item-pill__subtitle\">\n                  <slot name=\"subtitle\" />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.bottom\"\n                #bottom\n              >\n                <div class=\"d-recipe-feed-item-pill__bottom\">\n                  <slot name=\"bottom\" />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.right\"\n                #right\n              >\n                <div class=\"d-recipe-feed-item-pill__right\">\n                  <slot name=\"right\" />\n                </div>\n              </template>\n            </dt-item-layout>\n          </button>\n        </template>\n        <template\n          v-if=\"$slots.content\"\n          #content\n        >\n          <div class=\"d-recipe-feed-item-pill__content\">\n            <slot name=\"content\" />\n          </div>\n        </template>\n      </dt-collapsible>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { FEED_ITEM_PILL_BORDER_COLORS } from './feed_item_pill_constants';\nimport { DtItemLayout } from '@/components/item_layout';\nimport { DtCollapsible } from '@/components/collapsible';\nimport { DtIconChevronDown, DtIconChevronRight } from '@dialpad/dialtone-icons/vue3';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeFeedItemPill',\n\n  components: { DtItemLayout, DtCollapsible },\n\n  props: {\n    /**\n     * Bolded primary text\n     */\n    title: {\n      type: String,\n      default: () => '',\n    },\n\n    /**\n     * Additional styling around the pill\n     */\n    wrapperClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional styling for the pill\n     */\n    buttonClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Sets whether the pill can be toggled (Icon changing on hover, expanding and collapsing, pointer)\n     */\n    toggleable: {\n      type: Boolean,\n      default: () => true,\n    },\n\n    defaultToggled: {\n      type: Boolean,\n      default: () => false,\n    },\n\n    /**\n     * Callbox border color\n     * @values default, ai, critical\n     */\n    borderColor: {\n      type: String,\n      default: 'default',\n      validator: (color) => Object.keys(FEED_ITEM_PILL_BORDER_COLORS).includes(color),\n    },\n  },\n\n  data () {\n    return {\n      hover: false,\n      expanded: this.defaultToggled,\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    toggleIcon () {\n      return this.expanded ? DtIconChevronDown : DtIconChevronRight;\n    },\n\n    showChevronIcon () {\n      return this.toggleable && this.hover;\n    },\n\n    toggleableClass () {\n      return this.toggleable ? 'd-recipe-feed-item-pill--toggleable' : '';\n    },\n\n    borderClass () {\n      return FEED_ITEM_PILL_BORDER_COLORS[this.borderColor];\n    },\n\n    anchorTitle () {\n      return this.i18n.$t('DIALTONE_FEED_ITEM_PILL_ARIA_LABEL');\n    },\n  },\n\n  methods: {\n    onClick () {\n      if (!this.toggleable) return;\n\n      this.expanded = !this.expanded;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtItemLayout","DtCollapsible","color","FEED_ITEM_PILL_BORDER_COLORS","DialtoneLocalization","DtIconChevronDown","DtIconChevronRight","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_createElementBlock","_normalizeClass","$options","$props","_createElementVNode","_createVNode","_component_dt_collapsible","$data","_createSlots","args","_component_dt_item_layout","_hoisted_4","_createBlock","_resolveDynamicComponent","_renderSlot","_ctx","_withCtx","_toDisplayString"],"mappings":"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"}

package/dist/vue3/lib/feed-item-pill/feed-item-pill.js

@@ -1,13 +1,14 @@
 import { FEED_ITEM_PILL_BORDER_COLORS as a } from "./feed-item-pill-constants.js";
-import { DtIconChevronDown as g, DtIconChevronRight as h } from "@dialpad/dialtone-icons/vue3";
-import { resolveComponent as p, openBlock as c, createElementBlock as v, normalizeClass as m, createElementVNode as o, createVNode as f, createSlots as u, withCtx as l, createBlock as C, resolveDynamicComponent as y, renderSlot as s, toDisplayString as k } from "vue";
+import { DtIconChevronDown as b, DtIconChevronRight as h } from "@dialpad/dialtone-icons/vue3";
+import { DialtoneLocalization as v } from "../../localization/index.js";
+import { resolveComponent as p, openBlock as c, createElementBlock as C, normalizeClass as m, createElementVNode as l, createVNode as f, createSlots as u, withCtx as i, createBlock as y, resolveDynamicComponent as I, renderSlot as n, toDisplayString as k } from "vue";
 import { _ as D } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-import I from "../item-layout/item-layout.js";
-import S from "../collapsible/collapsible.js";
-const w = {
+import E from "../item-layout/item-layout.js";
+import L from "../collapsible/collapsible.js";
+const S = {
   compatConfig: { MODE: 3 },
   name: "DtRecipeFeedItemPill",
-  components: { DtItemLayout: I, DtCollapsible: S },
+  components: { DtItemLayout: E, DtCollapsible: L },
   props: {
     /**
      * Bolded primary text
@@ -30,13 +31,6 @@ const w = {
       type: [String, Array, Object],
       default: ""
     },
-    /**
-     * Aria label for feed pill
-     */
-    ariaLabel: {
-      type: String,
-      required: !0
-    },
     /**
      * Sets whether the pill can be toggled (Icon changing on hover, expanding and collapsing, pointer)
      */
@@ -61,12 +55,13 @@ const w = {
   data() {
     return {
       hover: !1,
-      expanded: this.defaultToggled
+      expanded: this.defaultToggled,
+      i18n: new v()
     };
   },
   computed: {
     toggleIcon() {
-      return this.expanded ? g : h;
+      return this.expanded ? b : h;
     },
     showChevronIcon() {
       return this.toggleable && this.hover;
@@ -76,6 +71,9 @@ const w = {
     },
     borderClass() {
       return a[this.borderColor];
+    },
+    anchorTitle() {
+      return this.i18n.$t("DIALTONE_FEED_ITEM_PILL_ARIA_LABEL");
     }
   },
   methods: {
@@ -83,73 +81,74 @@ const w = {
       this.toggleable && (this.expanded = !this.expanded);
     }
   }
-}, E = { class: "d-recipe-feed-item-pill__wrapper" }, O = ["aria-label"], B = { class: "d-recipe-feed-item-pill__title" }, L = {
+}, w = { class: "d-recipe-feed-item-pill__wrapper" }, O = ["aria-label", "title"], T = { class: "d-recipe-feed-item-pill__title" }, B = {
   class: "d-recipe-feed-item-pill__icon",
   "data-qa": "dt-recipe-feed-item-pill__icon"
-}, R = { class: "d-recipe-feed-item-pill__subtitle" }, F = { class: "d-recipe-feed-item-pill__bottom" }, M = { class: "d-recipe-feed-item-pill__right" }, j = { class: "d-recipe-feed-item-pill__content" };
-function q(e, t, d, z, n, i) {
-  const _ = p("dt-item-layout"), b = p("dt-collapsible");
-  return c(), v("div", {
-    class: m(["d-recipe-feed-item-pill__border", i.borderClass, d.wrapperClass])
+}, A = { class: "d-recipe-feed-item-pill__subtitle" }, R = { class: "d-recipe-feed-item-pill__bottom" }, F = { class: "d-recipe-feed-item-pill__right" }, M = { class: "d-recipe-feed-item-pill__content" };
+function z(e, t, d, j, s, o) {
+  const _ = p("dt-item-layout"), g = p("dt-collapsible");
+  return c(), C("div", {
+    class: m(["d-recipe-feed-item-pill__border", o.borderClass, d.wrapperClass])
   }, [
-    o("div", E, [
-      f(b, { open: n.expanded }, u({
-        anchor: l(() => [
-          o("button", {
+    l("div", w, [
+      f(g, { open: s.expanded }, u({
+        anchor: i(() => [
+          l("button", {
             "data-qa": "dt-recipe-feed-item-pill",
-            "aria-label": d.ariaLabel,
-            class: m(["d-recipe-feed-item-pill__button", i.toggleableClass, d.buttonClass]),
-            onFocusin: t[0] || (t[0] = (r) => n.hover = !0),
-            onFocusout: t[1] || (t[1] = (r) => n.hover = !1),
-            onMouseenter: t[2] || (t[2] = (r) => n.hover = !0),
-            onMouseleave: t[3] || (t[3] = (r) => n.hover = !1),
-            onClick: t[4] || (t[4] = (...r) => i.onClick && i.onClick(...r))
+            class: m(["d-recipe-feed-item-pill__button", o.toggleableClass, d.buttonClass]),
+            "aria-label": o.anchorTitle,
+            title: o.anchorTitle,
+            onFocusin: t[0] || (t[0] = (r) => s.hover = !0),
+            onFocusout: t[1] || (t[1] = (r) => s.hover = !1),
+            onMouseenter: t[2] || (t[2] = (r) => s.hover = !0),
+            onMouseleave: t[3] || (t[3] = (r) => s.hover = !1),
+            onClick: t[4] || (t[4] = (...r) => o.onClick && o.onClick(...r))
           }, [
             f(_, {
               class: "d-recipe-feed-item-pill__layout",
               unstyled: ""
             }, u({
-              left: l(() => [
-                o("div", L, [
-                  i.showChevronIcon ? (c(), C(y(i.toggleIcon), {
+              left: i(() => [
+                l("div", B, [
+                  o.showChevronIcon ? (c(), y(I(o.toggleIcon), {
                     key: 0,
                     size: "300"
-                  })) : s(e.$slots, "leftIcon", {
+                  })) : n(e.$slots, "leftIcon", {
                     key: 1,
                     iconSize: "300"
                   })
                 ])
               ]),
-              default: l(() => [
-                s(e.$slots, "title", {}, () => [
-                  o("span", B, k(d.title), 1)
+              default: i(() => [
+                n(e.$slots, "title", {}, () => [
+                  l("span", T, k(d.title), 1)
                 ])
               ]),
               _: 2
             }, [
               e.$slots.subtitle ? {
                 name: "subtitle",
-                fn: l(() => [
-                  o("div", R, [
-                    s(e.$slots, "subtitle")
+                fn: i(() => [
+                  l("div", A, [
+                    n(e.$slots, "subtitle")
                   ])
                 ]),
                 key: "0"
               } : void 0,
               e.$slots.bottom ? {
                 name: "bottom",
-                fn: l(() => [
-                  o("div", F, [
-                    s(e.$slots, "bottom")
+                fn: i(() => [
+                  l("div", R, [
+                    n(e.$slots, "bottom")
                   ])
                 ]),
                 key: "1"
               } : void 0,
               e.$slots.right ? {
                 name: "right",
-                fn: l(() => [
-                  o("div", M, [
-                    s(e.$slots, "right")
+                fn: i(() => [
+                  l("div", F, [
+                    n(e.$slots, "right")
                   ])
                 ]),
                 key: "2"
@@ -161,9 +160,9 @@ function q(e, t, d, z, n, i) {
       }, [
         e.$slots.content ? {
           name: "content",
-          fn: l(() => [
-            o("div", j, [
-              s(e.$slots, "content")
+          fn: i(() => [
+            l("div", M, [
+              n(e.$slots, "content")
             ])
           ]),
           key: "0"
@@ -172,8 +171,8 @@ function q(e, t, d, z, n, i) {
     ])
   ], 2);
 }
-const G = /* @__PURE__ */ D(w, [["render", q]]);
+const J = /* @__PURE__ */ D(S, [["render", z]]);
 export {
-  G as default
+  J as default
 };
 //# sourceMappingURL=feed-item-pill.js.map

package/dist/vue3/lib/feed-item-pill/feed-item-pill.js.map

@@ -1 +1 @@
-{"version":3,"file":"feed-item-pill.js","sources":["../../../recipes/conversation_view/feed_item_pill/feed_item_pill.vue"],"sourcesContent":["<template>\n  <div :class=\"['d-recipe-feed-item-pill__border', borderClass, wrapperClass]\">\n    <div class=\"d-recipe-feed-item-pill__wrapper\">\n      <dt-collapsible :open=\"expanded\">\n        <template #anchor>\n          <button\n            data-qa=\"dt-recipe-feed-item-pill\"\n            :aria-label=\"ariaLabel\"\n            :class=\"['d-recipe-feed-item-pill__button', toggleableClass, buttonClass]\"\n            @focusin=\"hover = true\"\n            @focusout=\"hover = false\"\n            @mouseenter=\"hover = true\"\n            @mouseleave=\"hover = false\"\n            @click=\"onClick\"\n          >\n            <dt-item-layout\n              class=\"d-recipe-feed-item-pill__layout\"\n              unstyled\n            >\n              <slot name=\"title\">\n                <span class=\"d-recipe-feed-item-pill__title\">{{ title }}</span>\n              </slot>\n              <template #left>\n                <div\n                  class=\"d-recipe-feed-item-pill__icon\"\n                  data-qa=\"dt-recipe-feed-item-pill__icon\"\n                >\n                  <component\n                    :is=\"toggleIcon\"\n                    v-if=\"showChevronIcon\"\n                    size=\"300\"\n                  />\n                  <!-- @slot Slot for left icon, icon-size slot prop defaults to '300' -->\n                  <slot\n                    v-else\n                    name=\"leftIcon\"\n                    :icon-size=\"'300'\"\n                  />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.subtitle\"\n                #subtitle\n              >\n                <div class=\"d-recipe-feed-item-pill__subtitle\">\n                  <slot name=\"subtitle\" />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.bottom\"\n                #bottom\n              >\n                <div class=\"d-recipe-feed-item-pill__bottom\">\n                  <slot name=\"bottom\" />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.right\"\n                #right\n              >\n                <div class=\"d-recipe-feed-item-pill__right\">\n                  <slot name=\"right\" />\n                </div>\n              </template>\n            </dt-item-layout>\n          </button>\n        </template>\n        <template\n          v-if=\"$slots.content\"\n          #content\n        >\n          <div class=\"d-recipe-feed-item-pill__content\">\n            <slot name=\"content\" />\n          </div>\n        </template>\n      </dt-collapsible>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { FEED_ITEM_PILL_BORDER_COLORS } from './feed_item_pill_constants';\nimport { DtItemLayout } from '@/components/item_layout';\nimport { DtCollapsible } from '@/components/collapsible';\nimport { DtIconChevronDown, DtIconChevronRight } from '@dialpad/dialtone-icons/vue3';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeFeedItemPill',\n\n  components: { DtItemLayout, DtCollapsible },\n\n  props: {\n    /**\n     * Bolded primary text\n     */\n    title: {\n      type: String,\n      default: () => '',\n    },\n\n    /**\n     * Additional styling around the pill\n     */\n    wrapperClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional styling for the pill\n     */\n    buttonClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Aria label for feed pill\n     */\n    ariaLabel: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Sets whether the pill can be toggled (Icon changing on hover, expanding and collapsing, pointer)\n     */\n    toggleable: {\n      type: Boolean,\n      default: () => true,\n    },\n\n    defaultToggled: {\n      type: Boolean,\n      default: () => false,\n    },\n\n    /**\n     * Callbox border color\n     * @values default, ai, critical\n     */\n    borderColor: {\n      type: String,\n      default: 'default',\n      validator: (color) => Object.keys(FEED_ITEM_PILL_BORDER_COLORS).includes(color),\n    },\n  },\n\n  data () {\n    return {\n      hover: false,\n      expanded: this.defaultToggled,\n    };\n  },\n\n  computed: {\n    toggleIcon () {\n      return this.expanded ? DtIconChevronDown : DtIconChevronRight;\n    },\n\n    showChevronIcon () {\n      return this.toggleable && this.hover;\n    },\n\n    toggleableClass () {\n      return this.toggleable ? 'd-recipe-feed-item-pill--toggleable' : '';\n    },\n\n    borderClass () {\n      return FEED_ITEM_PILL_BORDER_COLORS[this.borderColor];\n    },\n  },\n\n  methods: {\n    onClick () {\n      if (!this.toggleable) return;\n\n      this.expanded = !this.expanded;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtItemLayout","DtCollapsible","color","FEED_ITEM_PILL_BORDER_COLORS","DtIconChevronDown","DtIconChevronRight","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_createElementBlock","_normalizeClass","$options","$props","_createElementVNode","_createVNode","_component_dt_collapsible","$data","_createSlots","args","_component_dt_item_layout","_hoisted_4","_createBlock","_resolveDynamicComponent","_renderSlot","_ctx","_withCtx","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"feed-item-pill.js","sources":["../../../recipes/conversation_view/feed_item_pill/feed_item_pill.vue"],"sourcesContent":["<template>\n  <div :class=\"['d-recipe-feed-item-pill__border', borderClass, wrapperClass]\">\n    <div class=\"d-recipe-feed-item-pill__wrapper\">\n      <dt-collapsible :open=\"expanded\">\n        <template #anchor>\n          <button\n            data-qa=\"dt-recipe-feed-item-pill\"\n            :class=\"['d-recipe-feed-item-pill__button', toggleableClass, buttonClass]\"\n            :aria-label=\"anchorTitle\"\n            :title=\"anchorTitle\"\n            @focusin=\"hover = true\"\n            @focusout=\"hover = false\"\n            @mouseenter=\"hover = true\"\n            @mouseleave=\"hover = false\"\n            @click=\"onClick\"\n          >\n            <dt-item-layout\n              class=\"d-recipe-feed-item-pill__layout\"\n              unstyled\n            >\n              <slot name=\"title\">\n                <span class=\"d-recipe-feed-item-pill__title\">{{ title }}</span>\n              </slot>\n              <template #left>\n                <div\n                  class=\"d-recipe-feed-item-pill__icon\"\n                  data-qa=\"dt-recipe-feed-item-pill__icon\"\n                >\n                  <component\n                    :is=\"toggleIcon\"\n                    v-if=\"showChevronIcon\"\n                    size=\"300\"\n                  />\n                  <!-- @slot Slot for left icon, icon-size slot prop defaults to '300' -->\n                  <slot\n                    v-else\n                    name=\"leftIcon\"\n                    :icon-size=\"'300'\"\n                  />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.subtitle\"\n                #subtitle\n              >\n                <div class=\"d-recipe-feed-item-pill__subtitle\">\n                  <slot name=\"subtitle\" />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.bottom\"\n                #bottom\n              >\n                <div class=\"d-recipe-feed-item-pill__bottom\">\n                  <slot name=\"bottom\" />\n                </div>\n              </template>\n              <template\n                v-if=\"$slots.right\"\n                #right\n              >\n                <div class=\"d-recipe-feed-item-pill__right\">\n                  <slot name=\"right\" />\n                </div>\n              </template>\n            </dt-item-layout>\n          </button>\n        </template>\n        <template\n          v-if=\"$slots.content\"\n          #content\n        >\n          <div class=\"d-recipe-feed-item-pill__content\">\n            <slot name=\"content\" />\n          </div>\n        </template>\n      </dt-collapsible>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { FEED_ITEM_PILL_BORDER_COLORS } from './feed_item_pill_constants';\nimport { DtItemLayout } from '@/components/item_layout';\nimport { DtCollapsible } from '@/components/collapsible';\nimport { DtIconChevronDown, DtIconChevronRight } from '@dialpad/dialtone-icons/vue3';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtRecipeFeedItemPill',\n\n  components: { DtItemLayout, DtCollapsible },\n\n  props: {\n    /**\n     * Bolded primary text\n     */\n    title: {\n      type: String,\n      default: () => '',\n    },\n\n    /**\n     * Additional styling around the pill\n     */\n    wrapperClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional styling for the pill\n     */\n    buttonClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Sets whether the pill can be toggled (Icon changing on hover, expanding and collapsing, pointer)\n     */\n    toggleable: {\n      type: Boolean,\n      default: () => true,\n    },\n\n    defaultToggled: {\n      type: Boolean,\n      default: () => false,\n    },\n\n    /**\n     * Callbox border color\n     * @values default, ai, critical\n     */\n    borderColor: {\n      type: String,\n      default: 'default',\n      validator: (color) => Object.keys(FEED_ITEM_PILL_BORDER_COLORS).includes(color),\n    },\n  },\n\n  data () {\n    return {\n      hover: false,\n      expanded: this.defaultToggled,\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    toggleIcon () {\n      return this.expanded ? DtIconChevronDown : DtIconChevronRight;\n    },\n\n    showChevronIcon () {\n      return this.toggleable && this.hover;\n    },\n\n    toggleableClass () {\n      return this.toggleable ? 'd-recipe-feed-item-pill--toggleable' : '';\n    },\n\n    borderClass () {\n      return FEED_ITEM_PILL_BORDER_COLORS[this.borderColor];\n    },\n\n    anchorTitle () {\n      return this.i18n.$t('DIALTONE_FEED_ITEM_PILL_ARIA_LABEL');\n    },\n  },\n\n  methods: {\n    onClick () {\n      if (!this.toggleable) return;\n\n      this.expanded = !this.expanded;\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtItemLayout","DtCollapsible","color","FEED_ITEM_PILL_BORDER_COLORS","DialtoneLocalization","DtIconChevronDown","DtIconChevronRight","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_createElementBlock","_normalizeClass","$options","$props","_createElementVNode","_createVNode","_component_dt_collapsible","$data","_createSlots","args","_component_dt_item_layout","_hoisted_4","_createBlock","_resolveDynamicComponent","_renderSlot","_ctx","_withCtx","_toDisplayString"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./general-row-constants.cjs"),b=require("@dialpad/dialtone-icons/vue3"),C=require("../emoji-text-wrapper/emoji-text-wrapper.cjs"),w=require("./leftbar-general-row-icon.cjs"),l=require("../../common/utils/index.cjs"),e=require("vue"),y=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),g=require("../badge/badge.cjs"),E=require("../button/button.cjs"),T=require("../tooltip/tooltip.cjs"),S={compatConfig:{MODE:3},name:"DtRecipeGeneralRow",components:{DtEmojiTextWrapper:C.default,DtBadge:g.default,DtButton:E.default,DtTooltip:T.default,DtIconPhone:b.DtIconPhone,DtIconWaveform:b.DtIconWaveform,DtRecipeLeftbarGeneralRowIcon:w.default},inheritAttrs:!1,props:{type:{type:String,default:"inbox",validator:t=>Object.values(n.LEFTBAR_GENERAL_ROW_TYPES).includes(t)},ariaLabel:{type:String,default:""},description:{type:String,required:!0},color:{type:String,default:null,validator:t=>Object.keys(n.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(t)},channelSetting:{type:String,default:null},hasUnreads:{type:Boolean,default:!1},unreadCount:{type:String,default:null},unreadMentionCount:{type:String,default:null},unreadCountTooltip:{type:String,default:""},selected:{type:Boolean,default:!1},muted:{type:Boolean,default:!1},activeVoiceChat:{type:Boolean,default:!1},dndText:{type:String,default:""},dndTextTooltip:{type:String,default:""},hasCallButton:{type:Boolean,default:!1},callButtonTooltip:{type:String,default:""},isTyping:{type:Boolean,default:!1},iconSize:{type:String,default:"300",validator:t=>n.LEFTBAR_GENERAL_ROW_ICON_SIZES.includes(t)}},emits:["call"],data(){return{actionFocused:!1,labelWidth:"100%"}},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},generalRowListeners(){return l.extractVueListeners(this.$attrs)},getAriaLabel(){return this.ariaLabel?this.ariaLabel:l.safeConcatStrings([this.description,this.unreadCountTooltip,this.dndTextTooltip])},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}},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 i,a,d,c,s,u;const t=((a=(i=l.returnFirstEl(this.$el))==null?void 0:i.querySelector(".d-recipe-leftbar-row__primary"))==null?void 0:a.clientWidth)||0,o=((c=(d=l.returnFirstEl(this.$el))==null?void 0:d.querySelector(".d-recipe-leftbar-row__omega"))==null?void 0:c.clientWidth)||0,r=((u=(s=l.returnFirstEl(this.$el))==null?void 0:s.querySelector(".d-recipe-leftbar-row__alpha"))==null?void 0:u.clientWidth)||0,h=16;this.labelWidth=t-(o+r+h)+"px"}}},R=["data-qa","aria-label","title","href"],v={class:"d-recipe-leftbar-row__alpha"},B={key:0,class:"d-recipe-leftbar-row__is-typing"},N=e.createElementVNode("span",null,null,-1),A=e.createElementVNode("span",null,null,-1),k=e.createElementVNode("span",null,null,-1),L=[N,A,k],O={key:0,class:"d-recipe-leftbar-row__omega"},V={key:1,class:"d-recipe-leftbar-row__active-voice"},q={key:3,class:"d-recipe-leftbar-row__action","data-qa":"dt-recipe-leftbar-row-action"};function W(t,o,r,h,i,a){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"),f=e.resolveComponent("dt-icon-phone"),m=e.resolveComponent("dt-button");return e.openBlock(),e.createElementBlock("div",e.mergeProps({class:a.leftbarGeneralRowClasses},a.addClassStyleAttrs(t.$attrs),{"data-qa":"dt-recipe-leftbar-row"}),[e.createElementVNode("a",e.mergeProps({class:"d-recipe-leftbar-row__primary","data-qa":"data-qa"in t.$attrs?t.$attrs["data-qa"]:"d-recipe-leftbar-row-link","aria-label":a.getAriaLabel,title:r.description,href:"href"in t.$attrs?t.$attrs.href:"javascript:void(0)"},a.removeClassStyleAttrs(t.$attrs),e.toHandlers(a.generalRowListeners,!0)),[e.createElementVNode("div",v,[r.isTyping?(e.openBlock(),e.createElementBlock("div",B,L)):e.renderSlot(t.$slots,"left",{key:1},()=>[e.createVNode(d,{type:a.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: ${i.labelWidth}`)},[e.renderSlot(t.$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,R),a.hasActions?(e.openBlock(),e.createElementBlock("div",O,[r.dndText?(e.openBlock(),e.createBlock(s,{key:0,placement:"top",message:r.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.openBlock(),e.createElementBlock("div",V,[e.createVNode(u,{size:"300"})])):a.showUnreadCount||a.showUnreadMentionCount?(e.openBlock(),e.createBlock(s,{key:2,message:r.unreadCountTooltip,placement:"top"},{anchor:e.withCtx(()=>[a.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":a.shouldApplyCustomStyleForCountBadge}])},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.unreadCount),1)]),_:1},8,["class"])):e.createCommentVNode("",!0),a.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":a.shouldApplyCustomStyleForCountBadge},{"d-recipe-leftbar-row__unread-mention-only-count-badge":a.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",q,[e.createVNode(s,{message:r.callButtonTooltip,placement:"top"},{anchor:e.withCtx(()=>[e.createVNode(m,{class:"d-recipe-leftbar-row__action-button","data-qa":"dt-recipe-leftbar-row-action-call-button",circle:!0,size:"xs",kind:"inverted","aria-label":r.callButtonTooltip,onFocus:o[0]||(o[0]=_=>i.actionFocused=!0),onBlur:o[1]||(o[1]=_=>i.actionFocused=!1),onClick:o[2]||(o[2]=e.withModifiers(_=>t.$emit("call",_),["stop"]))},{icon:e.withCtx(()=>[e.createVNode(f,{size:"200"})]),_:1},8,["aria-label"])]),_:1},8,["message"])])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],16)}const U=y._(S,[["render",W]]);exports.default=U;
+"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("../emoji-text-wrapper/emoji-text-wrapper.cjs"),g=require("../badge/badge.cjs"),N=require("../button/button.cjs"),v=require("../tooltip/tooltip.cjs"),R={compatConfig:{MODE:3},name:"DtRecipeGeneralRow",components:{DtEmojiTextWrapper:y.default,DtBadge:g.default,DtButton:N.default,DtTooltip:v.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

package/dist/vue3/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          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        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=\"true\"\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/emoji_text_wrapper.vue';\nimport DtRecipeLeftbarGeneralRowIcon from './leftbar_general_row_icon.vue';\nimport { extractVueListeners, safeConcatStrings, removeClassStyleAttrs, returnFirstEl, addClassStyleAttrs } from '@/common/utils';\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     * Text shown when the unread count is hovered.\n     */\n    unreadCountTooltip: {\n      type: String,\n      default: '',\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     * Text shown in tooltip when you hover the dndText\n     */\n    dndTextTooltip: {\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     * Text shown when the call button is hovered.\n     */\n    callButtonTooltip: {\n      type: String,\n      default: '',\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    };\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      return this.ariaLabel\n        ? this.ariaLabel\n        : safeConcatStrings([this.description, this.unreadCountTooltip, this.dndTextTooltip]);\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\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","extractVueListeners","safeConcatStrings","returnFirstEl","removeClassStyleAttrs","addClassStyleAttrs","LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR","labelWidth","omegaWidth","alphaWidth","paddings","_hoisted_1","_hoisted_2","_createElementVNode","_hoisted_4","_hoisted_5","_hoisted_6","_openBlock","_createElementBlock","_mergeProps","$options","_ctx","$props","_toHandlers","_hoisted_3","_hoisted_7","_renderSlot","_createVNode","_component_dt_recipe_leftbar_general_row_icon","_normalizeStyle","$data","_component_dt_emoji_text_wrapper","_withCtx","_createTextVNode","_toDisplayString","_hoisted_8","_createBlock","_component_dt_tooltip","_createCommentVNode","_hoisted_9","_component_dt_icon_waveform","_component_dt_badge","_normalizeClass","_hoisted_10","_component_dt_button","_cache","_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\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_1","_hoisted_2","_createElementVNode","_hoisted_4","_hoisted_5","_hoisted_6","_openBlock","_createElementBlock","_mergeProps","$options","_ctx","$props","_toHandlers","_hoisted_3","_hoisted_7","_renderSlot","_createVNode","_component_dt_recipe_leftbar_general_row_icon","_normalizeStyle","$data","_component_dt_emoji_text_wrapper","_withCtx","_createTextVNode","_toDisplayString","_hoisted_8","_createBlock","_component_dt_tooltip","_createCommentVNode","_withDirectives","_hoisted_9","_component_dt_icon_waveform","_component_dt_badge","_normalizeClass","_hoisted_10","_component_dt_button","_cache","_withModifiers","$event","_component_dt_icon_phone"],"mappings":"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"}