@dialpad/dialtone 9.83.1 → 9.83.2

package/dist/vue2/packages/dialtone-vue2/recipes/leftbar/contact_row/contact_row.vue.cjs

@@ -1,193 +0,0 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const emoji_text_wrapper = require("../../../components/emoji_text_wrapper/emoji_text_wrapper.vue.cjs");
-const avatar = require("../../../components/avatar/avatar.vue.cjs");
-const common_utils = require("../../../../../common/utils.cjs");
-const vue2 = require("@dialpad/dialtone-icons/vue2");
-const _pluginVue2_normalizer = require("../../../../../_virtual/_plugin-vue2_normalizer.cjs");
-const general_row = require("../general_row/general_row.vue.cjs");
-const _sfc_main = {
-  name: "DtRecipeContactRow",
-  components: {
-    DtAvatar: avatar.default,
-    DtRecipeGeneralRow: general_row.default,
-    DtEmojiTextWrapper: emoji_text_wrapper.default,
-    DtIconUser: vue2.DtIconUser
-  },
-  inheritAttrs: false,
-  props: {
-    /**
-     * Optional avatar image url.
-     * If not provided it will use the initial of the name.
-     */
-    avatarSrc: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Determines whether to show the presence indicator for
-     * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',
-     * or 'active'. By default, it's null and nothing is shown.
-     * defer validation to avatar component.
-     * @values null, busy, away, offline, active
-     */
-    avatarPresence: {
-      type: String,
-      default: null
-    },
-    /**
-     * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.
-     */
-    avatarSeed: {
-      type: String,
-      default: null
-    },
-    /**
-     * Avatar color to display if `avatarSrc` is empty.
-     */
-    avatarColor: {
-      type: String,
-      default: null
-    },
-    /**
-     * Text describing the user's presence, such as "in a meeting"
-     */
-    presenceText: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Name of the contact
-     */
-    name: {
-      type: String,
-      required: true
-    },
-    /**
-     * Status as set by the user.
-     */
-    userStatus: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Gives a faded style to be used when muted
-     */
-    muted: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Number of unread messages
-     */
-    unreadCount: {
-      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: false
-    },
-    /**
-     * Determines if the row is selected
-     */
-    selected: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Initials will never be shown. Instead it will show a "User" icon.
-     */
-    noInitials: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Shows an "is typing" animation over the avatar when true.
-     */
-    isTyping: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether the contact row should display a call button when hovered.
-     */
-    hasCallButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Text shown when the call button is hovered.
-     */
-    callButtonTooltip: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Text shown when the unread count is hovered.
-     */
-    unreadCountTooltip: {
-      type: String,
-      default: ""
-    }
-  },
-  emits: [
-    /**
-     * Native click event on the row itself
-     *
-     * @event click
-     * @type {PointerEvent | KeyboardEvent}
-     */
-    "click",
-    /**
-     * Call button clicked
-     *
-     * @event call
-     * @type {PointerEvent | KeyboardEvent}
-     */
-    "call"
-  ],
-  computed: {
-    presenceColorClass() {
-      switch (this.avatarPresence) {
-        case "active":
-          return "d-fc-success";
-        case "busy":
-          return "d-fc-critical";
-        case "away":
-          return "d-fc-warning";
-        default:
-          return void 0;
-      }
-    },
-    contactDescription() {
-      return common_utils.safeConcatStrings([this.name, this.presenceText, this.userStatus]);
-    }
-  }
-};
-var _sfc_render = function render() {
-  var _vm = this, _c = _vm._self._c;
-  return _c("dt-recipe-general-row", _vm._g(_vm._b({ attrs: { "unread-count": _vm.unreadCount, "description": _vm.contactDescription, "has-unreads": _vm.hasUnreads, "selected": _vm.selected, "has-call-button": _vm.hasCallButton, "muted": _vm.muted, "is-typing": _vm.isTyping, "call-button-tooltip": _vm.callButtonTooltip, "unread-count-tooltip": _vm.unreadCountTooltip, "data-qa": "contact-row" }, scopedSlots: _vm._u([{ key: "left", fn: function() {
-    return [_c("dt-avatar", { attrs: { "full-name": _vm.name, "image-src": _vm.avatarSrc, "color": _vm.avatarColor, "image-alt": "", "size": "sm", "seed": _vm.avatarSeed, "presence": _vm.avatarPresence }, scopedSlots: _vm._u([_vm.noInitials ? { key: "icon", fn: function() {
-      return [_c("dt-icon-user", { attrs: { "size": "200" } })];
-    }, proxy: true } : null], null, true) })];
-  }, proxy: true }, { key: "label", fn: function() {
-    return [_c("dt-emoji-text-wrapper", { staticClass: "dt-leftbar-row__description", attrs: { "data-qa": "dt-leftbar-row-description", "size": "200" } }, [_vm._v(" " + _vm._s(_vm.name) + " ")]), _c("div", { staticClass: "dt-leftbar-row__status" }, [_vm.presenceText ? _c("span", { class: ["dt-leftbar-row__meta-context", _vm.presenceColorClass], attrs: { "data-qa": "dt-leftbar-row-presence-text" } }, [_vm._v(" " + _vm._s(_vm.presenceText) + " ")]) : _vm._e(), _vm.userStatus ? _c("dt-emoji-text-wrapper", { staticClass: "dt-leftbar-row__meta-custom", attrs: { "size": "100", "element-type": "span", "data-qa": "dt-leftbar-row-user-status" } }, [_vm._v(" " + _vm._s(_vm.userStatus) + " ")]) : _vm._e()], 1)];
-  }, proxy: true }]) }, "dt-recipe-general-row", _vm.$attrs, false), _vm.$listeners));
-};
-var _sfc_staticRenderFns = [];
-var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
-  _sfc_main,
-  _sfc_render,
-  _sfc_staticRenderFns,
-  false,
-  null,
-  null
-);
-const contact_row = __component__.exports;
-exports.default = contact_row;
-//# sourceMappingURL=contact_row.vue.cjs.map

package/dist/vue2/packages/dialtone-vue2/recipes/leftbar/contact_row/contact_row.vue.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"contact_row.vue.cjs","sources":["../../../../../../recipes/leftbar/contact_row/contact_row.vue"],"sourcesContent":["<template>\n  <dt-recipe-general-row\n    :unread-count=\"unreadCount\"\n    :description=\"contactDescription\"\n    :has-unreads=\"hasUnreads\"\n    :selected=\"selected\"\n    :has-call-button=\"hasCallButton\"\n    :muted=\"muted\"\n    :is-typing=\"isTyping\"\n    :call-button-tooltip=\"callButtonTooltip\"\n    :unread-count-tooltip=\"unreadCountTooltip\"\n    v-bind=\"$attrs\"\n    data-qa=\"contact-row\"\n    v-on=\"$listeners\"\n  >\n    <template #left>\n      <dt-avatar\n        :full-name=\"name\"\n        :image-src=\"avatarSrc\"\n        :color=\"avatarColor\"\n        image-alt=\"\"\n        size=\"sm\"\n        :seed=\"avatarSeed\"\n        :presence=\"avatarPresence\"\n      >\n        <template\n          v-if=\"noInitials\"\n          #icon\n        >\n          <dt-icon-user\n            size=\"200\"\n          />\n        </template>\n      </dt-avatar>\n    </template>\n    <template #label>\n      <dt-emoji-text-wrapper\n        class=\"dt-leftbar-row__description\"\n        data-qa=\"dt-leftbar-row-description\"\n        size=\"200\"\n      >\n        {{ name }}\n      </dt-emoji-text-wrapper>\n      <div class=\"dt-leftbar-row__status\">\n        <span\n          v-if=\"presenceText\"\n          data-qa=\"dt-leftbar-row-presence-text\"\n          :class=\"['dt-leftbar-row__meta-context', presenceColorClass]\"\n        >\n          {{ presenceText }}\n        </span>\n        <dt-emoji-text-wrapper\n          v-if=\"userStatus\"\n          size=\"100\"\n          element-type=\"span\"\n          data-qa=\"dt-leftbar-row-user-status\"\n          class=\"dt-leftbar-row__meta-custom\"\n        >\n          {{ userStatus }}\n        </dt-emoji-text-wrapper>\n      </div>\n    </template>\n  </dt-recipe-general-row>\n</template>\n\n<script>\nimport { DtRecipeGeneralRow } from '@/recipes/leftbar/general_row';\nimport DtEmojiTextWrapper from '@/components/emoji_text_wrapper/emoji_text_wrapper.vue';\nimport DtAvatar from '@/components/avatar/avatar.vue';\nimport { safeConcatStrings } from '@/common/utils';\nimport { DtIconUser } from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n  name: 'DtRecipeContactRow',\n\n  components: {\n    DtAvatar,\n    DtRecipeGeneralRow,\n    DtEmojiTextWrapper,\n    DtIconUser,\n  },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Optional avatar image url.\n     * If not provided it will use the initial of the name.\n     */\n    avatarSrc: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines whether to show the presence indicator for\n     * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',\n     * or 'active'. By default, it's null and nothing is shown.\n     * defer validation to avatar component.\n     * @values null, busy, away, offline, active\n     */\n    avatarPresence: {\n      type: String,\n      default: null,\n    },\n\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     * Avatar color to display if `avatarSrc` is empty.\n     */\n    avatarColor: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Text describing the user's presence, such as \"in a meeting\"\n     */\n    presenceText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Name of the contact\n     */\n    name: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Status as set by the user.\n     */\n    userStatus: {\n      type: String,\n      default: '',\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     * Number of unread messages\n     */\n    unreadCount: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Styles the row with an increased font weight to convey it has unreads. This must be true to see\n     * the unread count badge.\n     */\n    hasUnreads: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines if the row is selected\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * 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     * Shows an \"is typing\" animation over the avatar when true.\n     */\n    isTyping: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Whether the contact row should display a call button when hovered.\n     */\n    hasCallButton: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Text shown when the call button is hovered.\n     */\n    callButtonTooltip: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Text shown when the unread count is hovered.\n     */\n    unreadCountTooltip: {\n      type: String,\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native click event on the row itself\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n\n    /**\n     * Call button clicked\n     *\n     * @event call\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'call',\n  ],\n\n  computed: {\n    presenceColorClass () {\n      switch (this.avatarPresence) {\n        case 'active':\n          return 'd-fc-success';\n        case 'busy':\n          return 'd-fc-critical';\n        case 'away':\n          return 'd-fc-warning';\n        default:\n          return undefined;\n      }\n    },\n\n    contactDescription () {\n      return safeConcatStrings([this.name, this.presenceText, this.userStatus]);\n    },\n  },\n};\n</script>\n"],"names":["DtAvatar","DtRecipeGeneralRow","DtEmojiTextWrapper","DtIconUser","safeConcatStrings"],"mappings":";;;;;;;;AAwEA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,UAAAA,OAAA;AAAA,IACA,oBAAAC,YAAA;AAAA,IACA,oBAAAC,mBAAA;AAAA,IACA,YAAAC,KAAA;AAAA,EACA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,eAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,mBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,qBAAA;AACA,cAAA,KAAA,gBAAA;AAAA,QACA,KAAA;AACA,iBAAA;AAAA,QACA,KAAA;AACA,iBAAA;AAAA,QACA,KAAA;AACA,iBAAA;AAAA,QACA;AACA,iBAAA;AAAA,MACA;AAAA,IACA;AAAA,IAEA,qBAAA;AACA,aAAAC,aAAA,kBAAA,CAAA,KAAA,MAAA,KAAA,cAAA,KAAA,UAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/vue2/packages/dialtone-vue2/recipes/leftbar/contact_row/contact_row.vue.js

@@ -1,193 +0,0 @@
-import DtEmojiTextWrapper from "../../../components/emoji_text_wrapper/emoji_text_wrapper.vue.js";
-import DtAvatar from "../../../components/avatar/avatar.vue.js";
-import { safeConcatStrings } from "../../../../../common/utils.js";
-import { DtIconUser } from "@dialpad/dialtone-icons/vue2";
-import normalizeComponent from "../../../../../_virtual/_plugin-vue2_normalizer.js";
-import DtRecipeGeneralRow from "../general_row/general_row.vue.js";
-const _sfc_main = {
-  name: "DtRecipeContactRow",
-  components: {
-    DtAvatar,
-    DtRecipeGeneralRow,
-    DtEmojiTextWrapper,
-    DtIconUser
-  },
-  inheritAttrs: false,
-  props: {
-    /**
-     * Optional avatar image url.
-     * If not provided it will use the initial of the name.
-     */
-    avatarSrc: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Determines whether to show the presence indicator for
-     * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',
-     * or 'active'. By default, it's null and nothing is shown.
-     * defer validation to avatar component.
-     * @values null, busy, away, offline, active
-     */
-    avatarPresence: {
-      type: String,
-      default: null
-    },
-    /**
-     * Avatar seed, set this to the user's ID to get the same avatar background gradient each time it is displayed.
-     */
-    avatarSeed: {
-      type: String,
-      default: null
-    },
-    /**
-     * Avatar color to display if `avatarSrc` is empty.
-     */
-    avatarColor: {
-      type: String,
-      default: null
-    },
-    /**
-     * Text describing the user's presence, such as "in a meeting"
-     */
-    presenceText: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Name of the contact
-     */
-    name: {
-      type: String,
-      required: true
-    },
-    /**
-     * Status as set by the user.
-     */
-    userStatus: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Gives a faded style to be used when muted
-     */
-    muted: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Number of unread messages
-     */
-    unreadCount: {
-      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: false
-    },
-    /**
-     * Determines if the row is selected
-     */
-    selected: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Initials will never be shown. Instead it will show a "User" icon.
-     */
-    noInitials: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Shows an "is typing" animation over the avatar when true.
-     */
-    isTyping: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether the contact row should display a call button when hovered.
-     */
-    hasCallButton: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Text shown when the call button is hovered.
-     */
-    callButtonTooltip: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Text shown when the unread count is hovered.
-     */
-    unreadCountTooltip: {
-      type: String,
-      default: ""
-    }
-  },
-  emits: [
-    /**
-     * Native click event on the row itself
-     *
-     * @event click
-     * @type {PointerEvent | KeyboardEvent}
-     */
-    "click",
-    /**
-     * Call button clicked
-     *
-     * @event call
-     * @type {PointerEvent | KeyboardEvent}
-     */
-    "call"
-  ],
-  computed: {
-    presenceColorClass() {
-      switch (this.avatarPresence) {
-        case "active":
-          return "d-fc-success";
-        case "busy":
-          return "d-fc-critical";
-        case "away":
-          return "d-fc-warning";
-        default:
-          return void 0;
-      }
-    },
-    contactDescription() {
-      return safeConcatStrings([this.name, this.presenceText, this.userStatus]);
-    }
-  }
-};
-var _sfc_render = function render() {
-  var _vm = this, _c = _vm._self._c;
-  return _c("dt-recipe-general-row", _vm._g(_vm._b({ attrs: { "unread-count": _vm.unreadCount, "description": _vm.contactDescription, "has-unreads": _vm.hasUnreads, "selected": _vm.selected, "has-call-button": _vm.hasCallButton, "muted": _vm.muted, "is-typing": _vm.isTyping, "call-button-tooltip": _vm.callButtonTooltip, "unread-count-tooltip": _vm.unreadCountTooltip, "data-qa": "contact-row" }, scopedSlots: _vm._u([{ key: "left", fn: function() {
-    return [_c("dt-avatar", { attrs: { "full-name": _vm.name, "image-src": _vm.avatarSrc, "color": _vm.avatarColor, "image-alt": "", "size": "sm", "seed": _vm.avatarSeed, "presence": _vm.avatarPresence }, scopedSlots: _vm._u([_vm.noInitials ? { key: "icon", fn: function() {
-      return [_c("dt-icon-user", { attrs: { "size": "200" } })];
-    }, proxy: true } : null], null, true) })];
-  }, proxy: true }, { key: "label", fn: function() {
-    return [_c("dt-emoji-text-wrapper", { staticClass: "dt-leftbar-row__description", attrs: { "data-qa": "dt-leftbar-row-description", "size": "200" } }, [_vm._v(" " + _vm._s(_vm.name) + " ")]), _c("div", { staticClass: "dt-leftbar-row__status" }, [_vm.presenceText ? _c("span", { class: ["dt-leftbar-row__meta-context", _vm.presenceColorClass], attrs: { "data-qa": "dt-leftbar-row-presence-text" } }, [_vm._v(" " + _vm._s(_vm.presenceText) + " ")]) : _vm._e(), _vm.userStatus ? _c("dt-emoji-text-wrapper", { staticClass: "dt-leftbar-row__meta-custom", attrs: { "size": "100", "element-type": "span", "data-qa": "dt-leftbar-row-user-status" } }, [_vm._v(" " + _vm._s(_vm.userStatus) + " ")]) : _vm._e()], 1)];
-  }, proxy: true }]) }, "dt-recipe-general-row", _vm.$attrs, false), _vm.$listeners));
-};
-var _sfc_staticRenderFns = [];
-var __component__ = /* @__PURE__ */ normalizeComponent(
-  _sfc_main,
-  _sfc_render,
-  _sfc_staticRenderFns,
-  false,
-  null,
-  null
-);
-const contact_row = __component__.exports;
-export {
-  contact_row as default
-};
-//# sourceMappingURL=contact_row.vue.js.map

package/dist/vue2/packages/dialtone-vue2/recipes/leftbar/contact_row/contact_row.vue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"contact_row.vue.js","sources":["../../../../../../recipes/leftbar/contact_row/contact_row.vue"],"sourcesContent":["<template>\n  <dt-recipe-general-row\n    :unread-count=\"unreadCount\"\n    :description=\"contactDescription\"\n    :has-unreads=\"hasUnreads\"\n    :selected=\"selected\"\n    :has-call-button=\"hasCallButton\"\n    :muted=\"muted\"\n    :is-typing=\"isTyping\"\n    :call-button-tooltip=\"callButtonTooltip\"\n    :unread-count-tooltip=\"unreadCountTooltip\"\n    v-bind=\"$attrs\"\n    data-qa=\"contact-row\"\n    v-on=\"$listeners\"\n  >\n    <template #left>\n      <dt-avatar\n        :full-name=\"name\"\n        :image-src=\"avatarSrc\"\n        :color=\"avatarColor\"\n        image-alt=\"\"\n        size=\"sm\"\n        :seed=\"avatarSeed\"\n        :presence=\"avatarPresence\"\n      >\n        <template\n          v-if=\"noInitials\"\n          #icon\n        >\n          <dt-icon-user\n            size=\"200\"\n          />\n        </template>\n      </dt-avatar>\n    </template>\n    <template #label>\n      <dt-emoji-text-wrapper\n        class=\"dt-leftbar-row__description\"\n        data-qa=\"dt-leftbar-row-description\"\n        size=\"200\"\n      >\n        {{ name }}\n      </dt-emoji-text-wrapper>\n      <div class=\"dt-leftbar-row__status\">\n        <span\n          v-if=\"presenceText\"\n          data-qa=\"dt-leftbar-row-presence-text\"\n          :class=\"['dt-leftbar-row__meta-context', presenceColorClass]\"\n        >\n          {{ presenceText }}\n        </span>\n        <dt-emoji-text-wrapper\n          v-if=\"userStatus\"\n          size=\"100\"\n          element-type=\"span\"\n          data-qa=\"dt-leftbar-row-user-status\"\n          class=\"dt-leftbar-row__meta-custom\"\n        >\n          {{ userStatus }}\n        </dt-emoji-text-wrapper>\n      </div>\n    </template>\n  </dt-recipe-general-row>\n</template>\n\n<script>\nimport { DtRecipeGeneralRow } from '@/recipes/leftbar/general_row';\nimport DtEmojiTextWrapper from '@/components/emoji_text_wrapper/emoji_text_wrapper.vue';\nimport DtAvatar from '@/components/avatar/avatar.vue';\nimport { safeConcatStrings } from '@/common/utils';\nimport { DtIconUser } from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n  name: 'DtRecipeContactRow',\n\n  components: {\n    DtAvatar,\n    DtRecipeGeneralRow,\n    DtEmojiTextWrapper,\n    DtIconUser,\n  },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Optional avatar image url.\n     * If not provided it will use the initial of the name.\n     */\n    avatarSrc: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines whether to show the presence indicator for\n     * Avatar - accepts PRESENCE_STATES values: 'busy', 'away', 'offline',\n     * or 'active'. By default, it's null and nothing is shown.\n     * defer validation to avatar component.\n     * @values null, busy, away, offline, active\n     */\n    avatarPresence: {\n      type: String,\n      default: null,\n    },\n\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     * Avatar color to display if `avatarSrc` is empty.\n     */\n    avatarColor: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Text describing the user's presence, such as \"in a meeting\"\n     */\n    presenceText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Name of the contact\n     */\n    name: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Status as set by the user.\n     */\n    userStatus: {\n      type: String,\n      default: '',\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     * Number of unread messages\n     */\n    unreadCount: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Styles the row with an increased font weight to convey it has unreads. This must be true to see\n     * the unread count badge.\n     */\n    hasUnreads: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines if the row is selected\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * 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     * Shows an \"is typing\" animation over the avatar when true.\n     */\n    isTyping: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Whether the contact row should display a call button when hovered.\n     */\n    hasCallButton: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Text shown when the call button is hovered.\n     */\n    callButtonTooltip: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Text shown when the unread count is hovered.\n     */\n    unreadCountTooltip: {\n      type: String,\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native click event on the row itself\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n\n    /**\n     * Call button clicked\n     *\n     * @event call\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'call',\n  ],\n\n  computed: {\n    presenceColorClass () {\n      switch (this.avatarPresence) {\n        case 'active':\n          return 'd-fc-success';\n        case 'busy':\n          return 'd-fc-critical';\n        case 'away':\n          return 'd-fc-warning';\n        default:\n          return undefined;\n      }\n    },\n\n    contactDescription () {\n      return safeConcatStrings([this.name, this.presenceText, this.userStatus]);\n    },\n  },\n};\n</script>\n"],"names":[],"mappings":";;;;;;AAwEA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,eAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,mBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,oBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,qBAAA;AACA,cAAA,KAAA,gBAAA;AAAA,QACA,KAAA;AACA,iBAAA;AAAA,QACA,KAAA;AACA,iBAAA;AAAA,QACA,KAAA;AACA,iBAAA;AAAA,QACA;AACA,iBAAA;AAAA,MACA;AAAA,IACA;AAAA,IAEA,qBAAA;AACA,aAAA,kBAAA,CAAA,KAAA,MAAA,KAAA,cAAA,KAAA,UAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;"}