npm - @dialpad/dialtone-vue - Versions diffs - 3.220.0-next.5 → 3.220.0 - Mend

@dialpad/dialtone-vue 3.220.0-next.5 → 3.220.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 (2542) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"feed-item-row.cjs","names":[],"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 #start>\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=\"hasAttachmentContent\"\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 #blockEnd>\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>\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/LazyShow';\nimport { DtListItem } from '@/components/ListItem';\nimport { DtBadge } from '@/components/Badge';\nimport Modal from '@/common/mixins/modal';\nimport { DtIconUser } from '@dialpad/dialtone-icons/vue';\nimport { hasSlotContent } from '@/common/utils';\n\nexport default {\n compatConfig: { MODE: 3 },\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 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 hasAttachmentContent () {\n return hasSlotContent(this.$slots.attachment);\n },\n },\n\n watch: {\n state: {\n immediate: true,\n handler: function (newState) {\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"],"mappings":"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"}
1	+ {"version":3,"file":"feed-item-row.cjs","names":[],"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=\"hasAttachmentContent\"\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>\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/vue3';\nimport { hasSlotContent } from '@/common/utils';\n\nexport default {\n compatConfig: { MODE: 3 },\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 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 hasAttachmentContent () {\n return hasSlotContent(this.$slots.attachment);\n },\n },\n\n watch: {\n state: {\n immediate: true,\n handler: function (newState) {\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"],"mappings":"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"}

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

@@ -3,11 +3,11 @@ import { t } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
 import n from "../../common/mixins/modal.js";
 import r from "../avatar/avatar.js";
 import i from "../badge/badge.js";
-import a from "../lazyshow/lazyshow.js";
-import o from "../listitem/listitem.js";
+import a from "../lazy-show/lazy-show.js";
+import o from "../list-item/list-item.js";
 import { DEFAULT_FEED_ROW_STATE as s, FEED_ROW_STATE_BACKGROUND_COLOR as c } from "./feed-item-row-constants.js";
 import { createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createSlots as p, createVNode as m, mergeProps as h, openBlock as g, renderSlot as _, resolveComponent as v, toDisplayString as y, toHandlers as b, vShow as x, withCtx as S, withDirectives as C } from "vue";
-import { DtIconUser as w } from "@dialpad/dialtone-icons/vue";
+import { DtIconUser as w } from "@dialpad/dialtone-icons/vue3";
 //#region recipes/conversation_view/feed_item_row/feed_item_row.vue
 var T = {
 	compatConfig: { MODE: 3 },
@@ -153,7 +153,7 @@ function I(e, t, n, r, i, a) {
 		class: a.listItemClasses,
 		"data-qa": "dt-recipe-feed-item-row"
 	}, b(a.feedListeners)), {
-		start: S(() => [n.showHeader ? (g(), d("div", E, [_(e.$slots, "avatar", {}, () => [m(s, {
+		left: S(() => [n.showHeader ? (g(), d("div", E, [_(e.$slots, "avatar", {}, () => [m(s, {
 			"full-name": n.displayName,
 			"image-src": n.avatarImageUrl,
 			"image-alt": "",
@@ -171,7 +171,7 @@ function I(e, t, n, r, i, a) {
 			class: "d-recipe-feed-item-row__left-time",
 			"data-qa": "dt-recipe-feed-item-row--left-time"
 		}, y(n.shortTime), 513)), [[x, n.isActive]])]),
-		blockEnd: S(() => [
+		bottom: S(() => [
 			e.$slots.reactions ? (g(), d("div", N, [_(e.$slots, "reactions")])) : u("", !0),
 			e.$slots.threading ? (g(), d("div", P, [_(e.$slots, "threading")])) : u("", !0),
 			C(f("div", F, [m(w, {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"feed-item-row.js","names":[],"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 #start>\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=\"hasAttachmentContent\"\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 #blockEnd>\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>\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/LazyShow';\nimport { DtListItem } from '@/components/ListItem';\nimport { DtBadge } from '@/components/Badge';\nimport Modal from '@/common/mixins/modal';\nimport { DtIconUser } from '@dialpad/dialtone-icons/vue';\nimport { hasSlotContent } from '@/common/utils';\n\nexport default {\n compatConfig: { MODE: 3 },\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 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 hasAttachmentContent () {\n return hasSlotContent(this.$slots.attachment);\n },\n },\n\n watch: {\n state: {\n immediate: true,\n handler: function (newState) {\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"],"mappings":"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"}
1	+ {"version":3,"file":"feed-item-row.js","names":[],"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=\"hasAttachmentContent\"\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>\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/vue3';\nimport { hasSlotContent } from '@/common/utils';\n\nexport default {\n compatConfig: { MODE: 3 },\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 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 hasAttachmentContent () {\n return hasSlotContent(this.$slots.attachment);\n },\n },\n\n watch: {\n state: {\n immediate: true,\n handler: function (newState) {\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"],"mappings":"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"}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"general-row.cjs","names":[],"sources":["../../../recipes/leftbar/general_row/general_row.vue"],"sourcesContent":["<template>\n <div\n :class=\"[leftbarGeneralRowClasses, $attrs.class]\"\n :style=\"$attrs.style\"\n data-qa=\"dt-recipe-leftbar-row\"\n >\n <a\n class=\"d-recipe-leftbar-row__primary\"\n :data-qa=\"'data-qa' in $attrs ? $attrs['data-qa'] : 'd-recipe-leftbar-row-link'\"\n :aria-label=\"getAriaLabel\"\n :title=\"description\"\n :href=\"'href' in $attrs ? $attrs.href : 'javascript:void(0)'\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"generalRowListeners\"\n >\n <div\n class=\"d-recipe-leftbar-row__alpha\"\n >\n <div\n v-if=\"isTyping\"\n v-dt-tooltip=\"typingTooltip\"\n class=\"d-recipe-leftbar-row__is-typing\"\n >\n <span /><span /><span />\n </div>\n <!-- @slot Slot for start content -->\n <template v-else-if=\"$slots.start\">\n <slot name=\"start\" />\n </template>\n <!-- @slot @deprecated Use start -->\n <template v-else-if=\"$slots.left\">\n <slot name=\"left\" />\n </template>\n <template v-else>\n <div\n v-if=\"isDialbotType\"\n class=\"d-recipe-leftbar-general-row__icon\"\n data-qa=\"dt-recipe-leftbar-row-icon\"\n >\n <dt-icon-dialbot size=\"500\" />\n </div>\n <div\n v-else-if=\"isContactCenterType\"\n :class=\"contactCenterIconClasses\"\n data-qa=\"dt-recipe-leftbar-row-icon\"\n />\n <div\n v-else\n data-qa=\"dt-recipe-leftbar-row-icon\"\n >\n <dt-avatar\n icon-only\n :size=\"avatarSize\"\n >\n <template #icon=\"{ iconSize: slotIconSize }\">\n <component\n :is=\"getIconComponent\"\n :size=\"slotIconSize\"\n />\n </template>\n </dt-avatar>\n </div>\n </template>\n </div>\n <div\n class=\"d-recipe-leftbar-row__label\"\n :style=\"`flex-basis: ${labelWidth}`\"\n >\n <slot name=\"label\">\n <dt-emoji-text-wrapper\n class=\"d-recipe-leftbar-row__description\"\n data-qa=\"dt-recipe-leftbar-row-description\"\n size=\"200\"\n >\n {{ description }}\n </dt-emoji-text-wrapper>\n </slot>\n </div>\n </a>\n <div\n v-if=\"hasActions\"\n class=\"d-recipe-leftbar-row__omega\"\n >\n <dt-tooltip\n v-if=\"dndText\"\n placement=\"top\"\n :message=\"dndTextTooltip\"\n >\n <template #anchor>\n <div\n ref=\"d-recipe-leftbar-row-dnd\"\n class=\"d-recipe-leftbar-row__dnd\"\n data-qa=\"dt-recipe-leftbar-row-dnd\"\n >\n {{ dndText }}\n </div>\n </template>\n </dt-tooltip>\n <div\n v-if=\"activeVoiceChat\"\n v-dt-tooltip=\"activeVoiceChatTooltip\"\n class=\"d-recipe-leftbar-row__active-voice\"\n >\n <dt-icon-waveform\n size=\"300\"\n />\n </div>\n <dt-tooltip\n v-else-if=\"showUnreadCount \|\| showUnreadMentionCount\"\n :message=\"unreadCountTooltip\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-badge\n v-if=\"showUnreadCount\"\n kind=\"count\"\n type=\"bulletin\"\n data-qa=\"dt-recipe-leftbar-row-unread-badge\"\n :class=\"['d-recipe-leftbar-row__unread-badge', {\n 'd-recipe-leftbar-row__unread-count-badge':\n shouldApplyCustomStyleForCountBadge,\n }]\"\n >\n {{ unreadCount }}\n </dt-badge>\n <dt-badge\n v-if=\"showUnreadMentionCount\"\n kind=\"count\"\n type=\"bulletin\"\n data-qa=\"dt-recipe-leftbar-row-unread-mention-badge\"\n :class=\"['d-recipe-leftbar-row__unread-badge',\n { 'd-recipe-leftbar-row__unread-mention-count-badge': shouldApplyCustomStyleForCountBadge },\n { 'd-recipe-leftbar-row__unread-mention-only-count-badge': shouldApplyCustomStyleForMentionOnly },\n ]\"\n >\n {{ unreadMentionCount }}\n </dt-badge>\n </template>\n </dt-tooltip>\n <div\n v-if=\"hasCallButton\"\n class=\"d-recipe-leftbar-row__action\"\n data-qa=\"dt-recipe-leftbar-row-action\"\n >\n <dt-tooltip\n :message=\"callButtonTooltip\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n class=\"d-recipe-leftbar-row__action-button\"\n data-qa=\"dt-recipe-leftbar-row-action-call-button\"\n circle\n :size=\"100\"\n kind=\"inverted\"\n :aria-label=\"callButtonTooltip\"\n @focus=\"actionFocused = true\"\n @blur=\"actionFocused = false\"\n @click.stop=\"$emit('call', $event)\"\n >\n <template #icon>\n <dt-icon-phone\n size=\"200\"\n />\n </template>\n </dt-button>\n </template>\n </dt-tooltip>\n </div>\n </div>\n </div>\n</template>\n\n<script>\n/* eslint-disable max-lines /\nimport {\n LEFTBAR_GENERAL_ROW_TYPES,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR,\n LEFTBAR_GENERAL_ROW_ICON_SIZES,\n} from './general_row_constants';\nimport { DtBadge } from '@/components/Badge';\nimport {\n DtIconPhone,\n DtIconWaveform,\n DtIconDialbot,\n DtIconInbox,\n DtIconContacts,\n DtIconHash,\n DtIconThread,\n DtIconLayoutTemplate,\n DtIconLock,\n DtIconSparkle,\n DtIconUsers,\n DtIconExternalLink,\n DtIconLockFilled,\n DtIconHashBold,\n DtIconAtSign,\n DtIconLaptop2,\n DtIconCalendarClock,\n} from '@dialpad/dialtone-icons/vue';\nimport { DtButton } from '@/components/Button';\nimport { DtTooltip } from '@/components/Tooltip';\nimport { DtEmojiTextWrapper } from '@/components/EmojiTextWrapper';\nimport { DtAvatar } from '@/components/Avatar';\nimport DtRecipeLeftbarGeneralRowIcon from './leftbar_general_row_icon.vue';\nimport { extractVueListeners, safeConcatStrings, removeClassStyleAttrs, returnFirstEl } from '@/common/utils';\nimport { DialtoneLocalization } from '@/localization';\n\nconst TYPE_TO_ICON = new Map([\n [LEFTBAR_GENERAL_ROW_TYPES.INBOX, DtIconInbox],\n [LEFTBAR_GENERAL_ROW_TYPES.CONTACTS, DtIconContacts],\n [LEFTBAR_GENERAL_ROW_TYPES.CHANNELS, DtIconHash],\n [LEFTBAR_GENERAL_ROW_TYPES.THREADS, DtIconThread],\n [LEFTBAR_GENERAL_ROW_TYPES.LAUNCHPAD, DtIconLayoutTemplate],\n [LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL, DtIconLock],\n [LEFTBAR_GENERAL_ROW_TYPES.QUICK_START, DtIconSparkle],\n [LEFTBAR_GENERAL_ROW_TYPES.COACHING_GROUP, DtIconUsers],\n [LEFTBAR_GENERAL_ROW_TYPES.COACHING_CENTER, DtIconExternalLink],\n ['locked channel unread', DtIconLockFilled],\n ['channel unread', DtIconHashBold],\n [LEFTBAR_GENERAL_ROW_TYPES.ASSIGNED, DtIconAtSign],\n [LEFTBAR_GENERAL_ROW_TYPES.DIGITAL, DtIconLaptop2],\n [LEFTBAR_GENERAL_ROW_TYPES.SCHEDULED, DtIconCalendarClock],\n]);\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtRecipeGeneralRow',\n\n components: {\n DtEmojiTextWrapper,\n DtBadge,\n DtButton,\n DtTooltip,\n DtIconPhone,\n DtIconWaveform,\n DtIconDialbot,\n DtAvatar,\n DtRecipeLeftbarGeneralRowIcon,\n },\n\n inheritAttrs: false,\n\n props: {\n /\n Determines the icon to show.\n * If type is contact center, the color prop must be provided and will determine the color of the icon\n /\n type: {\n type: String,\n default: 'inbox',\n validator: (type) => {\n return Object.values(LEFTBAR_GENERAL_ROW_TYPES).includes(type);\n },\n },\n\n /\n Will be read out by a screen reader upon focus of this row. If not defined \"description\" will be read.\n /\n ariaLabel: {\n type: String,\n default: '',\n },\n\n /\n Text displayed next to the icon. Required. Even if you are overriding this field using the label slot\n * you still must input this as it will be displayed as the \"title\" attribute for the row.\n /\n description: {\n type: String,\n required: true,\n },\n\n /\n Determines the color of the contact center icon\n /\n color: {\n type: String,\n default: null,\n validator: (color) => {\n return Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(color);\n },\n },\n\n /\n The channel setting, either 'mention' or 'always'.\n * @values 'mention', 'always', null.\n /\n channelSetting: {\n type: String,\n default: null,\n },\n\n /\n Styles the row with an increased font weight to convey it has unreads. This must be true to see\n * the unread count badge.\n /\n hasUnreads: {\n type: Boolean,\n default: false,\n },\n\n /\n Number of unread messages\n /\n unreadCount: {\n type: String,\n default: null,\n },\n\n /\n Number of unread mention messages\n /\n unreadMentionCount: {\n type: String,\n default: null,\n },\n\n /\n Determines if the row is selected\n /\n selected: {\n type: Boolean,\n default: false,\n },\n\n /\n Gives a faded style to be used when muted\n /\n muted: {\n type: Boolean,\n default: false,\n },\n\n /\n Shows styling to represent an active voice chat. This will display over unreadCount.\n /\n activeVoiceChat: {\n type: Boolean,\n default: false,\n },\n\n /\n Acronym used to represent \"Do not Disturb\" state. If entered will display the entered text alongside\n * unreadCount.\n /\n dndText: {\n type: String,\n default: '',\n },\n\n /\n Whether the row should have a call button. Usually only applicable to individual contact rows.\n /\n hasCallButton: {\n type: Boolean,\n default: false,\n },\n\n /\n Shows an \"is typing\" animation over the avatar when true.\n /\n isTyping: {\n type: Boolean,\n default: false,\n },\n\n /\n Sets the size of the icon.\n /\n iconSize: {\n type: String,\n default: '300',\n validator: (size) => {\n return LEFTBAR_GENERAL_ROW_ICON_SIZES.includes(size);\n },\n },\n },\n\n emits: [\n /\n Call button clicked\n \n @event call\n * @type {PointerEvent \| KeyboardEvent}\n /\n 'call',\n ],\n\n data () {\n return {\n actionFocused: false,\n labelWidth: '100%',\n i18n: new DialtoneLocalization(),\n };\n },\n\n computed: {\n leftbarGeneralRowClasses () {\n return [\n 'd-recipe-leftbar-row',\n {\n 'd-recipe-leftbar-row--no-action': !this.hasCallButton,\n 'd-recipe-leftbar-row--has-unread': this.hasUnreads,\n 'd-recipe-leftbar-row__unread-count': this.showUnreadCount \|\| this.showUnreadMentionCount,\n 'd-recipe-leftbar-row--selected': this.selected,\n 'd-recipe-leftbar-row--muted': this.muted,\n 'd-recipe-leftbar-row--action-focused': this.actionFocused,\n },\n ];\n },\n\n getIcon () {\n switch (this.type) {\n case LEFTBAR_GENERAL_ROW_TYPES.CHANNELS:\n if (this.hasUnreads) return 'channel unread';\n break;\n case LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL:\n if (this.hasUnreads) return 'locked channel unread';\n break;\n }\n return this.type;\n },\n\n getIconComponent () {\n return TYPE_TO_ICON.get(this.getIcon);\n },\n\n isDialbotType () {\n return this.type === LEFTBAR_GENERAL_ROW_TYPES.DIALBOT;\n },\n\n isContactCenterType () {\n return this.type === LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER;\n },\n\n contactCenterIconClasses () {\n return [\n 'd-recipe-leftbar-row__icon-cc',\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS[this.color],\n ];\n },\n\n avatarSize () {\n // Map icon sizes to avatar sizes\n // iconSize '300' -> avatar size 300\n // iconSize '200' -> avatar size 200\n return this.iconSize;\n },\n\n generalRowListeners () {\n return extractVueListeners(this.$attrs);\n },\n\n getAriaLabel () {\n if (this.ariaLabel) return this.ariaLabel;\n\n return safeConcatStrings([\n this.typingTooltip,\n this.description,\n this.unreadCountTooltip,\n this.dndTextTooltip,\n this.activeVoiceChatTooltip,\n ]);\n },\n\n hasActions () {\n return this.dndText \|\| this.activeVoiceChat \|\| this.showUnreadCount \|\| this.hasCallButton \|\|\n this.showUnreadMentionCount;\n },\n\n showUnreadCount () {\n return !!this.unreadCount && this.hasUnreads;\n },\n\n showUnreadMentionCount () {\n return !!this.unreadMentionCount && this.hasUnreads;\n },\n\n hasUnreadCount () {\n return this.unreadCount !== null;\n },\n\n hasUnreadMentionCount () {\n return this.unreadMentionCount !== null;\n },\n\n shouldApplyCustomStyleForCountBadge () {\n return this.hasUnreadCount && this.hasUnreadMentionCount;\n },\n\n /\n When a channel in 'always' setting, meaning the user should see both unread count and unread mention count,\n * if there are only mention messages, we should apply the theme design tokens var(--dt-theme-mention-color-[background\|\|foreground]-strong).\n * @returns {boolean}\n */\n shouldApplyCustomStyleForMentionOnly () {\n return this.channelSetting === 'always' && !this.hasUnreadCount && this.hasUnreadMentionCount;\n },\n\n messageCount () {\n return isNaN(this.unreadCount)\n ? this.unreadCount\n : Number(this.unreadCount);\n },\n\n mentionCount () {\n return isNaN(this.unreadMentionCount)\n ? this.unreadMentionCount\n : Number(this.unreadMentionCount);\n },\n\n unreadCountTooltip () {\n return safeConcatStrings([\n this.unreadCount && this.i18n.$t('DIALTONE_UNREAD_MESSAGE_COUNT_TEXT', { unreadCount: this.messageCount }),\n this.unreadMentionCount && this.i18n.$t('DIALTONE_UNREAD_MENTION_COUNT_TEXT', { unreadCount: this.mentionCount }),\n ]);\n },\n\n dndTextTooltip () {\n return this.dndText && this.i18n.$t('DIALTONE_GENERAL_ROW_DND_TEXT_TOOLTIP');\n },\n\n activeVoiceChatTooltip () {\n return this.activeVoiceChat && this.i18n.$t('DIALTONE_GENERAL_ROW_ACTIVE_VOICE_CHAT_TEXT');\n },\n\n callButtonTooltip () {\n return this.i18n.$t('DIALTONE_GENERAL_ROW_CALL_BUTTON_TOOLTIP');\n },\n\n typingTooltip () {\n return this.isTyping && this.i18n.$t('DIALTONE_TYPING_TEXT');\n },\n },\n\n watch: {\n $props: {\n immediate: true,\n deep: true,\n async handler () {\n this.validateProps();\n await this.$nextTick();\n this.adjustLabelWidth();\n },\n },\n },\n\n mounted () {\n this.resizeObserver = new ResizeObserver(this.adjustLabelWidth);\n this.resizeObserver.observe(returnFirstEl(this.$el));\n this.adjustLabelWidth();\n },\n\n beforeUnmount: function () {\n this.resizeObserver.disconnect();\n },\n\n methods: {\n removeClassStyleAttrs,\n\n validateProps () {\n if (this.type === LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER &&\n !Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)) {\n console.error(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR);\n }\n },\n\n adjustLabelWidth () {\n const labelWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__primary')?.clientWidth \|\| 0;\n const omegaWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__omega')?.clientWidth \|\| 0;\n const alphaWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__alpha')?.clientWidth \|\| 0;\n const paddings = 16;\n this.labelWidth = labelWidth - (omegaWidth + alphaWidth + paddings) + 'px';\n },\n },\n};\n</script>\n"],"mappings":"wmBAiNA,IAAM,EAAe,IAAI,IAAI,CAC3B,CAAC,EAAA,0BAA0B,MAAO,EAAA,YAAY,CAC9C,CAAC,EAAA,0BAA0B,SAAU,EAAA,eAAe,CACpD,CAAC,EAAA,0BAA0B,SAAU,EAAA,WAAW,CAChD,CAAC,EAAA,0BAA0B,QAAS,EAAA,aAAa,CACjD,CAAC,EAAA,0BAA0B,UAAW,EAAA,qBAAqB,CAC3D,CAAC,EAAA,0BAA0B,eAAgB,EAAA,WAAW,CACtD,CAAC,EAAA,0BAA0B,YAAa,EAAA,cAAc,CACtD,CAAC,EAAA,0BAA0B,eAAgB,EAAA,YAAY,CACvD,CAAC,EAAA,0BAA0B,gBAAiB,EAAA,mBAAmB,CAC/D,CAAC,wBAAyB,EAAA,iBAAiB,CAC3C,CAAC,iBAAkB,EAAA,eAAe,CAClC,CAAC,EAAA,0BAA0B,SAAU,EAAA,aAAa,CAClD,CAAC,EAAA,0BAA0B,QAAS,EAAA,cAAc,CAClD,CAAC,EAAA,0BAA0B,UAAW,EAAA,oBAAoB,CAC3D,CAAC,CAEG,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,qBAEN,WAAY,CACV,mBAAA,EAAA,QACA,QAAA,EAAA,QACA,SAAA,EAAA,QACA,UAAA,EAAA,QACA,YAAA,EAAA,YACA,eAAA,EAAA,eACA,cAAA,EAAA,cACA,SAAA,EAAA,QACA,8BAAA,EAAA,QACD,CAED,aAAc,GAEd,MAAO,CAKL,KAAM,CACJ,KAAM,OACN,QAAS,QACT,UAAY,GACH,OAAO,OAAO,EAAA,0BAA0B,CAAC,SAAS,EAAK,CAEjE,CAKD,UAAW,CACT,KAAM,OACN,QAAS,GACV,CAMD,YAAa,CACX,KAAM,OACN,SAAU,GACX,CAKD,MAAO,CACL,KAAM,OACN,QAAS,KACT,UAAY,GACH,OAAO,KAAK,EAAA,0CAA0C,CAAC,SAAS,EAAM,CAEhF,CAMD,eAAgB,CACd,KAAM,OACN,QAAS,KACV,CAMD,WAAY,CACV,KAAM,QACN,QAAS,GACV,CAKD,YAAa,CACX,KAAM,OACN,QAAS,KACV,CAKD,mBAAoB,CAClB,KAAM,OACN,QAAS,KACV,CAKD,SAAU,CACR,KAAM,QACN,QAAS,GACV,CAKD,MAAO,CACL,KAAM,QACN,QAAS,GACV,CAKD,gBAAiB,CACf,KAAM,QACN,QAAS,GACV,CAMD,QAAS,CACP,KAAM,OACN,QAAS,GACV,CAKD,cAAe,CACb,KAAM,QACN,QAAS,GACV,CAKD,SAAU,CACR,KAAM,QACN,QAAS,GACV,CAKD,SAAU,CACR,KAAM,OACN,QAAS,MACT,UAAY,GACH,EAAA,+BAA+B,SAAS,EAAK,CAEvD,CACF,CAED,MAAO,CAOL,OACD,CAED,MAAQ,CACN,MAAO,CACL,cAAe,GACf,WAAY,OACZ,KAAM,IAAI,EAAA,qBACX,EAGH,SAAU,CACR,0BAA4B,CAC1B,MAAO,CACL,uBACA,CACE,kCAAmC,CAAC,KAAK,cACzC,mCAAoC,KAAK,WACzC,qCAAsC,KAAK,iBAAmB,KAAK,uBACnE,iCAAkC,KAAK,SACvC,8BAA+B,KAAK,MACpC,uCAAwC,KAAK,cAC9C,CACF,EAGH,SAAW,CACT,OAAQ,KAAK,KAAb,CACE,KAAK,EAAA,0BAA0B,SAC7B,GAAI,KAAK,WAAY,MAAO,iBAC5B,MACF,KAAK,EAAA,0BAA0B,eAC7B,GAAI,KAAK,WAAY,MAAO,wBAC5B,MAEJ,OAAO,KAAK,MAGd,kBAAoB,CAClB,OAAO,EAAa,IAAI,KAAK,QAAQ,EAGvC,eAAiB,CACf,OAAO,KAAK,OAAS,EAAA,0BAA0B,SAGjD,qBAAuB,CACrB,OAAO,KAAK,OAAS,EAAA,0BAA0B,gBAGjD,0BAA4B,CAC1B,MAAO,CACL,gCACA,EAAA,0CAA0C,KAAK,OAChD,EAGH,YAAc,CAIZ,OAAO,KAAK,UAGd,qBAAuB,CACrB,OAAO,EAAA,oBAAoB,KAAK,OAAO,EAGzC,cAAgB,CAGd,OAFI,KAAK,UAAkB,KAAK,UAEzB,EAAA,kBAAkB,CACvB,KAAK,cACL,KAAK,YACL,KAAK,mBACL,KAAK,eACL,KAAK,uBACN,CAAC,EAGJ,YAAc,CACZ,OAAO,KAAK,SAAW,KAAK,iBAAmB,KAAK,iBAAmB,KAAK,eAC1E,KAAK,wBAGT,iBAAmB,CACjB,MAAO,CAAC,CAAC,KAAK,aAAe,KAAK,YAGpC,wBAA0B,CACxB,MAAO,CAAC,CAAC,KAAK,oBAAsB,KAAK,YAG3C,gBAAkB,CAChB,OAAO,KAAK,cAAgB,MAG9B,uBAAyB,CACvB,OAAO,KAAK,qBAAuB,MAGrC,qCAAuC,CACrC,OAAO,KAAK,gBAAkB,KAAK,uBAQrC,sCAAwC,CACtC,OAAO,KAAK,iBAAmB,UAAY,CAAC,KAAK,gBAAkB,KAAK,uBAG1E,cAAgB,CACd,OAAO,MAAM,KAAK,YAAW,CACzB,KAAK,YACL,OAAO,KAAK,YAAY,EAG9B,cAAgB,CACd,OAAO,MAAM,KAAK,mBAAkB,CAChC,KAAK,mBACL,OAAO,KAAK,mBAAmB,EAGrC,oBAAsB,CACpB,OAAO,EAAA,kBAAkB,CACvB,KAAK,aAAe,KAAK,KAAK,GAAG,qCAAsC,CAAE,YAAa,KAAK,aAAc,CAAC,CAC1G,KAAK,oBAAsB,KAAK,KAAK,GAAG,qCAAsC,CAAE,YAAa,KAAK,aAAc,CAAC,CAClH,CAAC,EAGJ,gBAAkB,CAChB,OAAO,KAAK,SAAW,KAAK,KAAK,GAAG,wCAAwC,EAG9E,wBAA0B,CACxB,OAAO,KAAK,iBAAmB,KAAK,KAAK,GAAG,8CAA8C,EAG5F,mBAAqB,CACnB,OAAO,KAAK,KAAK,GAAG,2CAA2C,EAGjE,eAAiB,CACf,OAAO,KAAK,UAAY,KAAK,KAAK,GAAG,uBAAuB,EAE/D,CAED,MAAO,CACL,OAAQ,CACN,UAAW,GACX,KAAM,GACN,MAAM,SAAW,CACf,KAAK,eAAe,CACpB,MAAM,KAAK,WAAW,CACtB,KAAK,kBAAkB,EAE1B,CACF,CAED,SAAW,CACT,KAAK,eAAiB,IAAI,eAAe,KAAK,iBAAiB,CAC/D,KAAK,eAAe,QAAQ,EAAA,cAAc,KAAK,IAAI,CAAC,CACpD,KAAK,kBAAkB,EAGzB,cAAe,UAAY,CACzB,KAAK,eAAe,YAAY,EAGlC,QAAS,CACP,sBAAA,EAAA,sBAEA,eAAiB,CACX,KAAK,OAAS,EAAA,0BAA0B,gBAC1C,CAAC,OAAO,KAAK,EAAA,0CAA0C,CAAC,SAAS,KAAK,MAAM,EAC5E,QAAQ,MAAM,EAAA,oDAAoD,EAItE,kBAAoB,CAKlB,KAAK,YAJc,EAAA,cAAc,KAAK,IAAI,EAAE,cAAc,iCAAiC,EAAE,aAAe,KACzF,EAAA,cAAc,KAAK,IAAI,EAAE,cAAc,+BAA+B,EAAE,aAAe,IACvF,EAAA,cAAc,KAAK,IAAI,EAAE,cAAc,+BAA+B,EAAE,aAAe,GACzF,IACqD,MAEzE,CACF,8CAjjBO,MAAM,8BAA6B,UAKjC,MAAM,4CAeJ,MAAM,qCACN,UAAQ,uCAWR,UAAQ,uCAiCd,MAAM,wCAoBJ,MAAM,+CAwCN,MAAM,+BACN,UAAQ,ieA4BR,MAAA,CAxKH,OAAA,EAAA,EAAA,gBAAK,CAAG,EAAA,yBAA0B,EAAA,OAAO,MAAK,CAAA,CAC9C,OAAA,EAAA,EAAA,gBAAO,EAAA,OAAO,MAAK,CACpB,UAAQ,mDA0EJ,KAAA,EAAA,EAAA,YAAA,CAvEF,MAAM,gCACL,UAAO,YAAe,EAAA,OAAS,EAAA,OAAM,WAAA,4BACrC,aAAY,EAAA,aACZ,MAAO,EAAA,YACP,KAAI,SAAY,EAAA,OAAS,EAAA,OAAO,KAAI,sBAC7B,EAAA,sBAAsB,EAAA,OAAM,EAAA,EAAA,EAAA,YACV,EAApB,oBAAmB,GAAA,CAAA,CAAA,EAAA,EAAA,EAAA,oBAkDnB,MAhDN,EAgDM,CA5CI,EAAA,UAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAKF,MANN,EAMM,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA,0BADI,OAAA,KAAA,KAAA,GAAA,0BAAQ,OAAA,KAAA,KAAA,GAAA,0BAAQ,OAAA,KAAA,KAAA,GAAA,UAHV,EAAA,cAAa,CAAA,CAAA,CAMR,EAAA,OAAO,OAAA,EAAA,EAAA,YACL,EAAA,OAAA,QAAA,CAAA,IAAA,EAAA,CAAA,CAGF,EAAA,OAAO,MAAA,EAAA,EAAA,YACN,EAAA,OAAA,OAAA,CAAA,IAAA,EAAA,CAAA,GAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBA+BX,EAAA,SAAA,CAAA,IAAA,EAAA,CAAA,CA3BD,EAAA,gBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAKF,MANN,EAMM,EAAA,EAAA,EAAA,aAD0B,EAAA,CAAb,KAAK,MAAK,CAAA,CAAA,CAAA,EAGhB,EAAA,sBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAGX,MAAA,OAFC,OAAA,EAAA,EAAA,gBAAO,EAAA,yBAAwB,CAChC,UAAQ,mFAiBJ,MAfN,EAeM,EAAA,EAAA,EAAA,aADQ,EAAA,CATV,YAAA,GACC,KAAM,EAAA,aAEI,MAAA,EAAA,EAAA,UAIP,CAAA,SAJyB,KAAY,GAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,yBAEhC,EAAA,iBAAgB,CAAA,CACpB,KAAM,EAAY,CAAA,KAAA,EAAA,CAAA,OAAA,CAAA,EAAA,CAAA,sDAoBzB,MAAA,CAZJ,MAAM,8BACL,OAAA,EAAA,EAAA,gBAAK,eAAiB,EAAA,aAAU,oBAU1B,EAAA,OAAA,QAAA,EAAA,KAAA,EAAA,EAAA,EAAA,aADmB,EAAA,CALtB,MAAM,oCACN,UAAQ,oCACR,KAAK,kCAEY,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAd,EAAA,YAAW,CAAA,EAAA,CAAA,CAAA,oBAMd,EAAA,aAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAyFF,MA1FN,EA0FM,CArFI,EAAA,UAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,aAaK,EAAA,OAZX,UAAU,MACT,QAAS,EAAA,iBAEC,QAAA,EAAA,EAAA,aAOH,EAAA,EAAA,EAAA,oBAAA,MAAA,CALJ,IAAI,2BACJ,MAAM,4BACN,UAAQ,mDAEL,EAAA,QAAO,CAAA,IAAA,CAAA,CAAA,sDAKR,EAAA,iBAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAOF,MARN,EAQM,EAAA,EAAA,EAAA,aADF,EAAA,CADA,KAAK,MAAK,CAAA,CAAA,CAAA,EAAA,CAAA,CAAA,EAJE,EAAA,uBAAsB,CAAA,CAAA,CAQzB,EAAA,iBAAmB,EAAA,yBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,aA8BnB,EAAA,OA7BV,QAAS,EAAA,mBACV,UAAU,QAEC,QAAA,EAAA,EAAA,aAYE,CAVH,EAAA,kBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,aAUG,EAAA,OATT,KAAK,QACL,KAAK,WACL,UAAQ,qCACP,OAAA,EAAA,EAAA,gBAAK,CAAA,qCAAA,CAAA,2CAAqH,EAAA,oCAAA,CAAA,CAAA,6BAK1G,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAd,EAAA,YAAW,CAAA,EAAA,CAAA,CAAA,oDAGR,EAAA,yBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,aAUG,EAAA,OATT,KAAK,QACL,KAAK,WACL,UAAQ,6CACP,OAAA,EAAA,EAAA,gBAAK,CAAA,yFAAoH,EAAA,oCAAmC,0DAAoF,EAAA,qCAAoC,+BAK7P,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAArB,EAAA,mBAAkB,CAAA,EAAA,CAAA,CAAA,2GAKnB,EAAA,gBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBA4BF,MA7BN,EA6BM,EAAA,EAAA,EAAA,aADS,EAAA,CAtBV,QAAS,EAAA,kBACV,UAAU,QAEC,QAAA,EAAA,EAAA,aAiBG,EAAA,EAAA,EAAA,aAAA,EAAA,CAfV,MAAM,sCACN,UAAQ,2CACR,OAAA,GACC,KAAM,IACP,KAAK,WACJ,aAAY,EAAA,kBACZ,QAAK,EAAA,KAAA,EAAA,GAAA,GAAE,EAAA,cAAa,IACpB,OAAI,EAAA,KAAA,EAAA,GAAA,GAAE,EAAA,cAAa,IACnB,QAAK,EAAA,KAAA,EAAA,IAAA,EAAA,EAAA,eAAA,GAAO,EAAA,MAAK,OAAS,EAAM,CAAA,CAAA,OAAA,CAAA,IAEtB,MAAA,EAAA,EAAA,aAGP,EAAA,EAAA,EAAA,aAAA,EAAA,CADA,KAAK,MAAK,CAAA,CAAA,CAAA"}
1	+ {"version":3,"file":"general-row.cjs","names":[],"sources":["../../../recipes/leftbar/general_row/general_row.vue"],"sourcesContent":["<template>\n <div\n :class=\"leftbarGeneralRowClasses\"\n v-bind=\"addClassStyleAttrs($attrs)\"\n data-qa=\"dt-recipe-leftbar-row\"\n >\n <a\n class=\"d-recipe-leftbar-row__primary\"\n :data-qa=\"'data-qa' in $attrs ? $attrs['data-qa'] : 'd-recipe-leftbar-row-link'\"\n :aria-label=\"getAriaLabel\"\n :title=\"description\"\n :href=\"'href' in $attrs ? $attrs.href : 'javascript:void(0)'\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"generalRowListeners\"\n >\n <div\n class=\"d-recipe-leftbar-row__alpha\"\n >\n <div\n v-if=\"isTyping\"\n v-dt-tooltip=\"typingTooltip\"\n class=\"d-recipe-leftbar-row__is-typing\"\n >\n <span /><span /><span />\n </div>\n <slot\n v-else\n name=\"left\"\n >\n <dt-recipe-leftbar-general-row-icon\n :type=\"getIcon\"\n :color=\"color\"\n :icon-size=\"iconSize\"\n data-qa=\"dt-recipe-leftbar-row-icon\"\n />\n </slot>\n </div>\n <div\n class=\"d-recipe-leftbar-row__label\"\n :style=\"`flex-basis: ${labelWidth}`\"\n >\n <slot name=\"label\">\n <dt-emoji-text-wrapper\n class=\"d-recipe-leftbar-row__description\"\n data-qa=\"dt-recipe-leftbar-row-description\"\n size=\"200\"\n >\n {{ description }}\n </dt-emoji-text-wrapper>\n </slot>\n </div>\n </a>\n <div\n v-if=\"hasActions\"\n class=\"d-recipe-leftbar-row__omega\"\n >\n <dt-tooltip\n v-if=\"dndText\"\n placement=\"top\"\n :message=\"dndTextTooltip\"\n >\n <template #anchor>\n <div\n ref=\"d-recipe-leftbar-row-dnd\"\n class=\"d-recipe-leftbar-row__dnd\"\n data-qa=\"dt-recipe-leftbar-row-dnd\"\n >\n {{ dndText }}\n </div>\n </template>\n </dt-tooltip>\n <div\n v-if=\"activeVoiceChat\"\n v-dt-tooltip=\"activeVoiceChatTooltip\"\n class=\"d-recipe-leftbar-row__active-voice\"\n >\n <dt-icon-waveform\n size=\"300\"\n />\n </div>\n <dt-tooltip\n v-else-if=\"showUnreadCount \|\| showUnreadMentionCount\"\n :message=\"unreadCountTooltip\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-badge\n v-if=\"showUnreadCount\"\n kind=\"count\"\n type=\"bulletin\"\n data-qa=\"dt-recipe-leftbar-row-unread-badge\"\n :class=\"['d-recipe-leftbar-row__unread-badge', {\n 'd-recipe-leftbar-row__unread-count-badge':\n shouldApplyCustomStyleForCountBadge,\n }]\"\n >\n {{ unreadCount }}\n </dt-badge>\n <dt-badge\n v-if=\"showUnreadMentionCount\"\n kind=\"count\"\n type=\"bulletin\"\n data-qa=\"dt-recipe-leftbar-row-unread-mention-badge\"\n :class=\"['d-recipe-leftbar-row__unread-badge',\n { 'd-recipe-leftbar-row__unread-mention-count-badge': shouldApplyCustomStyleForCountBadge },\n { 'd-recipe-leftbar-row__unread-mention-only-count-badge': shouldApplyCustomStyleForMentionOnly },\n ]\"\n >\n {{ unreadMentionCount }}\n </dt-badge>\n </template>\n </dt-tooltip>\n <div\n v-if=\"hasCallButton\"\n class=\"d-recipe-leftbar-row__action\"\n data-qa=\"dt-recipe-leftbar-row-action\"\n >\n <dt-tooltip\n :message=\"callButtonTooltip\"\n placement=\"top\"\n >\n <template #anchor>\n <dt-button\n class=\"d-recipe-leftbar-row__action-button\"\n data-qa=\"dt-recipe-leftbar-row-action-call-button\"\n circle\n size=\"xs\"\n kind=\"inverted\"\n :aria-label=\"callButtonTooltip\"\n @focus=\"actionFocused = true\"\n @blur=\"actionFocused = false\"\n @click.stop=\"$emit('call', $event)\"\n >\n <template #icon>\n <dt-icon-phone\n size=\"200\"\n />\n </template>\n </dt-button>\n </template>\n </dt-tooltip>\n </div>\n </div>\n </div>\n</template>\n\n<script>\n/* eslint-disable max-lines /\nimport {\n LEFTBAR_GENERAL_ROW_TYPES,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS,\n LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR,\n LEFTBAR_GENERAL_ROW_ICON_SIZES,\n} from './general_row_constants';\nimport { DtBadge } from '@/components/badge';\nimport { DtIconPhone, DtIconWaveform } from '@dialpad/dialtone-icons/vue3';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport { DtEmojiTextWrapper } from '@/components/emoji_text_wrapper';\nimport DtRecipeLeftbarGeneralRowIcon from './leftbar_general_row_icon.vue';\nimport { extractVueListeners, safeConcatStrings, removeClassStyleAttrs, returnFirstEl, addClassStyleAttrs } from '@/common/utils';\nimport { DialtoneLocalization } from '@/localization';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtRecipeGeneralRow',\n\n components: {\n DtEmojiTextWrapper,\n DtBadge,\n DtButton,\n DtTooltip,\n DtIconPhone,\n DtIconWaveform,\n DtRecipeLeftbarGeneralRowIcon,\n },\n\n inheritAttrs: false,\n\n props: {\n /\n Determines the icon to show.\n * If type is contact center, the color prop must be provided and will determine the color of the icon\n /\n type: {\n type: String,\n default: 'inbox',\n validator: (type) => {\n return Object.values(LEFTBAR_GENERAL_ROW_TYPES).includes(type);\n },\n },\n\n /\n Will be read out by a screen reader upon focus of this row. If not defined \"description\" will be read.\n /\n ariaLabel: {\n type: String,\n default: '',\n },\n\n /\n Text displayed next to the icon. Required. Even if you are overriding this field using the label slot\n * you still must input this as it will be displayed as the \"title\" attribute for the row.\n /\n description: {\n type: String,\n required: true,\n },\n\n /\n Determines the color of the contact center icon\n /\n color: {\n type: String,\n default: null,\n validator: (color) => {\n return Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(color);\n },\n },\n\n /\n The channel setting, either 'mention' or 'always'.\n * @values 'mention', 'always', null.\n /\n channelSetting: {\n type: String,\n default: null,\n },\n\n /\n Styles the row with an increased font weight to convey it has unreads. This must be true to see\n * the unread count badge.\n /\n hasUnreads: {\n type: Boolean,\n default: false,\n },\n\n /\n Number of unread messages\n /\n unreadCount: {\n type: String,\n default: null,\n },\n\n /\n Number of unread mention messages\n /\n unreadMentionCount: {\n type: String,\n default: null,\n },\n\n /\n Determines if the row is selected\n /\n selected: {\n type: Boolean,\n default: false,\n },\n\n /\n Gives a faded style to be used when muted\n /\n muted: {\n type: Boolean,\n default: false,\n },\n\n /\n Shows styling to represent an active voice chat. This will display over unreadCount.\n /\n activeVoiceChat: {\n type: Boolean,\n default: false,\n },\n\n /\n Acronym used to represent \"Do not Disturb\" state. If entered will display the entered text alongside\n * unreadCount.\n /\n dndText: {\n type: String,\n default: '',\n },\n\n /\n Whether the row should have a call button. Usually only applicable to individual contact rows.\n /\n hasCallButton: {\n type: Boolean,\n default: false,\n },\n\n /\n Shows an \"is typing\" animation over the avatar when true.\n /\n isTyping: {\n type: Boolean,\n default: false,\n },\n\n /\n Sets the size of the icon.\n /\n iconSize: {\n type: String,\n default: '300',\n validator: (size) => {\n return LEFTBAR_GENERAL_ROW_ICON_SIZES.includes(size);\n },\n },\n },\n\n emits: [\n /\n Call button clicked\n \n @event call\n * @type {PointerEvent \| KeyboardEvent}\n /\n 'call',\n ],\n\n data () {\n return {\n actionFocused: false,\n labelWidth: '100%',\n i18n: new DialtoneLocalization(),\n };\n },\n\n computed: {\n leftbarGeneralRowClasses () {\n return [\n 'd-recipe-leftbar-row',\n {\n 'd-recipe-leftbar-row--no-action': !this.hasCallButton,\n 'd-recipe-leftbar-row--has-unread': this.hasUnreads,\n 'd-recipe-leftbar-row__unread-count': this.showUnreadCount \|\| this.showUnreadMentionCount,\n 'd-recipe-leftbar-row--selected': this.selected,\n 'd-recipe-leftbar-row--muted': this.muted,\n 'd-recipe-leftbar-row--action-focused': this.actionFocused,\n },\n ];\n },\n\n getIcon () {\n switch (this.type) {\n case LEFTBAR_GENERAL_ROW_TYPES.CHANNELS:\n if (this.hasUnreads) return 'channel unread';\n break;\n case LEFTBAR_GENERAL_ROW_TYPES.LOCKED_CHANNEL:\n if (this.hasUnreads) return 'locked channel unread';\n break;\n }\n return this.type;\n },\n\n generalRowListeners () {\n return extractVueListeners(this.$attrs);\n },\n\n getAriaLabel () {\n if (this.ariaLabel) return this.ariaLabel;\n\n return safeConcatStrings([\n this.typingTooltip,\n this.description,\n this.unreadCountTooltip,\n this.dndTextTooltip,\n this.activeVoiceChatTooltip,\n ]);\n },\n\n hasActions () {\n return this.dndText \|\| this.activeVoiceChat \|\| this.showUnreadCount \|\| this.hasCallButton \|\|\n this.showUnreadMentionCount;\n },\n\n showUnreadCount () {\n return !!this.unreadCount && this.hasUnreads;\n },\n\n showUnreadMentionCount () {\n return !!this.unreadMentionCount && this.hasUnreads;\n },\n\n hasUnreadCount () {\n return this.unreadCount !== null;\n },\n\n hasUnreadMentionCount () {\n return this.unreadMentionCount !== null;\n },\n\n shouldApplyCustomStyleForCountBadge () {\n return this.hasUnreadCount && this.hasUnreadMentionCount;\n },\n\n /\n When a channel in 'always' setting, meaning the user should see both unread count and unread mention count,\n * if there are only mention messages, we should apply the theme design tokens var(--dt-theme-mention-color-[background\|\|foreground]-strong).\n * @returns {boolean}\n */\n shouldApplyCustomStyleForMentionOnly () {\n return this.channelSetting === 'always' && !this.hasUnreadCount && this.hasUnreadMentionCount;\n },\n\n messageCount () {\n return isNaN(this.unreadCount)\n ? this.unreadCount\n : Number(this.unreadCount);\n },\n\n mentionCount () {\n return isNaN(this.unreadMentionCount)\n ? this.unreadMentionCount\n : Number(this.unreadMentionCount);\n },\n\n unreadCountTooltip () {\n return safeConcatStrings([\n this.unreadCount && this.i18n.$t('DIALTONE_UNREAD_MESSAGE_COUNT_TEXT', { unreadCount: this.messageCount }),\n this.unreadMentionCount && this.i18n.$t('DIALTONE_UNREAD_MENTION_COUNT_TEXT', { unreadCount: this.mentionCount }),\n ]);\n },\n\n dndTextTooltip () {\n return this.dndText && this.i18n.$t('DIALTONE_GENERAL_ROW_DND_TEXT_TOOLTIP');\n },\n\n activeVoiceChatTooltip () {\n return this.activeVoiceChat && this.i18n.$t('DIALTONE_GENERAL_ROW_ACTIVE_VOICE_CHAT_TEXT');\n },\n\n callButtonTooltip () {\n return this.i18n.$t('DIALTONE_GENERAL_ROW_CALL_BUTTON_TOOLTIP');\n },\n\n typingTooltip () {\n return this.isTyping && this.i18n.$t('DIALTONE_TYPING_TEXT');\n },\n },\n\n watch: {\n $props: {\n immediate: true,\n deep: true,\n async handler () {\n this.validateProps();\n await this.$nextTick();\n this.adjustLabelWidth();\n },\n },\n },\n\n mounted () {\n this.resizeObserver = new ResizeObserver(this.adjustLabelWidth);\n this.resizeObserver.observe(returnFirstEl(this.$el));\n this.adjustLabelWidth();\n },\n\n beforeUnmount: function () {\n this.resizeObserver.disconnect();\n },\n\n methods: {\n removeClassStyleAttrs,\n addClassStyleAttrs,\n\n validateProps () {\n if (this.type === LEFTBAR_GENERAL_ROW_TYPES.CONTACT_CENTER &&\n !Object.keys(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS).includes(this.color)) {\n console.error(LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR);\n }\n },\n\n adjustLabelWidth () {\n const labelWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__primary')?.clientWidth \|\| 0;\n const omegaWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__omega')?.clientWidth \|\| 0;\n const alphaWidth = returnFirstEl(this.$el)?.querySelector('.d-recipe-leftbar-row__alpha')?.clientWidth \|\| 0;\n const paddings = 16;\n this.labelWidth = labelWidth - (omegaWidth + alphaWidth + paddings) + 'px';\n },\n },\n};\n</script>\n"],"mappings":"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"}

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

@@ -1,32 +1,16 @@
-import { extractVueListeners as e, removeClassStyleAttrs as t, returnFirstEl as n, safeConcatStrings as r } from "../../common/utils/index.js";
-import { t as i } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
-import a from "../avatar/avatar.js";
+import { addClassStyleAttrs as e, extractVueListeners as t, removeClassStyleAttrs as n, returnFirstEl as r, safeConcatStrings as i } from "../../common/utils/index.js";
+import { t as a } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
 import o from "../badge/badge.js";
 import { DialtoneLocalization as s } from "../../localization/index.js";
 import c from "../button/button.js";
 import l from "../tooltip/tooltip.js";
-import u from "../emojitextwrapper/emojitextwrapper.js";
+import u from "../emoji-text-wrapper/emoji-text-wrapper.js";
 import { LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as d, LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR as f, LEFTBAR_GENERAL_ROW_ICON_SIZES as p, LEFTBAR_GENERAL_ROW_TYPES as m } from "./general-row-constants.js";
 import h from "./leftbar-general-row-icon.js";
-import { Fragment as g, createBlock as _, createCommentVNode as v, createElementBlock as y, createElementVNode as b, createTextVNode as x, createVNode as S, mergeProps as C, normalizeClass as w, normalizeStyle as T, openBlock as E, renderSlot as D, resolveComponent as O, resolveDirective as ee, resolveDynamicComponent as k, toDisplayString as A, toHandlers as j, withCtx as M, withDirectives as N, withModifiers as P } from "vue";
-import { DtIconAtSign as F, DtIconCalendarClock as I, DtIconContacts as L, DtIconDialbot as R, DtIconExternalLink as z, DtIconHash as B, DtIconHashBold as V, DtIconInbox as H, DtIconLaptop2 as U, DtIconLayoutTemplate as W, DtIconLock as te, DtIconLockFilled as G, DtIconPhone as K, DtIconSparkle as q, DtIconThread as J, DtIconUsers as Y, DtIconWaveform as X } from "@dialpad/dialtone-icons/vue";
+import { createBlock as g, createCommentVNode as _, createElementBlock as v, createElementVNode as y, createTextVNode as b, createVNode as x, mergeProps as S, normalizeClass as C, normalizeStyle as w, openBlock as T, renderSlot as E, resolveComponent as D, resolveDirective as O, toDisplayString as k, toHandlers as A, withCtx as j, withDirectives as M, withModifiers as N } from "vue";
+import { DtIconPhone as P, DtIconWaveform as F } from "@dialpad/dialtone-icons/vue3";
 //#region recipes/leftbar/general_row/general_row.vue
-var Z = new Map([
-	[m.INBOX, H],
-	[m.CONTACTS, L],
-	[m.CHANNELS, B],
-	[m.THREADS, J],
-	[m.LAUNCHPAD, W],
-	[m.LOCKED_CHANNEL, te],
-	[m.QUICK_START, q],
-	[m.COACHING_GROUP, Y],
-	[m.COACHING_CENTER, z],
-	["locked channel unread", G],
-	["channel unread", V],
-	[m.ASSIGNED, F],
-	[m.DIGITAL, U],
-	[m.SCHEDULED, I]
-]), Q = {
+var I = {
 	compatConfig: { MODE: 3 },
 	name: "DtRecipeGeneralRow",
 	components: {
@@ -34,10 +18,8 @@ var Z = new Map([
 		DtBadge: o,
 		DtButton: c,
 		DtTooltip: l,
-		DtIconPhone: K,
-		DtIconWaveform: X,
-		DtIconDialbot: R,
-		DtAvatar: a,
+		DtIconPhone: P,
+		DtIconWaveform: F,
 		DtRecipeLeftbarGeneralRowIcon: h
 	},
 	inheritAttrs: !1,
@@ -136,26 +118,11 @@ var Z = new Map([
 			}
 			return this.type;
 		},
-		getIconComponent() {
-			return Z.get(this.getIcon);
-		},
-		isDialbotType() {
-			return this.type === m.DIALBOT;
-		},
-		isContactCenterType() {
-			return this.type === m.CONTACT_CENTER;
-		},
-		contactCenterIconClasses() {
-			return ["d-recipe-leftbar-row__icon-cc", d[this.color]];
-		},
-		avatarSize() {
-			return this.iconSize;
-		},
 		generalRowListeners() {
-			return e(this.$attrs);
+			return t(this.$attrs);
 		},
 		getAriaLabel() {
-			return this.ariaLabel ? this.ariaLabel : r([
+			return this.ariaLabel ? this.ariaLabel : i([
 				this.typingTooltip,
 				this.description,
 				this.unreadCountTooltip,
@@ -191,7 +158,7 @@ var Z = new Map([
 			return isNaN(this.unreadMentionCount) ? this.unreadMentionCount : Number(this.unreadMentionCount);
 		},
 		unreadCountTooltip() {
-			return r([this.unreadCount && this.i18n.$t("DIALTONE_UNREAD_MESSAGE_COUNT_TEXT", { unreadCount: this.messageCount }), this.unreadMentionCount && this.i18n.$t("DIALTONE_UNREAD_MENTION_COUNT_TEXT", { unreadCount: this.mentionCount })]);
+			return i([this.unreadCount && this.i18n.$t("DIALTONE_UNREAD_MESSAGE_COUNT_TEXT", { unreadCount: this.messageCount }), this.unreadMentionCount && this.i18n.$t("DIALTONE_UNREAD_MENTION_COUNT_TEXT", { unreadCount: this.mentionCount })]);
 		},
 		dndTextTooltip() {
 			return this.dndText && this.i18n.$t("DIALTONE_GENERAL_ROW_DND_TEXT_TOOLTIP");
@@ -214,149 +181,138 @@ var Z = new Map([
 		}
 	} },
 	mounted() {
-		this.resizeObserver = new ResizeObserver(this.adjustLabelWidth), this.resizeObserver.observe(n(this.$el)), this.adjustLabelWidth();
+		this.resizeObserver = new ResizeObserver(this.adjustLabelWidth), this.resizeObserver.observe(r(this.$el)), this.adjustLabelWidth();
 	},
 	beforeUnmount: function() {
 		this.resizeObserver.disconnect();
 	},
 	methods: {
-		removeClassStyleAttrs: t,
+		removeClassStyleAttrs: n,
+		addClassStyleAttrs: e,
 		validateProps() {
 			this.type === m.CONTACT_CENTER && !Object.keys(d).includes(this.color) && console.error(f);
 		},
 		adjustLabelWidth() {
-			this.labelWidth = (n(this.$el)?.querySelector(".d-recipe-leftbar-row__primary")?.clientWidth || 0) - ((n(this.$el)?.querySelector(".d-recipe-leftbar-row__omega")?.clientWidth || 0) + (n(this.$el)?.querySelector(".d-recipe-leftbar-row__alpha")?.clientWidth || 0) + 16) + "px";
+			this.labelWidth = (r(this.$el)?.querySelector(".d-recipe-leftbar-row__primary")?.clientWidth || 0) - ((r(this.$el)?.querySelector(".d-recipe-leftbar-row__omega")?.clientWidth || 0) + (r(this.$el)?.querySelector(".d-recipe-leftbar-row__alpha")?.clientWidth || 0) + 16) + "px";
 		}
 	}
-}, ne = [
+}, L = [
 	"data-qa",
 	"aria-label",
 	"title",
 	"href"
-], re = { class: "d-recipe-leftbar-row__alpha" }, ie = {
+], R = { class: "d-recipe-leftbar-row__alpha" }, z = {
 	key: 0,
 	class: "d-recipe-leftbar-row__is-typing"
-}, ae = {
-	key: 0,
-	class: "d-recipe-leftbar-general-row__icon",
-	"data-qa": "dt-recipe-leftbar-row-icon"
-}, oe = {
-	key: 2,
-	"data-qa": "dt-recipe-leftbar-row-icon"
-}, $ = {
+}, B = {
 	key: 0,
 	class: "d-recipe-leftbar-row__omega"
-}, se = {
+}, V = {
 	key: 1,
 	class: "d-recipe-leftbar-row__active-voice"
-}, ce = {
+}, H = {
 	key: 3,
 	class: "d-recipe-leftbar-row__action",
 	"data-qa": "dt-recipe-leftbar-row-action"
 };
-function le(e, t, n, r, i, a) {
-	let o = O("dt-icon-dialbot"), s = O("dt-avatar"), c = O("dt-emoji-text-wrapper"), l = O("dt-tooltip"), u = O("dt-icon-waveform"), d = O("dt-badge"), f = O("dt-icon-phone"), p = O("dt-button"), m = ee("dt-tooltip");
-	return E(), y("div", {
-		class: w([a.leftbarGeneralRowClasses, e.$attrs.class]),
-		style: T(e.$attrs.style),
-		"data-qa": "dt-recipe-leftbar-row"
-	}, [b("a", C({
+function U(e, t, n, r, i, a) {
+	let o = D("dt-recipe-leftbar-general-row-icon"), s = D("dt-emoji-text-wrapper"), c = D("dt-tooltip"), l = D("dt-icon-waveform"), u = D("dt-badge"), d = D("dt-icon-phone"), f = D("dt-button"), p = O("dt-tooltip");
+	return T(), v("div", S({ class: a.leftbarGeneralRowClasses }, a.addClassStyleAttrs(e.$attrs), { "data-qa": "dt-recipe-leftbar-row" }), [y("a", S({
 		class: "d-recipe-leftbar-row__primary",
 		"data-qa": "data-qa" in e.$attrs ? e.$attrs["data-qa"] : "d-recipe-leftbar-row-link",
 		"aria-label": a.getAriaLabel,
 		title: n.description,
 		href: "href" in e.$attrs ? e.$attrs.href : "javascript:void(0)"
-	}, a.removeClassStyleAttrs(e.$attrs), j(a.generalRowListeners, !0)), [b("div", re, [n.isTyping ? N((E(), y("div", ie, [...t[3] || (t[3] = [
-		b("span", null, null, -1),
-		b("span", null, null, -1),
-		b("span", null, null, -1)
-	])])), [[m, a.typingTooltip]]) : e.$slots.start ? D(e.$slots, "start", { key: 1 }) : e.$slots.left ? D(e.$slots, "left", { key: 2 }) : (E(), y(g, { key: 3 }, [a.isDialbotType ? (E(), y("div", ae, [S(o, { size: "500" })])) : a.isContactCenterType ? (E(), y("div", {
-		key: 1,
-		class: w(a.contactCenterIconClasses),
+	}, a.removeClassStyleAttrs(e.$attrs), A(a.generalRowListeners, !0)), [y("div", R, [n.isTyping ? M((T(), v("div", z, [...t[3] || (t[3] = [
+		y("span", null, null, -1),
+		y("span", null, null, -1),
+		y("span", null, null, -1)
+	])])), [[p, a.typingTooltip]]) : E(e.$slots, "left", { key: 1 }, () => [x(o, {
+		type: a.getIcon,
+		color: n.color,
+		"icon-size": n.iconSize,
 		"data-qa": "dt-recipe-leftbar-row-icon"
-	}, null, 2)) : (E(), y("div", oe, [S(s, {
-		"icon-only": "",
-		size: a.avatarSize
-	}, {
-		icon: M(({ iconSize: e }) => [(E(), _(k(a.getIconComponent), { size: e }, null, 8, ["size"]))]),
-		_: 1
-	}, 8, ["size"])]))], 64))]), b("div", {
+	}, null, 8, [
+		"type",
+		"color",
+		"icon-size"
+	])])]), y("div", {
 		class: "d-recipe-leftbar-row__label",
-		style: T(`flex-basis: ${i.labelWidth}`)
-	}, [D(e.$slots, "label", {}, () => [S(c, {
+		style: w(`flex-basis: ${i.labelWidth}`)
+	}, [E(e.$slots, "label", {}, () => [x(s, {
 		class: "d-recipe-leftbar-row__description",
 		"data-qa": "dt-recipe-leftbar-row-description",
 		size: "200"
 	}, {
-		default: M(() => [x(A(n.description), 1)]),
+		default: j(() => [b(k(n.description), 1)]),
 		_: 1
-	})])], 4)], 16, ne), a.hasActions ? (E(), y("div", $, [
-		n.dndText ? (E(), _(l, {
+	})])], 4)], 16, L), a.hasActions ? (T(), v("div", B, [
+		n.dndText ? (T(), g(c, {
 			key: 0,
 			placement: "top",
 			message: a.dndTextTooltip
 		}, {
-			anchor: M(() => [b("div", {
+			anchor: j(() => [y("div", {
 				ref: "d-recipe-leftbar-row-dnd",
 				class: "d-recipe-leftbar-row__dnd",
 				"data-qa": "dt-recipe-leftbar-row-dnd"
-			}, A(n.dndText), 513)]),
+			}, k(n.dndText), 513)]),
 			_: 1
-		}, 8, ["message"])) : v("", !0),
-		n.activeVoiceChat ? N((E(), y("div", se, [S(u, { size: "300" })])), [[m, a.activeVoiceChatTooltip]]) : a.showUnreadCount || a.showUnreadMentionCount ? (E(), _(l, {
+		}, 8, ["message"])) : _("", !0),
+		n.activeVoiceChat ? M((T(), v("div", V, [x(l, { size: "300" })])), [[p, a.activeVoiceChatTooltip]]) : a.showUnreadCount || a.showUnreadMentionCount ? (T(), g(c, {
 			key: 2,
 			message: a.unreadCountTooltip,
 			placement: "top"
 		}, {
-			anchor: M(() => [a.showUnreadCount ? (E(), _(d, {
+			anchor: j(() => [a.showUnreadCount ? (T(), g(u, {
 				key: 0,
 				kind: "count",
 				type: "bulletin",
 				"data-qa": "dt-recipe-leftbar-row-unread-badge",
-				class: w(["d-recipe-leftbar-row__unread-badge", { "d-recipe-leftbar-row__unread-count-badge": a.shouldApplyCustomStyleForCountBadge }])
+				class: C(["d-recipe-leftbar-row__unread-badge", { "d-recipe-leftbar-row__unread-count-badge": a.shouldApplyCustomStyleForCountBadge }])
 			}, {
-				default: M(() => [x(A(n.unreadCount), 1)]),
+				default: j(() => [b(k(n.unreadCount), 1)]),
 				_: 1
-			}, 8, ["class"])) : v("", !0), a.showUnreadMentionCount ? (E(), _(d, {
+			}, 8, ["class"])) : _("", !0), a.showUnreadMentionCount ? (T(), g(u, {
 				key: 1,
 				kind: "count",
 				type: "bulletin",
 				"data-qa": "dt-recipe-leftbar-row-unread-mention-badge",
-				class: w([
+				class: C([
 					"d-recipe-leftbar-row__unread-badge",
 					{ "d-recipe-leftbar-row__unread-mention-count-badge": a.shouldApplyCustomStyleForCountBadge },
 					{ "d-recipe-leftbar-row__unread-mention-only-count-badge": a.shouldApplyCustomStyleForMentionOnly }
 				])
 			}, {
-				default: M(() => [x(A(n.unreadMentionCount), 1)]),
+				default: j(() => [b(k(n.unreadMentionCount), 1)]),
 				_: 1
-			}, 8, ["class"])) : v("", !0)]),
+			}, 8, ["class"])) : _("", !0)]),
 			_: 1
-		}, 8, ["message"])) : v("", !0),
-		n.hasCallButton ? (E(), y("div", ce, [S(l, {
+		}, 8, ["message"])) : _("", !0),
+		n.hasCallButton ? (T(), v("div", H, [x(c, {
 			message: a.callButtonTooltip,
 			placement: "top"
 		}, {
-			anchor: M(() => [S(p, {
+			anchor: j(() => [x(f, {
 				class: "d-recipe-leftbar-row__action-button",
 				"data-qa": "dt-recipe-leftbar-row-action-call-button",
 				circle: "",
-				size: 100,
+				size: "xs",
 				kind: "inverted",
 				"aria-label": a.callButtonTooltip,
 				onFocus: t[0] || (t[0] = (e) => i.actionFocused = !0),
 				onBlur: t[1] || (t[1] = (e) => i.actionFocused = !1),
-				onClick: t[2] || (t[2] = P((t) => e.$emit("call", t), ["stop"]))
+				onClick: t[2] || (t[2] = N((t) => e.$emit("call", t), ["stop"]))
 			}, {
-				icon: M(() => [S(f, { size: "200" })]),
+				icon: j(() => [x(d, { size: "200" })]),
 				_: 1
 			}, 8, ["aria-label"])]),
 			_: 1
-		}, 8, ["message"])])) : v("", !0)
-	])) : v("", !0)], 6);
+		}, 8, ["message"])])) : _("", !0)
+	])) : _("", !0)], 16);
 }
-var ue = /* @__PURE__ */ i(Q, [["render", le]]);
+var W = /* @__PURE__ */ a(I, [["render", U]]);
 //#endregion
-export { ue as default };
+export { W as default };
 //# sourceMappingURL=general-row.js.map