{"version":3,"file":"chip.vue.cjs","sources":["../../../components/chip/chip.vue"],"sourcesContent":["<template>\n  <span class=\"d-chip\">\n    <component\n      :is=\"interactive ? 'button' : 'span'\"\n      :id=\"id\"\n      :type=\"interactive && 'button'\"\n      :class=\"chipClasses()\"\n      data-qa=\"dt-chip\"\n      :aria-labelledby=\"ariaLabel ? undefined : `${id}-content`\"\n      :aria-label=\"ariaLabel\"\n      v-on=\"chipListeners\"\n    >\n      <span\n        v-if=\"hasSlotContent($slots.icon)\"\n        data-qa=\"dt-chip-icon\"\n        class=\"d-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        data-qa=\"dt-chip-label\"\n        :class=\"['d-chip__text', contentClass]\"\n      >\n        <!-- @slot slot for Content within chip -->\n        <slot />\n      </span>\n    </component>\n    <dt-button\n      v-if=\"!hideClose\"\n      v-bind=\"closeButtonProps\"\n      :class=\"chipCloseButtonClasses()\"\n      data-qa=\"dt-chip-close\"\n      :aria-label=\"closeButtonProps.ariaLabel\"\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';\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     * A set of props to be passed into the modal's close button. Requires an 'ariaLabel' property.\n     */\n    closeButtonProps: {\n      type: Object,\n      default: function () { return { ariaLabel: 'close' }; },\n      validator: (props) => {\n        return !!props.ariaLabel;\n      },\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  data () {\n    return {\n      isActive: false,\n      hasSlotContent,\n    };\n  },\n\n  computed: {\n    chipListeners () {\n      return {\n        click: event => {\n          if (this.interactive) this.$emit('click', event);\n        },\n\n        keyup: event => {\n          if (event.code?.toLowerCase() === 'delete') {\n            this.onClose();\n          } else {\n            this.$emit('keyup', event);\n          }\n        },\n      };\n    },\n\n    closeButtonIconSize () {\n      return CHIP_ICON_SIZES[this.size];\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      ];\n    },\n\n    chipCloseButtonClasses () {\n      return [\n        'd-chip__close',\n        CHIP_CLOSE_BUTTON_SIZE_MODIFIERS[this.size],\n      ];\n    },\n\n    onClose () {\n      if (!this.hideClose) {\n        this.$emit('close');\n      }\n    },\n  },\n};\n</script>\n"],"names":["DtButton","DtIconClose","CHIP_SIZE_MODIFIERS","getUniqueString","hasSlotContent","CHIP_ICON_SIZES","CHIP_CLOSE_BUTTON_SIZE_MODIFIERS","_openBlock","_createElementBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_toHandlers","_withCtx","_renderSlot","_createCommentVNode","_normalizeClass","_createVNode"],"mappings":"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"}