@dialpad/dialtone-vue 3.219.0-next.2 → 3.219.0

package/dist/lib/avatar/avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.js","sources":["../../../components/avatar/avatar.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"clickable ? 'button' : 'div'\"\n    :id=\"id\"\n    :class=\"avatarClasses\"\n    :style=\"avatarStyles\"\n    :data-avatar-family=\"!iconOnly ? computedFamily : undefined\"\n    :data-avatar-variant=\"!iconOnly ? computedVariant : undefined\"\n    data-qa=\"dt-avatar\"\n    :type=\"clickable ? 'button' : undefined\"\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      <div class=\"d-avatar__canvas-inner\">\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        >\n          <!-- @slot Slot for avatar icon. It will display if no imageSrc is provided -->\n          <slot name=\"icon\" />\n        </div>\n        <span\n          v-else\n          :class=\"[AVATAR_KIND_MODIFIERS.initials]\"\n        >\n          {{ formattedInitials }}\n        </span>\n      </div>\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      role=\"img\"\n      :aria-label=\"`${group} participants`\"\n    >{{ formattedGroup }}</span>\n    <dt-presence\n      v-if=\"presence && !showGroup && AVATAR_PRESENCE_SIZE_MODIFIERS[size]\"\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, hasSlotContent } 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_GROUP_VALIDATOR,\n  AVATAR_FAMILY_COUNT,\n  AVATAR_VARIANT_COUNT,\n  colorToFamilyVariant,\n  getRandomFamilyVariant,\n  computeAvatarHex,\n} from './avatar_constants';\nimport { extractInitialsFromName } from './utils';\n\n// Check if browser supports oklch() - only compute hex fallback if not\nconst supportsOklch = typeof CSS !== 'undefined' && CSS.supports?.('background', 'oklch(0.5 0.1 0)');\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  compatConfig: { MODE: 3 },\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     * **Recommended.** Pass a unique identifier (e.g., user ID) to generate consistent,\n     * deterministic colors for this avatar. The same seed always produces the same color.\n     * This is the preferred approach for most use cases.\n     */\n    seed: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * **Advanced.** Avatar color family (1-12). Each family represents a different hue\n     * offset from the theme's anchor. Only use this if you need explicit control over\n     * the color. For most cases, use `seed` instead.\n     * Families: 1=Red, 2=Orange, 3=Amber, 4=Yellow-Green, 5=Green, 6=Teal, 7=Cyan,\n     * 8=Blue, 9=Indigo, 10=Purple, 11=Magenta, 12=Pink\n     * @values 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12\n     */\n    family: {\n      type: Number,\n      default: undefined,\n      validator: (val) => val >= 1 && val <= AVATAR_FAMILY_COUNT,\n    },\n\n    /**\n     * **Advanced.** Avatar color variant (0-9). Controls lightness/chroma within the family.\n     * Only use this if you need explicit control over the color. For most cases, use `seed` instead.\n     * 0 = darkest, 9 = lightest. Variants 0-5 have light text, 6-9 have dark text.\n     * @values 0, 1, 2, 3, 4, 5, 6, 7, 8, 9\n     */\n    variant: {\n      type: Number,\n      default: undefined,\n      validator: (val) => val >= 0 && val < AVATAR_VARIANT_COUNT,\n    },\n\n    /**\n     * Avatar color code for backward compatibility. Converted internally\n     * to family/variant. For new code, use `seed` (recommended) or `family`/`variant`.\n     * Format: family (1-12) * 100 + variant (0-9) * 10, e.g., '540' = family 5, variant 4.\n     * @deprecated Use seed or family/variant instead.\n     */\n    color: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * The size of the avatar.\n     * T-shirt sizes (xs, sm, md, lg, xl) are deprecated and will be removed in the next major version.\n     * Please use the numeric scale instead.\n     * @values 100, 150, 200, 250, 300, 400, 500, 600, 700, 800, 900\n     */\n    size: {\n      type: [String, Number],\n      default: 300,\n      validator: (size) => Object.keys(AVATAR_SIZE_MODIFIERS).includes(String(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     * 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     * When true, renders the avatar with a transparent background and no color.\n     * Useful for displaying icons that should not have a colored background,\n     * such as channel or navigation icons.\n     */\n    iconOnly: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * When true, renders the avatar in a desaturated/washed-out state.\n     * Use this to indicate that a user is deactivated or inactive.\n     */\n    deactivated: {\n      type: Boolean,\n      default: false,\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      imageLoadedSuccessfully: null,\n      formattedInitials: '',\n      initializing: false,\n      hasSlotContent,\n      anchorHue: 0,\n    };\n  },\n\n  computed: {\n    hasOverlayIcon () {\n      return hasSlotContent(this.$slots.overlayIcon);\n    },\n\n    isIconType () {\n      return hasSlotContent(this.$slots.icon);\n    },\n\n    iconDataQa () {\n      return 'dt-avatar-icon';\n    },\n\n    /**\n     * Compute family from props, color prop, or random\n     */\n    computedFamily () {\n      // Icon-type avatars don't use color\n      if (this.isIconType) return undefined;\n\n      // Explicit family prop takes precedence\n      if (this.family !== undefined) return this.family;\n\n      // Color prop (converted to family/variant)\n      if (this.color !== undefined) {\n        const parsed = colorToFamilyVariant(this.color);\n        if (parsed) return parsed.family;\n      }\n\n      // Random based on seed\n      const random = getRandomFamilyVariant(this.seed);\n      return random.family;\n    },\n\n    /**\n     * Compute variant from props, color prop, or random\n     */\n    computedVariant () {\n      // Icon-type avatars don't use color\n      if (this.isIconType) return undefined;\n\n      // Explicit variant prop takes precedence\n      if (this.variant !== undefined) return this.variant;\n\n      // Color prop (converted to family/variant)\n      if (this.color !== undefined) {\n        const parsed = colorToFamilyVariant(this.color);\n        if (parsed) return parsed.variant;\n      }\n\n      // Random based on seed\n      const random = getRandomFamilyVariant(this.seed);\n      return random.variant;\n    },\n\n    avatarClasses () {\n      return [\n        'd-avatar',\n        this.$attrs.class,\n        AVATAR_SIZE_MODIFIERS[this.validatedSize],\n        this.avatarClass,\n        {\n          'd-avatar--group': this.showGroup,\n          'd-avatar--group-digits-2': this.showGroup && String(this.formattedGroup).length === 2,\n          'd-avatar--group-digits-3': this.showGroup && String(this.formattedGroup).length >= 3,\n          'd-avatar--clickable': this.clickable,\n          'd-avatar--presence': this.presence && !this.showGroup,\n          'd-avatar--icon-only': this.iconOnly,\n          'd-avatar--deactivated': this.deactivated,\n        },\n      ];\n    },\n\n    /**\n     * Compute inline styles for fallback color in browsers that don't support oklch()\n     */\n    avatarStyles () {\n      // $attrs.style can be object, string, or array — normalize to an array for merging\n      const attrStyle = this.$attrs.style;\n      const baseStyles = attrStyle != null ? [].concat(attrStyle) : [];\n\n      // Only compute hex fallback for browsers that don't support oklch()\n      if (!supportsOklch && !this.isIconType && this.computedFamily && this.computedVariant !== undefined) {\n        const fallbackHex = computeAvatarHex(this.computedFamily, this.computedVariant, this.anchorHue);\n        baseStyles.push({ '--avatar-color-background': fallbackHex });\n      }\n\n      return baseStyles.length > 0 ? baseStyles : undefined;\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      const size = String(this.validatedSize);\n      // Sizes 100-250 cap at 2 digits — too small for 3\n      const smallSizes = ['xs', '100', '150', '200', '250'];\n      const maxDigits = smallSizes.includes(size) ? 2 : 3;\n      if (maxDigits === 2) {\n        return this.group > 9 ? '9+' : this.group;\n      }\n      return this.group > 99 ? '99+' : this.group;\n    },\n\n    validatedSize () {\n      return 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    // Only read anchor hue for fallback computation in browsers without oklch() support\n    if (!supportsOklch) {\n      this.readAnchorHue();\n    }\n  },\n\n  methods: {\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      const size = String(this.validatedSize);\n\n      // xs/100 are too small for initials\n      if (size === 'xs' || size === '100') {\n        this.formattedInitials = '';\n      // sm/150/200 show single initial\n      } else if (size === 'sm' || size === '150' || size === '200') {\n        this.formattedInitials = initials[0];\n      } else {\n        this.formattedInitials = initials;\n      }\n    },\n\n    /**\n     * Read the anchor hue from CSS custom property for fallback computation\n     */\n    readAnchorHue () {\n      try {\n        const hueValue = getComputedStyle(document.documentElement)\n          .getPropertyValue('--dt-avatar-anchor-hue')\n          .trim();\n        this.anchorHue = parseFloat(hueValue) || 0;\n      } catch {\n        this.anchorHue = 0;\n      }\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":["supportsOklch","_a","_sfc_main","DtPresence","getUniqueString","val","AVATAR_FAMILY_COUNT","AVATAR_VARIANT_COUNT","size","AVATAR_SIZE_MODIFIERS","AVATAR_PRESENCE_STATES","state","group","AVATAR_GROUP_VALIDATOR","AVATAR_KIND_MODIFIERS","AVATAR_PRESENCE_SIZE_MODIFIERS","hasSlotContent","parsed","colorToFamilyVariant","getRandomFamilyVariant","attrStyle","baseStyles","fallbackHex","computeAvatarHex","newSrc","el","initials","extractInitialsFromName","hueValue","_hoisted_1","_openBlock","_createBlock","_resolveDynamicComponent","$props","$options","_createElementVNode","_normalizeClass","$data","_createElementBlock","_renderSlot","_ctx","_hoisted_4","_toDisplayString","_hoisted_5","_component_dt_presence","_mergeProps"],"mappings":"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"}
+{"version":3,"file":"avatar.js","names":[],"sources":["../../../components/avatar/avatar.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"clickable ? 'button' : 'div'\"\n    :id=\"id\"\n    :class=\"avatarClasses\"\n    :style=\"$attrs.style\"\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, hasSlotContent } 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  compatConfig: { MODE: 3 },\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      hasSlotContent,\n    };\n  },\n\n  computed: {\n    hasOverlayIcon () {\n      return hasSlotContent(this.$slots.overlayIcon);\n    },\n\n    iconDataQa () {\n      return 'dt-avatar-icon';\n    },\n\n    avatarClasses () {\n      return [\n        'd-avatar',\n        this.$attrs.class,\n        AVATAR_SIZE_MODIFIERS[this.validatedSize],\n        this.avatarClass,\n        {\n          'd-avatar--group': this.showGroup,\n          'd-avatar--group-digits-2': this.showGroup && this.group > 9 && this.group < 100,\n          'd-avatar--group-digits-3': this.showGroup && this.group > 99,\n          [`d-avatar--color-${this.getColor()}`]: !this.isIconType(),\n          'd-avatar--clickable': this.clickable,\n          'd-avatar--presence': this.presence && !this.showGroup,\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 hasSlotContent(this.$slots.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"],"mappings":"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"}

package/dist/lib/avatar/index.cjs

@@ -1,2 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("./avatar.cjs"),A=require("./avatar-constants.cjs");exports.DtAvatar=_.default;exports.AVATAR_CHROMA=A.AVATAR_CHROMA;exports.AVATAR_FAMILY_COUNT=A.AVATAR_FAMILY_COUNT;exports.AVATAR_GROUP_VALIDATOR=A.AVATAR_GROUP_VALIDATOR;exports.AVATAR_HUE_OFFSETS=A.AVATAR_HUE_OFFSETS;exports.AVATAR_ICON_SIZES=A.AVATAR_ICON_SIZES;exports.AVATAR_KIND_MODIFIERS=A.AVATAR_KIND_MODIFIERS;exports.AVATAR_LIGHTNESS=A.AVATAR_LIGHTNESS;exports.AVATAR_PRESENCE_SIZE_MODIFIERS=A.AVATAR_PRESENCE_SIZE_MODIFIERS;exports.AVATAR_PRESENCE_STATES=A.AVATAR_PRESENCE_STATES;exports.AVATAR_SIZE_MODIFIERS=A.AVATAR_SIZE_MODIFIERS;exports.AVATAR_VARIANT_COUNT=A.AVATAR_VARIANT_COUNT;exports.colorToFamilyVariant=A.colorToFamilyVariant;exports.computeAvatarHex=A.computeAvatarHex;exports.getRandomFamilyVariant=A.getRandomFamilyVariant;
-//# sourceMappingURL=index.cjs.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./avatar-constants.cjs`),t=require(`./avatar.cjs`);exports.AVATAR_COLORS=e.AVATAR_COLORS,exports.AVATAR_GROUP_VALIDATOR=e.AVATAR_GROUP_VALIDATOR,exports.AVATAR_ICON_SIZES=e.AVATAR_ICON_SIZES,exports.AVATAR_KIND_MODIFIERS=e.AVATAR_KIND_MODIFIERS,exports.AVATAR_PRESENCE_SIZE_MODIFIERS=e.AVATAR_PRESENCE_SIZE_MODIFIERS,exports.AVATAR_PRESENCE_STATES=e.AVATAR_PRESENCE_STATES,exports.AVATAR_RANDOM_COLORS=e.AVATAR_RANDOM_COLORS,exports.AVATAR_SIZE_MODIFIERS=e.AVATAR_SIZE_MODIFIERS,exports.DtAvatar=t.default;

package/dist/lib/avatar/index.js

@@ -1,20 +1,3 @@
-import { default as _ } from "./avatar.js";
-import { AVATAR_CHROMA as E, AVATAR_FAMILY_COUNT as I, AVATAR_GROUP_VALIDATOR as S, AVATAR_HUE_OFFSETS as V, AVATAR_ICON_SIZES as a, AVATAR_KIND_MODIFIERS as t, AVATAR_LIGHTNESS as O, AVATAR_PRESENCE_SIZE_MODIFIERS as o, AVATAR_PRESENCE_STATES as r, AVATAR_SIZE_MODIFIERS as F, AVATAR_VARIANT_COUNT as N, colorToFamilyVariant as e, computeAvatarHex as m, getRandomFamilyVariant as C } from "./avatar-constants.js";
-export {
-  E as AVATAR_CHROMA,
-  I as AVATAR_FAMILY_COUNT,
-  S as AVATAR_GROUP_VALIDATOR,
-  V as AVATAR_HUE_OFFSETS,
-  a as AVATAR_ICON_SIZES,
-  t as AVATAR_KIND_MODIFIERS,
-  O as AVATAR_LIGHTNESS,
-  o as AVATAR_PRESENCE_SIZE_MODIFIERS,
-  r as AVATAR_PRESENCE_STATES,
-  F as AVATAR_SIZE_MODIFIERS,
-  N as AVATAR_VARIANT_COUNT,
-  _ as DtAvatar,
-  e as colorToFamilyVariant,
-  m as computeAvatarHex,
-  C as getRandomFamilyVariant
-};
-//# sourceMappingURL=index.js.map
+import { AVATAR_COLORS as e, AVATAR_GROUP_VALIDATOR as t, AVATAR_ICON_SIZES as n, AVATAR_KIND_MODIFIERS as r, AVATAR_PRESENCE_SIZE_MODIFIERS as i, AVATAR_PRESENCE_STATES as a, AVATAR_RANDOM_COLORS as o, AVATAR_SIZE_MODIFIERS as s } from "./avatar-constants.js";
+import c from "./avatar.js";
+export { e as AVATAR_COLORS, t as AVATAR_GROUP_VALIDATOR, n as AVATAR_ICON_SIZES, r as AVATAR_KIND_MODIFIERS, i as AVATAR_PRESENCE_SIZE_MODIFIERS, a as AVATAR_PRESENCE_STATES, o as AVATAR_RANDOM_COLORS, s as AVATAR_SIZE_MODIFIERS, c as DtAvatar };

package/dist/lib/avatar/utils.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=t=>{if(typeof t!="string"||!t.trim())return"";t=t.replace(/[^\p{L}\p{N}\s]/gu,"");const r=t.trim().split(/\s+/g);return r.length===1?r.join("").substring(0,2):r.filter((e,i)=>i===0||i===r.length-1).map(e=>e.slice(0,1).toUpperCase()).join("")};exports.extractInitialsFromName=s;
-//# sourceMappingURL=utils.cjs.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=e=>{if(typeof e!=`string`||!e.trim())return``;e=e.replace(/[^\p{L}\p{N}\s]/gu,``);let t=e.trim().split(/\s+/g);return t.length===1?t.join(``).substring(0,2):t.filter((e,n)=>n===0||n===t.length-1).map(e=>e.slice(0,1).toUpperCase()).join(``)};exports.extractInitialsFromName=e;
+//# sourceMappingURL=utils.cjs.map

package/dist/lib/avatar/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.cjs","sources":["../../../components/avatar/utils.js"],"sourcesContent":["export const extractInitialsFromName = (fullName) => {\n  if (typeof fullName !== 'string' || !fullName.trim()) return '';\n\n  // sanitize fullName by leaving only letters, numbers and spaces\n  fullName = fullName.replace(/[^\\p{L}\\p{N}\\s]/gu, '');\n\n  const names = fullName.trim().split(/\\s+/g);\n\n  return names.length === 1\n    ? names.join('').substring(0, 2)\n    : names.filter((_, index) => (index === 0 || index === names.length - 1))\n      .map(name => name.slice(0, 1).toUpperCase())\n      .join('');\n};\n"],"names":["extractInitialsFromName","fullName","names","_","index","name"],"mappings":"gFAAY,MAACA,EAA2BC,GAAa,CACnD,GAAI,OAAOA,GAAa,UAAY,CAACA,EAAS,KAAI,EAAI,MAAO,GAG7DA,EAAWA,EAAS,QAAQ,oBAAqB,EAAE,EAEnD,MAAMC,EAAQD,EAAS,KAAI,EAAG,MAAM,MAAM,EAE1C,OAAOC,EAAM,SAAW,EACpBA,EAAM,KAAK,EAAE,EAAE,UAAU,EAAG,CAAC,EAC7BA,EAAM,OAAO,CAACC,EAAGC,IAAWA,IAAU,GAAKA,IAAUF,EAAM,OAAS,CAAE,EACrE,IAAIG,GAAQA,EAAK,MAAM,EAAG,CAAC,EAAE,YAAW,CAAE,EAC1C,KAAK,EAAE,CACd"}
+{"version":3,"file":"utils.cjs","names":[],"sources":["../../../components/avatar/utils.js"],"sourcesContent":["export const extractInitialsFromName = (fullName) => {\n  if (typeof fullName !== 'string' || !fullName.trim()) return '';\n\n  // sanitize fullName by leaving only letters, numbers and spaces\n  fullName = fullName.replace(/[^\\p{L}\\p{N}\\s]/gu, '');\n\n  const names = fullName.trim().split(/\\s+/g);\n\n  return names.length === 1\n    ? names.join('').substring(0, 2)\n    : names.filter((_, index) => (index === 0 || index === names.length - 1))\n      .map(name => name.slice(0, 1).toUpperCase())\n      .join('');\n};\n"],"mappings":"mEAAA,IAAa,EAA2B,GAAa,CACnD,GAAI,OAAO,GAAa,UAAY,CAAC,EAAS,MAAM,CAAE,MAAO,GAG7D,EAAW,EAAS,QAAQ,oBAAqB,GAAG,CAEpD,IAAM,EAAQ,EAAS,MAAM,CAAC,MAAM,OAAO,CAE3C,OAAO,EAAM,SAAW,EACpB,EAAM,KAAK,GAAG,CAAC,UAAU,EAAG,EAAE,CAC9B,EAAM,QAAQ,EAAG,IAAW,IAAU,GAAK,IAAU,EAAM,OAAS,EAAG,CACtE,IAAI,GAAQ,EAAK,MAAM,EAAG,EAAE,CAAC,aAAa,CAAC,CAC3C,KAAK,GAAG"}

package/dist/lib/avatar/utils.js

@@ -1,10 +1,11 @@
-const n = (t) => {
-  if (typeof t != "string" || !t.trim()) return "";
-  t = t.replace(/[^\p{L}\p{N}\s]/gu, "");
-  const r = t.trim().split(/\s+/g);
-  return r.length === 1 ? r.join("").substring(0, 2) : r.filter((s, i) => i === 0 || i === r.length - 1).map((s) => s.slice(0, 1).toUpperCase()).join("");
+//#region components/avatar/utils.js
+var e = (e) => {
+	if (typeof e != "string" || !e.trim()) return "";
+	e = e.replace(/[^\p{L}\p{N}\s]/gu, "");
+	let t = e.trim().split(/\s+/g);
+	return t.length === 1 ? t.join("").substring(0, 2) : t.filter((e, n) => n === 0 || n === t.length - 1).map((e) => e.slice(0, 1).toUpperCase()).join("");
 };
-export {
-  n as extractInitialsFromName
-};
-//# sourceMappingURL=utils.js.map
+//#endregion
+export { e as extractInitialsFromName };
+
+//# sourceMappingURL=utils.js.map

package/dist/lib/avatar/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../components/avatar/utils.js"],"sourcesContent":["export const extractInitialsFromName = (fullName) => {\n  if (typeof fullName !== 'string' || !fullName.trim()) return '';\n\n  // sanitize fullName by leaving only letters, numbers and spaces\n  fullName = fullName.replace(/[^\\p{L}\\p{N}\\s]/gu, '');\n\n  const names = fullName.trim().split(/\\s+/g);\n\n  return names.length === 1\n    ? names.join('').substring(0, 2)\n    : names.filter((_, index) => (index === 0 || index === names.length - 1))\n      .map(name => name.slice(0, 1).toUpperCase())\n      .join('');\n};\n"],"names":["extractInitialsFromName","fullName","names","_","index","name"],"mappings":"AAAY,MAACA,IAA0B,CAACC,MAAa;AACnD,MAAI,OAAOA,KAAa,YAAY,CAACA,EAAS,KAAI,EAAI,QAAO;AAG7D,EAAAA,IAAWA,EAAS,QAAQ,qBAAqB,EAAE;AAEnD,QAAMC,IAAQD,EAAS,KAAI,EAAG,MAAM,MAAM;AAE1C,SAAOC,EAAM,WAAW,IACpBA,EAAM,KAAK,EAAE,EAAE,UAAU,GAAG,CAAC,IAC7BA,EAAM,OAAO,CAACC,GAAGC,MAAWA,MAAU,KAAKA,MAAUF,EAAM,SAAS,CAAE,EACrE,IAAI,CAAAG,MAAQA,EAAK,MAAM,GAAG,CAAC,EAAE,YAAW,CAAE,EAC1C,KAAK,EAAE;AACd;"}
+{"version":3,"file":"utils.js","names":[],"sources":["../../../components/avatar/utils.js"],"sourcesContent":["export const extractInitialsFromName = (fullName) => {\n  if (typeof fullName !== 'string' || !fullName.trim()) return '';\n\n  // sanitize fullName by leaving only letters, numbers and spaces\n  fullName = fullName.replace(/[^\\p{L}\\p{N}\\s]/gu, '');\n\n  const names = fullName.trim().split(/\\s+/g);\n\n  return names.length === 1\n    ? names.join('').substring(0, 2)\n    : names.filter((_, index) => (index === 0 || index === names.length - 1))\n      .map(name => name.slice(0, 1).toUpperCase())\n      .join('');\n};\n"],"mappings":";AAAA,IAAa,KAA2B,MAAa;AACnD,KAAI,OAAO,KAAa,YAAY,CAAC,EAAS,MAAM,CAAE,QAAO;AAG7D,KAAW,EAAS,QAAQ,qBAAqB,GAAG;CAEpD,IAAM,IAAQ,EAAS,MAAM,CAAC,MAAM,OAAO;AAE3C,QAAO,EAAM,WAAW,IACpB,EAAM,KAAK,GAAG,CAAC,UAAU,GAAG,EAAE,GAC9B,EAAM,QAAQ,GAAG,MAAW,MAAU,KAAK,MAAU,EAAM,SAAS,EAAG,CACtE,KAAI,MAAQ,EAAK,MAAM,GAAG,EAAE,CAAC,aAAa,CAAC,CAC3C,KAAK,GAAG"}

package/dist/lib/badge/badge-constants.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={default:"",info:"d-badge--info",success:"d-badge--success",warning:"d-badge--warning",critical:"d-badge--critical",bulletin:"d-badge--bulletin",ai:"d-badge--ai"},d={label:"",count:"d-badge--count"},a={"black-400":"d-badge--decorate-black-400","black-500":"d-badge--decorate-black-500","black-900":"d-badge--decorate-black-900","red-200":"d-badge--decorate-red-200","red-300":"d-badge--decorate-red-300","red-400":"d-badge--decorate-red-400","purple-200":"d-badge--decorate-purple-200","purple-300":"d-badge--decorate-purple-300","purple-400":"d-badge--decorate-purple-400","purple-500":"d-badge--decorate-purple-500","blue-200":"d-badge--decorate-blue-200","blue-300":"d-badge--decorate-blue-300","blue-400":"d-badge--decorate-blue-400","green-300":"d-badge--decorate-green-300","green-400":"d-badge--decorate-green-400","green-500":"d-badge--decorate-green-500","gold-300":"d-badge--decorate-gold-300","gold-400":"d-badge--decorate-gold-400","gold-500":"d-badge--decorate-gold-500","magenta-200":"d-badge--decorate-magenta-200","magenta-300":"d-badge--decorate-magenta-300","magenta-400":"d-badge--decorate-magenta-400"};exports.BADGE_DECORATION_MODIFIERS=a;exports.BADGE_KIND_MODIFIERS=d;exports.BADGE_TYPE_MODIFIERS=e;
-//# sourceMappingURL=badge-constants.cjs.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={default:``,info:`d-badge--info`,success:`d-badge--success`,warning:`d-badge--warning`,critical:`d-badge--critical`,bulletin:`d-badge--bulletin`,ai:`d-badge--ai`},t={label:``,count:`d-badge--count`},n={"black-400":`d-badge--decorate-black-400`,"black-500":`d-badge--decorate-black-500`,"black-900":`d-badge--decorate-black-900`,"red-200":`d-badge--decorate-red-200`,"red-300":`d-badge--decorate-red-300`,"red-400":`d-badge--decorate-red-400`,"purple-200":`d-badge--decorate-purple-200`,"purple-300":`d-badge--decorate-purple-300`,"purple-400":`d-badge--decorate-purple-400`,"purple-500":`d-badge--decorate-purple-500`,"blue-200":`d-badge--decorate-blue-200`,"blue-300":`d-badge--decorate-blue-300`,"blue-400":`d-badge--decorate-blue-400`,"green-300":`d-badge--decorate-green-300`,"green-400":`d-badge--decorate-green-400`,"green-500":`d-badge--decorate-green-500`,"gold-300":`d-badge--decorate-gold-300`,"gold-400":`d-badge--decorate-gold-400`,"gold-500":`d-badge--decorate-gold-500`,"magenta-200":`d-badge--decorate-magenta-200`,"magenta-300":`d-badge--decorate-magenta-300`,"magenta-400":`d-badge--decorate-magenta-400`};exports.BADGE_DECORATION_MODIFIERS=n,exports.BADGE_KIND_MODIFIERS=t,exports.BADGE_TYPE_MODIFIERS=e;
+//# sourceMappingURL=badge-constants.cjs.map

package/dist/lib/badge/badge-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"badge-constants.cjs","sources":["../../../components/badge/badge_constants.js"],"sourcesContent":["export const BADGE_TYPE_MODIFIERS = {\n  default: '',\n  info: 'd-badge--info',\n  success: 'd-badge--success',\n  warning: 'd-badge--warning',\n  critical: 'd-badge--critical',\n  bulletin: 'd-badge--bulletin',\n  ai: 'd-badge--ai',\n};\n\nexport const BADGE_KIND_MODIFIERS = {\n  label: '',\n  count: 'd-badge--count',\n};\n\nexport const BADGE_DECORATION_MODIFIERS = {\n  'black-400': 'd-badge--decorate-black-400',\n  'black-500': 'd-badge--decorate-black-500',\n  'black-900': 'd-badge--decorate-black-900',\n  'red-200': 'd-badge--decorate-red-200',\n  'red-300': 'd-badge--decorate-red-300',\n  'red-400': 'd-badge--decorate-red-400',\n  'purple-200': 'd-badge--decorate-purple-200',\n  'purple-300': 'd-badge--decorate-purple-300',\n  'purple-400': 'd-badge--decorate-purple-400',\n  'purple-500': 'd-badge--decorate-purple-500',\n  'blue-200': 'd-badge--decorate-blue-200',\n  'blue-300': 'd-badge--decorate-blue-300',\n  'blue-400': 'd-badge--decorate-blue-400',\n  'green-300': 'd-badge--decorate-green-300',\n  'green-400': 'd-badge--decorate-green-400',\n  'green-500': 'd-badge--decorate-green-500',\n  'gold-300': 'd-badge--decorate-gold-300',\n  'gold-400': 'd-badge--decorate-gold-400',\n  'gold-500': 'd-badge--decorate-gold-500',\n  'magenta-200': 'd-badge--decorate-magenta-200',\n  'magenta-300': 'd-badge--decorate-magenta-300',\n  'magenta-400': 'd-badge--decorate-magenta-400',\n};\n"],"names":["BADGE_TYPE_MODIFIERS","BADGE_KIND_MODIFIERS","BADGE_DECORATION_MODIFIERS"],"mappings":"gFAAY,MAACA,EAAuB,CAClC,QAAS,GACT,KAAM,gBACN,QAAS,mBACT,QAAS,mBACT,SAAU,oBACV,SAAU,oBACV,GAAI,aACN,EAEaC,EAAuB,CAClC,MAAO,GACP,MAAO,gBACT,EAEaC,EAA6B,CACxC,YAAa,8BACb,YAAa,8BACb,YAAa,8BACb,UAAW,4BACX,UAAW,4BACX,UAAW,4BACX,aAAc,+BACd,aAAc,+BACd,aAAc,+BACd,aAAc,+BACd,WAAY,6BACZ,WAAY,6BACZ,WAAY,6BACZ,YAAa,8BACb,YAAa,8BACb,YAAa,8BACb,WAAY,6BACZ,WAAY,6BACZ,WAAY,6BACZ,cAAe,gCACf,cAAe,gCACf,cAAe,+BACjB"}
+{"version":3,"file":"badge-constants.cjs","names":[],"sources":["../../../components/badge/badge_constants.js"],"sourcesContent":["export const BADGE_TYPE_MODIFIERS = {\n  default: '',\n  info: 'd-badge--info',\n  success: 'd-badge--success',\n  warning: 'd-badge--warning',\n  critical: 'd-badge--critical',\n  bulletin: 'd-badge--bulletin',\n  ai: 'd-badge--ai',\n};\n\nexport const BADGE_KIND_MODIFIERS = {\n  label: '',\n  count: 'd-badge--count',\n};\n\nexport const BADGE_DECORATION_MODIFIERS = {\n  'black-400': 'd-badge--decorate-black-400',\n  'black-500': 'd-badge--decorate-black-500',\n  'black-900': 'd-badge--decorate-black-900',\n  'red-200': 'd-badge--decorate-red-200',\n  'red-300': 'd-badge--decorate-red-300',\n  'red-400': 'd-badge--decorate-red-400',\n  'purple-200': 'd-badge--decorate-purple-200',\n  'purple-300': 'd-badge--decorate-purple-300',\n  'purple-400': 'd-badge--decorate-purple-400',\n  'purple-500': 'd-badge--decorate-purple-500',\n  'blue-200': 'd-badge--decorate-blue-200',\n  'blue-300': 'd-badge--decorate-blue-300',\n  'blue-400': 'd-badge--decorate-blue-400',\n  'green-300': 'd-badge--decorate-green-300',\n  'green-400': 'd-badge--decorate-green-400',\n  'green-500': 'd-badge--decorate-green-500',\n  'gold-300': 'd-badge--decorate-gold-300',\n  'gold-400': 'd-badge--decorate-gold-400',\n  'gold-500': 'd-badge--decorate-gold-500',\n  'magenta-200': 'd-badge--decorate-magenta-200',\n  'magenta-300': 'd-badge--decorate-magenta-300',\n  'magenta-400': 'd-badge--decorate-magenta-400',\n};\n"],"mappings":"mEAAA,IAAa,EAAuB,CAClC,QAAS,GACT,KAAM,gBACN,QAAS,mBACT,QAAS,mBACT,SAAU,oBACV,SAAU,oBACV,GAAI,cACL,CAEY,EAAuB,CAClC,MAAO,GACP,MAAO,iBACR,CAEY,EAA6B,CACxC,YAAa,8BACb,YAAa,8BACb,YAAa,8BACb,UAAW,4BACX,UAAW,4BACX,UAAW,4BACX,aAAc,+BACd,aAAc,+BACd,aAAc,+BACd,aAAc,+BACd,WAAY,6BACZ,WAAY,6BACZ,WAAY,6BACZ,YAAa,8BACb,YAAa,8BACb,YAAa,8BACb,WAAY,6BACZ,WAAY,6BACZ,WAAY,6BACZ,cAAe,gCACf,cAAe,gCACf,cAAe,gCAChB"}

package/dist/lib/badge/badge-constants.js

@@ -1,41 +1,40 @@
-const e = {
-  default: "",
-  info: "d-badge--info",
-  success: "d-badge--success",
-  warning: "d-badge--warning",
-  critical: "d-badge--critical",
-  bulletin: "d-badge--bulletin",
-  ai: "d-badge--ai"
-}, d = {
-  label: "",
-  count: "d-badge--count"
-}, a = {
-  "black-400": "d-badge--decorate-black-400",
-  "black-500": "d-badge--decorate-black-500",
-  "black-900": "d-badge--decorate-black-900",
-  "red-200": "d-badge--decorate-red-200",
-  "red-300": "d-badge--decorate-red-300",
-  "red-400": "d-badge--decorate-red-400",
-  "purple-200": "d-badge--decorate-purple-200",
-  "purple-300": "d-badge--decorate-purple-300",
-  "purple-400": "d-badge--decorate-purple-400",
-  "purple-500": "d-badge--decorate-purple-500",
-  "blue-200": "d-badge--decorate-blue-200",
-  "blue-300": "d-badge--decorate-blue-300",
-  "blue-400": "d-badge--decorate-blue-400",
-  "green-300": "d-badge--decorate-green-300",
-  "green-400": "d-badge--decorate-green-400",
-  "green-500": "d-badge--decorate-green-500",
-  "gold-300": "d-badge--decorate-gold-300",
-  "gold-400": "d-badge--decorate-gold-400",
-  "gold-500": "d-badge--decorate-gold-500",
-  "magenta-200": "d-badge--decorate-magenta-200",
-  "magenta-300": "d-badge--decorate-magenta-300",
-  "magenta-400": "d-badge--decorate-magenta-400"
+//#region components/badge/badge_constants.js
+var e = {
+	default: "",
+	info: "d-badge--info",
+	success: "d-badge--success",
+	warning: "d-badge--warning",
+	critical: "d-badge--critical",
+	bulletin: "d-badge--bulletin",
+	ai: "d-badge--ai"
+}, t = {
+	label: "",
+	count: "d-badge--count"
+}, n = {
+	"black-400": "d-badge--decorate-black-400",
+	"black-500": "d-badge--decorate-black-500",
+	"black-900": "d-badge--decorate-black-900",
+	"red-200": "d-badge--decorate-red-200",
+	"red-300": "d-badge--decorate-red-300",
+	"red-400": "d-badge--decorate-red-400",
+	"purple-200": "d-badge--decorate-purple-200",
+	"purple-300": "d-badge--decorate-purple-300",
+	"purple-400": "d-badge--decorate-purple-400",
+	"purple-500": "d-badge--decorate-purple-500",
+	"blue-200": "d-badge--decorate-blue-200",
+	"blue-300": "d-badge--decorate-blue-300",
+	"blue-400": "d-badge--decorate-blue-400",
+	"green-300": "d-badge--decorate-green-300",
+	"green-400": "d-badge--decorate-green-400",
+	"green-500": "d-badge--decorate-green-500",
+	"gold-300": "d-badge--decorate-gold-300",
+	"gold-400": "d-badge--decorate-gold-400",
+	"gold-500": "d-badge--decorate-gold-500",
+	"magenta-200": "d-badge--decorate-magenta-200",
+	"magenta-300": "d-badge--decorate-magenta-300",
+	"magenta-400": "d-badge--decorate-magenta-400"
 };
-export {
-  a as BADGE_DECORATION_MODIFIERS,
-  d as BADGE_KIND_MODIFIERS,
-  e as BADGE_TYPE_MODIFIERS
-};
-//# sourceMappingURL=badge-constants.js.map
+//#endregion
+export { n as BADGE_DECORATION_MODIFIERS, t as BADGE_KIND_MODIFIERS, e as BADGE_TYPE_MODIFIERS };
+
+//# sourceMappingURL=badge-constants.js.map

package/dist/lib/badge/badge-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge-constants.js","sources":["../../../components/badge/badge_constants.js"],"sourcesContent":["export const BADGE_TYPE_MODIFIERS = {\n  default: '',\n  info: 'd-badge--info',\n  success: 'd-badge--success',\n  warning: 'd-badge--warning',\n  critical: 'd-badge--critical',\n  bulletin: 'd-badge--bulletin',\n  ai: 'd-badge--ai',\n};\n\nexport const BADGE_KIND_MODIFIERS = {\n  label: '',\n  count: 'd-badge--count',\n};\n\nexport const BADGE_DECORATION_MODIFIERS = {\n  'black-400': 'd-badge--decorate-black-400',\n  'black-500': 'd-badge--decorate-black-500',\n  'black-900': 'd-badge--decorate-black-900',\n  'red-200': 'd-badge--decorate-red-200',\n  'red-300': 'd-badge--decorate-red-300',\n  'red-400': 'd-badge--decorate-red-400',\n  'purple-200': 'd-badge--decorate-purple-200',\n  'purple-300': 'd-badge--decorate-purple-300',\n  'purple-400': 'd-badge--decorate-purple-400',\n  'purple-500': 'd-badge--decorate-purple-500',\n  'blue-200': 'd-badge--decorate-blue-200',\n  'blue-300': 'd-badge--decorate-blue-300',\n  'blue-400': 'd-badge--decorate-blue-400',\n  'green-300': 'd-badge--decorate-green-300',\n  'green-400': 'd-badge--decorate-green-400',\n  'green-500': 'd-badge--decorate-green-500',\n  'gold-300': 'd-badge--decorate-gold-300',\n  'gold-400': 'd-badge--decorate-gold-400',\n  'gold-500': 'd-badge--decorate-gold-500',\n  'magenta-200': 'd-badge--decorate-magenta-200',\n  'magenta-300': 'd-badge--decorate-magenta-300',\n  'magenta-400': 'd-badge--decorate-magenta-400',\n};\n"],"names":["BADGE_TYPE_MODIFIERS","BADGE_KIND_MODIFIERS","BADGE_DECORATION_MODIFIERS"],"mappings":"AAAY,MAACA,IAAuB;AAAA,EAClC,SAAS;AAAA,EACT,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,UAAU;AAAA,EACV,UAAU;AAAA,EACV,IAAI;AACN,GAEaC,IAAuB;AAAA,EAClC,OAAO;AAAA,EACP,OAAO;AACT,GAEaC,IAA6B;AAAA,EACxC,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AAAA,EACf,eAAe;AACjB;"}
+{"version":3,"file":"badge-constants.js","names":[],"sources":["../../../components/badge/badge_constants.js"],"sourcesContent":["export const BADGE_TYPE_MODIFIERS = {\n  default: '',\n  info: 'd-badge--info',\n  success: 'd-badge--success',\n  warning: 'd-badge--warning',\n  critical: 'd-badge--critical',\n  bulletin: 'd-badge--bulletin',\n  ai: 'd-badge--ai',\n};\n\nexport const BADGE_KIND_MODIFIERS = {\n  label: '',\n  count: 'd-badge--count',\n};\n\nexport const BADGE_DECORATION_MODIFIERS = {\n  'black-400': 'd-badge--decorate-black-400',\n  'black-500': 'd-badge--decorate-black-500',\n  'black-900': 'd-badge--decorate-black-900',\n  'red-200': 'd-badge--decorate-red-200',\n  'red-300': 'd-badge--decorate-red-300',\n  'red-400': 'd-badge--decorate-red-400',\n  'purple-200': 'd-badge--decorate-purple-200',\n  'purple-300': 'd-badge--decorate-purple-300',\n  'purple-400': 'd-badge--decorate-purple-400',\n  'purple-500': 'd-badge--decorate-purple-500',\n  'blue-200': 'd-badge--decorate-blue-200',\n  'blue-300': 'd-badge--decorate-blue-300',\n  'blue-400': 'd-badge--decorate-blue-400',\n  'green-300': 'd-badge--decorate-green-300',\n  'green-400': 'd-badge--decorate-green-400',\n  'green-500': 'd-badge--decorate-green-500',\n  'gold-300': 'd-badge--decorate-gold-300',\n  'gold-400': 'd-badge--decorate-gold-400',\n  'gold-500': 'd-badge--decorate-gold-500',\n  'magenta-200': 'd-badge--decorate-magenta-200',\n  'magenta-300': 'd-badge--decorate-magenta-300',\n  'magenta-400': 'd-badge--decorate-magenta-400',\n};\n"],"mappings":";AAAA,IAAa,IAAuB;CAClC,SAAS;CACT,MAAM;CACN,SAAS;CACT,SAAS;CACT,UAAU;CACV,UAAU;CACV,IAAI;CACL,EAEY,IAAuB;CAClC,OAAO;CACP,OAAO;CACR,EAEY,IAA6B;CACxC,aAAa;CACb,aAAa;CACb,aAAa;CACb,WAAW;CACX,WAAW;CACX,WAAW;CACX,cAAc;CACd,cAAc;CACd,cAAc;CACd,cAAc;CACd,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,aAAa;CACb,aAAa;CACb,aAAa;CACb,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,eAAe;CACf,eAAe;CACf,eAAe;CAChB"}

package/dist/lib/badge/badge.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./badge-constants.cjs"),a=require("../../common/utils/index.cjs"),e=require("vue"),l=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),r=require("../icon/icon-constants.cjs"),d={compatConfig:{MODE:3},name:"DtBadge",props:{iconSize:{type:String,default:"200",validator:t=>Object.keys(r.ICON_SIZE_MODIFIERS).includes(t)},text:{type:String,default:""},kind:{type:String,default:"label",validator:t=>Object.keys(n.BADGE_KIND_MODIFIERS).includes(t)},type:{type:String,default:"default",validator:t=>Object.keys(n.BADGE_TYPE_MODIFIERS).includes(t)},decoration:{type:String,default:void 0,validator:t=>Object.keys(n.BADGE_DECORATION_MODIFIERS).includes(t)},labelClass:{type:[String,Array,Object],default:""},subtle:{type:Boolean,default:!1},outlined:{type:Boolean,default:!1}},data(){return{BADGE_TYPE_MODIFIERS:n.BADGE_TYPE_MODIFIERS,BADGE_KIND_MODIFIERS:n.BADGE_KIND_MODIFIERS,BADGE_DECORATION_MODIFIERS:n.BADGE_DECORATION_MODIFIERS}},computed:{hasLeftIcon(){return a.hasSlotContent(this.$slots.startIcon)||a.hasSlotContent(this.$slots.leftIcon)},hasRightIcon(){return a.hasSlotContent(this.$slots.endIcon)||a.hasSlotContent(this.$slots.rightIcon)},hasIcons(){return this.hasLeftIcon||this.hasRightIcon}},updated(){this.validateProps()},methods:{validateProps(){this.validateTypePropCombination(),this.validateDecorationPropCombination()},validateTypePropCombination(){this.type==="ai"&&this.kind==="count"&&console.error("DtBadge error: type: 'ai' with kind: 'count' is an invalid combination."),this.type!=="bulletin"&&this.subtle&&console.error("DtBadge error: subtle can only be used with type 'bulletin'")},validateDecorationPropCombination(){this.decoration&&((this.kind!=="label"||this.type!=="default")&&console.error("DtBadge error: decoration prop can only be used with kind: 'label' and type: 'default'."),this.hasIcons&&console.error("DtBadge error: decoration prop cannot be used with startIcon or endIcon."))}}},c={key:0,class:"d-badge__decorative"},u={key:1,class:"d-badge__icon-left"},I={key:2,class:"d-badge__icon-right"};function _(t,D,o,S,i,s){return e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(["d-badge",i.BADGE_TYPE_MODIFIERS[o.type],i.BADGE_KIND_MODIFIERS[o.kind],i.BADGE_DECORATION_MODIFIERS[o.decoration],{"d-badge--subtle":o.subtle},{"d-badge--outlined":o.outlined}]),"data-qa":"dt-badge"},[o.decoration?(e.openBlock(),e.createElementBlock("span",c)):e.createCommentVNode("",!0),s.hasLeftIcon?(e.openBlock(),e.createElementBlock("span",u,[t.$slots.startIcon?e.renderSlot(t.$slots,"startIcon",{key:0,iconSize:o.iconSize}):e.renderSlot(t.$slots,"leftIcon",{key:1,iconSize:o.iconSize})])):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass(["d-badge__label",o.labelClass])},[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(o.text),1)])],2),s.hasRightIcon?(e.openBlock(),e.createElementBlock("span",I,[t.$slots.endIcon?e.renderSlot(t.$slots,"endIcon",{key:0,iconSize:o.iconSize}):e.renderSlot(t.$slots,"rightIcon",{key:1,iconSize:o.iconSize})])):e.createCommentVNode("",!0)],2)}const h=l._(d,[["render",_]]);exports.default=h;
-//# sourceMappingURL=badge.cjs.map
+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(`../icon/icon-constants.cjs`),r=require(`./badge-constants.cjs`);let i=require(`vue`);var a={compatConfig:{MODE:3},name:`DtBadge`,props:{iconSize:{type:String,default:`200`,validator:e=>Object.keys(n.ICON_SIZE_MODIFIERS).includes(e)},text:{type:String,default:``},kind:{type:String,default:`label`,validator:e=>Object.keys(r.BADGE_KIND_MODIFIERS).includes(e)},type:{type:String,default:`default`,validator:e=>Object.keys(r.BADGE_TYPE_MODIFIERS).includes(e)},decoration:{type:String,default:void 0,validator:e=>Object.keys(r.BADGE_DECORATION_MODIFIERS).includes(e)},labelClass:{type:[String,Array,Object],default:``},subtle:{type:Boolean,default:!1},outlined:{type:Boolean,default:!1}},data(){return{BADGE_TYPE_MODIFIERS:r.BADGE_TYPE_MODIFIERS,BADGE_KIND_MODIFIERS:r.BADGE_KIND_MODIFIERS,BADGE_DECORATION_MODIFIERS:r.BADGE_DECORATION_MODIFIERS}},computed:{hasLeftIcon(){return e.hasSlotContent(this.$slots.leftIcon)},hasRightIcon(){return e.hasSlotContent(this.$slots.rightIcon)},hasIcons(){return this.hasLeftIcon||this.hasRightIcon}},updated(){this.validateProps()},methods:{validateProps(){this.validateTypePropCombination(),this.validateDecorationPropCombination()},validateTypePropCombination(){this.type===`ai`&&this.kind===`count`&&console.error(`DtBadge error: type: 'ai' with kind: 'count' is an invalid combination.`),this.type!==`bulletin`&&this.subtle&&console.error(`DtBadge error: subtle can only be used with type 'bulletin'`)},validateDecorationPropCombination(){this.decoration&&((this.kind!==`label`||this.type!==`default`)&&console.error(`DtBadge error: decoration prop can only be used with kind: 'label' and type: 'default'.`),this.hasIcons&&console.error(`DtBadge error: decoration prop cannot be used with leftIcon or rightIcon.`))}}},o={key:0,class:`d-badge__decorative`},s={key:1,class:`d-badge__icon-left`},c={key:2,class:`d-badge__icon-right`};function l(e,t,n,r,a,l){return(0,i.openBlock)(),(0,i.createElementBlock)(`span`,{class:(0,i.normalizeClass)([`d-badge`,a.BADGE_TYPE_MODIFIERS[n.type],a.BADGE_KIND_MODIFIERS[n.kind],a.BADGE_DECORATION_MODIFIERS[n.decoration],{"d-badge--subtle":n.subtle},{"d-badge--outlined":n.outlined}]),"data-qa":`dt-badge`},[n.decoration?((0,i.openBlock)(),(0,i.createElementBlock)(`span`,o)):(0,i.createCommentVNode)(``,!0),l.hasLeftIcon?((0,i.openBlock)(),(0,i.createElementBlock)(`span`,s,[(0,i.renderSlot)(e.$slots,`leftIcon`,{iconSize:n.iconSize})])):(0,i.createCommentVNode)(``,!0),(0,i.createElementVNode)(`span`,{class:(0,i.normalizeClass)([`d-badge__label`,n.labelClass])},[(0,i.renderSlot)(e.$slots,`default`,{},()=>[(0,i.createTextVNode)((0,i.toDisplayString)(n.text),1)])],2),l.hasRightIcon?((0,i.openBlock)(),(0,i.createElementBlock)(`span`,c,[(0,i.renderSlot)(e.$slots,`rightIcon`,{iconSize:n.iconSize})])):(0,i.createCommentVNode)(``,!0)],2)}var u=t.t(a,[[`render`,l]]);exports.default=u;
+//# sourceMappingURL=badge.cjs.map

package/dist/lib/badge/badge.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"badge.cjs","sources":["../../../components/badge/badge.vue"],"sourcesContent":["<template>\n  <span\n    :class=\"[\n      'd-badge',\n      BADGE_TYPE_MODIFIERS[type],\n      BADGE_KIND_MODIFIERS[kind],\n      BADGE_DECORATION_MODIFIERS[decoration],\n      { 'd-badge--subtle': subtle },\n      { 'd-badge--outlined': outlined },\n    ]\"\n    data-qa=\"dt-badge\"\n  >\n    <span\n      v-if=\"decoration\"\n      class=\"d-badge__decorative\"\n    />\n    <span\n      v-if=\"hasLeftIcon\"\n      class=\"d-badge__icon-left\"\n    >\n      <!-- @slot Slot for start icon, icon-size slot prop defaults to '200' -->\n      <slot\n        v-if=\"$slots.startIcon\"\n        name=\"startIcon\"\n        :icon-size=\"iconSize\"\n      />\n      <!-- @slot @deprecated Use startIcon -->\n      <slot\n        v-else\n        name=\"leftIcon\"\n        :icon-size=\"iconSize\"\n      />\n    </span>\n    <span :class=\"['d-badge__label', labelClass]\">\n      <!-- @slot Slot for badge content, defaults to text prop -->\n      <slot>\n        {{ text }}\n      </slot>\n    </span>\n    <span\n      v-if=\"hasRightIcon\"\n      class=\"d-badge__icon-right\"\n    >\n      <!-- @slot Slot for end icon, icon-size slot prop defaults to '200' -->\n      <slot\n        v-if=\"$slots.endIcon\"\n        name=\"endIcon\"\n        :icon-size=\"iconSize\"\n      />\n      <!-- @slot @deprecated Use endIcon -->\n      <slot\n        v-else\n        name=\"rightIcon\"\n        :icon-size=\"iconSize\"\n      />\n    </span>\n  </span>\n</template>\n\n<script>\nimport { BADGE_TYPE_MODIFIERS, BADGE_KIND_MODIFIERS, BADGE_DECORATION_MODIFIERS } from './badge_constants';\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon';\nimport { hasSlotContent } from '@/common/utils/index.js';\n\n/**\n * A badge is a compact UI element that provides brief, descriptive information about an element.\n * It is terse, ideally one word.\n * @see https://dialtone.dialpad.com/components/badge.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtBadge',\n\n  props: {\n    /**\n     * The size of the left and right icons.\n     * @values 100, 200, 300, 400, 500, 600, 700, 800\n     */\n    iconSize: {\n      type: String,\n      default: '200',\n      validator: (s) => Object.keys(ICON_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * Text for the badge content\n     */\n    text: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * The kind of badge which determines the styling\n     * @values label, count\n     */\n    kind: {\n      type: String,\n      default: 'label',\n      validator: (kind) => Object.keys(BADGE_KIND_MODIFIERS).includes(kind),\n    },\n\n    /**\n     * Color for the badge background\n     * @values default, info, success, warning, critical, bulletin, ai\n     */\n    type: {\n      type: String,\n      default: 'default',\n      validator: (type) => Object.keys(BADGE_TYPE_MODIFIERS).includes(type),\n    },\n\n    /**\n     * Decoration for the badge. This can be only used with kind: label and type: default\n     * with no left and right icons\n     * @values default, black-400, black-500, black-900, red-200, red-300, red-400, purple-200,\n     * purple-300, purple-400, purple-500, blue-200, blue-300, blue-400, green-300, green-400,\n     * green-500, gold-300, gold-400, gold-500, magenta-200, magenta-300, magenta-400\n     */\n    decoration: {\n      type: String,\n      default: undefined,\n      validator: (type) => Object.keys(BADGE_DECORATION_MODIFIERS).includes(type),\n    },\n\n    /**\n     * Used to customize the label container\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Shows a subtle appearance for the badge\n     * Currently only affects the badge when type is bulletin.\n     */\n    subtle: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Outlines the badge with a border\n     */\n    outlined: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  data () {\n    return {\n      BADGE_TYPE_MODIFIERS,\n      BADGE_KIND_MODIFIERS,\n      BADGE_DECORATION_MODIFIERS,\n    };\n  },\n\n  computed: {\n    hasLeftIcon () {\n      return hasSlotContent(this.$slots.startIcon) || hasSlotContent(this.$slots.leftIcon);\n    },\n\n    hasRightIcon () {\n      return hasSlotContent(this.$slots.endIcon) || hasSlotContent(this.$slots.rightIcon);\n    },\n\n    hasIcons () {\n      return this.hasLeftIcon || this.hasRightIcon;\n    },\n  },\n\n  updated () {\n    this.validateProps();\n  },\n\n  methods: {\n    validateProps () {\n      this.validateTypePropCombination();\n      this.validateDecorationPropCombination();\n    },\n\n    validateTypePropCombination () {\n      if (this.type === 'ai' && this.kind === 'count') {\n        console.error('DtBadge error: type: \\'ai\\' with kind: \\'count\\' is an invalid combination.');\n      }\n      if (this.type !== 'bulletin' && this.subtle) {\n        console.error('DtBadge error: subtle can only be used with type \\'bulletin\\'');\n      }\n    },\n\n    validateDecorationPropCombination () {\n      if (!this.decoration) return;\n\n      if (this.kind !== 'label' || this.type !== 'default') {\n        console.error('DtBadge error: decoration prop can only be used with kind: \\'label\\' and type: \\'default\\'.');\n      }\n\n      if (this.hasIcons) {\n        console.error('DtBadge error: decoration prop cannot be used with startIcon or endIcon.');\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","s","ICON_SIZE_MODIFIERS","kind","BADGE_KIND_MODIFIERS","type","BADGE_TYPE_MODIFIERS","BADGE_DECORATION_MODIFIERS","hasSlotContent","_createElementBlock","_normalizeClass","$data","$props","_openBlock","_hoisted_1","$options","_hoisted_2","_ctx","_renderSlot","_createElementVNode","_hoisted_3"],"mappings":"kTAqEKA,EAAU,CACb,aAAc,CAAE,KAAM,GACtB,KAAM,UAEN,MAAO,CAKL,SAAU,CACR,KAAM,OACN,QAAS,MACT,UAAYC,GAAM,OAAO,KAAKC,qBAAmB,EAAE,SAASD,CAAC,GAM/D,KAAM,CACJ,KAAM,OACN,QAAS,IAOX,KAAM,CACJ,KAAM,OACN,QAAS,QACT,UAAYE,GAAS,OAAO,KAAKC,sBAAoB,EAAE,SAASD,CAAI,GAOtE,KAAM,CACJ,KAAM,OACN,QAAS,UACT,UAAYE,GAAS,OAAO,KAAKC,sBAAoB,EAAE,SAASD,CAAI,GAUtE,WAAY,CACV,KAAM,OACN,QAAS,OACT,UAAYA,GAAS,OAAO,KAAKE,4BAA0B,EAAE,SAASF,CAAI,GAM5E,WAAY,CACV,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,IAOX,OAAQ,CACN,KAAM,QACN,QAAS,IAMX,SAAU,CACR,KAAM,QACN,QAAS,KAIb,MAAQ,CACN,MAAO,CACL,qBAAAC,EAAAA,qBACA,qBAAAF,EAAAA,gDACAG,EAAAA,2BAEJ,EAEA,SAAU,CACR,aAAe,CACb,OAAOC,EAAAA,eAAe,KAAK,OAAO,SAAS,GAAKA,iBAAe,KAAK,OAAO,QAAQ,CACrF,EAEA,cAAgB,CACd,OAAOA,EAAAA,eAAe,KAAK,OAAO,OAAO,GAAKA,iBAAe,KAAK,OAAO,SAAS,CACpF,EAEA,UAAY,CACV,OAAO,KAAK,aAAe,KAAK,YAClC,GAGF,SAAW,CACT,KAAK,cAAa,CACpB,EAEA,QAAS,CACP,eAAiB,CACf,KAAK,4BAA2B,EAChC,KAAK,kCAAiC,CACxC,EAEA,6BAA+B,CACzB,KAAK,OAAS,MAAQ,KAAK,OAAS,SACtC,QAAQ,MAAM,yEAA6E,EAEzF,KAAK,OAAS,YAAc,KAAK,QACnC,QAAQ,MAAM,6DAA+D,CAEjF,EAEA,mCAAqC,CAC9B,KAAK,cAEN,KAAK,OAAS,SAAW,KAAK,OAAS,YACzC,QAAQ,MAAM,yFAA6F,EAGzG,KAAK,UACP,QAAQ,MAAM,0EAA0E,EAE5F,EAEJ,WA9LM,MAAM,gCAIN,MAAM,+BAuBN,MAAM,oEAxCVC,EAAAA,mBAuDO,OAAA,CAtDJ,MAAKC,EAAAA,eAAA,WAA2BC,EAAA,qBAAqBC,EAAA,IAAI,EAASD,EAAA,qBAAqBC,EAAA,IAAI,EAASD,EAAA,2BAA2BC,EAAA,UAAU,qBAA8BA,EAAA,MAAM,uBAAiCA,EAAA,QAAQ,IAQvN,UAAQ,aAGAA,EAAA,YADRC,EAAAA,YAAAJ,EAAAA,mBAGE,OAHFK,CAGE,+BAEMC,EAAA,aADRF,EAAAA,YAAAJ,EAAAA,mBAgBO,OAhBPO,EAgBO,CAVGC,EAAA,OAAO,UADfC,aAIED,EAAA,OAAA,YAAA,OADC,SAAWL,EAAA,WAGdM,aAIED,EAAA,OAAA,WAAA,OADC,SAAWL,EAAA,0CAGhBO,EAAAA,mBAKO,OAAA,CALA,yCAA0BP,EAAA,UAAU,CAAA,IAEzCM,EAAAA,WAEOD,sBAFP,IAEO,qCADFL,EAAA,IAAI,EAAA,CAAA,QAIHG,EAAA,cADRF,EAAAA,YAAAJ,EAAAA,mBAgBO,OAhBPW,EAgBO,CAVGH,EAAA,OAAO,QADfC,aAIED,EAAA,OAAA,UAAA,OADC,SAAWL,EAAA,WAGdM,aAIED,EAAA,OAAA,YAAA,OADC,SAAWL,EAAA"}
+{"version":3,"file":"badge.cjs","names":[],"sources":["../../../components/badge/badge.vue"],"sourcesContent":["<template>\n  <span\n    :class=\"[\n      'd-badge',\n      BADGE_TYPE_MODIFIERS[type],\n      BADGE_KIND_MODIFIERS[kind],\n      BADGE_DECORATION_MODIFIERS[decoration],\n      { 'd-badge--subtle': subtle },\n      { 'd-badge--outlined': outlined },\n    ]\"\n    data-qa=\"dt-badge\"\n  >\n    <span\n      v-if=\"decoration\"\n      class=\"d-badge__decorative\"\n    />\n    <span\n      v-if=\"hasLeftIcon\"\n      class=\"d-badge__icon-left\"\n    >\n      <!-- @slot Slot for left icon, icon-size slot prop defaults to '200' -->\n      <slot\n        name=\"leftIcon\"\n        :icon-size=\"iconSize\"\n      />\n    </span>\n    <span :class=\"['d-badge__label', labelClass]\">\n      <!-- @slot Slot for badge content, defaults to text prop -->\n      <slot>\n        {{ text }}\n      </slot>\n    </span>\n    <span\n      v-if=\"hasRightIcon\"\n      class=\"d-badge__icon-right\"\n    >\n      <!-- @slot Slot for right icon, icon-size slot prop defaults to '200' -->\n      <slot\n        name=\"rightIcon\"\n        :icon-size=\"iconSize\"\n      />\n    </span>\n  </span>\n</template>\n\n<script>\nimport { BADGE_TYPE_MODIFIERS, BADGE_KIND_MODIFIERS, BADGE_DECORATION_MODIFIERS } from './badge_constants';\nimport { ICON_SIZE_MODIFIERS } from '@/components/icon';\nimport { hasSlotContent } from '@/common/utils/index.js';\n\n/**\n * A badge is a compact UI element that provides brief, descriptive information about an element.\n * It is terse, ideally one word.\n * @see https://dialtone.dialpad.com/components/badge.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtBadge',\n\n  props: {\n    /**\n     * The size of the left and right icons.\n     * @values 100, 200, 300, 400, 500, 600, 700, 800\n     */\n    iconSize: {\n      type: String,\n      default: '200',\n      validator: (s) => Object.keys(ICON_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * Text for the badge content\n     */\n    text: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * The kind of badge which determines the styling\n     * @values label, count\n     */\n    kind: {\n      type: String,\n      default: 'label',\n      validator: (kind) => Object.keys(BADGE_KIND_MODIFIERS).includes(kind),\n    },\n\n    /**\n     * Color for the badge background\n     * @values default, info, success, warning, critical, bulletin, ai\n     */\n    type: {\n      type: String,\n      default: 'default',\n      validator: (type) => Object.keys(BADGE_TYPE_MODIFIERS).includes(type),\n    },\n\n    /**\n     * Decoration for the badge. This can be only used with kind: label and type: default\n     * with no left and right icons\n     * @values default, black-400, black-500, black-900, red-200, red-300, red-400, purple-200,\n     * purple-300, purple-400, purple-500, blue-200, blue-300, blue-400, green-300, green-400,\n     * green-500, gold-300, gold-400, gold-500, magenta-200, magenta-300, magenta-400\n     */\n    decoration: {\n      type: String,\n      default: undefined,\n      validator: (type) => Object.keys(BADGE_DECORATION_MODIFIERS).includes(type),\n    },\n\n    /**\n     * Used to customize the label container\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Shows a subtle appearance for the badge\n     * Currently only affects the badge when type is bulletin.\n     */\n    subtle: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Outlines the badge with a border\n     */\n    outlined: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  data () {\n    return {\n      BADGE_TYPE_MODIFIERS,\n      BADGE_KIND_MODIFIERS,\n      BADGE_DECORATION_MODIFIERS,\n    };\n  },\n\n  computed: {\n    hasLeftIcon () {\n      return hasSlotContent(this.$slots.leftIcon);\n    },\n\n    hasRightIcon () {\n      return hasSlotContent(this.$slots.rightIcon);\n    },\n\n    hasIcons () {\n      return this.hasLeftIcon || this.hasRightIcon;\n    },\n  },\n\n  updated () {\n    this.validateProps();\n  },\n\n  methods: {\n    validateProps () {\n      this.validateTypePropCombination();\n      this.validateDecorationPropCombination();\n    },\n\n    validateTypePropCombination () {\n      if (this.type === 'ai' && this.kind === 'count') {\n        console.error('DtBadge error: type: \\'ai\\' with kind: \\'count\\' is an invalid combination.');\n      }\n      if (this.type !== 'bulletin' && this.subtle) {\n        console.error('DtBadge error: subtle can only be used with type \\'bulletin\\'');\n      }\n    },\n\n    validateDecorationPropCombination () {\n      if (!this.decoration) return;\n\n      if (this.kind !== 'label' || this.type !== 'default') {\n        console.error('DtBadge error: decoration prop can only be used with kind: \\'label\\' and type: \\'default\\'.');\n      }\n\n      if (this.hasIcons) {\n        console.error('DtBadge error: decoration prop cannot be used with leftIcon or rightIcon.');\n      }\n    },\n  },\n};\n</script>\n"],"mappings":"6UAuDA,IAAK,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,UAEN,MAAO,CAKL,SAAU,CACR,KAAM,OACN,QAAS,MACT,UAAY,GAAM,OAAO,KAAK,EAAA,oBAAoB,CAAC,SAAS,EAAE,CAC/D,CAKD,KAAM,CACJ,KAAM,OACN,QAAS,GACV,CAMD,KAAM,CACJ,KAAM,OACN,QAAS,QACT,UAAY,GAAS,OAAO,KAAK,EAAA,qBAAqB,CAAC,SAAS,EAAK,CACtE,CAMD,KAAM,CACJ,KAAM,OACN,QAAS,UACT,UAAY,GAAS,OAAO,KAAK,EAAA,qBAAqB,CAAC,SAAS,EAAK,CACtE,CASD,WAAY,CACV,KAAM,OACN,QAAS,IAAA,GACT,UAAY,GAAS,OAAO,KAAK,EAAA,2BAA2B,CAAC,SAAS,EAAK,CAC5E,CAKD,WAAY,CACV,KAAM,CAAC,OAAQ,MAAO,OAAO,CAC7B,QAAS,GACV,CAMD,OAAQ,CACN,KAAM,QACN,QAAS,GACV,CAKD,SAAU,CACR,KAAM,QACN,QAAS,GACV,CACF,CAED,MAAQ,CACN,MAAO,CACL,qBAAA,EAAA,qBACA,qBAAA,EAAA,qBACA,2BAAA,EAAA,2BACD,EAGH,SAAU,CACR,aAAe,CACb,OAAO,EAAA,eAAe,KAAK,OAAO,SAAS,EAG7C,cAAgB,CACd,OAAO,EAAA,eAAe,KAAK,OAAO,UAAU,EAG9C,UAAY,CACV,OAAO,KAAK,aAAe,KAAK,cAEnC,CAED,SAAW,CACT,KAAK,eAAe,EAGtB,QAAS,CACP,eAAiB,CACf,KAAK,6BAA6B,CAClC,KAAK,mCAAmC,EAG1C,6BAA+B,CACzB,KAAK,OAAS,MAAQ,KAAK,OAAS,SACtC,QAAQ,MAAM,0EAA8E,CAE1F,KAAK,OAAS,YAAc,KAAK,QACnC,QAAQ,MAAM,8DAAgE,EAIlF,mCAAqC,CAC9B,KAAK,cAEN,KAAK,OAAS,SAAW,KAAK,OAAS,YACzC,QAAQ,MAAM,0FAA8F,CAG1G,KAAK,UACP,QAAQ,MAAM,4EAA4E,GAG/F,CACF,UAhLK,MAAM,gCAIN,MAAM,+BAgBN,MAAM,gGAQH,OAAA,CAxCJ,OAAA,EAAA,EAAA,gBAAK,WAA2B,EAAA,qBAAqB,EAAA,MAAa,EAAA,qBAAqB,EAAA,MAAa,EAAA,2BAA2B,EAAA,+BAAwC,EAAA,OAAM,sBAAiC,EAAA,SAAQ,GAQvN,UAAQ,aAGA,EAAA,aAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAEN,OAHF,EAGE,GAAA,EAAA,EAAA,oBAAA,GAAA,GAAA,CAEM,EAAA,cAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAQD,OATP,EASO,EAAA,EAAA,EAAA,YADH,EAAA,OAAA,WAAA,CADC,SAAW,EAAA,SAAQ,CAAA,CAAA,CAAA,GAAA,EAAA,EAAA,oBAAA,GAAA,GAAA,0BAQjB,OAAA,CALA,OAAA,EAAA,EAAA,gBAAK,CAAA,iBAAqB,EAAA,WAAU,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,YAIlC,EAAA,OAAA,UAAA,EAAA,KAAA,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBADF,EAAA,KAAI,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,EAAA,CAIH,EAAA,eAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAQD,OATP,EASO,EAAA,EAAA,EAAA,YADH,EAAA,OAAA,YAAA,CADC,SAAW,EAAA,SAAQ,CAAA,CAAA,CAAA,GAAA,EAAA,EAAA,oBAAA,GAAA,GAAA"}