@dialpad/dialtone-vue 2.183.2 → 2.184.1

package/dist/common/validators.js

@@ -1,23 +0,0 @@
-import { VALIDATION_MESSAGE_TYPES } from "./constants.js";
-function validationMessageValidator(rawMessages) {
-  if (!rawMessages) {
-    return true;
-  }
-  return rawMessages.every((message) => {
-    if (typeof message === "string") {
-      return true;
-    }
-    if (typeof message === "object") {
-      return Object.values(VALIDATION_MESSAGE_TYPES).includes(message == null ? void 0 : message.type);
-    }
-    return false;
-  });
-}
-const index = {
-  validationMessageValidator
-};
-export {
-  index as default,
-  validationMessageValidator
-};
-//# sourceMappingURL=validators.js.map

package/dist/common/validators.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"validators.js","sources":["../../common/validators/index.js"],"sourcesContent":["import {\n  VALIDATION_MESSAGE_TYPES,\n} from '../constants';\n\nexport function validationMessageValidator (rawMessages) {\n  if (!rawMessages) {\n    return true;\n  }\n\n  return rawMessages.every(message => {\n    if (typeof message === 'string') {\n      return true;\n    }\n\n    if (typeof message === 'object') {\n      return Object.values(VALIDATION_MESSAGE_TYPES).includes(message?.type);\n    }\n\n    return false;\n  });\n}\n\nexport default {\n  validationMessageValidator,\n};\n"],"names":[],"mappings":";AAIO,SAAS,2BAA4B,aAAa;AACvD,MAAI,CAAC,aAAa;AAChB,WAAO;AAAA,EACR;AAED,SAAO,YAAY,MAAM,aAAW;AAClC,QAAI,OAAO,YAAY,UAAU;AAC/B,aAAO;AAAA,IACR;AAED,QAAI,OAAO,YAAY,UAAU;AAC/B,aAAO,OAAO,OAAO,wBAAwB,EAAE,SAAS,mCAAS,IAAI;AAAA,IACtE;AAED,WAAO;AAAA,EACX,CAAG;AACH;AAEA,MAAe,QAAA;AAAA,EACb;AACF;"}

package/dist/components/avatar/avatar.vue.cjs

@@ -1,313 +0,0 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const common_utils = require("../../common/utils.cjs");
-const avatar_constants = require("./avatar_constants.cjs");
-const icon_constants = require("../icon/icon_constants.cjs");
-const utils = require("./utils.cjs");
-const _pluginVue2_normalizer = require("../../_virtual/_plugin-vue2_normalizer.cjs");
-const presence = require("../presence/presence.vue.cjs");
-const _sfc_main = {
-  name: "DtAvatar",
-  components: { DtPresence: presence.default },
-  inheritAttrs: false,
-  props: {
-    /**
-     * Id of the avatar content wrapper element
-     */
-    id: {
-      type: String,
-      default() {
-        return common_utils.getUniqueString();
-      }
-    },
-    /**
-     * Pass in a seed to get the random color generation based on that string. For example if you pass in a
-     * user ID as the string it will return the same randomly generated colors every time for that user.
-     */
-    seed: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Set the avatar background to a specific color. If undefined will randomize the color which can be deterministic
-     * if the seed prop is set.
-     */
-    color: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * The size of the avatar
-     * @values xs, sm, md, lg, xl
-     */
-    size: {
-      type: String,
-      default: "md",
-      validator: (size) => Object.keys(avatar_constants.AVATAR_SIZE_MODIFIERS).includes(size)
-    },
-    /**
-     * Used to customize the avatar container
-     */
-    avatarClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Set classes on the avatar canvas. Wrapper around the core avatar image.
-     */
-    canvasClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Pass through classes. Used to customize the avatar icon
-     */
-    iconClass: {
-      type: [String, Array, Object],
-      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.
-     * @values null, busy, away, offline, active
-     */
-    presence: {
-      type: String,
-      default: avatar_constants.AVATAR_PRESENCE_STATES.NONE,
-      validator: (state) => {
-        return Object.values(avatar_constants.AVATAR_PRESENCE_STATES).includes(state);
-      }
-    },
-    /**
-     * A set of props to be passed into the presence component.
-     */
-    presenceProps: {
-      type: Object,
-      default: () => ({})
-    },
-    /**
-     * Determines whether to show a group avatar.
-     * Limit to 2 digits max, more than 99 will be rendered as “99+”.
-     * if the number is 1 or less it would just show the regular avatar as if group had not been set.
-     */
-    group: {
-      type: Number,
-      default: void 0,
-      validator: (group) => avatar_constants.AVATAR_GROUP_VALIDATOR(group)
-    },
-    /**
-     * The text that overlays the avatar
-     */
-    overlayText: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Used to customize the avatar overlay
-     */
-    overlayClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Source of the image
-     */
-    imageSrc: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Alt attribute of the image, required if imageSrc is provided.
-     * Can be set to '' (empty string) if the image is described
-     * in text nearby
-     */
-    imageAlt: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Icon size to be displayed on the avatar
-     * @values 100, 200, 300, 400, 500, 600, 700, 800
-     */
-    iconSize: {
-      type: String,
-      default: "",
-      validator: (size) => !size || Object.keys(icon_constants.ICON_SIZE_MODIFIERS).includes(size)
-    },
-    /**
-     * Full name used to extract initials.
-     */
-    fullName: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Makes the avatar focusable and clickable,
-     * emits a click event when clicked.
-     */
-    clickable: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Descriptive label for the icon.
-     * To avoid a11y issues, set this prop if clickable and iconName are set.
-     */
-    iconAriaLabel: {
-      type: String,
-      default: void 0
-    }
-  },
-  emits: [
-    /**
-     * Avatar click event
-     *
-     * @event click
-     * @type {PointerEvent | KeyboardEvent}
-     */
-    "click"
-  ],
-  data() {
-    return {
-      AVATAR_SIZE_MODIFIERS: avatar_constants.AVATAR_SIZE_MODIFIERS,
-      AVATAR_KIND_MODIFIERS: avatar_constants.AVATAR_KIND_MODIFIERS,
-      AVATAR_PRESENCE_SIZE_MODIFIERS: avatar_constants.AVATAR_PRESENCE_SIZE_MODIFIERS,
-      AVATAR_ICON_SIZES: avatar_constants.AVATAR_ICON_SIZES,
-      imageLoadedSuccessfully: null,
-      formattedInitials: "",
-      initializing: false
-    };
-  },
-  computed: {
-    hasOverlayIcon() {
-      return !!this.$slots.overlayIcon;
-    },
-    iconDataQa() {
-      return "dt-avatar-icon";
-    },
-    avatarClasses() {
-      return [
-        "d-avatar",
-        avatar_constants.AVATAR_SIZE_MODIFIERS[this.validatedSize],
-        this.avatarClass,
-        {
-          "d-avatar--group": this.showGroup,
-          [`d-avatar--color-${this.getColor()}`]: !this.isIconType(),
-          "d-avatar--clickable": this.clickable
-        }
-      ];
-    },
-    overlayClasses() {
-      return [
-        "d-avatar__overlay",
-        this.overlayClass,
-        { "d-avatar__overlay-icon": this.hasOverlayIcon }
-      ];
-    },
-    showGroup() {
-      return avatar_constants.AVATAR_GROUP_VALIDATOR(this.group);
-    },
-    formattedGroup() {
-      return this.group > 99 ? "99+" : this.group;
-    },
-    validatedSize() {
-      return this.group ? "xs" : this.size;
-    },
-    showImage() {
-      return this.imageLoadedSuccessfully !== false && this.imageSrc;
-    }
-  },
-  watch: {
-    fullName: {
-      immediate: true,
-      handler() {
-        this.formatInitials();
-      }
-    },
-    size: {
-      immediate: true,
-      handler() {
-        this.formatInitials();
-      }
-    },
-    group: {
-      immediate: true,
-      handler() {
-        this.formatInitials();
-      }
-    },
-    imageSrc(newSrc) {
-      this.imageLoadedSuccessfully = null;
-      if (!newSrc) return;
-      this.validateProps();
-      this.setImageListeners();
-    }
-  },
-  mounted() {
-    this.validateProps();
-    this.setImageListeners();
-  },
-  methods: {
-    isIconType() {
-      return this.$scopedSlots.icon && this.$scopedSlots.icon();
-    },
-    async setImageListeners() {
-      await this.$nextTick();
-      const el = this.$refs.avatarImage;
-      if (!el) return;
-      el.addEventListener("load", () => this._loadedImageEventHandler(el), { once: true });
-      el.addEventListener("error", () => this._erroredImageEventHandler(el), { once: true });
-    },
-    formatInitials() {
-      const initials = utils.extractInitialsFromName(this.fullName);
-      if (this.validatedSize === "xs") {
-        this.formattedInitials = "";
-      } else if (this.validatedSize === "sm") {
-        this.formattedInitials = initials[0];
-      } else {
-        this.formattedInitials = initials;
-      }
-    },
-    getColor() {
-      return this.color ?? common_utils.getRandomElement(avatar_constants.AVATAR_RANDOM_COLORS, this.seed);
-    },
-    _loadedImageEventHandler(el) {
-      this.imageLoadedSuccessfully = true;
-      el.classList.remove("d-d-none");
-    },
-    _erroredImageEventHandler(el) {
-      this.imageLoadedSuccessfully = false;
-      el.classList.add("d-d-none");
-    },
-    validateProps() {
-      if (this.imageSrc && this.imageAlt === void 0) {
-        console.error('image-alt required if image-src is provided. Can be set to "" (empty string) if the image is described in text nearby');
-      }
-    },
-    handleClick(e) {
-      if (!this.clickable) return;
-      this.$emit("click", e);
-    }
-  }
-};
-var _sfc_render = function render() {
-  var _vm = this, _c = _vm._self._c;
-  return _c(_vm.clickable ? "button" : "div", { tag: "component", class: _vm.avatarClasses, attrs: { "id": _vm.id, "data-qa": "dt-avatar" }, on: { "click": _vm.handleClick } }, [_c("div", { ref: "canvas", class: [
-    _vm.canvasClass,
-    "d-avatar__canvas",
-    { "d-avatar--image-loaded": _vm.imageLoadedSuccessfully }
-  ] }, [_vm.showImage ? _c("img", { ref: "avatarImage", staticClass: "d-avatar__image", attrs: { "data-qa": "dt-avatar-image", "src": _vm.imageSrc, "alt": _vm.imageAlt } }) : _vm.isIconType() ? _c("div", { class: [_vm.iconClass, _vm.AVATAR_KIND_MODIFIERS.icon], attrs: { "aria-label": _vm.clickable ? _vm.iconAriaLabel : "", "data-qa": _vm.iconDataQa, "role": _vm.clickable ? "button" : "" } }, [_vm._t("icon", null, { "iconSize": _vm.iconSize || _vm.AVATAR_ICON_SIZES[_vm.size] })], 2) : _c("span", { class: [_vm.AVATAR_KIND_MODIFIERS.initials] }, [_vm._v(" " + _vm._s(_vm.formattedInitials) + " ")])]), _vm.hasOverlayIcon || _vm.overlayText ? _c("div", { class: _vm.overlayClasses }, [_vm.hasOverlayIcon ? _vm._t("overlayIcon") : _vm.overlayText ? _c("p", { staticClass: "d-avatar__overlay-text" }, [_vm._v(" " + _vm._s(_vm.overlayText) + " ")]) : _vm._e()], 2) : _vm._e(), _vm.showGroup ? _c("span", { staticClass: "d-avatar__count", attrs: { "data-qa": "dt-avatar-count" } }, [_vm._v(_vm._s(_vm.formattedGroup))]) : _vm._e(), _vm.presence && !_vm.showGroup ? _c("dt-presence", _vm._b({ class: [
-    "d-avatar__presence",
-    _vm.AVATAR_PRESENCE_SIZE_MODIFIERS[_vm.size]
-  ], attrs: { "presence": _vm.presence, "data-qa": "dt-presence" } }, "dt-presence", _vm.presenceProps, false)) : _vm._e()], 1);
-};
-var _sfc_staticRenderFns = [];
-var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
-  _sfc_main,
-  _sfc_render,
-  _sfc_staticRenderFns
-);
-const DtAvatar = __component__.exports;
-exports.default = DtAvatar;
-//# sourceMappingURL=avatar.vue.cjs.map

package/dist/components/avatar/avatar.vue.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"avatar.vue.cjs","sources":["../../../components/avatar/avatar.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"clickable ? 'button' : 'div'\"\n    :id=\"id\"\n    :class=\"avatarClasses\"\n    data-qa=\"dt-avatar\"\n    @click=\"handleClick\"\n  >\n    <div\n      ref=\"canvas\"\n      :class=\"[\n        canvasClass,\n        'd-avatar__canvas',\n        { 'd-avatar--image-loaded': imageLoadedSuccessfully },\n      ]\"\n    >\n      <img\n        v-if=\"showImage\"\n        ref=\"avatarImage\"\n        class=\"d-avatar__image\"\n        data-qa=\"dt-avatar-image\"\n        :src=\"imageSrc\"\n        :alt=\"imageAlt\"\n      >\n      <div\n        v-else-if=\"isIconType()\"\n        :class=\"[iconClass, AVATAR_KIND_MODIFIERS.icon]\"\n        :aria-label=\"clickable ? iconAriaLabel : ''\"\n        :data-qa=\"iconDataQa\"\n        :role=\"clickable ? 'button' : ''\"\n      >\n        <!-- @slot Slot for avatar icon. It will display if no imageSrc is provided -->\n        <slot\n          name=\"icon\"\n          :icon-size=\"iconSize || AVATAR_ICON_SIZES[size]\"\n        />\n      </div>\n      <span\n        v-else\n        :class=\"[AVATAR_KIND_MODIFIERS.initials]\"\n      >\n        {{ formattedInitials }}\n      </span>\n    </div>\n    <div\n      v-if=\"hasOverlayIcon || overlayText\"\n      :class=\"overlayClasses\"\n    >\n      <!-- @slot Slot for overlay icon. -->\n      <slot\n        v-if=\"hasOverlayIcon\"\n        name=\"overlayIcon\"\n      />\n      <p\n        v-else-if=\"overlayText\"\n        class=\"d-avatar__overlay-text\"\n      >\n        {{ overlayText }}\n      </p>\n    </div>\n    <span\n      v-if=\"showGroup\"\n      class=\"d-avatar__count\"\n      data-qa=\"dt-avatar-count\"\n    >{{ formattedGroup }}</span>\n    <dt-presence\n      v-if=\"presence && !showGroup\"\n      :presence=\"presence\"\n      :class=\"[\n        'd-avatar__presence',\n        AVATAR_PRESENCE_SIZE_MODIFIERS[size],\n      ]\"\n      v-bind=\"presenceProps\"\n      data-qa=\"dt-presence\"\n    />\n  </component>\n</template>\n\n<script>\nimport { getUniqueString, getRandomElement } from '@/common/utils';\nimport { DtPresence } from '../presence';\nimport {\n  AVATAR_KIND_MODIFIERS,\n  AVATAR_SIZE_MODIFIERS,\n  AVATAR_PRESENCE_SIZE_MODIFIERS,\n  AVATAR_PRESENCE_STATES,\n  AVATAR_RANDOM_COLORS,\n  AVATAR_GROUP_VALIDATOR,\n  AVATAR_ICON_SIZES,\n} from './avatar_constants';\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon/icon_constants.js';\nimport { extractInitialsFromName } from './utils';\n\n/**\n * An avatar is a visual representation of a user or object.\n * @see https://dialtone.dialpad.com/components/avatar.html\n */\nexport default {\n  name: 'DtAvatar',\n  components: { DtPresence },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Id of the avatar content wrapper element\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * Pass in a seed to get the random color generation based on that string. For example if you pass in a\n     * user ID as the string it will return the same randomly generated colors every time for that user.\n     */\n    seed: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Set the avatar background to a specific color. If undefined will randomize the color which can be deterministic\n     * if the seed prop is set.\n     */\n    color: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * The size of the avatar\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (size) => Object.keys(AVATAR_SIZE_MODIFIERS).includes(size),\n    },\n\n    /**\n     * Used to customize the avatar container\n     */\n    avatarClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Set classes on the avatar canvas. Wrapper around the core avatar image.\n     */\n    canvasClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Pass through classes. Used to customize the avatar icon\n     */\n    iconClass: {\n      type: [String, Array, Object],\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     * @values null, busy, away, offline, active\n     */\n    presence: {\n      type: String,\n      default: AVATAR_PRESENCE_STATES.NONE,\n      validator: (state) => {\n        return Object.values(AVATAR_PRESENCE_STATES).includes(state);\n      },\n    },\n\n    /**\n     * A set of props to be passed into the presence component.\n     */\n    presenceProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * Determines whether to show a group avatar.\n     * Limit to 2 digits max, more than 99 will be rendered as “99+”.\n     * if the number is 1 or less it would just show the regular avatar as if group had not been set.\n     */\n    group: {\n      type: Number,\n      default: undefined,\n      validator: (group) => AVATAR_GROUP_VALIDATOR(group),\n    },\n\n    /**\n     * The text that overlays the avatar\n     */\n    overlayText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Used to customize the avatar overlay\n     */\n    overlayClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Source of the image\n     */\n    imageSrc: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Alt attribute of the image, required if imageSrc is provided.\n     * Can be set to '' (empty string) if the image is described\n     * in text nearby\n     */\n    imageAlt: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Icon size to be displayed on the avatar\n     * @values 100, 200, 300, 400, 500, 600, 700, 800\n     */\n    iconSize: {\n      type: String,\n      default: '',\n      validator: (size) => !size || Object.keys(ICON_SIZE_MODIFIERS).includes(size),\n    },\n\n    /**\n     * Full name used to extract initials.\n     */\n    fullName: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Makes the avatar focusable and clickable,\n     * emits a click event when clicked.\n     */\n    clickable: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the icon.\n     * To avoid a11y issues, set this prop if clickable and iconName are set.\n     */\n    iconAriaLabel: {\n      type: String,\n      default: undefined,\n    },\n  },\n\n  emits: [\n    /**\n     * Avatar click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n  ],\n\n  data () {\n    return {\n      AVATAR_SIZE_MODIFIERS,\n      AVATAR_KIND_MODIFIERS,\n      AVATAR_PRESENCE_SIZE_MODIFIERS,\n      AVATAR_ICON_SIZES,\n      imageLoadedSuccessfully: null,\n      formattedInitials: '',\n      initializing: false,\n    };\n  },\n\n  computed: {\n    hasOverlayIcon () {\n      return !!this.$slots.overlayIcon;\n    },\n\n    iconDataQa () {\n      return 'dt-avatar-icon';\n    },\n\n    avatarClasses () {\n      return [\n        'd-avatar',\n        AVATAR_SIZE_MODIFIERS[this.validatedSize],\n        this.avatarClass,\n        {\n          'd-avatar--group': this.showGroup,\n          [`d-avatar--color-${this.getColor()}`]: !this.isIconType(),\n          'd-avatar--clickable': this.clickable,\n        },\n      ];\n    },\n\n    overlayClasses () {\n      return [\n        'd-avatar__overlay',\n        this.overlayClass,\n        { 'd-avatar__overlay-icon': this.hasOverlayIcon },\n      ];\n    },\n\n    showGroup () {\n      return AVATAR_GROUP_VALIDATOR(this.group);\n    },\n\n    formattedGroup () {\n      return this.group > 99 ? '99+' : this.group;\n    },\n\n    validatedSize () {\n      // TODO: Group only supports xs size for now. Remove this when we support other sizes.\n      return this.group ? 'xs' : this.size;\n    },\n\n    showImage () {\n      return this.imageLoadedSuccessfully !== false && this.imageSrc;\n    },\n  },\n\n  watch: {\n    fullName: {\n      immediate: true,\n      handler () {\n        this.formatInitials();\n      },\n    },\n\n    size: {\n      immediate: true,\n      handler () {\n        this.formatInitials();\n      },\n    },\n\n    group: {\n      immediate: true,\n      handler () {\n        this.formatInitials();\n      },\n    },\n\n    imageSrc (newSrc) {\n      this.imageLoadedSuccessfully = null;\n      if (!newSrc) return;\n\n      this.validateProps();\n      this.setImageListeners();\n    },\n  },\n\n  mounted () {\n    this.validateProps();\n    this.setImageListeners();\n  },\n\n  methods: {\n    isIconType () {\n      return this.$scopedSlots.icon && this.$scopedSlots.icon();\n    },\n\n    async setImageListeners () {\n      await this.$nextTick();\n      const el = this.$refs.avatarImage;\n      if (!el) return;\n\n      el.addEventListener('load', () => this._loadedImageEventHandler(el), { once: true });\n      el.addEventListener('error', () => this._erroredImageEventHandler(el), { once: true });\n    },\n\n    formatInitials () {\n      const initials = extractInitialsFromName(this.fullName);\n\n      if (this.validatedSize === 'xs') {\n        this.formattedInitials = '';\n      } else if (this.validatedSize === 'sm') {\n        this.formattedInitials = initials[0];\n      } else {\n        this.formattedInitials = initials;\n      }\n    },\n\n    getColor () {\n      return this.color ?? getRandomElement(AVATAR_RANDOM_COLORS, this.seed);\n    },\n\n    _loadedImageEventHandler (el) {\n      this.imageLoadedSuccessfully = true;\n      el.classList.remove('d-d-none');\n    },\n\n    _erroredImageEventHandler (el) {\n      this.imageLoadedSuccessfully = false;\n      el.classList.add('d-d-none');\n    },\n\n    validateProps () {\n      if (this.imageSrc && this.imageAlt === undefined) {\n        console.error('image-alt required if image-src is provided. Can be set to \"\" (empty string) if the image is described in text nearby');\n      }\n    },\n\n    handleClick (e) {\n      if (!this.clickable) return;\n      this.$emit('click', e);\n    },\n  },\n};\n</script>\n"],"names":["DtPresence","getUniqueString","AVATAR_SIZE_MODIFIERS","AVATAR_PRESENCE_STATES","AVATAR_GROUP_VALIDATOR","ICON_SIZE_MODIFIERS","AVATAR_KIND_MODIFIERS","AVATAR_PRESENCE_SIZE_MODIFIERS","AVATAR_ICON_SIZES","extractInitialsFromName","getRandomElement","AVATAR_RANDOM_COLORS"],"mappings":"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"}

package/dist/components/avatar/avatar.vue.js

@@ -1,313 +0,0 @@
-import { getUniqueString, getRandomElement } from "../../common/utils.js";
-import { AVATAR_SIZE_MODIFIERS, AVATAR_PRESENCE_STATES, AVATAR_GROUP_VALIDATOR, AVATAR_KIND_MODIFIERS, AVATAR_PRESENCE_SIZE_MODIFIERS, AVATAR_ICON_SIZES, AVATAR_RANDOM_COLORS } from "./avatar_constants.js";
-import { ICON_SIZE_MODIFIERS } from "../icon/icon_constants.js";
-import { extractInitialsFromName } from "./utils.js";
-import normalizeComponent from "../../_virtual/_plugin-vue2_normalizer.js";
-import DtPresence from "../presence/presence.vue.js";
-const _sfc_main = {
-  name: "DtAvatar",
-  components: { DtPresence },
-  inheritAttrs: false,
-  props: {
-    /**
-     * Id of the avatar content wrapper element
-     */
-    id: {
-      type: String,
-      default() {
-        return getUniqueString();
-      }
-    },
-    /**
-     * Pass in a seed to get the random color generation based on that string. For example if you pass in a
-     * user ID as the string it will return the same randomly generated colors every time for that user.
-     */
-    seed: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Set the avatar background to a specific color. If undefined will randomize the color which can be deterministic
-     * if the seed prop is set.
-     */
-    color: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * The size of the avatar
-     * @values xs, sm, md, lg, xl
-     */
-    size: {
-      type: String,
-      default: "md",
-      validator: (size) => Object.keys(AVATAR_SIZE_MODIFIERS).includes(size)
-    },
-    /**
-     * Used to customize the avatar container
-     */
-    avatarClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Set classes on the avatar canvas. Wrapper around the core avatar image.
-     */
-    canvasClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Pass through classes. Used to customize the avatar icon
-     */
-    iconClass: {
-      type: [String, Array, Object],
-      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.
-     * @values null, busy, away, offline, active
-     */
-    presence: {
-      type: String,
-      default: AVATAR_PRESENCE_STATES.NONE,
-      validator: (state) => {
-        return Object.values(AVATAR_PRESENCE_STATES).includes(state);
-      }
-    },
-    /**
-     * A set of props to be passed into the presence component.
-     */
-    presenceProps: {
-      type: Object,
-      default: () => ({})
-    },
-    /**
-     * Determines whether to show a group avatar.
-     * Limit to 2 digits max, more than 99 will be rendered as “99+”.
-     * if the number is 1 or less it would just show the regular avatar as if group had not been set.
-     */
-    group: {
-      type: Number,
-      default: void 0,
-      validator: (group) => AVATAR_GROUP_VALIDATOR(group)
-    },
-    /**
-     * The text that overlays the avatar
-     */
-    overlayText: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Used to customize the avatar overlay
-     */
-    overlayClass: {
-      type: [String, Array, Object],
-      default: ""
-    },
-    /**
-     * Source of the image
-     */
-    imageSrc: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Alt attribute of the image, required if imageSrc is provided.
-     * Can be set to '' (empty string) if the image is described
-     * in text nearby
-     */
-    imageAlt: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Icon size to be displayed on the avatar
-     * @values 100, 200, 300, 400, 500, 600, 700, 800
-     */
-    iconSize: {
-      type: String,
-      default: "",
-      validator: (size) => !size || Object.keys(ICON_SIZE_MODIFIERS).includes(size)
-    },
-    /**
-     * Full name used to extract initials.
-     */
-    fullName: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Makes the avatar focusable and clickable,
-     * emits a click event when clicked.
-     */
-    clickable: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Descriptive label for the icon.
-     * To avoid a11y issues, set this prop if clickable and iconName are set.
-     */
-    iconAriaLabel: {
-      type: String,
-      default: void 0
-    }
-  },
-  emits: [
-    /**
-     * Avatar click event
-     *
-     * @event click
-     * @type {PointerEvent | KeyboardEvent}
-     */
-    "click"
-  ],
-  data() {
-    return {
-      AVATAR_SIZE_MODIFIERS,
-      AVATAR_KIND_MODIFIERS,
-      AVATAR_PRESENCE_SIZE_MODIFIERS,
-      AVATAR_ICON_SIZES,
-      imageLoadedSuccessfully: null,
-      formattedInitials: "",
-      initializing: false
-    };
-  },
-  computed: {
-    hasOverlayIcon() {
-      return !!this.$slots.overlayIcon;
-    },
-    iconDataQa() {
-      return "dt-avatar-icon";
-    },
-    avatarClasses() {
-      return [
-        "d-avatar",
-        AVATAR_SIZE_MODIFIERS[this.validatedSize],
-        this.avatarClass,
-        {
-          "d-avatar--group": this.showGroup,
-          [`d-avatar--color-${this.getColor()}`]: !this.isIconType(),
-          "d-avatar--clickable": this.clickable
-        }
-      ];
-    },
-    overlayClasses() {
-      return [
-        "d-avatar__overlay",
-        this.overlayClass,
-        { "d-avatar__overlay-icon": this.hasOverlayIcon }
-      ];
-    },
-    showGroup() {
-      return AVATAR_GROUP_VALIDATOR(this.group);
-    },
-    formattedGroup() {
-      return this.group > 99 ? "99+" : this.group;
-    },
-    validatedSize() {
-      return this.group ? "xs" : this.size;
-    },
-    showImage() {
-      return this.imageLoadedSuccessfully !== false && this.imageSrc;
-    }
-  },
-  watch: {
-    fullName: {
-      immediate: true,
-      handler() {
-        this.formatInitials();
-      }
-    },
-    size: {
-      immediate: true,
-      handler() {
-        this.formatInitials();
-      }
-    },
-    group: {
-      immediate: true,
-      handler() {
-        this.formatInitials();
-      }
-    },
-    imageSrc(newSrc) {
-      this.imageLoadedSuccessfully = null;
-      if (!newSrc) return;
-      this.validateProps();
-      this.setImageListeners();
-    }
-  },
-  mounted() {
-    this.validateProps();
-    this.setImageListeners();
-  },
-  methods: {
-    isIconType() {
-      return this.$scopedSlots.icon && this.$scopedSlots.icon();
-    },
-    async setImageListeners() {
-      await this.$nextTick();
-      const el = this.$refs.avatarImage;
-      if (!el) return;
-      el.addEventListener("load", () => this._loadedImageEventHandler(el), { once: true });
-      el.addEventListener("error", () => this._erroredImageEventHandler(el), { once: true });
-    },
-    formatInitials() {
-      const initials = extractInitialsFromName(this.fullName);
-      if (this.validatedSize === "xs") {
-        this.formattedInitials = "";
-      } else if (this.validatedSize === "sm") {
-        this.formattedInitials = initials[0];
-      } else {
-        this.formattedInitials = initials;
-      }
-    },
-    getColor() {
-      return this.color ?? getRandomElement(AVATAR_RANDOM_COLORS, this.seed);
-    },
-    _loadedImageEventHandler(el) {
-      this.imageLoadedSuccessfully = true;
-      el.classList.remove("d-d-none");
-    },
-    _erroredImageEventHandler(el) {
-      this.imageLoadedSuccessfully = false;
-      el.classList.add("d-d-none");
-    },
-    validateProps() {
-      if (this.imageSrc && this.imageAlt === void 0) {
-        console.error('image-alt required if image-src is provided. Can be set to "" (empty string) if the image is described in text nearby');
-      }
-    },
-    handleClick(e) {
-      if (!this.clickable) return;
-      this.$emit("click", e);
-    }
-  }
-};
-var _sfc_render = function render() {
-  var _vm = this, _c = _vm._self._c;
-  return _c(_vm.clickable ? "button" : "div", { tag: "component", class: _vm.avatarClasses, attrs: { "id": _vm.id, "data-qa": "dt-avatar" }, on: { "click": _vm.handleClick } }, [_c("div", { ref: "canvas", class: [
-    _vm.canvasClass,
-    "d-avatar__canvas",
-    { "d-avatar--image-loaded": _vm.imageLoadedSuccessfully }
-  ] }, [_vm.showImage ? _c("img", { ref: "avatarImage", staticClass: "d-avatar__image", attrs: { "data-qa": "dt-avatar-image", "src": _vm.imageSrc, "alt": _vm.imageAlt } }) : _vm.isIconType() ? _c("div", { class: [_vm.iconClass, _vm.AVATAR_KIND_MODIFIERS.icon], attrs: { "aria-label": _vm.clickable ? _vm.iconAriaLabel : "", "data-qa": _vm.iconDataQa, "role": _vm.clickable ? "button" : "" } }, [_vm._t("icon", null, { "iconSize": _vm.iconSize || _vm.AVATAR_ICON_SIZES[_vm.size] })], 2) : _c("span", { class: [_vm.AVATAR_KIND_MODIFIERS.initials] }, [_vm._v(" " + _vm._s(_vm.formattedInitials) + " ")])]), _vm.hasOverlayIcon || _vm.overlayText ? _c("div", { class: _vm.overlayClasses }, [_vm.hasOverlayIcon ? _vm._t("overlayIcon") : _vm.overlayText ? _c("p", { staticClass: "d-avatar__overlay-text" }, [_vm._v(" " + _vm._s(_vm.overlayText) + " ")]) : _vm._e()], 2) : _vm._e(), _vm.showGroup ? _c("span", { staticClass: "d-avatar__count", attrs: { "data-qa": "dt-avatar-count" } }, [_vm._v(_vm._s(_vm.formattedGroup))]) : _vm._e(), _vm.presence && !_vm.showGroup ? _c("dt-presence", _vm._b({ class: [
-    "d-avatar__presence",
-    _vm.AVATAR_PRESENCE_SIZE_MODIFIERS[_vm.size]
-  ], attrs: { "presence": _vm.presence, "data-qa": "dt-presence" } }, "dt-presence", _vm.presenceProps, false)) : _vm._e()], 1);
-};
-var _sfc_staticRenderFns = [];
-var __component__ = /* @__PURE__ */ normalizeComponent(
-  _sfc_main,
-  _sfc_render,
-  _sfc_staticRenderFns
-);
-const DtAvatar = __component__.exports;
-export {
-  DtAvatar as default
-};
-//# sourceMappingURL=avatar.vue.js.map