@dialpad/dialtone-vue 3.218.2 → 3.218.4

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

@@ -1,420 +1,318 @@
-import { LEFTBAR_GENERAL_ROW_TYPES as C, LEFTBAR_GENERAL_ROW_CONTACT_CENTER_COLORS as N, LEFTBAR_GENERAL_ROW_CONTACT_CENTER_VALIDATION_ERROR as D, LEFTBAR_GENERAL_ROW_ICON_SIZES as k } from "./general-row-constants.js";
-import { DtIconWaveform as M, DtIconPhone as W } from "@dialpad/dialtone-icons/vue3";
-import I from "./leftbar-general-row-icon.js";
-import { addClassStyleAttrs as q, removeClassStyleAttrs as z, returnFirstEl as b, safeConcatStrings as v, extractVueListeners as F } from "../../common/utils/index.js";
-import { DialtoneLocalization as V } from "../../localization/index.js";
-import { resolveComponent as o, resolveDirective as G, openBlock as a, createElementBlock as h, mergeProps as O, createElementVNode as i, toHandlers as x, withDirectives as L, renderSlot as R, createVNode as u, normalizeStyle as j, withCtx as s, createTextVNode as w, toDisplayString as m, createBlock as T, createCommentVNode as c, normalizeClass as S, withModifiers as P } from "vue";
-import { _ as X } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-import H from "../tooltip/tooltip.js";
-import Y from "../button/button.js";
-import K from "../badge/badge.js";
-import Z from "../emoji-text-wrapper/emoji-text-wrapper.js";
-const J = {
-  compatConfig: { MODE: 3 },
-  name: "DtRecipeGeneralRow",
-  components: {
-    DtEmojiTextWrapper: Z,
-    DtBadge: K,
-    DtButton: Y,
-    DtTooltip: H,
-    DtIconPhone: W,
-    DtIconWaveform: M,
-    DtRecipeLeftbarGeneralRowIcon: I
-  },
-  inheritAttrs: !1,
-  props: {
-    /**
-     * Determines the icon to show.
-     * If type is contact center, the color prop must be provided and will determine the color of the icon
-     */
-    type: {
-      type: String,
-      default: "inbox",
-      validator: (t) => Object.values(C).includes(t)
-    },
-    /**
-     * Will be read out by a screen reader upon focus of this row. If not defined "description" will be read.
-     */
-    ariaLabel: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Text displayed next to the icon. Required. Even if you are overriding this field using the label slot
-     * you still must input this as it will be displayed as the "title" attribute for the row.
-     */
-    description: {
-      type: String,
-      required: !0
-    },
-    /**
-     * Determines the color of the contact center icon
-     */
-    color: {
-      type: String,
-      default: null,
-      validator: (t) => Object.keys(N).includes(t)
-    },
-    /**
-     * The channel setting, either 'mention' or 'always'.
-     * @values 'mention', 'always', null.
-     */
-    channelSetting: {
-      type: String,
-      default: null
-    },
-    /**
-     * Styles the row with an increased font weight to convey it has unreads. This must be true to see
-     * the unread count badge.
-     */
-    hasUnreads: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Number of unread messages
-     */
-    unreadCount: {
-      type: String,
-      default: null
-    },
-    /**
-     * Number of unread mention messages
-     */
-    unreadMentionCount: {
-      type: String,
-      default: null
-    },
-    /**
-     * Determines if the row is selected
-     */
-    selected: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Gives a faded style to be used when muted
-     */
-    muted: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Shows styling to represent an active voice chat. This will display over unreadCount.
-     */
-    activeVoiceChat: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Acronym used to represent "Do not Disturb" state. If entered will display the entered text alongside
-     * unreadCount.
-     */
-    dndText: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Whether the row should have a call button. Usually only applicable to individual contact rows.
-     */
-    hasCallButton: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Shows an "is typing" animation over the avatar when true.
-     */
-    isTyping: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Sets the size of the icon.
-     */
-    iconSize: {
-      type: String,
-      default: "300",
-      validator: (t) => k.includes(t)
-    }
-  },
-  emits: [
-    /**
-     * Call button clicked
-     *
-     * @event call
-     * @type {PointerEvent | KeyboardEvent}
-     */
-    "call"
-  ],
-  data() {
-    return {
-      actionFocused: !1,
-      labelWidth: "100%",
-      i18n: new V()
-    };
-  },
-  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.CHANNELS:
-          if (this.hasUnreads) return "channel unread";
-          break;
-        case C.LOCKED_CHANNEL:
-          if (this.hasUnreads) return "locked channel unread";
-          break;
-      }
-      return this.type;
-    },
-    generalRowListeners() {
-      return F(this.$attrs);
-    },
-    getAriaLabel() {
-      return this.ariaLabel ? this.ariaLabel : v([
-        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;
-    },
-    /**
-     * When a channel in 'always' setting, meaning the user should see both unread count and unread mention count,
-     * if there are only mention messages, we should apply the theme design tokens var(--dt-theme-mention-color-[background||foreground]-strong).
-     * @returns {boolean}
-     */
-    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 v([
-        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(b(this.$el)), this.adjustLabelWidth();
-  },
-  beforeUnmount: function() {
-    this.resizeObserver.disconnect();
-  },
-  methods: {
-    removeClassStyleAttrs: z,
-    addClassStyleAttrs: q,
-    validateProps() {
-      this.type === C.CONTACT_CENTER && !Object.keys(N).includes(this.color) && console.error(D);
-    },
-    adjustLabelWidth() {
-      var l, e, _, p, d, f;
-      const t = ((e = (l = b(this.$el)) == null ? void 0 : l.querySelector(".d-recipe-leftbar-row__primary")) == null ? void 0 : e.clientWidth) || 0, n = ((p = (_ = b(this.$el)) == null ? void 0 : _.querySelector(".d-recipe-leftbar-row__omega")) == null ? void 0 : p.clientWidth) || 0, r = ((f = (d = b(this.$el)) == null ? void 0 : d.querySelector(".d-recipe-leftbar-row__alpha")) == null ? void 0 : f.clientWidth) || 0, g = 16;
-      this.labelWidth = t - (n + r + g) + "px";
-    }
-  }
-}, Q = ["data-qa", "aria-label", "title", "href"], $ = { class: "d-recipe-leftbar-row__alpha" }, ee = {
-  key: 0,
-  class: "d-recipe-leftbar-row__is-typing"
-}, te = {
-  key: 0,
-  class: "d-recipe-leftbar-row__omega"
-}, re = {
-  key: 1,
-  class: "d-recipe-leftbar-row__active-voice"
-}, ne = {
-  key: 3,
-  class: "d-recipe-leftbar-row__action",
-  "data-qa": "dt-recipe-leftbar-row-action"
+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 "../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 { 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 I = {
+	compatConfig: { MODE: 3 },
+	name: "DtRecipeGeneralRow",
+	components: {
+		DtEmojiTextWrapper: u,
+		DtBadge: o,
+		DtButton: c,
+		DtTooltip: l,
+		DtIconPhone: P,
+		DtIconWaveform: F,
+		DtRecipeLeftbarGeneralRowIcon: h
+	},
+	inheritAttrs: !1,
+	props: {
+		type: {
+			type: String,
+			default: "inbox",
+			validator: (e) => Object.values(m).includes(e)
+		},
+		ariaLabel: {
+			type: String,
+			default: ""
+		},
+		description: {
+			type: String,
+			required: !0
+		},
+		color: {
+			type: String,
+			default: null,
+			validator: (e) => Object.keys(d).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) => p.includes(e)
+		}
+	},
+	emits: ["call"],
+	data() {
+		return {
+			actionFocused: !1,
+			labelWidth: "100%",
+			i18n: new s()
+		};
+	},
+	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 m.CHANNELS:
+					if (this.hasUnreads) return "channel unread";
+					break;
+				case m.LOCKED_CHANNEL:
+					if (this.hasUnreads) return "locked channel unread";
+					break;
+			}
+			return this.type;
+		},
+		generalRowListeners() {
+			return t(this.$attrs);
+		},
+		getAriaLabel() {
+			return this.ariaLabel ? this.ariaLabel : i([
+				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 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");
+		},
+		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(r(this.$el)), this.adjustLabelWidth();
+	},
+	beforeUnmount: function() {
+		this.resizeObserver.disconnect();
+	},
+	methods: {
+		removeClassStyleAttrs: n,
+		addClassStyleAttrs: e,
+		validateProps() {
+			this.type === m.CONTACT_CENTER && !Object.keys(d).includes(this.color) && console.error(f);
+		},
+		adjustLabelWidth() {
+			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";
+		}
+	}
+}, L = [
+	"data-qa",
+	"aria-label",
+	"title",
+	"href"
+], R = { class: "d-recipe-leftbar-row__alpha" }, z = {
+	key: 0,
+	class: "d-recipe-leftbar-row__is-typing"
+}, B = {
+	key: 0,
+	class: "d-recipe-leftbar-row__omega"
+}, V = {
+	key: 1,
+	class: "d-recipe-leftbar-row__active-voice"
+}, H = {
+	key: 3,
+	class: "d-recipe-leftbar-row__action",
+	"data-qa": "dt-recipe-leftbar-row-action"
 };
-function ae(t, n, r, g, l, e) {
-  const _ = o("dt-recipe-leftbar-general-row-icon"), p = o("dt-emoji-text-wrapper"), d = o("dt-tooltip"), f = o("dt-icon-waveform"), E = o("dt-badge"), U = o("dt-icon-phone"), B = o("dt-button"), A = G("dt-tooltip");
-  return a(), h("div", O({ class: e.leftbarGeneralRowClasses }, e.addClassStyleAttrs(t.$attrs), { "data-qa": "dt-recipe-leftbar-row" }), [
-    i("a", O({
-      class: "d-recipe-leftbar-row__primary",
-      "data-qa": "data-qa" in t.$attrs ? t.$attrs["data-qa"] : "d-recipe-leftbar-row-link",
-      "aria-label": e.getAriaLabel,
-      title: r.description,
-      href: "href" in t.$attrs ? t.$attrs.href : "javascript:void(0)"
-    }, e.removeClassStyleAttrs(t.$attrs), x(e.generalRowListeners, !0)), [
-      i("div", $, [
-        r.isTyping ? L((a(), h("div", ee, [...n[3] || (n[3] = [
-          i("span", null, null, -1),
-          i("span", null, null, -1),
-          i("span", null, null, -1)
-        ])])), [
-          [A, e.typingTooltip]
-        ]) : R(t.$slots, "left", { key: 1 }, () => [
-          u(_, {
-            type: e.getIcon,
-            color: r.color,
-            "icon-size": r.iconSize,
-            "data-qa": "dt-recipe-leftbar-row-icon"
-          }, null, 8, ["type", "color", "icon-size"])
-        ])
-      ]),
-      i("div", {
-        class: "d-recipe-leftbar-row__label",
-        style: j(`flex-basis: ${l.labelWidth}`)
-      }, [
-        R(t.$slots, "label", {}, () => [
-          u(p, {
-            class: "d-recipe-leftbar-row__description",
-            "data-qa": "dt-recipe-leftbar-row-description",
-            size: "200"
-          }, {
-            default: s(() => [
-              w(m(r.description), 1)
-            ]),
-            _: 1
-          })
-        ])
-      ], 4)
-    ], 16, Q),
-    e.hasActions ? (a(), h("div", te, [
-      r.dndText ? (a(), T(d, {
-        key: 0,
-        placement: "top",
-        message: e.dndTextTooltip
-      }, {
-        anchor: s(() => [
-          i("div", {
-            ref: "d-recipe-leftbar-row-dnd",
-            class: "d-recipe-leftbar-row__dnd",
-            "data-qa": "dt-recipe-leftbar-row-dnd"
-          }, m(r.dndText), 513)
-        ]),
-        _: 1
-      }, 8, ["message"])) : c("", !0),
-      r.activeVoiceChat ? L((a(), h("div", re, [
-        u(f, { size: "300" })
-      ])), [
-        [A, e.activeVoiceChatTooltip]
-      ]) : e.showUnreadCount || e.showUnreadMentionCount ? (a(), T(d, {
-        key: 2,
-        message: e.unreadCountTooltip,
-        placement: "top"
-      }, {
-        anchor: s(() => [
-          e.showUnreadCount ? (a(), T(E, {
-            key: 0,
-            kind: "count",
-            type: "bulletin",
-            "data-qa": "dt-recipe-leftbar-row-unread-badge",
-            class: S(["d-recipe-leftbar-row__unread-badge", {
-              "d-recipe-leftbar-row__unread-count-badge": e.shouldApplyCustomStyleForCountBadge
-            }])
-          }, {
-            default: s(() => [
-              w(m(r.unreadCount), 1)
-            ]),
-            _: 1
-          }, 8, ["class"])) : c("", !0),
-          e.showUnreadMentionCount ? (a(), T(E, {
-            key: 1,
-            kind: "count",
-            type: "bulletin",
-            "data-qa": "dt-recipe-leftbar-row-unread-mention-badge",
-            class: S([
-              "d-recipe-leftbar-row__unread-badge",
-              { "d-recipe-leftbar-row__unread-mention-count-badge": e.shouldApplyCustomStyleForCountBadge },
-              { "d-recipe-leftbar-row__unread-mention-only-count-badge": e.shouldApplyCustomStyleForMentionOnly }
-            ])
-          }, {
-            default: s(() => [
-              w(m(r.unreadMentionCount), 1)
-            ]),
-            _: 1
-          }, 8, ["class"])) : c("", !0)
-        ]),
-        _: 1
-      }, 8, ["message"])) : c("", !0),
-      r.hasCallButton ? (a(), h("div", ne, [
-        u(d, {
-          message: e.callButtonTooltip,
-          placement: "top"
-        }, {
-          anchor: s(() => [
-            u(B, {
-              class: "d-recipe-leftbar-row__action-button",
-              "data-qa": "dt-recipe-leftbar-row-action-call-button",
-              circle: "",
-              size: "xs",
-              kind: "inverted",
-              "aria-label": e.callButtonTooltip,
-              onFocus: n[0] || (n[0] = (y) => l.actionFocused = !0),
-              onBlur: n[1] || (n[1] = (y) => l.actionFocused = !1),
-              onClick: n[2] || (n[2] = P((y) => t.$emit("call", y), ["stop"]))
-            }, {
-              icon: s(() => [
-                u(U, { size: "200" })
-              ]),
-              _: 1
-            }, 8, ["aria-label"])
-          ]),
-          _: 1
-        }, 8, ["message"])
-      ])) : c("", !0)
-    ])) : c("", !0)
-  ], 16);
+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), 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, 8, [
+		"type",
+		"color",
+		"icon-size"
+	])])]), y("div", {
+		class: "d-recipe-leftbar-row__label",
+		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: j(() => [b(k(n.description), 1)]),
+		_: 1
+	})])], 4)], 16, L), a.hasActions ? (T(), v("div", B, [
+		n.dndText ? (T(), g(c, {
+			key: 0,
+			placement: "top",
+			message: a.dndTextTooltip
+		}, {
+			anchor: j(() => [y("div", {
+				ref: "d-recipe-leftbar-row-dnd",
+				class: "d-recipe-leftbar-row__dnd",
+				"data-qa": "dt-recipe-leftbar-row-dnd"
+			}, k(n.dndText), 513)]),
+			_: 1
+		}, 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: j(() => [a.showUnreadCount ? (T(), g(u, {
+				key: 0,
+				kind: "count",
+				type: "bulletin",
+				"data-qa": "dt-recipe-leftbar-row-unread-badge",
+				class: C(["d-recipe-leftbar-row__unread-badge", { "d-recipe-leftbar-row__unread-count-badge": a.shouldApplyCustomStyleForCountBadge }])
+			}, {
+				default: j(() => [b(k(n.unreadCount), 1)]),
+				_: 1
+			}, 8, ["class"])) : _("", !0), a.showUnreadMentionCount ? (T(), g(u, {
+				key: 1,
+				kind: "count",
+				type: "bulletin",
+				"data-qa": "dt-recipe-leftbar-row-unread-mention-badge",
+				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: j(() => [b(k(n.unreadMentionCount), 1)]),
+				_: 1
+			}, 8, ["class"])) : _("", !0)]),
+			_: 1
+		}, 8, ["message"])) : _("", !0),
+		n.hasCallButton ? (T(), v("div", H, [x(c, {
+			message: a.callButtonTooltip,
+			placement: "top"
+		}, {
+			anchor: j(() => [x(f, {
+				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] = N((t) => e.$emit("call", t), ["stop"]))
+			}, {
+				icon: j(() => [x(d, { size: "200" })]),
+				_: 1
+			}, 8, ["aria-label"])]),
+			_: 1
+		}, 8, ["message"])])) : _("", !0)
+	])) : _("", !0)], 16);
 }
-const Ce = /* @__PURE__ */ X(J, [["render", ae]]);
-export {
-  Ce as default
-};
-//# sourceMappingURL=general-row.js.map
+var W = /* @__PURE__ */ a(I, [["render", U]]);
+//#endregion
+export { W as default };
+
+//# sourceMappingURL=general-row.js.map