npm - @dialpad/dialtone - Versions diffs - 9.123.1 → 9.124.0 - Mend

@dialpad/dialtone 9.123.1 → 9.124.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (339) hide show

package/dist/vue2/lib/feed-item-pill/feed-item-pill.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import { FEED_ITEM_PILL_BORDER_COLORS as o } from "./feed-item-pill-constants.js";
 import { DtIconChevronDown as i, DtIconChevronRight as n } from "@dialpad/dialtone-icons/vue2";
-import { n as s } from "../../_plugin-vue2_normalizer-CeySl7Fu.js";
+import { n as s } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
 import a from "../item-layout/item-layout.js";
-import u from "../collapsible/collapsible.js";
-const d = {
+import d from "../collapsible/collapsible.js";
+const u = {
   name: "DtRecipeFeedItemPill",
-  components: { DtItemLayout: a, DtCollapsible: u },
+  components: { DtItemLayout: a, DtCollapsible: d },
   props: {
     /**
      * Bolded primary text
@@ -53,7 +53,7 @@ const d = {
     borderColor: {
       type: String,
       default: "default",
-      validator: (r) => Object.keys(o).includes(r)
+      validator: (l) => Object.keys(o).includes(l)
     }
   },
   data() {
@@ -85,13 +85,13 @@ const d = {
 var c = function() {
   var e = this, t = e._self._c;
   return t("div", { class: ["d-recipe-feed-item-pill__border", e.borderClass, e.wrapperClass] }, [t("div", { staticClass: "d-recipe-feed-item-pill__wrapper" }, [t("dt-collapsible", { attrs: { open: e.expanded }, scopedSlots: e._u([{ key: "anchor", fn: function() {
-    return [t("button", { class: ["d-recipe-feed-item-pill__button", e.toggleableClass, e.buttonClass], attrs: { "data-qa": "dt-recipe-feed-item-pill", "aria-label": e.ariaLabel }, on: { focusin: function(l) {
+    return [t("button", { class: ["d-recipe-feed-item-pill__button", e.toggleableClass, e.buttonClass], attrs: { "data-qa": "dt-recipe-feed-item-pill", "aria-label": e.ariaLabel }, on: { focusin: function(r) {
       e.hover = !0;
-    }, focusout: function(l) {
+    }, focusout: function(r) {
       e.hover = !1;
-    }, mouseenter: function(l) {
+    }, mouseenter: function(r) {
       e.hover = !0;
-    }, mouseleave: function(l) {
+    }, mouseleave: function(r) {
       e.hover = !1;
     }, click: e.onClick } }, [t("dt-item-layout", { staticClass: "d-recipe-feed-item-pill__layout", attrs: { unstyled: "" }, scopedSlots: e._u([{ key: "left", fn: function() {
       return [t("div", { staticClass: "d-recipe-feed-item-pill__icon", attrs: { "data-qa": "dt-recipe-feed-item-pill__icon" } }, [e.showChevronIcon ? t(e.toggleIcon, { tag: "component", attrs: { size: "300" } }) : e._t("leftIcon", null, { iconSize: "300" })], 2)];
@@ -108,12 +108,9 @@ var c = function() {
     return [t("div", { staticClass: "d-recipe-feed-item-pill__content" }, [e._t("content")], 2)];
   }, proxy: !0 } : null], null, !0) })], 1)]);
 }, p = [], f = /* @__PURE__ */ s(
-  d,
+  u,
   c,
-  p,
-  !1,
-  null,
-  null
+  p
 );
 const v = f.exports;
 export {

package/dist/vue2/lib/feed-item-pill/feed-item-pill.js.map CHANGED Viewed

	@@ -1 +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/vue2';\n\nexport default {\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"],"mappings":";;;;;AAsFA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA,EAAA,cAAAC,GAAA,eAAAC,EAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AAAA,IACA;AAAA,IAEA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAAC,MAAA,OAAA,KAAAC,CAAA,EAAA,SAAAD,CAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA,KAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,aAAA;AACA,aAAA,KAAA,WAAAE,IAAAC;AAAA,IACA;AAAA,IAEA,kBAAA;AACA,aAAA,KAAA,cAAA,KAAA;AAAA,IACA;AAAA,IAEA,kBAAA;AACA,aAAA,KAAA,aAAA,wCAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,aAAAF,EAAA,KAAA,WAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,UAAA;AACA,MAAA,KAAA,eAEA,KAAA,WAAA,CAAA,KAAA;AAAA,IACA;AAAA,EACA;AACA~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
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/vue2';\n\nexport default {\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"],"mappings":";;;;;AAsFA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA,EAAA,cAAAC,GAAA,eAAAC,EAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AAAA,IACA;AAAA,IAEA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA,MAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAAC,MAAA,OAAA,KAAAC,CAAA,EAAA,SAAAD,CAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA,KAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,aAAA;AACA,aAAA,KAAA,WAAAE,IAAAC;AAAA,IACA;AAAA,IAEA,kBAAA;AACA,aAAA,KAAA,cAAA,KAAA;AAAA,IACA;AAAA,IAEA,kBAAA;AACA,aAAA,KAAA,aAAA,wCAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,aAAAF,EAAA,KAAA,WAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,UAAA;AACA,MAAA,KAAA,eAEA,KAAA,WAAA,CAAA,KAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/vue2/lib/feed-item-row/feed-item-row.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("./feed-item-row-constants.cjs"),r=require("../../common/mixins/modal.cjs"),o=require("@dialpad/dialtone-icons/vue2"),n=require("../../_plugin-vue2_normalizer-yXi3ZRRD.cjs"),d=require("../avatar/avatar.cjs"),l=require("../lazy-show/lazy-show.cjs"),c=require("../list-item/list-item.cjs"),_=require("../badge/badge.cjs"),u={name:"DtRecipeFeedItemRow",components:{DtAvatar:d.default,DtLazyShow:l.default,DtListItem:c.default,DtBadge:_.default,DtIconUser:o.DtIconUser},mixins:[r.default],inheritAttrs:!1,props:{avatarSeed:{type:String,default:null},showHeader:{type:Boolean,default:!1},avatarImageUrl:{type:String,default:""},displayName:{type:String,default:""},noInitials:{type:Boolean,default:!1},time:{type:String,default:""},shortTime:{type:String,default:""},labelText:{type:String,default:""},isActive:{type:Boolean,default:!1},state:{type:String,default:i.DEFAULT_FEED_ROW_STATE,validator:a=>Object.keys(i.FEED_ROW_STATE_BACKGROUND_COLOR).includes(a)}},emits:["hover","focus","keydown"],data(){return{transitionActive:!1}},computed:{feedListeners(){return{...this.$listeners,mouseenter:()=>this.setHover(!0),mouseleave:()=>this.setHover(!1),focusin:()=>this.setFocus(!0),focusout:()=>this.setFocus(!1),transitionend:()=>this.transitionComplete(),keydown:a=>{switch(a.code){case"Tab":this.trapFocus(a);break}this.$emit("keydown",a)}}},listItemClasses(){return["d-recipe-feed-item-row",{"d-recipe-feed-item-row--active":this.isActive&&this.state===i.DEFAULT_FEED_ROW_STATE},{"d-recipe-feed-item-row__state-transition":this.transitionActive},i.FEED_ROW_STATE_BACKGROUND_COLOR[this.state]]}},watch:{state:{immediate:!0,handler:function(a,e){a!==i.DEFAULT_FEED_ROW_STATE&&(this.transitionActive=!0)}}},methods:{transitionComplete(){this.state===i.DEFAULT_FEED_ROW_STATE&&(this.transitionActive=!1)},trapFocus(a){this.focusTrappedTabPress(a)},setFocus(a){this.$emit("focus",a)},setHover(a){this.$emit("hover",a)}}};var m=function(){var e=this,t=e._self._c;return t("dt-list-item",e._g(e._b({ref:"FeedItemRef",class:e.listItemClasses,attrs:{"navigation-type":"none","data-qa":"dt-recipe-feed-item-row"},scopedSlots:e._u([{key:"left",fn:function(){return[e.showHeader?t("div",{staticClass:"d-recipe-feed-item-row__avatar-container"},[e._t("avatar",function(){return[t("dt-avatar",{attrs:{"full-name":e.displayName,"image-src":e.avatarImageUrl,"image-alt":"",seed:e.avatarSeed},scopedSlots:e._u([e.noInitials?{key:"icon",fn:function({iconSize:s}){return[t("dt-icon-user",{attrs:{size:s}})]}}:null],null,!0)})]})],2):e._e(),e.showHeader?e._e():t("span",{directives:[{name:"show",rawName:"v-show",value:e.isActive,expression:"isActive"}],staticClass:"d-recipe-feed-item-row__left-time",attrs:{"data-qa":"dt-recipe-feed-item-row--left-time"}},[e._v(" "+e._s(e.shortTime)+" ")])]},proxy:!0},{key:"bottom",fn:function(){return[e.$slots.reactions?t("div",{staticClass:"d-recipe-feed-item-row__reactions",attrs:{"data-qa":"dt-recipe-feed-item-row--reactions"}},[e._t("reactions")],2):e._e(),e.$slots.threading?t("div",{staticClass:"d-recipe-feed-item-row__threading"},[e._t("threading")],2):e._e(),t("div",{directives:[{name:"show",rawName:"v-show",value:e.isActive,expression:"isActive"}],staticClass:"d-recipe-feed-item-row__menu",attrs:{"data-qa":"dt-recipe-feed-item-row--menu"}},[t("dt-lazy-show",{attrs:{appear:!0,transition:"fade",show:e.isActive}},[e._t("menu")],2)],1)]},proxy:!0}],null,!0)},"dt-list-item",e.$attrs,!1),e.feedListeners),[t("article",{staticClass:"d-recipe-feed-item-row__content"},[e.showHeader?t("div",{staticClass:"d-recipe-feed-item-row__header",attrs:{"data-qa":"dt-recipe-feed-item-row--header"}},[e._t("displayName",function(){return[t("p",{staticClass:"d-recipe-feed-item-row__header-name"},[e._v(" "+e._s(e.displayName)+" ")])]}),t("time",{staticClass:"d-recipe-feed-item-row__header-time"},[e._v(" "+e._s(e.time)+" ")]),e.labelText?t("dt-badge",{attrs:{text:e.labelText}}):e._e()],2):e._e(),t("span",{attrs:{"data-qa":"dt-recipe-feed-item-row--content"}},[e._t("default")],2),e.$slots.attachment?t("div",{staticClass:"d-recipe-feed-item-row__attachment",attrs:{"data-qa":"dt-recipe-feed-item-row--attachment"}},[e._t("attachment")],2):e._e()])])},f=[],p=n.n(u,m,f,!1,null,null);const h=p.exports;exports.default=h;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("./feed-item-row-constants.cjs"),r=require("../../common/mixins/modal.cjs"),o=require("@dialpad/dialtone-icons/vue2"),n=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),d=require("../avatar/avatar.cjs"),c=require("../lazy-show/lazy-show.cjs"),l=require("../list-item/list-item.cjs"),_=require("../badge/badge.cjs"),u={name:"DtRecipeFeedItemRow",components:{DtAvatar:d.default,DtLazyShow:c.default,DtListItem:l.default,DtBadge:_.default,DtIconUser:o.DtIconUser},mixins:[r.default],inheritAttrs:!1,props:{avatarSeed:{type:String,default:null},showHeader:{type:Boolean,default:!1},avatarImageUrl:{type:String,default:""},displayName:{type:String,default:""},noInitials:{type:Boolean,default:!1},time:{type:String,default:""},shortTime:{type:String,default:""},labelText:{type:String,default:""},isActive:{type:Boolean,default:!1},state:{type:String,default:i.DEFAULT_FEED_ROW_STATE,validator:a=>Object.keys(i.FEED_ROW_STATE_BACKGROUND_COLOR).includes(a)}},emits:["hover","focus","keydown"],data(){return{transitionActive:!1}},computed:{feedListeners(){return{...this.$listeners,mouseenter:()=>this.setHover(!0),mouseleave:()=>this.setHover(!1),focusin:()=>this.setFocus(!0),focusout:()=>this.setFocus(!1),transitionend:()=>this.transitionComplete(),keydown:a=>{switch(a.code){case"Tab":this.trapFocus(a);break}this.$emit("keydown",a)}}},listItemClasses(){return["d-recipe-feed-item-row",{"d-recipe-feed-item-row--active":this.isActive&&this.state===i.DEFAULT_FEED_ROW_STATE},{"d-recipe-feed-item-row__state-transition":this.transitionActive},i.FEED_ROW_STATE_BACKGROUND_COLOR[this.state]]}},watch:{state:{immediate:!0,handler:function(a,e){a!==i.DEFAULT_FEED_ROW_STATE&&(this.transitionActive=!0)}}},methods:{transitionComplete(){this.state===i.DEFAULT_FEED_ROW_STATE&&(this.transitionActive=!1)},trapFocus(a){this.focusTrappedTabPress(a)},setFocus(a){this.$emit("focus",a)},setHover(a){this.$emit("hover",a)}}};var m=function(){var e=this,t=e._self._c;return t("dt-list-item",e._g(e._b({ref:"FeedItemRef",class:e.listItemClasses,attrs:{"navigation-type":"none","data-qa":"dt-recipe-feed-item-row"},scopedSlots:e._u([{key:"left",fn:function(){return[e.showHeader?t("div",{staticClass:"d-recipe-feed-item-row__avatar-container"},[e._t("avatar",function(){return[t("dt-avatar",{attrs:{"full-name":e.displayName,"image-src":e.avatarImageUrl,"image-alt":"",seed:e.avatarSeed},scopedSlots:e._u([e.noInitials?{key:"icon",fn:function({iconSize:s}){return[t("dt-icon-user",{attrs:{size:s}})]}}:null],null,!0)})]})],2):e._e(),e.showHeader?e._e():t("span",{directives:[{name:"show",rawName:"v-show",value:e.isActive,expression:"isActive"}],staticClass:"d-recipe-feed-item-row__left-time",attrs:{"data-qa":"dt-recipe-feed-item-row--left-time"}},[e._v(" "+e._s(e.shortTime)+" ")])]},proxy:!0},{key:"bottom",fn:function(){return[e.$slots.reactions?t("div",{staticClass:"d-recipe-feed-item-row__reactions",attrs:{"data-qa":"dt-recipe-feed-item-row--reactions"}},[e._t("reactions")],2):e._e(),e.$slots.threading?t("div",{staticClass:"d-recipe-feed-item-row__threading"},[e._t("threading")],2):e._e(),t("div",{directives:[{name:"show",rawName:"v-show",value:e.isActive,expression:"isActive"}],staticClass:"d-recipe-feed-item-row__menu",attrs:{"data-qa":"dt-recipe-feed-item-row--menu"}},[t("dt-lazy-show",{attrs:{appear:!0,transition:"fade",show:e.isActive}},[e._t("menu")],2)],1)]},proxy:!0}],null,!0)},"dt-list-item",e.$attrs,!1),e.feedListeners),[t("article",{staticClass:"d-recipe-feed-item-row__content"},[e.showHeader?t("div",{staticClass:"d-recipe-feed-item-row__header",attrs:{"data-qa":"dt-recipe-feed-item-row--header"}},[e._t("displayName",function(){return[t("p",{staticClass:"d-recipe-feed-item-row__header-name"},[e._v(" "+e._s(e.displayName)+" ")])]}),t("time",{staticClass:"d-recipe-feed-item-row__header-time"},[e._v(" "+e._s(e.time)+" ")]),e.labelText?t("dt-badge",{attrs:{text:e.labelText}}):e._e()],2):e._e(),t("span",{attrs:{"data-qa":"dt-recipe-feed-item-row--content"}},[e._t("default")],2),e.$slots.attachment?t("div",{staticClass:"d-recipe-feed-item-row__attachment",attrs:{"data-qa":"dt-recipe-feed-item-row--attachment"}},[e._t("attachment")],2):e._e()])])},f=[],p=n.n(u,m,f);const h=p.exports;exports.default=h;
 //# sourceMappingURL=feed-item-row.cjs.map

package/dist/vue2/lib/feed-item-row/feed-item-row.js CHANGED Viewed

@@ -1,17 +1,17 @@
 import { DEFAULT_FEED_ROW_STATE as i, FEED_ROW_STATE_BACKGROUND_COLOR as s } from "./feed-item-row-constants.js";
 import o from "../../common/mixins/modal.js";
 import { DtIconUser as n } from "@dialpad/dialtone-icons/vue2";
-import { n as d } from "../../_plugin-vue2_normalizer-CeySl7Fu.js";
+import { n as d } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
 import c from "../avatar/avatar.js";
-import l from "../lazy-show/lazy-show.js";
-import m from "../list-item/list-item.js";
+import m from "../lazy-show/lazy-show.js";
+import l from "../list-item/list-item.js";
 import f from "../badge/badge.js";
 const p = {
   name: "DtRecipeFeedItemRow",
   components: {
     DtAvatar: c,
-    DtLazyShow: l,
-    DtListItem: m,
+    DtLazyShow: m,
+    DtListItem: l,
     DtBadge: f,
     DtIconUser: n
   },
@@ -188,10 +188,7 @@ var _ = function() {
 }, u = [], h = /* @__PURE__ */ d(
   p,
   _,
-  u,
-  !1,
-  null,
-  null
+  u
 );
 const x = h.exports;
 export {

package/dist/vue2/lib/feed-item-row/feed-item-row.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"feed-item-row.js","sources":["../../../recipes/conversation_view/feed_item_row/feed_item_row.vue"],"sourcesContent":["<template>\n <dt-list-item\n ref=\"FeedItemRef\"\n navigation-type=\"none\"\n v-bind=\"$attrs\"\n :class=\"listItemClasses\"\n data-qa=\"dt-recipe-feed-item-row\"\n v-on=\"feedListeners\"\n >\n <!-- Avatar or time -->\n <template #left>\n <div\n v-if=\"showHeader\"\n class=\"d-recipe-feed-item-row__avatar-container\"\n >\n <!-- @slot Slot to contain the avatar, overrides avatar props. -->\n <slot\n name=\"avatar\"\n >\n <dt-avatar\n :full-name=\"displayName\"\n :image-src=\"avatarImageUrl\"\n image-alt=\"\"\n :seed=\"avatarSeed\"\n >\n <template\n v-if=\"noInitials\"\n #icon=\"{ iconSize }\"\n >\n <dt-icon-user\n :size=\"iconSize\"\n />\n </template>\n </dt-avatar>\n </slot>\n </div>\n <!-- show time instead of avatar when headers not present -->\n <span\n v-if=\"!showHeader\"\n v-show=\"isActive\"\n class=\"d-recipe-feed-item-row__left-time\"\n data-qa=\"dt-recipe-feed-item-row--left-time\"\n >\n {{ shortTime }}\n </span>\n </template>\n\n <article class=\"d-recipe-feed-item-row__content\">\n <!-- Feed Item -->\n <div\n v-if=\"showHeader\"\n data-qa=\"dt-recipe-feed-item-row--header\"\n class=\"d-recipe-feed-item-row__header\"\n >\n <!-- @slot Slot for display name -->\n <slot name=\"displayName\">\n <p class=\"d-recipe-feed-item-row__header-name\">\n {{ displayName }}\n </p>\n </slot>\n <time\n class=\"d-recipe-feed-item-row__header-time\"\n >\n {{ time }}\n </time>\n <dt-badge\n v-if=\"labelText\"\n :text=\"labelText\"\n />\n </div>\n <!-- @slot Default content slot for feed item row -->\n <span\n data-qa=\"dt-recipe-feed-item-row--content\"\n >\n <slot />\n </span>\n <div\n v-if=\"$slots.attachment\"\n data-qa=\"dt-recipe-feed-item-row--attachment\"\n class=\"d-recipe-feed-item-row__attachment\"\n >\n <slot name=\"attachment\" />\n </div>\n </article>\n\n <template #bottom>\n <!-- Reactions -->\n <div\n v-if=\"$slots.reactions\"\n class=\"d-recipe-feed-item-row__reactions\"\n data-qa=\"dt-recipe-feed-item-row--reactions\"\n >\n <!-- @slot Slot for reactions row component -->\n <slot name=\"reactions\" />\n </div>\n\n <!-- Threading -->\n <div\n v-if=\"$slots.threading\"\n class=\"d-recipe-feed-item-row__threading\"\n >\n <!-- @slot Slot for threading row component -->\n <slot name=\"threading\" />\n </div>\n\n <!-- Action menu -->\n <div\n v-show=\"isActive\"\n data-qa=\"dt-recipe-feed-item-row--menu\"\n class=\"d-recipe-feed-item-row__menu\"\n >\n <dt-lazy-show\n :appear=\"true\"\n transition=\"fade\"\n :show=\"isActive\"\n >\n <!-- @slot Slot for actions hover menu component -->\n <slot name=\"menu\" />\n </dt-lazy-show>\n </div>\n </template>\n </dt-list-item>\n</template>\n\n<script>\n/* eslint-disable max-lines /\nimport { DEFAULT_FEED_ROW_STATE, FEED_ROW_STATE_BACKGROUND_COLOR } from './feed_item_row_constants.js';\nimport { DtAvatar } from '@/components/avatar';\nimport { DtLazyShow } from '@/components/lazy_show';\nimport { DtListItem } from '@/components/list_item';\nimport { DtBadge } from '@/components/badge';\nimport Modal from '@/common/mixins/modal';\nimport { DtIconUser } from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n name: 'DtRecipeFeedItemRow',\n\n components: {\n DtAvatar,\n DtLazyShow,\n DtListItem,\n DtBadge,\n DtIconUser,\n },\n\n mixins: [Modal],\n\n inheritAttrs: false,\n\n props: {\n /\n Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.\n /\n avatarSeed: {\n type: String,\n default: null,\n },\n\n /\n Show avatar, show header text or dont show left time and vice versa\n /\n showHeader: {\n type: Boolean,\n default: false,\n },\n\n /\n Optional avatar image url.\n * If not provided it will use extracted initials from displayName.\n /\n avatarImageUrl: {\n type: String,\n default: '',\n },\n\n /\n The display name of the sender\n /\n displayName: {\n type: String,\n default: '',\n },\n\n /\n Initials will never be shown. Instead it will show a \"User\" icon.\n /\n noInitials: {\n type: Boolean,\n default: false,\n },\n\n /\n time string displayed as is.\n * Shown on the header when showHeader is true\n /\n time: {\n type: String,\n default: '',\n },\n\n /\n short time string without AM/PM displayed as is.\n * Shown on the left of feed item when showHeader is false and isActive is true\n /\n shortTime: {\n type: String,\n default: '',\n },\n\n /\n A label displayed next to the displayName. Will not show if empty.\n /\n labelText: {\n type: String,\n default: '',\n },\n\n /\n displays a darkened background on the row.\n /\n isActive: {\n type: Boolean,\n default: false,\n },\n\n /\n state for the feed item row. Can be normal, searched & error\n /\n state: {\n type: String,\n default: DEFAULT_FEED_ROW_STATE,\n validator: state => Object.keys(FEED_ROW_STATE_BACKGROUND_COLOR).includes(state),\n },\n },\n\n emits: [\n /\n Fires when hovered over feed row\n \n @event hover\n * @type {Boolean}\n /\n 'hover',\n\n /\n Fires when focused over feed row\n \n @event focus\n * @type {Boolean}\n /\n 'focus',\n\n /\n Key down event\n \n @event keydown\n * @type {KeyboardEvent}\n */\n 'keydown',\n ],\n\n data () {\n return {\n transitionActive: false,\n };\n },\n\n computed: {\n feedListeners () {\n return {\n ...this.$listeners,\n mouseenter: () => this.setHover(true),\n mouseleave: () => this.setHover(false),\n focusin: () => this.setFocus(true),\n focusout: () => this.setFocus(false),\n transitionend: () => this.transitionComplete(),\n keydown: event => {\n switch (event.code) {\n case 'Tab':\n this.trapFocus(event);\n break;\n }\n this.$emit('keydown', event);\n },\n };\n },\n\n listItemClasses () {\n return [\n 'd-recipe-feed-item-row',\n { 'd-recipe-feed-item-row--active': this.isActive && this.state === DEFAULT_FEED_ROW_STATE },\n { 'd-recipe-feed-item-row__state-transition': this.transitionActive },\n FEED_ROW_STATE_BACKGROUND_COLOR[this.state],\n\n ];\n },\n },\n\n watch: {\n state: {\n immediate: true,\n handler: function (newState, oldState) {\n if (newState !== DEFAULT_FEED_ROW_STATE) {\n this.transitionActive = true;\n }\n },\n },\n },\n\n methods: {\n transitionComplete () {\n if (this.state === DEFAULT_FEED_ROW_STATE) {\n this.transitionActive = false;\n }\n },\n\n trapFocus (e) {\n this.focusTrappedTabPress(e);\n },\n\n setFocus (bool) {\n this.$emit('focus', bool);\n },\n\n setHover (bool) {\n this.$emit('hover', bool);\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtAvatar","DtLazyShow","DtListItem","DtBadge","DtIconUser","Modal","DEFAULT_FEED_ROW_STATE","state","FEED_ROW_STATE_BACKGROUND_COLOR","event","newState","oldState","e","bool"],"mappings":"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"}
1	+ {"version":3,"file":"feed-item-row.js","sources":["../../../recipes/conversation_view/feed_item_row/feed_item_row.vue"],"sourcesContent":["<template>\n <dt-list-item\n ref=\"FeedItemRef\"\n navigation-type=\"none\"\n v-bind=\"$attrs\"\n :class=\"listItemClasses\"\n data-qa=\"dt-recipe-feed-item-row\"\n v-on=\"feedListeners\"\n >\n <!-- Avatar or time -->\n <template #left>\n <div\n v-if=\"showHeader\"\n class=\"d-recipe-feed-item-row__avatar-container\"\n >\n <!-- @slot Slot to contain the avatar, overrides avatar props. -->\n <slot\n name=\"avatar\"\n >\n <dt-avatar\n :full-name=\"displayName\"\n :image-src=\"avatarImageUrl\"\n image-alt=\"\"\n :seed=\"avatarSeed\"\n >\n <template\n v-if=\"noInitials\"\n #icon=\"{ iconSize }\"\n >\n <dt-icon-user\n :size=\"iconSize\"\n />\n </template>\n </dt-avatar>\n </slot>\n </div>\n <!-- show time instead of avatar when headers not present -->\n <span\n v-if=\"!showHeader\"\n v-show=\"isActive\"\n class=\"d-recipe-feed-item-row__left-time\"\n data-qa=\"dt-recipe-feed-item-row--left-time\"\n >\n {{ shortTime }}\n </span>\n </template>\n\n <article class=\"d-recipe-feed-item-row__content\">\n <!-- Feed Item -->\n <div\n v-if=\"showHeader\"\n data-qa=\"dt-recipe-feed-item-row--header\"\n class=\"d-recipe-feed-item-row__header\"\n >\n <!-- @slot Slot for display name -->\n <slot name=\"displayName\">\n <p class=\"d-recipe-feed-item-row__header-name\">\n {{ displayName }}\n </p>\n </slot>\n <time\n class=\"d-recipe-feed-item-row__header-time\"\n >\n {{ time }}\n </time>\n <dt-badge\n v-if=\"labelText\"\n :text=\"labelText\"\n />\n </div>\n <!-- @slot Default content slot for feed item row -->\n <span\n data-qa=\"dt-recipe-feed-item-row--content\"\n >\n <slot />\n </span>\n <div\n v-if=\"$slots.attachment\"\n data-qa=\"dt-recipe-feed-item-row--attachment\"\n class=\"d-recipe-feed-item-row__attachment\"\n >\n <slot name=\"attachment\" />\n </div>\n </article>\n\n <template #bottom>\n <!-- Reactions -->\n <div\n v-if=\"$slots.reactions\"\n class=\"d-recipe-feed-item-row__reactions\"\n data-qa=\"dt-recipe-feed-item-row--reactions\"\n >\n <!-- @slot Slot for reactions row component -->\n <slot name=\"reactions\" />\n </div>\n\n <!-- Threading -->\n <div\n v-if=\"$slots.threading\"\n class=\"d-recipe-feed-item-row__threading\"\n >\n <!-- @slot Slot for threading row component -->\n <slot name=\"threading\" />\n </div>\n\n <!-- Action menu -->\n <div\n v-show=\"isActive\"\n data-qa=\"dt-recipe-feed-item-row--menu\"\n class=\"d-recipe-feed-item-row__menu\"\n >\n <dt-lazy-show\n :appear=\"true\"\n transition=\"fade\"\n :show=\"isActive\"\n >\n <!-- @slot Slot for actions hover menu component -->\n <slot name=\"menu\" />\n </dt-lazy-show>\n </div>\n </template>\n </dt-list-item>\n</template>\n\n<script>\n/* eslint-disable max-lines /\nimport { DEFAULT_FEED_ROW_STATE, FEED_ROW_STATE_BACKGROUND_COLOR } from './feed_item_row_constants.js';\nimport { DtAvatar } from '@/components/avatar';\nimport { DtLazyShow } from '@/components/lazy_show';\nimport { DtListItem } from '@/components/list_item';\nimport { DtBadge } from '@/components/badge';\nimport Modal from '@/common/mixins/modal';\nimport { DtIconUser } from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n name: 'DtRecipeFeedItemRow',\n\n components: {\n DtAvatar,\n DtLazyShow,\n DtListItem,\n DtBadge,\n DtIconUser,\n },\n\n mixins: [Modal],\n\n inheritAttrs: false,\n\n props: {\n /\n Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.\n /\n avatarSeed: {\n type: String,\n default: null,\n },\n\n /\n Show avatar, show header text or dont show left time and vice versa\n /\n showHeader: {\n type: Boolean,\n default: false,\n },\n\n /\n Optional avatar image url.\n * If not provided it will use extracted initials from displayName.\n /\n avatarImageUrl: {\n type: String,\n default: '',\n },\n\n /\n The display name of the sender\n /\n displayName: {\n type: String,\n default: '',\n },\n\n /\n Initials will never be shown. Instead it will show a \"User\" icon.\n /\n noInitials: {\n type: Boolean,\n default: false,\n },\n\n /\n time string displayed as is.\n * Shown on the header when showHeader is true\n /\n time: {\n type: String,\n default: '',\n },\n\n /\n short time string without AM/PM displayed as is.\n * Shown on the left of feed item when showHeader is false and isActive is true\n /\n shortTime: {\n type: String,\n default: '',\n },\n\n /\n A label displayed next to the displayName. Will not show if empty.\n /\n labelText: {\n type: String,\n default: '',\n },\n\n /\n displays a darkened background on the row.\n /\n isActive: {\n type: Boolean,\n default: false,\n },\n\n /\n state for the feed item row. Can be normal, searched & error\n /\n state: {\n type: String,\n default: DEFAULT_FEED_ROW_STATE,\n validator: state => Object.keys(FEED_ROW_STATE_BACKGROUND_COLOR).includes(state),\n },\n },\n\n emits: [\n /\n Fires when hovered over feed row\n \n @event hover\n * @type {Boolean}\n /\n 'hover',\n\n /\n Fires when focused over feed row\n \n @event focus\n * @type {Boolean}\n /\n 'focus',\n\n /\n Key down event\n \n @event keydown\n * @type {KeyboardEvent}\n */\n 'keydown',\n ],\n\n data () {\n return {\n transitionActive: false,\n };\n },\n\n computed: {\n feedListeners () {\n return {\n ...this.$listeners,\n mouseenter: () => this.setHover(true),\n mouseleave: () => this.setHover(false),\n focusin: () => this.setFocus(true),\n focusout: () => this.setFocus(false),\n transitionend: () => this.transitionComplete(),\n keydown: event => {\n switch (event.code) {\n case 'Tab':\n this.trapFocus(event);\n break;\n }\n this.$emit('keydown', event);\n },\n };\n },\n\n listItemClasses () {\n return [\n 'd-recipe-feed-item-row',\n { 'd-recipe-feed-item-row--active': this.isActive && this.state === DEFAULT_FEED_ROW_STATE },\n { 'd-recipe-feed-item-row__state-transition': this.transitionActive },\n FEED_ROW_STATE_BACKGROUND_COLOR[this.state],\n\n ];\n },\n },\n\n watch: {\n state: {\n immediate: true,\n handler: function (newState, oldState) {\n if (newState !== DEFAULT_FEED_ROW_STATE) {\n this.transitionActive = true;\n }\n },\n },\n },\n\n methods: {\n transitionComplete () {\n if (this.state === DEFAULT_FEED_ROW_STATE) {\n this.transitionActive = false;\n }\n },\n\n trapFocus (e) {\n this.focusTrappedTabPress(e);\n },\n\n setFocus (bool) {\n this.$emit('focus', bool);\n },\n\n setHover (bool) {\n this.$emit('hover', bool);\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtAvatar","DtLazyShow","DtListItem","DtBadge","DtIconUser","Modal","DEFAULT_FEED_ROW_STATE","state","FEED_ROW_STATE_BACKGROUND_COLOR","event","newState","oldState","e","bool"],"mappings":"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"}

package/dist/vue2/lib/general-row/general-row.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("./general-row-constants.cjs"),c=require("@dialpad/dialtone-icons/vue2"),p=require("../emoji-text-wrapper/emoji-text-wrapper.cjs"),_=require("./leftbar-general-row-icon.cjs"),h=require("../../common/utils/index.cjs"),f=require("../../_plugin-vue2_normalizer-yXi3ZRRD.cjs"),b=require("../badge/badge.cjs"),C=require("../button/button.cjs"),w=require("../tooltip/tooltip.cjs"),y={name:"DtRecipeGeneralRow",components:{DtEmojiTextWrapper:p.default,DtBadge:b.default,DtButton:C.default,DtTooltip:w.default,DtIconPhone:c.DtIconPhone,DtIconWaveform:c.DtIconWaveform,DtRecipeLeftbarGeneralRowIcon:_.default},inheritAttrs:!1,props:{type:{type:String,default:"inbox",validator:a=>Object.values(r.LEFTBAR_GENERAL_ROW_TYPES).includes(a)},ariaLabel:{type:String,default:""},description:{type:String,required:!0},color:{type:String,default:null,validator:a=>Object.keys(r.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(a)},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:a=>r.LEFTBAR_GENERAL_ROW_ICON_SIZES.includes(a)}},emits:["click","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 r.LEFTBAR_GENERAL_ROW_TYPES.CHANNELS:if(this.hasUnreads)return"channel unread";break;case r.LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL:if(this.hasUnreads)return"locked channel unread";break}return this.type},getAriaLabel(){return this.ariaLabel?this.ariaLabel:h.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(this.$el),this.adjustLabelWidth()},beforeDestroy:function(){this.resizeObserver.disconnect()},methods:{validateProps(){this.type===r.LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER&&!Object.keys(r.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)&&console.error(r.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR)},adjustLabelWidth(){var o,i,s,l,d,u;const a=((i=(o=this.$el)==null?void 0:o.querySelector(".d-recipe-leftbar-row__primary"))==null?void 0:i.clientWidth)||0,e=((l=(s=this.$el)==null?void 0:s.querySelector(".d-recipe-leftbar-row__omega"))==null?void 0:l.clientWidth)||0,t=((u=(d=this.$el)==null?void 0:d.querySelector(".d-recipe-leftbar-row__alpha"))==null?void 0:u.clientWidth)||0,n=16;this.labelWidth=a-(e+t+n)+"px"}}};var g=function(){var e=this,t=e._self._c;return t("div",{class:e.leftbarGeneralRowClasses,attrs:{"data-qa":"dt-recipe-leftbar-row"}},[t("a",e._g(e._b({staticClass:"d-recipe-leftbar-row__primary",attrs:{"data-qa":"data-qa"in e.$attrs?e.$attrs["data-qa"]:"d-recipe-leftbar-row-link","aria-label":e.getAriaLabel,title:e.description,href:"href"in e.$attrs?e.$attrs.href:"javascript:void(0)"}},"a",e.$attrs,!1),e.$listeners),[t("div",{staticClass:"d-recipe-leftbar-row__alpha"},[e.isTyping?t("div",{staticClass:"d-recipe-leftbar-row__is-typing"},[t("span"),t("span"),t("span")]):e._t("left",function(){return[t("dt-recipe-leftbar-general-row-icon",{attrs:{type:e.getIcon,color:e.color,"icon-size":e.iconSize,"data-qa":"dt-recipe-leftbar-row-icon"}})]})],2),t("div",{staticClass:"d-recipe-leftbar-row__label",style:`flex-basis: ${e.labelWidth}`},[e._t("label",function(){return[t("dt-emoji-text-wrapper",{staticClass:"d-recipe-leftbar-row__description",attrs:{"data-qa":"dt-recipe-leftbar-row-description",size:"200"}},[e._v(" "+e._s(e.description)+" ")])]})],2)]),e.hasActions?t("div",{staticClass:"d-recipe-leftbar-row__omega"},[e.dndText?t("dt-tooltip",{attrs:{placement:"top",message:e.dndTextTooltip},scopedSlots:e._u([{key:"anchor",fn:function(){return[t("div",{ref:"d-recipe-leftbar-row-dnd",staticClass:"d-recipe-leftbar-row__dnd",attrs:{"data-qa":"dt-recipe-leftbar-row-dnd"}},[e._v(" "+e._s(e.dndText)+" ")])]},proxy:!0}],null,!1,3247296267)}):e._e(),e.activeVoiceChat?t("div",{staticClass:"d-recipe-leftbar-row__active-voice"},[t("dt-icon-waveform",{attrs:{size:"300"}})],1):e.showUnreadCount||e.showUnreadMentionCount?t("dt-tooltip",{attrs:{message:e.unreadCountTooltip,placement:"top"},scopedSlots:e._u([{key:"anchor",fn:function(){return[e.showUnreadCount?t("dt-badge",{class:["d-recipe-leftbar-row__unread-badge",{"d-recipe-leftbar-row__unread-count-badge":e.shouldApplyCustomStyleForCountBadge}],attrs:{kind:"count",type:"bulletin","data-qa":"dt-recipe-leftbar-row-unread-badge"}},[e._v(" "+e._s(e.unreadCount)+" ")]):e._e(),e.showUnreadMentionCount?t("dt-badge",{class:["d-recipe-leftbar-row__unread-badge",{"d-recipe-leftbar-row__unread-mention-count-badge":e.shouldApplyCustomStyleForCountBadge},{"d-recipe-leftbar-row__unread-mention-only-count-badge":e.shouldApplyCustomStyleForMentionOnly}],attrs:{kind:"count",type:"bulletin","data-qa":"dt-recipe-leftbar-row-unread-mention-badge"}},[e._v(" "+e._s(e.unreadMentionCount)+" ")]):e._e()]},proxy:!0}],null,!1,715135836)}):e._e(),e.hasCallButton?t("div",{staticClass:"d-recipe-leftbar-row__action",attrs:{"data-qa":"dt-recipe-leftbar-row-action"}},[t("dt-tooltip",{attrs:{message:e.callButtonTooltip,placement:"top"},scopedSlots:e._u([{key:"anchor",fn:function(){return[t("dt-button",{staticClass:"d-recipe-leftbar-row__action-button",attrs:{"data-qa":"dt-recipe-leftbar-row-action-call-button",circle:!0,size:"xs",kind:"inverted","aria-label":e.callButtonTooltip},on:{focus:function(n){e.actionFocused=!0},blur:function(n){e.actionFocused=!1},click:function(n){return n.stopPropagation(),e.$emit("call",n)}},scopedSlots:e._u([{key:"icon",fn:function(){return[t("dt-icon-phone",{attrs:{size:"200"}})]},proxy:!0}],null,!1,2193255039)})]},proxy:!0}],null,!1,1396332550)})],1):e._e()],1):e._e()])},T=[],R=f.n(y,g,T,!1,null,null);const m=R.exports;exports.default=m;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("./general-row-constants.cjs"),c=require("@dialpad/dialtone-icons/vue2"),p=require("../emoji-text-wrapper/emoji-text-wrapper.cjs"),_=require("./leftbar-general-row-icon.cjs"),h=require("../../common/utils/index.cjs"),f=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),b=require("../badge/badge.cjs"),C=require("../button/button.cjs"),w=require("../tooltip/tooltip.cjs"),y={name:"DtRecipeGeneralRow",components:{DtEmojiTextWrapper:p.default,DtBadge:b.default,DtButton:C.default,DtTooltip:w.default,DtIconPhone:c.DtIconPhone,DtIconWaveform:c.DtIconWaveform,DtRecipeLeftbarGeneralRowIcon:_.default},inheritAttrs:!1,props:{type:{type:String,default:"inbox",validator:a=>Object.values(r.LEFTBAR_GENERAL_ROW_TYPES).includes(a)},ariaLabel:{type:String,default:""},description:{type:String,required:!0},color:{type:String,default:null,validator:a=>Object.keys(r.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(a)},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:a=>r.LEFTBAR_GENERAL_ROW_ICON_SIZES.includes(a)}},emits:["click","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 r.LEFTBAR_GENERAL_ROW_TYPES.CHANNELS:if(this.hasUnreads)return"channel unread";break;case r.LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL:if(this.hasUnreads)return"locked channel unread";break}return this.type},getAriaLabel(){return this.ariaLabel?this.ariaLabel:h.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(this.$el),this.adjustLabelWidth()},beforeDestroy:function(){this.resizeObserver.disconnect()},methods:{validateProps(){this.type===r.LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER&&!Object.keys(r.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)&&console.error(r.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR)},adjustLabelWidth(){var o,i,s,l,d,u;const a=((i=(o=this.$el)==null?void 0:o.querySelector(".d-recipe-leftbar-row__primary"))==null?void 0:i.clientWidth)||0,e=((l=(s=this.$el)==null?void 0:s.querySelector(".d-recipe-leftbar-row__omega"))==null?void 0:l.clientWidth)||0,t=((u=(d=this.$el)==null?void 0:d.querySelector(".d-recipe-leftbar-row__alpha"))==null?void 0:u.clientWidth)||0,n=16;this.labelWidth=a-(e+t+n)+"px"}}};var g=function(){var e=this,t=e._self._c;return t("div",{class:e.leftbarGeneralRowClasses,attrs:{"data-qa":"dt-recipe-leftbar-row"}},[t("a",e._g(e._b({staticClass:"d-recipe-leftbar-row__primary",attrs:{"data-qa":"data-qa"in e.$attrs?e.$attrs["data-qa"]:"d-recipe-leftbar-row-link","aria-label":e.getAriaLabel,title:e.description,href:"href"in e.$attrs?e.$attrs.href:"javascript:void(0)"}},"a",e.$attrs,!1),e.$listeners),[t("div",{staticClass:"d-recipe-leftbar-row__alpha"},[e.isTyping?t("div",{staticClass:"d-recipe-leftbar-row__is-typing"},[t("span"),t("span"),t("span")]):e._t("left",function(){return[t("dt-recipe-leftbar-general-row-icon",{attrs:{type:e.getIcon,color:e.color,"icon-size":e.iconSize,"data-qa":"dt-recipe-leftbar-row-icon"}})]})],2),t("div",{staticClass:"d-recipe-leftbar-row__label",style:`flex-basis: ${e.labelWidth}`},[e._t("label",function(){return[t("dt-emoji-text-wrapper",{staticClass:"d-recipe-leftbar-row__description",attrs:{"data-qa":"dt-recipe-leftbar-row-description",size:"200"}},[e._v(" "+e._s(e.description)+" ")])]})],2)]),e.hasActions?t("div",{staticClass:"d-recipe-leftbar-row__omega"},[e.dndText?t("dt-tooltip",{attrs:{placement:"top",message:e.dndTextTooltip},scopedSlots:e._u([{key:"anchor",fn:function(){return[t("div",{ref:"d-recipe-leftbar-row-dnd",staticClass:"d-recipe-leftbar-row__dnd",attrs:{"data-qa":"dt-recipe-leftbar-row-dnd"}},[e._v(" "+e._s(e.dndText)+" ")])]},proxy:!0}],null,!1,3247296267)}):e._e(),e.activeVoiceChat?t("div",{staticClass:"d-recipe-leftbar-row__active-voice"},[t("dt-icon-waveform",{attrs:{size:"300"}})],1):e.showUnreadCount||e.showUnreadMentionCount?t("dt-tooltip",{attrs:{message:e.unreadCountTooltip,placement:"top"},scopedSlots:e._u([{key:"anchor",fn:function(){return[e.showUnreadCount?t("dt-badge",{class:["d-recipe-leftbar-row__unread-badge",{"d-recipe-leftbar-row__unread-count-badge":e.shouldApplyCustomStyleForCountBadge}],attrs:{kind:"count",type:"bulletin","data-qa":"dt-recipe-leftbar-row-unread-badge"}},[e._v(" "+e._s(e.unreadCount)+" ")]):e._e(),e.showUnreadMentionCount?t("dt-badge",{class:["d-recipe-leftbar-row__unread-badge",{"d-recipe-leftbar-row__unread-mention-count-badge":e.shouldApplyCustomStyleForCountBadge},{"d-recipe-leftbar-row__unread-mention-only-count-badge":e.shouldApplyCustomStyleForMentionOnly}],attrs:{kind:"count",type:"bulletin","data-qa":"dt-recipe-leftbar-row-unread-mention-badge"}},[e._v(" "+e._s(e.unreadMentionCount)+" ")]):e._e()]},proxy:!0}],null,!1,715135836)}):e._e(),e.hasCallButton?t("div",{staticClass:"d-recipe-leftbar-row__action",attrs:{"data-qa":"dt-recipe-leftbar-row-action"}},[t("dt-tooltip",{attrs:{message:e.callButtonTooltip,placement:"top"},scopedSlots:e._u([{key:"anchor",fn:function(){return[t("dt-button",{staticClass:"d-recipe-leftbar-row__action-button",attrs:{"data-qa":"dt-recipe-leftbar-row-action-call-button",circle:!0,size:"xs",kind:"inverted","aria-label":e.callButtonTooltip},on:{focus:function(n){e.actionFocused=!0},blur:function(n){e.actionFocused=!1},click:function(n){return n.stopPropagation(),e.$emit("call",n)}},scopedSlots:e._u([{key:"icon",fn:function(){return[t("dt-icon-phone",{attrs:{size:"200"}})]},proxy:!0}],null,!1,2193255039)})]},proxy:!0}],null,!1,1396332550)})],1):e._e()],1):e._e()])},T=[],R=f.n(y,g,T);const m=R.exports;exports.default=m;
 //# sourceMappingURL=general-row.cjs.map

package/dist/vue2/lib/general-row/general-row.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { DtIconPhone as f, DtIconWaveform as _ } from "@dialpad/dialtone-icons/v
 import b from "../emoji-text-wrapper/emoji-text-wrapper.js";
 import C from "./leftbar-general-row-icon.js";
 import { safeConcatStrings as y } from "../../common/utils/index.js";
-import { n as m } from "../../_plugin-vue2_normalizer-CeySl7Fu.js";
+import { n as m } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
 import w from "../badge/badge.js";
 import g from "../button/button.js";
 import v from "../tooltip/tooltip.js";
@@ -288,10 +288,7 @@ var S = function() {
 }, R = [], A = /* @__PURE__ */ m(
   T,
   S,
-  R,
-  !1,
-  null,
-  null
+  R
 );
 const q = A.exports;
 export {

package/dist/vue2/lib/general-row/general-row.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"general-row.js","sources":["../../../recipes/leftbar/general_row/general_row.vue"],"sourcesContent":["<template>\n <div\n :class=\"leftbarGeneralRowClasses\"\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=\"$attrs\"\n v-on=\"$listeners\"\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/vue2';\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 { safeConcatStrings } from '@/common/utils';\n\nexport default {\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 Native click event on the row itself\n \n @event click\n * @type {PointerEvent \| KeyboardEvent}\n /\n 'click',\n\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 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(this.$el);\n this.adjustLabelWidth();\n },\n\n beforeDestroy: function () {\n this.resizeObserver.disconnect();\n },\n\n methods: {\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 = this.$el?.querySelector('.d-recipe-leftbar-row__primary')?.clientWidth \|\| 0;\n const omegaWidth = this.$el?.querySelector('.d-recipe-leftbar-row__omega')?.clientWidth \|\| 0;\n const alphaWidth = 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","safeConcatStrings","LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR","labelWidth","_b","_a","omegaWidth","_d","_c","alphaWidth","_f","_e","paddings"],"mappings":"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"}
1	+ {"version":3,"file":"general-row.js","sources":["../../../recipes/leftbar/general_row/general_row.vue"],"sourcesContent":["<template>\n <div\n :class=\"leftbarGeneralRowClasses\"\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=\"$attrs\"\n v-on=\"$listeners\"\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/vue2';\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 { safeConcatStrings } from '@/common/utils';\n\nexport default {\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 Native click event on the row itself\n \n @event click\n * @type {PointerEvent \| KeyboardEvent}\n /\n 'click',\n\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 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(this.$el);\n this.adjustLabelWidth();\n },\n\n beforeDestroy: function () {\n this.resizeObserver.disconnect();\n },\n\n methods: {\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 = this.$el?.querySelector('.d-recipe-leftbar-row__primary')?.clientWidth \|\| 0;\n const omegaWidth = this.$el?.querySelector('.d-recipe-leftbar-row__omega')?.clientWidth \|\| 0;\n const alphaWidth = 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","safeConcatStrings","LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR","labelWidth","_b","_a","omegaWidth","_d","_c","alphaWidth","_f","_e","paddings"],"mappings":"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"}

package/dist/vue2/lib/general-row/leftbar-general-row-icon.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("@dialpad/dialtone-icons/vue2"),n=require("./general-row-constants.cjs"),c=require("../../_plugin-vue2_normalizer-yXi3ZRRD.cjs"),a=new Map([[n.LEFTBAR_GENERAL_ROW_TYPES.INBOX,t.DtIconInbox],[n.LEFTBAR_GENERAL_ROW_TYPES.CONTACTS,t.DtIconContacts],[n.LEFTBAR_GENERAL_ROW_TYPES.CHANNELS,t.DtIconHash],[n.LEFTBAR_GENERAL_ROW_TYPES.THREADS,t.DtIconThread],[n.LEFTBAR_GENERAL_ROW_TYPES.LAUNCHPAD,t.DtIconLayoutTemplate],[n.LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL,t.DtIconLock],[n.LEFTBAR_GENERAL_ROW_TYPES.QUICK_START,t.DtIconSparkle],[n.LEFTBAR_GENERAL_ROW_TYPES.COACHING_GROUP,t.DtIconUsers],[n.LEFTBAR_GENERAL_ROW_TYPES.COACHING_CENTER,t.DtIconExternalLink],["locked channel unread",t.DtIconLockFilled],["channel unread",t.DtIconHashBold],[n.LEFTBAR_GENERAL_ROW_TYPES.ASSIGNED,t.DtIconAtSign],[n.LEFTBAR_GENERAL_ROW_TYPES.DIGITAL,t.DtIconLaptop2],[n.LEFTBAR_GENERAL_ROW_TYPES.SCHEDULED,t.DtIconCalendarClock]]),E={name:"DtRecipeLeftbarGeneralRowIcon",components:{DtIconDialbot:t.DtIconDialbot,DtIconInbox:t.DtIconInbox,DtIconContacts:t.DtIconContacts,DtIconHash:t.DtIconHash,DtIconThread:t.DtIconThread,DtIconLayoutTemplate:t.DtIconLayoutTemplate,DtIconLock:t.DtIconLock,DtIconSparkle:t.DtIconSparkle,DtIconUsers:t.DtIconUsers,DtIconExternalLink:t.DtIconExternalLink,DtIconLockFilled:t.DtIconLockFilled,DtIconHashBold:t.DtIconHashBold,DtIconAtSign:t.DtIconAtSign,DtIconLaptop2:t.DtIconLaptop2,DtIconCalendarClock:t.DtIconCalendarClock},props:{type:{type:String,default:null},color:{type:String,default:null},iconSize:{type:String,default:"300"}},computed:{isIconType(){return![n.LEFTBAR_GENERAL_ROW_TYPES.DIALBOT,n.LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER].includes(this.type)},isContactCenterType(){return this.type===n.LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER},isDialbotType(){return this.type===n.LEFTBAR_GENERAL_ROW_TYPES.DIALBOT},getIconName(){return a.get(this.type)},contactCenterIconClasses(){return["d-recipe-leftbar-row__icon-cc",n.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS[this.color]]}}};var _=function(){var e=this,o=e._self._c;return e.isIconType?o(e.getIconName,{tag:"component",attrs:{size:e.iconSize}}):e.isContactCenterType?o("div",{class:e.contactCenterIconClasses}):e.isDialbotType?o("div",{staticClass:"d-recipe-leftbar-general-row__icon",attrs:{"data-qa":"general-row-dialbot"}},[o("dt-icon-dialbot",{attrs:{size:"500"}})],1):e._e()},r=[],l=c.n(E,_,r,!1,null,null);const s=l.exports;exports.default=s;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("@dialpad/dialtone-icons/vue2"),n=require("./general-row-constants.cjs"),c=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),a=new Map([[n.LEFTBAR_GENERAL_ROW_TYPES.INBOX,t.DtIconInbox],[n.LEFTBAR_GENERAL_ROW_TYPES.CONTACTS,t.DtIconContacts],[n.LEFTBAR_GENERAL_ROW_TYPES.CHANNELS,t.DtIconHash],[n.LEFTBAR_GENERAL_ROW_TYPES.THREADS,t.DtIconThread],[n.LEFTBAR_GENERAL_ROW_TYPES.LAUNCHPAD,t.DtIconLayoutTemplate],[n.LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL,t.DtIconLock],[n.LEFTBAR_GENERAL_ROW_TYPES.QUICK_START,t.DtIconSparkle],[n.LEFTBAR_GENERAL_ROW_TYPES.COACHING_GROUP,t.DtIconUsers],[n.LEFTBAR_GENERAL_ROW_TYPES.COACHING_CENTER,t.DtIconExternalLink],["locked channel unread",t.DtIconLockFilled],["channel unread",t.DtIconHashBold],[n.LEFTBAR_GENERAL_ROW_TYPES.ASSIGNED,t.DtIconAtSign],[n.LEFTBAR_GENERAL_ROW_TYPES.DIGITAL,t.DtIconLaptop2],[n.LEFTBAR_GENERAL_ROW_TYPES.SCHEDULED,t.DtIconCalendarClock]]),E={name:"DtRecipeLeftbarGeneralRowIcon",components:{DtIconDialbot:t.DtIconDialbot,DtIconInbox:t.DtIconInbox,DtIconContacts:t.DtIconContacts,DtIconHash:t.DtIconHash,DtIconThread:t.DtIconThread,DtIconLayoutTemplate:t.DtIconLayoutTemplate,DtIconLock:t.DtIconLock,DtIconSparkle:t.DtIconSparkle,DtIconUsers:t.DtIconUsers,DtIconExternalLink:t.DtIconExternalLink,DtIconLockFilled:t.DtIconLockFilled,DtIconHashBold:t.DtIconHashBold,DtIconAtSign:t.DtIconAtSign,DtIconLaptop2:t.DtIconLaptop2,DtIconCalendarClock:t.DtIconCalendarClock},props:{type:{type:String,default:null},color:{type:String,default:null},iconSize:{type:String,default:"300"}},computed:{isIconType(){return![n.LEFTBAR_GENERAL_ROW_TYPES.DIALBOT,n.LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER].includes(this.type)},isContactCenterType(){return this.type===n.LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER},isDialbotType(){return this.type===n.LEFTBAR_GENERAL_ROW_TYPES.DIALBOT},getIconName(){return a.get(this.type)},contactCenterIconClasses(){return["d-recipe-leftbar-row__icon-cc",n.LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS[this.color]]}}};var _=function(){var e=this,o=e._self._c;return e.isIconType?o(e.getIconName,{tag:"component",attrs:{size:e.iconSize}}):e.isContactCenterType?o("div",{class:e.contactCenterIconClasses}):e.isDialbotType?o("div",{staticClass:"d-recipe-leftbar-general-row__icon",attrs:{"data-qa":"general-row-dialbot"}},[o("dt-icon-dialbot",{attrs:{size:"500"}})],1):e._e()},r=[],R=c.n(E,_,r);const l=R.exports;exports.default=l;
 //# sourceMappingURL=leftbar-general-row-icon.cjs.map

package/dist/vue2/lib/general-row/leftbar-general-row-icon.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { DtIconDialbot as E, DtIconInbox as o, DtIconContacts as c, DtIconHash as r, DtIconThread as a, DtIconLayoutTemplate as s, DtIconLock as i, DtIconSparkle as l, DtIconUsers as p, DtIconExternalLink as C, DtIconLockFilled as I, DtIconHashBold as _, DtIconAtSign as T, DtIconLaptop2 as D, DtIconCalendarClock as d } from "@dialpad/dialtone-icons/vue2";
 import { LEFTBAR_GENERAL_ROW_TYPES as t, LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as A } from "./general-row-constants.js";
-import { n as N } from "../../_plugin-vue2_normalizer-CeySl7Fu.js";
-const u = /* @__PURE__ */ new Map([
+import { n as N } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
+const L = /* @__PURE__ */ new Map([
   [t.INBOX, o],
   [t.CONTACTS, c],
   [t.CHANNELS, r],
@@ -16,7 +16,7 @@ const u = /* @__PURE__ */ new Map([
   [t.ASSIGNED, T],
   [t.DIGITAL, D],
   [t.SCHEDULED, d]
-]), L = {
+]), R = {
   name: "DtRecipeLeftbarGeneralRowIcon",
   components: {
     DtIconDialbot: E,
@@ -60,7 +60,7 @@ const u = /* @__PURE__ */ new Map([
       return this.type === t.DIALBOT;
     },
     getIconName() {
-      return u.get(this.type);
+      return L.get(this.type);
     },
     contactCenterIconClasses() {
       return [
@@ -70,16 +70,13 @@ const u = /* @__PURE__ */ new Map([
     }
   }
 };
-var R = function() {
+var m = function() {
   var e = this, n = e._self._c;
   return e.isIconType ? n(e.getIconName, { tag: "component", attrs: { size: e.iconSize } }) : e.isContactCenterType ? n("div", { class: e.contactCenterIconClasses }) : e.isDialbotType ? n("div", { staticClass: "d-recipe-leftbar-general-row__icon", attrs: { "data-qa": "general-row-dialbot" } }, [n("dt-icon-dialbot", { attrs: { size: "500" } })], 1) : e._e();
-}, m = [], f = /* @__PURE__ */ N(
-  L,
+}, u = [], f = /* @__PURE__ */ N(
   R,
   m,
-  !1,
-  null,
-  null
+  u
 );
 const b = f.exports;
 export {

package/dist/vue2/lib/general-row/leftbar-general-row-icon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"leftbar-general-row-icon.js","sources":["../../../recipes/leftbar/general_row/leftbar_general_row_icon.vue"],"sourcesContent":["<template>\n <component\n :is=\"getIconName\"\n v-if=\"isIconType\"\n :size=\"iconSize\"\n />\n <div\n v-else-if=\"isContactCenterType\"\n :class=\"contactCenterIconClasses\"\n />\n <div\n v-else-if=\"isDialbotType\"\n class=\"d-recipe-leftbar-general-row__icon\"\n data-qa=\"general-row-dialbot\"\n >\n <dt-icon-dialbot\n size=\"500\"\n />\n </div>\n</template>\n\n<script>\nimport {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n} from '@dialpad/dialtone-icons/vue2';\nimport {\n LEFTBAR_GENERAL_ROW_TYPES as TYPES,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as COLORS,\n} from '@/recipes/leftbar/general_row/general_row_constants';\n\nconst typeToIcon = new Map([\n [TYPES.INBOX, DtIconInbox],\n [TYPES.CONTACTS, DtIconContacts],\n [TYPES.CHANNELS, DtIconHash],\n [TYPES.THREADS, DtIconThread],\n [TYPES.LAUNCHPAD, DtIconLayoutTemplate],\n [TYPES.LOCKED_CHANNEL, DtIconLock],\n [TYPES.QUICK_START, DtIconSparkle],\n [TYPES.COACHING_GROUP, DtIconUsers],\n [TYPES.COACHING_CENTER, DtIconExternalLink],\n ['locked channel unread', DtIconLockFilled],\n ['channel unread', DtIconHashBold],\n [TYPES.ASSIGNED, DtIconAtSign],\n [TYPES.DIGITAL, DtIconLaptop2],\n [TYPES.SCHEDULED, DtIconCalendarClock],\n]);\n\nexport default {\n name: 'DtRecipeLeftbarGeneralRowIcon',\n components: {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n },\n\n props: {\n type: {\n type: String,\n default: null,\n },\n\n color: {\n type: String,\n default: null,\n },\n\n iconSize: {\n type: String,\n default: '300',\n },\n },\n\n computed: {\n isIconType () {\n return ![TYPES.DIALBOT, TYPES.CONTACT_CENTER].includes(this.type);\n },\n\n isContactCenterType () {\n return this.type === TYPES.CONTACT_CENTER;\n },\n\n isDialbotType () {\n return this.type === TYPES.DIALBOT;\n },\n\n getIconName () {\n return typeToIcon.get(this.type);\n },\n\n contactCenterIconClasses () {\n return [\n 'd-recipe-leftbar-row__icon-cc',\n COLORS[this.color],\n ];\n },\n },\n};\n</script>\n"],"names":["typeToIcon","TYPES","DtIconInbox","DtIconContacts","DtIconHash","DtIconThread","DtIconLayoutTemplate","DtIconLock","DtIconSparkle","DtIconUsers","DtIconExternalLink","DtIconLockFilled","DtIconHashBold","DtIconAtSign","DtIconLaptop2","DtIconCalendarClock","_sfc_main","DtIconDialbot","COLORS"],"mappings":";;;AA4CA,MAAAA,IAAA,oBAAA,IAAA;AAAA,EACA,CAAAC,EAAA,OAAAC,CAAA;AAAA,EACA,CAAAD,EAAA,UAAAE,CAAA;AAAA,EACA,CAAAF,EAAA,UAAAG,CAAA;AAAA,EACA,CAAAH,EAAA,SAAAI,CAAA;AAAA,EACA,CAAAJ,EAAA,WAAAK,CAAA;AAAA,EACA,CAAAL,EAAA,gBAAAM,CAAA;AAAA,EACA,CAAAN,EAAA,aAAAO,CAAA;AAAA,EACA,CAAAP,EAAA,gBAAAQ,CAAA;AAAA,EACA,CAAAR,EAAA,iBAAAS,CAAA;AAAA,EACA,CAAA,yBAAAC,CAAA;AAAA,EACA,CAAA,kBAAAC,CAAA;AAAA,EACA,CAAAX,EAAA,UAAAY,CAAA;AAAA,EACA,CAAAZ,EAAA,SAAAa,CAAA;AAAA,EACA,CAAAb,EAAA,WAAAc,CAAA;AACA,CAAA,GAEAC,IAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,IACA,eAAAC;AAAA,IACA,aAAAf;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,aAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,qBAAAC;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,aAAA;AACA,aAAA,CAAA,CAAAd,EAAA,SAAAA,EAAA,cAAA,EAAA,SAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,sBAAA;AACA,aAAA,KAAA,SAAAA,EAAA;AAAA,IACA;AAAA,IAEA,gBAAA;AACA,aAAA,KAAA,SAAAA,EAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,aAAAD,EAAA,IAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,2BAAA;AACA,aAAA;AAAA,QACA;AAAA,QACAkB,EAAA,KAAA,KAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AACA~~;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"leftbar-general-row-icon.js","sources":["../../../recipes/leftbar/general_row/leftbar_general_row_icon.vue"],"sourcesContent":["<template>\n <component\n :is=\"getIconName\"\n v-if=\"isIconType\"\n :size=\"iconSize\"\n />\n <div\n v-else-if=\"isContactCenterType\"\n :class=\"contactCenterIconClasses\"\n />\n <div\n v-else-if=\"isDialbotType\"\n class=\"d-recipe-leftbar-general-row__icon\"\n data-qa=\"general-row-dialbot\"\n >\n <dt-icon-dialbot\n size=\"500\"\n />\n </div>\n</template>\n\n<script>\nimport {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n} from '@dialpad/dialtone-icons/vue2';\nimport {\n LEFTBAR_GENERAL_ROW_TYPES as TYPES,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as COLORS,\n} from '@/recipes/leftbar/general_row/general_row_constants';\n\nconst typeToIcon = new Map([\n [TYPES.INBOX, DtIconInbox],\n [TYPES.CONTACTS, DtIconContacts],\n [TYPES.CHANNELS, DtIconHash],\n [TYPES.THREADS, DtIconThread],\n [TYPES.LAUNCHPAD, DtIconLayoutTemplate],\n [TYPES.LOCKED_CHANNEL, DtIconLock],\n [TYPES.QUICK_START, DtIconSparkle],\n [TYPES.COACHING_GROUP, DtIconUsers],\n [TYPES.COACHING_CENTER, DtIconExternalLink],\n ['locked channel unread', DtIconLockFilled],\n ['channel unread', DtIconHashBold],\n [TYPES.ASSIGNED, DtIconAtSign],\n [TYPES.DIGITAL, DtIconLaptop2],\n [TYPES.SCHEDULED, DtIconCalendarClock],\n]);\n\nexport default {\n name: 'DtRecipeLeftbarGeneralRowIcon',\n components: {\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n },\n\n props: {\n type: {\n type: String,\n default: null,\n },\n\n color: {\n type: String,\n default: null,\n },\n\n iconSize: {\n type: String,\n default: '300',\n },\n },\n\n computed: {\n isIconType () {\n return ![TYPES.DIALBOT, TYPES.CONTACT_CENTER].includes(this.type);\n },\n\n isContactCenterType () {\n return this.type === TYPES.CONTACT_CENTER;\n },\n\n isDialbotType () {\n return this.type === TYPES.DIALBOT;\n },\n\n getIconName () {\n return typeToIcon.get(this.type);\n },\n\n contactCenterIconClasses () {\n return [\n 'd-recipe-leftbar-row__icon-cc',\n COLORS[this.color],\n ];\n },\n },\n};\n</script>\n"],"names":["typeToIcon","TYPES","DtIconInbox","DtIconContacts","DtIconHash","DtIconThread","DtIconLayoutTemplate","DtIconLock","DtIconSparkle","DtIconUsers","DtIconExternalLink","DtIconLockFilled","DtIconHashBold","DtIconAtSign","DtIconLaptop2","DtIconCalendarClock","_sfc_main","DtIconDialbot","COLORS"],"mappings":";;;AA4CA,MAAAA,IAAA,oBAAA,IAAA;AAAA,EACA,CAAAC,EAAA,OAAAC,CAAA;AAAA,EACA,CAAAD,EAAA,UAAAE,CAAA;AAAA,EACA,CAAAF,EAAA,UAAAG,CAAA;AAAA,EACA,CAAAH,EAAA,SAAAI,CAAA;AAAA,EACA,CAAAJ,EAAA,WAAAK,CAAA;AAAA,EACA,CAAAL,EAAA,gBAAAM,CAAA;AAAA,EACA,CAAAN,EAAA,aAAAO,CAAA;AAAA,EACA,CAAAP,EAAA,gBAAAQ,CAAA;AAAA,EACA,CAAAR,EAAA,iBAAAS,CAAA;AAAA,EACA,CAAA,yBAAAC,CAAA;AAAA,EACA,CAAA,kBAAAC,CAAA;AAAA,EACA,CAAAX,EAAA,UAAAY,CAAA;AAAA,EACA,CAAAZ,EAAA,SAAAa,CAAA;AAAA,EACA,CAAAb,EAAA,WAAAc,CAAA;AACA,CAAA,GAEAC,IAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,IACA,eAAAC;AAAA,IACA,aAAAf;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,aAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,qBAAAC;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,IAEA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,aAAA;AACA,aAAA,CAAA,CAAAd,EAAA,SAAAA,EAAA,cAAA,EAAA,SAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,sBAAA;AACA,aAAA,KAAA,SAAAA,EAAA;AAAA,IACA;AAAA,IAEA,gBAAA;AACA,aAAA,KAAA,SAAAA,EAAA;AAAA,IACA;AAAA,IAEA,cAAA;AACA,aAAAD,EAAA,IAAA,KAAA,IAAA;AAAA,IACA;AAAA,IAEA,2BAAA;AACA,aAAA;AAAA,QACA;AAAA,QACAkB,EAAA,KAAA,KAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;"}

package/dist/vue2/lib/group-row/group-row.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("@dialpad/dialtone-icons/vue2"),r=require("../../common/utils/index.cjs"),o=require("../../_plugin-vue2_normalizer-yXi3ZRRD.cjs"),a=require("../general-row/general-row.cjs"),u={name:"DtRecipeGroupRow",components:{DtIconUsers:n.DtIconUsers,DtRecipeGeneralRow:a.default},inheritAttrs:!1,props:{groupCountText:{type:String,default:""},names:{type:String,required:!0},unreadCount:{type:String,default:null},unreadMentionCount:{type:String,default:null},unreadCountTooltip:{type:String,default:null},hasUnreads:{type:Boolean,default:!1},selected:{type:Boolean,default:!1},isTyping:{type:Boolean,default:!1}},emits:["click"],computed:{ariaLabel(){return r.safeConcatStrings([this.groupCountText,this.names])}}};var s=function(){var e=this,t=e._self._c;return t("dt-recipe-general-row",e._g(e._b({attrs:{description:e.names,"aria-label":e.ariaLabel,"unread-count":e.unreadCount,"has-unreads":e.hasUnreads,"unread-count-tooltip":e.unreadCountTooltip,"unread-mention-count":e.unreadMentionCount,selected:e.selected,"is-typing":e.isTyping},scopedSlots:e._u([{key:"left",fn:function(){return[t("dt-icon-users",{attrs:{size:"300"}})]},proxy:!0}])},"dt-recipe-general-row",e.$attrs,!1),e.$listeners))},l=[],i=o.n(u,s,l,!1,null,null);const c=i.exports;exports.default=c;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("@dialpad/dialtone-icons/vue2"),r=require("../../common/utils/index.cjs"),o=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),a=require("../general-row/general-row.cjs"),s={name:"DtRecipeGroupRow",components:{DtIconUsers:n.DtIconUsers,DtRecipeGeneralRow:a.default},inheritAttrs:!1,props:{groupCountText:{type:String,default:""},names:{type:String,required:!0},unreadCount:{type:String,default:null},unreadMentionCount:{type:String,default:null},unreadCountTooltip:{type:String,default:null},hasUnreads:{type:Boolean,default:!1},selected:{type:Boolean,default:!1},isTyping:{type:Boolean,default:!1}},emits:["click"],computed:{ariaLabel(){return r.safeConcatStrings([this.groupCountText,this.names])}}};var u=function(){var e=this,t=e._self._c;return t("dt-recipe-general-row",e._g(e._b({attrs:{description:e.names,"aria-label":e.ariaLabel,"unread-count":e.unreadCount,"has-unreads":e.hasUnreads,"unread-count-tooltip":e.unreadCountTooltip,"unread-mention-count":e.unreadMentionCount,selected:e.selected,"is-typing":e.isTyping},scopedSlots:e._u([{key:"left",fn:function(){return[t("dt-icon-users",{attrs:{size:"300"}})]},proxy:!0}])},"dt-recipe-general-row",e.$attrs,!1),e.$listeners))},i=[],l=o.n(s,u,i);const c=l.exports;exports.default=c;
 //# sourceMappingURL=group-row.cjs.map

package/dist/vue2/lib/group-row/group-row.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { DtIconUsers as n } from "@dialpad/dialtone-icons/vue2";
 import { safeConcatStrings as r } from "../../common/utils/index.js";
-import { n as o } from "../../_plugin-vue2_normalizer-CeySl7Fu.js";
+import { n as o } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
 import a from "../general-row/general-row.js";
 const s = {
   name: "DtRecipeGroupRow",
@@ -83,18 +83,15 @@ const s = {
     }
   }
 };
-var u = function() {
+var i = function() {
   var e = this, t = e._self._c;
   return t("dt-recipe-general-row", e._g(e._b({ attrs: { description: e.names, "aria-label": e.ariaLabel, "unread-count": e.unreadCount, "has-unreads": e.hasUnreads, "unread-count-tooltip": e.unreadCountTooltip, "unread-mention-count": e.unreadMentionCount, selected: e.selected, "is-typing": e.isTyping }, scopedSlots: e._u([{ key: "left", fn: function() {
     return [t("dt-icon-users", { attrs: { size: "300" } })];
   }, proxy: !0 }]) }, "dt-recipe-general-row", e.$attrs, !1), e.$listeners));
-}, i = [], l = /* @__PURE__ */ o(
+}, u = [], l = /* @__PURE__ */ o(
   s,
-  u,
   i,
-  !1,
-  null,
-  null
+  u
 );
 const _ = l.exports;
 export {

package/dist/vue2/lib/group-row/group-row.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"group-row.js","sources":["../../../recipes/leftbar/group_row/group_row.vue"],"sourcesContent":["<template>\n <dt-recipe-general-row\n :description=\"names\"\n :aria-label=\"ariaLabel\"\n :unread-count=\"unreadCount\"\n :has-unreads=\"hasUnreads\"\n :unread-count-tooltip=\"unreadCountTooltip\"\n :unread-mention-count=\"unreadMentionCount\"\n :selected=\"selected\"\n :is-typing=\"isTyping\"\n v-bind=\"$attrs\"\n v-on=\"$listeners\"\n >\n <template #left>\n <dt-icon-users\n size=\"300\"\n />\n </template>\n </dt-recipe-general-row>\n</template>\n\n<script>\nimport { DtRecipeGeneralRow } from '@/recipes/leftbar/general_row';\nimport { DtIconUsers } from '@dialpad/dialtone-icons/vue2';\nimport { safeConcatStrings } from '@/common/utils';\n\nexport default {\n name: 'DtRecipeGroupRow',\n\n components: {\n DtIconUsers,\n DtRecipeGeneralRow,\n },\n\n inheritAttrs: false,\n\n props: {\n\n /*\n Screen reader will read out the number of users in the group using this text. Ex: \"2 users\"\n /\n groupCountText: {\n type: String,\n default: '',\n },\n\n /\n Names of the group members\n /\n names: {\n type: String,\n required: true,\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: 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 Determines if the row is selected\n /\n selected: {\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 emits: [\n /\n Native click event on the row itself\n \n @event click\n * @type {PointerEvent \| KeyboardEvent}\n */\n 'click',\n ],\n\n computed: {\n ariaLabel () {\n return safeConcatStrings([this.groupCountText, this.names]);\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtIconUsers","DtRecipeGeneralRow","safeConcatStrings"],"mappings":";;;;AA0BA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,aAAAC;AAAA,IACA,oBAAAC;AAAA,EACA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,YAAA;AACA,aAAAC,EAAA,CAAA,KAAA,gBAAA,KAAA,KAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA~~;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"group-row.js","sources":["../../../recipes/leftbar/group_row/group_row.vue"],"sourcesContent":["<template>\n <dt-recipe-general-row\n :description=\"names\"\n :aria-label=\"ariaLabel\"\n :unread-count=\"unreadCount\"\n :has-unreads=\"hasUnreads\"\n :unread-count-tooltip=\"unreadCountTooltip\"\n :unread-mention-count=\"unreadMentionCount\"\n :selected=\"selected\"\n :is-typing=\"isTyping\"\n v-bind=\"$attrs\"\n v-on=\"$listeners\"\n >\n <template #left>\n <dt-icon-users\n size=\"300\"\n />\n </template>\n </dt-recipe-general-row>\n</template>\n\n<script>\nimport { DtRecipeGeneralRow } from '@/recipes/leftbar/general_row';\nimport { DtIconUsers } from '@dialpad/dialtone-icons/vue2';\nimport { safeConcatStrings } from '@/common/utils';\n\nexport default {\n name: 'DtRecipeGroupRow',\n\n components: {\n DtIconUsers,\n DtRecipeGeneralRow,\n },\n\n inheritAttrs: false,\n\n props: {\n\n /*\n Screen reader will read out the number of users in the group using this text. Ex: \"2 users\"\n /\n groupCountText: {\n type: String,\n default: '',\n },\n\n /\n Names of the group members\n /\n names: {\n type: String,\n required: true,\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: 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 Determines if the row is selected\n /\n selected: {\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 emits: [\n /\n Native click event on the row itself\n \n @event click\n * @type {PointerEvent \| KeyboardEvent}\n */\n 'click',\n ],\n\n computed: {\n ariaLabel () {\n return safeConcatStrings([this.groupCountText, this.names]);\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtIconUsers","DtRecipeGeneralRow","safeConcatStrings"],"mappings":";;;;AA0BA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,aAAAC;AAAA,IACA,oBAAAC;AAAA,EACA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,YAAA;AACA,aAAAC,EAAA,CAAA,KAAA,gBAAA,KAAA,KAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;"}

package/dist/vue2/lib/grouped-chip/grouped-chip.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("../../_plugin-vue2_normalizer-yXi3ZRRD.cjs"),n=require("../chip/chip.cjs"),i={name:"DtRecipeGroupedChip",components:{DtChip:n.default},computed:{}};var o=function(){var t=this,e=t._self._c;return e("div",{staticClass:"d-recipe-grouped-chip",attrs:{"data-qa":"dt-recipe-grouped-chip"}},[e("dt-chip",{staticClass:"d-recipe-grouped-chip__content d-recipe-grouped-chip__content-left",attrs:{"hide-close":!0,interactive:!1,size:"xs","grouped-chip":!0},scopedSlots:t._u([t.$slots.leftIcon?{key:"icon",fn:function(){return[t.$slots.leftIcon?e("div",{attrs:{"data-qa":"left-grouped-chip-icon"}},[t._t("leftIcon")],2):t._e()]},proxy:!0}:null,{key:"default",fn:function(){return[t.$slots.leftContent?e("div",{attrs:{"data-qa":"left-grouped-chip-content"}},[t._t("leftContent")],2):t._e()]},proxy:!0}],null,!0)}),e("dt-chip",{staticClass:"d-recipe-grouped-chip__content d-recipe-grouped-chip__content-right",attrs:{"hide-close":!0,interactive:!1,size:"xs","grouped-chip":!0},scopedSlots:t._u([{key:"icon",fn:function(){return[t.$slots.rightIcon?e("div",{attrs:{"data-qa":"right-grouped-chip-icon"}},[t._t("rightIcon")],2):t._e()]},proxy:!0},{key:"default",fn:function(){return[t.$slots.rightContent?e("div",{attrs:{"data-qa":"right-grouped-chip-content"}},[t._t("rightContent")],2):t._e()]},proxy:!0}],null,!0)})],1)},c=[],s=r.n(i,o,c,!1,null,null);const u=s.exports;exports.default=u;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),n=require("../chip/chip.cjs"),i={name:"DtRecipeGroupedChip",components:{DtChip:n.default},computed:{}};var o=function(){var t=this,e=t._self._c;return e("div",{staticClass:"d-recipe-grouped-chip",attrs:{"data-qa":"dt-recipe-grouped-chip"}},[e("dt-chip",{staticClass:"d-recipe-grouped-chip__content d-recipe-grouped-chip__content-left",attrs:{"hide-close":!0,interactive:!1,size:"xs","grouped-chip":!0},scopedSlots:t._u([t.$slots.leftIcon?{key:"icon",fn:function(){return[t.$slots.leftIcon?e("div",{attrs:{"data-qa":"left-grouped-chip-icon"}},[t._t("leftIcon")],2):t._e()]},proxy:!0}:null,{key:"default",fn:function(){return[t.$slots.leftContent?e("div",{attrs:{"data-qa":"left-grouped-chip-content"}},[t._t("leftContent")],2):t._e()]},proxy:!0}],null,!0)}),e("dt-chip",{staticClass:"d-recipe-grouped-chip__content d-recipe-grouped-chip__content-right",attrs:{"hide-close":!0,interactive:!1,size:"xs","grouped-chip":!0},scopedSlots:t._u([{key:"icon",fn:function(){return[t.$slots.rightIcon?e("div",{attrs:{"data-qa":"right-grouped-chip-icon"}},[t._t("rightIcon")],2):t._e()]},proxy:!0},{key:"default",fn:function(){return[t.$slots.rightContent?e("div",{attrs:{"data-qa":"right-grouped-chip-content"}},[t._t("rightContent")],2):t._e()]},proxy:!0}],null,!0)})],1)},c=[],s=r.n(i,o,c);const u=s.exports;exports.default=u;
 //# sourceMappingURL=grouped-chip.cjs.map

package/dist/vue2/lib/grouped-chip/grouped-chip.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { n as r } from "../../_plugin-vue2_normalizer-CeySl7Fu.js";
+import { n as r } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
 import n from "../chip/chip.js";
 const o = {
   name: "DtRecipeGroupedChip",
@@ -21,13 +21,10 @@ var c = function() {
 }, i = [], p = /* @__PURE__ */ r(
   o,
   c,
-  i,
-  !1,
-  null,
-  null
+  i
 );
-const d = p.exports;
+const u = p.exports;
 export {
-  d as default
+  u as default
 };
 //# sourceMappingURL=grouped-chip.js.map

package/dist/vue2/lib/grouped-chip/grouped-chip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"grouped-chip.js","sources":["../../../recipes/chips/grouped_chip/grouped_chip.vue"],"sourcesContent":["<template>\n <div\n data-qa=\"dt-recipe-grouped-chip\"\n class=\"d-recipe-grouped-chip\"\n >\n <dt-chip\n :hide-close=\"true\"\n :interactive=\"false\"\n size=\"xs\"\n :grouped-chip=\"true\"\n class=\"d-recipe-grouped-chip__content d-recipe-grouped-chip__content-left\"\n >\n <template\n v-if=\"$slots.leftIcon\"\n #icon\n >\n <!-- @slot Slot for left chip icon information -->\n <div\n v-if=\"$slots.leftIcon\"\n data-qa=\"left-grouped-chip-icon\"\n >\n <slot name=\"leftIcon\" />\n </div>\n </template>\n <template #default>\n <div\n v-if=\"$slots.leftContent\"\n data-qa=\"left-grouped-chip-content\"\n >\n <!-- @slot Slot for left chip content information -->\n <slot name=\"leftContent\" />\n </div>\n </template>\n </dt-chip>\n\n <!-- Right side split chip -->\n <dt-chip\n :hide-close=\"true\"\n :interactive=\"false\"\n size=\"xs\"\n :grouped-chip=\"true\"\n class=\"d-recipe-grouped-chip__content d-recipe-grouped-chip__content-right\"\n >\n <template #icon>\n <div\n v-if=\"$slots.rightIcon\"\n data-qa=\"right-grouped-chip-icon\"\n >\n <!-- @slot Slot for right chip content information -->\n <slot name=\"rightIcon\" />\n </div>\n </template>\n <template #default>\n <div\n v-if=\"$slots.rightContent\"\n data-qa=\"right-grouped-chip-content\"\n >\n <!-- @slot Slot for right chip content information -->\n <slot name=\"rightContent\" />\n </div>\n </template>\n </dt-chip>\n </div>\n</template>\n\n<script>\nimport { DtChip } from '@/components/chip';\n\nexport default {\n name: 'DtRecipeGroupedChip',\n\n components: {\n DtChip,\n },\n\n computed: {},\n};\n</script>\n"],"names":["_sfc_main","DtChip"],"mappings":";;AAoEA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,QAAAC;AAAA,EACA;AAAA,EAEA,UAAA,CAAA;AACA~~;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"grouped-chip.js","sources":["../../../recipes/chips/grouped_chip/grouped_chip.vue"],"sourcesContent":["<template>\n <div\n data-qa=\"dt-recipe-grouped-chip\"\n class=\"d-recipe-grouped-chip\"\n >\n <dt-chip\n :hide-close=\"true\"\n :interactive=\"false\"\n size=\"xs\"\n :grouped-chip=\"true\"\n class=\"d-recipe-grouped-chip__content d-recipe-grouped-chip__content-left\"\n >\n <template\n v-if=\"$slots.leftIcon\"\n #icon\n >\n <!-- @slot Slot for left chip icon information -->\n <div\n v-if=\"$slots.leftIcon\"\n data-qa=\"left-grouped-chip-icon\"\n >\n <slot name=\"leftIcon\" />\n </div>\n </template>\n <template #default>\n <div\n v-if=\"$slots.leftContent\"\n data-qa=\"left-grouped-chip-content\"\n >\n <!-- @slot Slot for left chip content information -->\n <slot name=\"leftContent\" />\n </div>\n </template>\n </dt-chip>\n\n <!-- Right side split chip -->\n <dt-chip\n :hide-close=\"true\"\n :interactive=\"false\"\n size=\"xs\"\n :grouped-chip=\"true\"\n class=\"d-recipe-grouped-chip__content d-recipe-grouped-chip__content-right\"\n >\n <template #icon>\n <div\n v-if=\"$slots.rightIcon\"\n data-qa=\"right-grouped-chip-icon\"\n >\n <!-- @slot Slot for right chip content information -->\n <slot name=\"rightIcon\" />\n </div>\n </template>\n <template #default>\n <div\n v-if=\"$slots.rightContent\"\n data-qa=\"right-grouped-chip-content\"\n >\n <!-- @slot Slot for right chip content information -->\n <slot name=\"rightContent\" />\n </div>\n </template>\n </dt-chip>\n </div>\n</template>\n\n<script>\nimport { DtChip } from '@/components/chip';\n\nexport default {\n name: 'DtRecipeGroupedChip',\n\n components: {\n DtChip,\n },\n\n computed: {},\n};\n</script>\n"],"names":["_sfc_main","DtChip"],"mappings":";;AAoEA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,QAAAC;AAAA,EACA;AAAA,EAEA,UAAA,CAAA;AACA;;;;;;;;;;;;;;;;;;"}

package/dist/vue2/lib/hovercard/hovercard.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../common/utils/index.cjs"),l=require("../../_plugin-vue2_normalizer-yXi3ZRRD.cjs"),i=require("../popover/popover.cjs"),o=require("../tooltip/tooltip-constants.cjs"),a=require("../popover/popover-constants.cjs"),u={name:"DtHovercard",components:{DtPopover:i.default},props:{open:{type:Boolean,default:null},transition:{type:Boolean,default:!1},fallbackPlacements:{type:Array,default:()=>["auto"]},placement:{type:String,default:"top-start",validator(t){return o.TOOLTIP_DIRECTIONS.includes(t)}},padding:{type:String,default:"large",validator:t=>Object.keys(a.POPOVER_PADDING_CLASSES).some(e=>e===t)},offset:{type:Array,default:()=>[0,16]},id:{type:String,default(){return s.getUniqueString()}},headerClass:{type:[String,Array,Object],default:""},footerClass:{type:[String,Array,Object],default:""},dialogClass:{type:[String,Array,Object],default:""},contentClass:{type:[String,Array,Object],default:""},appendTo:{type:[HTMLElement,String],default:"body",validator:t=>a.POPOVER_APPEND_TO_VALUES.includes(t)||t instanceof HTMLElement},enterDelay:{type:Number,default:o.TOOLTIP_DELAY_MS},leaveDelay:{type:Number,default:o.TOOLTIP_DELAY_MS}},emits:["opened"],data(){return{hovercardOpen:this.open,anchorEl:null,observer:null,inTimer:null,outTimer:null}},watch:{open:{handler:function(t){this.hovercardOpen=t},immediate:!0}},mounted(){this.$nextTick(()=>{var t,e,r;this.anchorEl=(r=(e=(t=this.$refs.popover)==null?void 0:t.$refs)==null?void 0:e.anchor)==null?void 0:r.firstElementChild,this.observer=new MutationObserver(()=>{this.anchorEl&&!this.anchorEl.isConnected&&(this.hovercardOpen=!1)}),this.observer.observe(document.body,{childList:!0,subtree:!0})})},beforeDestroy(){this.observer&&this.observer.disconnect(),clearTimeout(this.inTimer),clearTimeout(this.outTimer)},methods:{setInTimer(){this.inTimer=setTimeout(()=>{this.hovercardOpen=!0},this.enterDelay)},setOutTimer(){this.outTimer=setTimeout(()=>{this.hovercardOpen=!1},this.leaveDelay)},onMouseEnter(){this.open===null&&(clearTimeout(this.outTimer),this.setInTimer())},onMouseLeave(){this.open===null&&(clearTimeout(this.inTimer),this.setOutTimer())}}};var c=function(){var e=this,r=e._self._c;return r("dt-popover",{ref:"popover",attrs:{id:e.id,open:e.hovercardOpen,placement:e.placement,"content-class":e.contentClass,"dialog-class":e.dialogClass,"fallback-placements":e.fallbackPlacements,padding:e.padding,transition:e.transition?"fade":null,offset:e.offset,modal:!1,"initial-focus-element":"none","header-class":e.headerClass,"footer-class":e.footerClass,"append-to":e.appendTo,"data-qa":"dt-hovercard","enter-delay":e.enterDelay,"leave-delay":e.leaveDelay},on:{opened:n=>e.$emit("opened",n),"mouseenter-popover":e.onMouseEnter,"mouseleave-popover":e.onMouseLeave,"mouseenter-popover-anchor":e.onMouseEnter,"mouseleave-popover-anchor":e.onMouseLeave},scopedSlots:e._u([{key:"anchor",fn:function({attrs:n}){return[e._t("anchor",null,null,n)]}},{key:"content",fn:function(){return[e._t("content")]},proxy:!0},{key:"headerContent",fn:function(){return[e._t("headerContent")]},proxy:!0},{key:"footerContent",fn:function(){return[e._t("footerContent")]},proxy:!0}],null,!0)})},d=[],p=l.n(u,c,d,!1,null,null);const f=p.exports;exports.default=f;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../common/utils/index.cjs"),i=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),l=require("../popover/popover.cjs"),o=require("../tooltip/tooltip-constants.cjs"),a=require("../popover/popover-constants.cjs"),u={name:"DtHovercard",components:{DtPopover:l.default},props:{open:{type:Boolean,default:null},transition:{type:Boolean,default:!1},fallbackPlacements:{type:Array,default:()=>["auto"]},placement:{type:String,default:"top-start",validator(t){return o.TOOLTIP_DIRECTIONS.includes(t)}},padding:{type:String,default:"large",validator:t=>Object.keys(a.POPOVER_PADDING_CLASSES).some(e=>e===t)},offset:{type:Array,default:()=>[0,16]},id:{type:String,default(){return s.getUniqueString()}},headerClass:{type:[String,Array,Object],default:""},footerClass:{type:[String,Array,Object],default:""},dialogClass:{type:[String,Array,Object],default:""},contentClass:{type:[String,Array,Object],default:""},appendTo:{type:[HTMLElement,String],default:"body",validator:t=>a.POPOVER_APPEND_TO_VALUES.includes(t)||t instanceof HTMLElement},enterDelay:{type:Number,default:o.TOOLTIP_DELAY_MS},leaveDelay:{type:Number,default:o.TOOLTIP_DELAY_MS}},emits:["opened"],data(){return{hovercardOpen:this.open,anchorEl:null,observer:null,inTimer:null,outTimer:null}},watch:{open:{handler:function(t){this.hovercardOpen=t},immediate:!0}},mounted(){this.$nextTick(()=>{var t,e,r;this.anchorEl=(r=(e=(t=this.$refs.popover)==null?void 0:t.$refs)==null?void 0:e.anchor)==null?void 0:r.firstElementChild,this.observer=new MutationObserver(()=>{this.anchorEl&&!this.anchorEl.isConnected&&(this.hovercardOpen=!1)}),this.observer.observe(document.body,{childList:!0,subtree:!0})})},beforeDestroy(){this.observer&&this.observer.disconnect(),clearTimeout(this.inTimer),clearTimeout(this.outTimer)},methods:{setInTimer(){this.inTimer=setTimeout(()=>{this.hovercardOpen=!0},this.enterDelay)},setOutTimer(){this.outTimer=setTimeout(()=>{this.hovercardOpen=!1},this.leaveDelay)},onMouseEnter(){this.open===null&&(clearTimeout(this.outTimer),this.setInTimer())},onMouseLeave(){this.open===null&&(clearTimeout(this.inTimer),this.setOutTimer())}}};var c=function(){var e=this,r=e._self._c;return r("dt-popover",{ref:"popover",attrs:{id:e.id,open:e.hovercardOpen,placement:e.placement,"content-class":e.contentClass,"dialog-class":e.dialogClass,"fallback-placements":e.fallbackPlacements,padding:e.padding,transition:e.transition?"fade":null,offset:e.offset,modal:!1,"initial-focus-element":"none","header-class":e.headerClass,"footer-class":e.footerClass,"append-to":e.appendTo,"data-qa":"dt-hovercard","enter-delay":e.enterDelay,"leave-delay":e.leaveDelay},on:{opened:n=>e.$emit("opened",n),"mouseenter-popover":e.onMouseEnter,"mouseleave-popover":e.onMouseLeave,"mouseenter-popover-anchor":e.onMouseEnter,"mouseleave-popover-anchor":e.onMouseLeave},scopedSlots:e._u([{key:"anchor",fn:function({attrs:n}){return[e._t("anchor",null,null,n)]}},{key:"content",fn:function(){return[e._t("content")]},proxy:!0},{key:"headerContent",fn:function(){return[e._t("headerContent")]},proxy:!0},{key:"footerContent",fn:function(){return[e._t("footerContent")]},proxy:!0}],null,!0)})},d=[],p=i.n(u,c,d);const f=p.exports;exports.default=f;
 //# sourceMappingURL=hovercard.cjs.map