{"version":3,"file":"chip.cjs","names":[],"sources":["../../../components/chip/chip.vue"],"sourcesContent":["<template>\n  <span class=\"d-chip\">\n    <component\n      :is=\"interactive ? 'button' : 'span'\"\n      :id=\"id\"\n      :aria-label=\"ariaLabel\"\n      :aria-labelledby=\"ariaLabel ? undefined : `${id}-content`\"\n      :aria-disabled=\"disabled\"\n      :class=\"chipClasses()\"\n      :type=\"interactive && 'button'\"\n      data-qa=\"dt-chip\"\n      :tabindex=\"disabled ? -1 : null\"\n      v-on=\"chipListeners\"\n    >\n      <span\n        v-if=\"hasSlotContent($slots.icon)\"\n        class=\"d-chip__icon\"\n        data-qa=\"dt-chip-icon\"\n      >\n        <!-- @slot slot for Chip icon -->\n        <slot name=\"icon\" />\n      </span>\n      <span\n        v-else-if=\"hasSlotContent($slots.avatar)\"\n        data-qa=\"dt-chip-avatar\"\n      >\n        <!-- @slot slot for Chip avatar -->\n        <slot name=\"avatar\" />\n      </span>\n      <span\n        v-if=\"hasSlotContent($slots.default)\"\n        :id=\"`${id}-content`\"\n        :class=\"['d-chip__text', contentClass]\"\n        data-qa=\"dt-chip-label\"\n      >\n        <!-- @slot slot for Content within chip -->\n        <slot />\n      </span>\n    </component>\n    <dt-button\n      v-if=\"!hideClose\"\n      :class=\"chipCloseButtonClasses()\"\n      data-qa=\"dt-chip-close\"\n      :aria-label=\"closeButtonTitle\"\n      :aria-disabled=\"disabled\"\n      :title=\"closeButtonTitle\"\n      :tabindex=\"disabled ? -1 : null\"\n      @click=\"$emit('close')\"\n    >\n      <template #icon>\n        <dt-icon-close\n          :size=\"closeButtonIconSize\"\n        />\n      </template>\n    </dt-button>\n  </span>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtIconClose } from '@dialpad/dialtone-icons/vue3';\nimport {\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n} from './chip_constants';\nimport { getUniqueString, hasSlotContent } from '@/common/utils';\nimport { DialtoneLocalization } from '@/localization';\n\n/**\n * A chip is a compact UI element that provides brief, descriptive information about an element.\n * It is terse, ideally one word. It is important a button is identifiable, consistent, and\n * communicates its actions clearly, and is appropriately sized to its action.\n * @see https://dialtone.dialpad.com/components/chip.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtChip',\n\n  components: {\n    DtButton,\n    DtIconClose,\n  },\n\n  props: {\n    /**\n     * Whether the chip is disabled\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Hides the close button on the chip\n     * @values true, false\n     */\n    hideClose: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * The size of the chip.\n     * @values xs, sm, md\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (s) => Object.keys(CHIP_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * The interactivity of the chip.\n     * Makes chip clickable, apply hover/focus/active style, emit keyboard events etc.\n     * @values true, false\n     */\n    interactive: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Id to use for the dialog's aria-labelledby.\n     */\n    id: {\n      type: String,\n      default: function () { return getUniqueString(); },\n    },\n\n    /**\n     * Descriptive label for the chip content.\n     * If this prop is unset the content in the default slot will be used as an aria-label.\n     */\n    ariaLabel: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the chip element.\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the span element.\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native chip click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n\n    /**\n     * Close button click event\n     *\n     * @event close\n     */\n    'close',\n\n    /**\n     * Native chip key up event\n     *\n     * @event keyup\n     * @type {KeyboardEvent}\n     */\n    'keyup',\n\n    /**\n     * Native chip key down event\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n  ],\n\n  data () {\n    return {\n      isActive: false,\n      hasSlotContent,\n      i18n: new DialtoneLocalization(),\n    };\n  },\n\n  computed: {\n    chipListeners () {\n      return {\n        click: event => {\n          if (this.interactive) this.$emit('click', event);\n        },\n\n        keydown: event => {\n          if (event.code?.toLowerCase() === 'delete') {\n            this.onClose();\n          } else {\n            this.$emit('keydown', event);\n          }\n        },\n\n        keyup: event => {\n          this.$emit('keyup', event);\n        },\n      };\n    },\n\n    closeButtonIconSize () {\n      return CHIP_ICON_SIZES[this.size];\n    },\n\n    closeButtonTitle () {\n      return this.i18n.$t('DIALTONE_CLOSE_BUTTON');\n    },\n  },\n\n  methods: {\n    chipClasses () {\n      return [\n        this.$attrs['grouped-chip'] ? 'd-chip' : 'd-chip__label',\n        CHIP_SIZE_MODIFIERS[this.size],\n        this.labelClass,\n        this.disabled && 'd-chip--disabled',\n      ];\n    },\n\n    chipCloseButtonClasses () {\n      return [\n        'd-chip__close',\n        CHIP_CLOSE_BUTTON_SIZE_MODIFIERS[this.size],\n        this.disabled && 'd-chip__close--disabled',\n      ];\n    },\n\n    onClose () {\n      if (!this.hideClose) {\n        this.$emit('close');\n      }\n    },\n  },\n};\n</script>\n"],"mappings":"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"}