@dialpad/dialtone-vue 3.120.0 → 3.120.2

package/dist/lib/chip.cjs

@@ -1,2 +1,236 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./utils.cjs"),e=require("vue"),_=require("../chunks/_plugin-vue_export-helper-6_y-gaV6.js"),h=require("./button.cjs"),p=require("./icon.cjs");require("./constants.cjs");require("../chunks/link_constants-Kn6kP4i1.js");require("@dialpad/dialtone-icons/vue3");require("../chunks/icon_constants-2S_OSQ1t.js");require("@dialpad/dialtone-icons/icons.json");const i={xs:"d-chip__label--xs",sm:"d-chip__label--sm",md:""},c={xs:"d-chip__close--xs",sm:"d-chip__close--sm",md:""},r={xs:"200",sm:"200",md:"200"},C={name:"DtChip",components:{DtButton:h.DtButton,DtIcon:p.DtIcon},props:{closeButtonProps:{type:Object,default:function(){return{ariaLabel:"close"}},validator:t=>!!t.ariaLabel},hideClose:{type:Boolean,default:!1},size:{type:String,default:"md",validator:t=>Object.keys(i).includes(t)},interactive:{type:Boolean,default:!0},id:{type:String,default:function(){return a.getUniqueString()}},ariaLabel:{type:String,default:""},contentClass:{type:[String,Array,Object],default:""},labelClass:{type:[String,Array,Object],default:""}},emits:["click","close","keyup"],data(){return{isActive:!1,hasSlotContent:a.hasSlotContent}},computed:{chipListeners(){return{click:t=>{this.interactive&&this.$emit("click",t)},keyup:t=>{var s;((s=t.code)==null?void 0:s.toLowerCase())==="delete"?this.onClose():this.$emit("keyup",t)}}},closeButtonIconSize(){return r[this.size]}},methods:{chipClasses(){return[this.$attrs["grouped-chip"]?"d-chip":"d-chip__label",i[this.size],this.labelClass]},chipCloseButtonClasses(){return["d-chip__close",c[this.size]]},onClose(){this.hideClose||this.$emit("close")}}},m={class:"d-chip"},b={key:0,"data-qa":"dt-chip-icon",class:"d-chip__icon"},S={key:1,"data-qa":"dt-chip-avatar"},I=["id"];function y(t,s,o,k,n,l){const d=e.resolveComponent("dt-icon"),u=e.resolveComponent("dt-button");return e.openBlock(),e.createElementBlock("span",m,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.interactive?"button":"span"),e.mergeProps({id:o.id,type:o.interactive&&"button",class:l.chipClasses(),"data-qa":"dt-chip","aria-labelledby":o.ariaLabel?void 0:`${o.id}-content`,"aria-label":o.ariaLabel},e.toHandlers(l.chipListeners)),{default:e.withCtx(()=>[n.hasSlotContent(t.$slots.icon)?(e.openBlock(),e.createElementBlock("span",b,[e.renderSlot(t.$slots,"icon")])):n.hasSlotContent(t.$slots.avatar)?(e.openBlock(),e.createElementBlock("span",S,[e.renderSlot(t.$slots,"avatar")])):e.createCommentVNode("",!0),n.hasSlotContent(t.$slots.default)?(e.openBlock(),e.createElementBlock("span",{key:2,id:`${o.id}-content`,"data-qa":"dt-chip-label",class:e.normalizeClass(["d-chip__text",o.contentClass])},[e.renderSlot(t.$slots,"default")],10,I)):e.createCommentVNode("",!0)]),_:3},16,["id","type","class","aria-labelledby","aria-label"])),o.hideClose?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(u,e.mergeProps({key:0},o.closeButtonProps,{class:l.chipCloseButtonClasses(),"data-qa":"dt-chip-close","aria-label":o.closeButtonProps.ariaLabel,onClick:s[0]||(s[0]=f=>t.$emit("close"))}),{icon:e.withCtx(()=>[e.createVNode(d,{name:"close",size:l.closeButtonIconSize},null,8,["size"])]),_:1},16,["class","aria-label"]))])}const B=_._(C,[["render",y]]);exports.CHIP_CLOSE_BUTTON_SIZE_MODIFIERS=c;exports.CHIP_ICON_SIZES=r;exports.CHIP_SIZE_MODIFIERS=i;exports.DtChip=B;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const common_utils = require("../common/utils.cjs");
+const vue = require("vue");
+const _pluginVue_exportHelper = require("../chunks/_plugin-vue_export-helper-fhnQq0tA.js");
+const lib_button = require("./button.cjs");
+const lib_icon = require("./icon.cjs");
+require("../common/constants.cjs");
+require("../chunks/link_constants-Huj7D_hm.js");
+require("@dialpad/dialtone-icons/vue3");
+require("../chunks/icon_constants-QYpmdE0R.js");
+require("@dialpad/dialtone-icons/icons.json");
+const CHIP_SIZE_MODIFIERS = {
+  xs: "d-chip__label--xs",
+  sm: "d-chip__label--sm",
+  md: ""
+};
+const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {
+  xs: "d-chip__close--xs",
+  sm: "d-chip__close--sm",
+  md: ""
+};
+const CHIP_ICON_SIZES = {
+  xs: "200",
+  sm: "200",
+  md: "200"
+};
+const _sfc_main = {
+  name: "DtChip",
+  components: {
+    DtButton: lib_button.DtButton,
+    DtIcon: lib_icon.DtIcon
+  },
+  props: {
+    /**
+     * A set of props to be passed into the modal's close button. Requires an 'ariaLabel' property.
+     */
+    closeButtonProps: {
+      type: Object,
+      default: function() {
+        return { ariaLabel: "close" };
+      },
+      validator: (props) => {
+        return !!props.ariaLabel;
+      }
+    },
+    /**
+     * Hides the close button on the chip
+     * @values true, false
+     */
+    hideClose: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * The size of the chip.
+     * @values xs, sm, md
+     */
+    size: {
+      type: String,
+      default: "md",
+      validator: (s) => Object.keys(CHIP_SIZE_MODIFIERS).includes(s)
+    },
+    /**
+     * The interactivity of the chip.
+     * Makes chip clickable, apply hover/focus/active style, emit keyboard events etc.
+     * @values true, false
+     */
+    interactive: {
+      type: Boolean,
+      default: true
+    },
+    /**
+     * Id to use for the dialog's aria-labelledby.
+     */
+    id: {
+      type: String,
+      default: function() {
+        return common_utils.getUniqueString();
+      }
+    },
+    /**
+     * Descriptive label for the chip content.
+     * If this prop is unset the content in the default slot will be used as an aria-label.
+     */
+    ariaLabel: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Additional class name for the chip element.
+     */
+    contentClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * Additional class name for the span element.
+     */
+    labelClass: {
+      type: [String, Array, Object],
+      default: ""
+    }
+  },
+  emits: [
+    /**
+     * Native chip click event
+     *
+     * @event click
+     * @type {PointerEvent | KeyboardEvent}
+     */
+    "click",
+    /**
+     * Close button click event
+     *
+     * @event close
+     */
+    "close",
+    /**
+     * Native chip key up event
+     *
+     * @event keyup
+     * @type {KeyboardEvent}
+     */
+    "keyup"
+  ],
+  data() {
+    return {
+      isActive: false,
+      hasSlotContent: common_utils.hasSlotContent
+    };
+  },
+  computed: {
+    chipListeners() {
+      return {
+        click: (event) => {
+          if (this.interactive)
+            this.$emit("click", event);
+        },
+        keyup: (event) => {
+          var _a;
+          if (((_a = event.code) == null ? void 0 : _a.toLowerCase()) === "delete") {
+            this.onClose();
+          } else {
+            this.$emit("keyup", event);
+          }
+        }
+      };
+    },
+    closeButtonIconSize() {
+      return CHIP_ICON_SIZES[this.size];
+    }
+  },
+  methods: {
+    chipClasses() {
+      return [
+        this.$attrs["grouped-chip"] ? "d-chip" : "d-chip__label",
+        CHIP_SIZE_MODIFIERS[this.size],
+        this.labelClass
+      ];
+    },
+    chipCloseButtonClasses() {
+      return [
+        "d-chip__close",
+        CHIP_CLOSE_BUTTON_SIZE_MODIFIERS[this.size]
+      ];
+    },
+    onClose() {
+      if (!this.hideClose) {
+        this.$emit("close");
+      }
+    }
+  }
+};
+const _hoisted_1 = { class: "d-chip" };
+const _hoisted_2 = {
+  key: 0,
+  "data-qa": "dt-chip-icon",
+  class: "d-chip__icon"
+};
+const _hoisted_3 = {
+  key: 1,
+  "data-qa": "dt-chip-avatar"
+};
+const _hoisted_4 = ["id"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dt_icon = vue.resolveComponent("dt-icon");
+  const _component_dt_button = vue.resolveComponent("dt-button");
+  return vue.openBlock(), vue.createElementBlock("span", _hoisted_1, [
+    (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.interactive ? "button" : "span"), vue.mergeProps({
+      id: $props.id,
+      type: $props.interactive && "button",
+      class: $options.chipClasses(),
+      "data-qa": "dt-chip",
+      "aria-labelledby": $props.ariaLabel ? void 0 : `${$props.id}-content`,
+      "aria-label": $props.ariaLabel
+    }, vue.toHandlers($options.chipListeners)), {
+      default: vue.withCtx(() => [
+        $data.hasSlotContent(_ctx.$slots.icon) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2, [
+          vue.renderSlot(_ctx.$slots, "icon")
+        ])) : $data.hasSlotContent(_ctx.$slots.avatar) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3, [
+          vue.renderSlot(_ctx.$slots, "avatar")
+        ])) : vue.createCommentVNode("", true),
+        $data.hasSlotContent(_ctx.$slots.default) ? (vue.openBlock(), vue.createElementBlock("span", {
+          key: 2,
+          id: `${$props.id}-content`,
+          "data-qa": "dt-chip-label",
+          class: vue.normalizeClass(["d-chip__text", $props.contentClass])
+        }, [
+          vue.renderSlot(_ctx.$slots, "default")
+        ], 10, _hoisted_4)) : vue.createCommentVNode("", true)
+      ]),
+      _: 3
+    }, 16, ["id", "type", "class", "aria-labelledby", "aria-label"])),
+    !$props.hideClose ? (vue.openBlock(), vue.createBlock(_component_dt_button, vue.mergeProps({ key: 0 }, $props.closeButtonProps, {
+      class: $options.chipCloseButtonClasses(),
+      "data-qa": "dt-chip-close",
+      "aria-label": $props.closeButtonProps.ariaLabel,
+      onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("close"))
+    }), {
+      icon: vue.withCtx(() => [
+        vue.createVNode(_component_dt_icon, {
+          name: "close",
+          size: $options.closeButtonIconSize
+        }, null, 8, ["size"])
+      ]),
+      _: 1
+    }, 16, ["class", "aria-label"])) : vue.createCommentVNode("", true)
+  ]);
+}
+const DtChip = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render]]);
+exports.CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = CHIP_CLOSE_BUTTON_SIZE_MODIFIERS;
+exports.CHIP_ICON_SIZES = CHIP_ICON_SIZES;
+exports.CHIP_SIZE_MODIFIERS = CHIP_SIZE_MODIFIERS;
+exports.DtChip = DtChip;
 //# sourceMappingURL=chip.cjs.map

package/dist/lib/chip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"chip.cjs","sources":["../../components/chip/chip_constants.js","../../components/chip/chip.vue"],"sourcesContent":["export const CHIP_SIZE_MODIFIERS = {\n  xs: 'd-chip__label--xs',\n  sm: 'd-chip__label--sm',\n  md: '',\n};\n\nexport const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-chip__close--xs',\n  sm: 'd-chip__close--sm',\n  md: '',\n};\n\nexport const CHIP_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '200',\n};\n\nexport default {\n  CHIP_SIZE_MODIFIERS,\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n};\n","<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\n          name=\"close\"\n          :size=\"closeButtonIconSize\"\n        />\n      </template>\n    </dt-button>\n  </span>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtIcon } from '@/components/icon';\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  name: 'DtChip',\n\n  components: {\n    DtButton,\n    DtIcon,\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":["CHIP_SIZE_MODIFIERS","CHIP_CLOSE_BUTTON_SIZE_MODIFIERS","CHIP_ICON_SIZES","_sfc_main","DtButton","DtIcon","props","s","getUniqueString","hasSlotContent","event","_a","_hoisted_1","_openBlock","_createElementBlock","_createBlock","_resolveDynamicComponent","$props","_mergeProps","$options","_toHandlers","$data","_ctx","_hoisted_2","_renderSlot","_hoisted_3","_component_dt_button","_createVNode","_component_dt_icon"],"mappings":"gcAAY,MAACA,EAAsB,CACjC,GAAI,oBACJ,GAAI,oBACJ,GAAI,EACN,EAEaC,EAAmC,CAC9C,GAAI,oBACJ,GAAI,oBACJ,GAAI,EACN,EAEaC,EAAkB,CAC7B,GAAI,MACJ,GAAI,MACJ,GAAI,KACN,ECuDKC,EAAU,CACb,KAAM,SAEN,WAAY,CACV,SAAAC,EAAQ,SACR,OAAAC,EAAM,MACP,EAED,MAAO,CAIL,iBAAkB,CAChB,KAAM,OACN,QAAS,UAAY,CAAE,MAAO,CAAE,UAAW,OAAS,CAAG,EACvD,UAAYC,GACH,CAAC,CAACA,EAAM,SAElB,EAMD,UAAW,CACT,KAAM,QACN,QAAS,EACV,EAMD,KAAM,CACJ,KAAM,OACN,QAAS,KACT,UAAYC,GAAM,OAAO,KAAKP,CAAmB,EAAE,SAASO,CAAC,CAC9D,EAOD,YAAa,CACX,KAAM,QACN,QAAS,EACV,EAKD,GAAI,CACF,KAAM,OACN,QAAS,UAAY,CAAE,OAAOC,EAAe,gBAAA,CAAK,CACnD,EAMD,UAAW,CACT,KAAM,OACN,QAAS,EACV,EAKD,aAAc,CACZ,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,EACV,EAKD,WAAY,CACV,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,EACV,CACF,EAED,MAAO,CAOL,QAOA,QAQA,OACD,EAED,MAAQ,CACN,MAAO,CACL,SAAU,GACV,eAAAC,EAAc,eAEjB,EAED,SAAU,CACR,eAAiB,CACf,MAAO,CACL,MAAOC,GAAS,CACV,KAAK,aAAa,KAAK,MAAM,QAASA,CAAK,CAChD,EAED,MAAOA,GAAS,SACVC,EAAAD,EAAM,OAAN,YAAAC,EAAY,iBAAkB,SAChC,KAAK,QAAO,EAEZ,KAAK,MAAM,QAASD,CAAK,CAE5B,EAEJ,EAED,qBAAuB,CACrB,OAAOR,EAAgB,KAAK,IAAI,CACjC,CACF,EAED,QAAS,CACP,aAAe,CACb,MAAO,CACL,KAAK,OAAO,cAAc,EAAI,SAAW,gBACzCF,EAAoB,KAAK,IAAI,EAC7B,KAAK,WAER,EAED,wBAA0B,CACxB,MAAO,CACL,gBACAC,EAAiC,KAAK,IAAI,EAE7C,EAED,SAAW,CACJ,KAAK,WACR,KAAK,MAAM,OAAO,CAErB,CACF,CACH,EArOQW,EAAA,CAAA,MAAM,QAAQ,WAad,UAAQ,eACR,MAAM,yBAON,UAAQ,2HArBd,OAAAC,YAAA,EAAAC,qBAmDO,OAnDPF,EAmDO,gBAlDLG,EAkCY,YAAAC,0BAjCLC,EAAW,YAAA,SAAA,MAAA,EADlBC,aAkCY,CAhCT,GAAID,EAAE,GACN,KAAMA,EAAW,aAAA,SACjB,MAAOE,EAAW,YAAA,EACnB,UAAQ,UACP,kBAAiBF,EAAA,UAAY,UAAeA,EAAE,EAAA,WAC9C,aAAYA,EAAS,SACtB,EAAAG,aAAMD,EAAa,aAAA,CAAA,EAAA,mBAEnB,IAOO,CANCE,EAAc,eAACC,EAAM,OAAC,IAAI,GADlCT,EAAAA,YAAAC,EAAAA,mBAOO,OAPPS,EAOO,CADLC,aAAoBF,EAAA,OAAA,MAAA,KAGTD,EAAc,eAACC,EAAM,OAAC,MAAM,GADzCT,EAAAA,YAAAC,EAAAA,mBAMO,OANPW,EAMO,CADLD,aAAsBF,EAAA,OAAA,QAAA,iCAGhBD,EAAc,eAACC,EAAM,OAAC,OAAO,iBADrCR,EAQO,mBAAA,OAAA,OANJ,MAAOG,EAAE,EAAA,WACV,UAAQ,gBACP,uCAAwBA,EAAY,YAAA,CAAA,IAGrCO,aAAQF,EAAA,OAAA,SAAA,uGAIHL,EAAS,qDADlBF,cAcYW,EAdZR,EAcY,WAAA,CAAA,IAAA,CAAA,EAZFD,EAAgB,iBAAA,CACvB,MAAOE,EAAsB,uBAAA,EAC9B,UAAQ,gBACP,aAAYF,EAAgB,iBAAC,UAC7B,uBAAOK,EAAK,MAAA,OAAA,MAEF,eACT,IAGE,CAHFK,EAAAA,YAGEC,EAAA,CAFA,KAAK,QACJ,KAAMT,EAAmB"}
+{"version":3,"file":"chip.cjs","sources":["../../components/chip/chip_constants.js","../../components/chip/chip.vue"],"sourcesContent":["export const CHIP_SIZE_MODIFIERS = {\n  xs: 'd-chip__label--xs',\n  sm: 'd-chip__label--sm',\n  md: '',\n};\n\nexport const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-chip__close--xs',\n  sm: 'd-chip__close--sm',\n  md: '',\n};\n\nexport const CHIP_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '200',\n};\n\nexport default {\n  CHIP_SIZE_MODIFIERS,\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n};\n","<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\n          name=\"close\"\n          :size=\"closeButtonIconSize\"\n        />\n      </template>\n    </dt-button>\n  </span>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtIcon } from '@/components/icon';\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  name: 'DtChip',\n\n  components: {\n    DtButton,\n    DtIcon,\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","DtIcon","getUniqueString","hasSlotContent","_openBlock","_createElementBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_toHandlers","_renderSlot","_createVNode"],"mappings":"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"}

package/dist/lib/chip.js

@@ -1,30 +1,33 @@
-import { getUniqueString as C, hasSlotContent as b } from "./utils.js";
-import { resolveComponent as r, openBlock as s, createElementBlock as o, createBlock as d, resolveDynamicComponent as f, mergeProps as u, toHandlers as y, withCtx as h, renderSlot as n, createCommentVNode as c, normalizeClass as S, createVNode as k } from "vue";
-import { _ as B } from "../chunks/_plugin-vue_export-helper-hUChTQA_.js";
-import { DtButton as I } from "./button.js";
-import { DtIcon as v } from "./icon.js";
-import "./constants.js";
-import "../chunks/link_constants-vIUB92L4.js";
+import { getUniqueString, hasSlotContent } from "../common/utils.js";
+import { resolveComponent, openBlock, createElementBlock, createBlock, resolveDynamicComponent, mergeProps, toHandlers, withCtx, renderSlot, createCommentVNode, normalizeClass, createVNode } from "vue";
+import { _export_sfc } from "../chunks/_plugin-vue_export-helper-caHeSgYY.js";
+import { DtButton } from "./button.js";
+import { DtIcon } from "./icon.js";
+import "../common/constants.js";
+import "../chunks/link_constants-nWVlXQBs.js";
 import "@dialpad/dialtone-icons/vue3";
-import "../chunks/icon_constants-OpYAAKwF.js";
+import "../chunks/icon_constants-Dy4MEUJL.js";
 import "@dialpad/dialtone-icons/icons.json";
-const p = {
+const CHIP_SIZE_MODIFIERS = {
   xs: "d-chip__label--xs",
   sm: "d-chip__label--sm",
   md: ""
-}, L = {
+};
+const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {
   xs: "d-chip__close--xs",
   sm: "d-chip__close--sm",
   md: ""
-}, g = {
+};
+const CHIP_ICON_SIZES = {
   xs: "200",
   sm: "200",
   md: "200"
-}, z = {
+};
+const _sfc_main = {
   name: "DtChip",
   components: {
-    DtButton: I,
-    DtIcon: v
+    DtButton,
+    DtIcon
   },
   props: {
     /**
@@ -35,7 +38,9 @@ const p = {
       default: function() {
         return { ariaLabel: "close" };
       },
-      validator: (e) => !!e.ariaLabel
+      validator: (props) => {
+        return !!props.ariaLabel;
+      }
     },
     /**
      * Hides the close button on the chip
@@ -43,7 +48,7 @@ const p = {
      */
     hideClose: {
       type: Boolean,
-      default: !1
+      default: false
     },
     /**
      * The size of the chip.
@@ -52,7 +57,7 @@ const p = {
     size: {
       type: String,
       default: "md",
-      validator: (e) => Object.keys(p).includes(e)
+      validator: (s) => Object.keys(CHIP_SIZE_MODIFIERS).includes(s)
     },
     /**
      * The interactivity of the chip.
@@ -61,7 +66,7 @@ const p = {
      */
     interactive: {
       type: Boolean,
-      default: !0
+      default: true
     },
     /**
      * Id to use for the dialog's aria-labelledby.
@@ -69,7 +74,7 @@ const p = {
     id: {
       type: String,
       default: function() {
-        return C();
+        return getUniqueString();
       }
     },
     /**
@@ -119,101 +124,113 @@ const p = {
   ],
   data() {
     return {
-      isActive: !1,
-      hasSlotContent: b
+      isActive: false,
+      hasSlotContent
     };
   },
   computed: {
     chipListeners() {
       return {
-        click: (e) => {
-          this.interactive && this.$emit("click", e);
+        click: (event) => {
+          if (this.interactive)
+            this.$emit("click", event);
         },
-        keyup: (e) => {
-          var a;
-          ((a = e.code) == null ? void 0 : a.toLowerCase()) === "delete" ? this.onClose() : this.$emit("keyup", e);
+        keyup: (event) => {
+          var _a;
+          if (((_a = event.code) == null ? void 0 : _a.toLowerCase()) === "delete") {
+            this.onClose();
+          } else {
+            this.$emit("keyup", event);
+          }
         }
       };
     },
     closeButtonIconSize() {
-      return g[this.size];
+      return CHIP_ICON_SIZES[this.size];
     }
   },
   methods: {
     chipClasses() {
       return [
         this.$attrs["grouped-chip"] ? "d-chip" : "d-chip__label",
-        p[this.size],
+        CHIP_SIZE_MODIFIERS[this.size],
         this.labelClass
       ];
     },
     chipCloseButtonClasses() {
       return [
         "d-chip__close",
-        L[this.size]
+        CHIP_CLOSE_BUTTON_SIZE_MODIFIERS[this.size]
       ];
     },
     onClose() {
-      this.hideClose || this.$emit("close");
+      if (!this.hideClose) {
+        this.$emit("close");
+      }
     }
   }
-}, O = { class: "d-chip" }, D = {
+};
+const _hoisted_1 = { class: "d-chip" };
+const _hoisted_2 = {
   key: 0,
   "data-qa": "dt-chip-icon",
   class: "d-chip__icon"
-}, E = {
+};
+const _hoisted_3 = {
   key: 1,
   "data-qa": "dt-chip-avatar"
-}, P = ["id"];
-function q(e, a, t, j, l, i) {
-  const m = r("dt-icon"), _ = r("dt-button");
-  return s(), o("span", O, [
-    (s(), d(f(t.interactive ? "button" : "span"), u({
-      id: t.id,
-      type: t.interactive && "button",
-      class: i.chipClasses(),
+};
+const _hoisted_4 = ["id"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dt_icon = resolveComponent("dt-icon");
+  const _component_dt_button = resolveComponent("dt-button");
+  return openBlock(), createElementBlock("span", _hoisted_1, [
+    (openBlock(), createBlock(resolveDynamicComponent($props.interactive ? "button" : "span"), mergeProps({
+      id: $props.id,
+      type: $props.interactive && "button",
+      class: $options.chipClasses(),
       "data-qa": "dt-chip",
-      "aria-labelledby": t.ariaLabel ? void 0 : `${t.id}-content`,
-      "aria-label": t.ariaLabel
-    }, y(i.chipListeners)), {
-      default: h(() => [
-        l.hasSlotContent(e.$slots.icon) ? (s(), o("span", D, [
-          n(e.$slots, "icon")
-        ])) : l.hasSlotContent(e.$slots.avatar) ? (s(), o("span", E, [
-          n(e.$slots, "avatar")
-        ])) : c("", !0),
-        l.hasSlotContent(e.$slots.default) ? (s(), o("span", {
+      "aria-labelledby": $props.ariaLabel ? void 0 : `${$props.id}-content`,
+      "aria-label": $props.ariaLabel
+    }, toHandlers($options.chipListeners)), {
+      default: withCtx(() => [
+        $data.hasSlotContent(_ctx.$slots.icon) ? (openBlock(), createElementBlock("span", _hoisted_2, [
+          renderSlot(_ctx.$slots, "icon")
+        ])) : $data.hasSlotContent(_ctx.$slots.avatar) ? (openBlock(), createElementBlock("span", _hoisted_3, [
+          renderSlot(_ctx.$slots, "avatar")
+        ])) : createCommentVNode("", true),
+        $data.hasSlotContent(_ctx.$slots.default) ? (openBlock(), createElementBlock("span", {
           key: 2,
-          id: `${t.id}-content`,
+          id: `${$props.id}-content`,
           "data-qa": "dt-chip-label",
-          class: S(["d-chip__text", t.contentClass])
+          class: normalizeClass(["d-chip__text", $props.contentClass])
         }, [
-          n(e.$slots, "default")
-        ], 10, P)) : c("", !0)
+          renderSlot(_ctx.$slots, "default")
+        ], 10, _hoisted_4)) : createCommentVNode("", true)
       ]),
       _: 3
     }, 16, ["id", "type", "class", "aria-labelledby", "aria-label"])),
-    t.hideClose ? c("", !0) : (s(), d(_, u({ key: 0 }, t.closeButtonProps, {
-      class: i.chipCloseButtonClasses(),
+    !$props.hideClose ? (openBlock(), createBlock(_component_dt_button, mergeProps({ key: 0 }, $props.closeButtonProps, {
+      class: $options.chipCloseButtonClasses(),
       "data-qa": "dt-chip-close",
-      "aria-label": t.closeButtonProps.ariaLabel,
-      onClick: a[0] || (a[0] = (H) => e.$emit("close"))
+      "aria-label": $props.closeButtonProps.ariaLabel,
+      onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("close"))
     }), {
-      icon: h(() => [
-        k(m, {
+      icon: withCtx(() => [
+        createVNode(_component_dt_icon, {
           name: "close",
-          size: i.closeButtonIconSize
+          size: $options.closeButtonIconSize
         }, null, 8, ["size"])
       ]),
       _: 1
-    }, 16, ["class", "aria-label"]))
+    }, 16, ["class", "aria-label"])) : createCommentVNode("", true)
   ]);
 }
-const V = /* @__PURE__ */ B(z, [["render", q]]);
+const DtChip = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {
-  L as CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,
-  g as CHIP_ICON_SIZES,
-  p as CHIP_SIZE_MODIFIERS,
-  V as DtChip
+  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,
+  CHIP_ICON_SIZES,
+  CHIP_SIZE_MODIFIERS,
+  DtChip
 };
 //# sourceMappingURL=chip.js.map

package/dist/lib/chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.js","sources":["../../components/chip/chip_constants.js","../../components/chip/chip.vue"],"sourcesContent":["export const CHIP_SIZE_MODIFIERS = {\n  xs: 'd-chip__label--xs',\n  sm: 'd-chip__label--sm',\n  md: '',\n};\n\nexport const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-chip__close--xs',\n  sm: 'd-chip__close--sm',\n  md: '',\n};\n\nexport const CHIP_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '200',\n};\n\nexport default {\n  CHIP_SIZE_MODIFIERS,\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n};\n","<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\n          name=\"close\"\n          :size=\"closeButtonIconSize\"\n        />\n      </template>\n    </dt-button>\n  </span>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtIcon } from '@/components/icon';\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  name: 'DtChip',\n\n  components: {\n    DtButton,\n    DtIcon,\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":["CHIP_SIZE_MODIFIERS","CHIP_CLOSE_BUTTON_SIZE_MODIFIERS","CHIP_ICON_SIZES","_sfc_main","DtButton","DtIcon","props","s","getUniqueString","hasSlotContent","event","_a","_hoisted_1","_openBlock","_createElementBlock","_createBlock","_resolveDynamicComponent","$props","_mergeProps","$options","_toHandlers","$data","_ctx","_hoisted_2","_renderSlot","_hoisted_3","_component_dt_button","_createVNode","_component_dt_icon"],"mappings":"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"}
+{"version":3,"file":"chip.js","sources":["../../components/chip/chip_constants.js","../../components/chip/chip.vue"],"sourcesContent":["export const CHIP_SIZE_MODIFIERS = {\n  xs: 'd-chip__label--xs',\n  sm: 'd-chip__label--sm',\n  md: '',\n};\n\nexport const CHIP_CLOSE_BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-chip__close--xs',\n  sm: 'd-chip__close--sm',\n  md: '',\n};\n\nexport const CHIP_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '200',\n};\n\nexport default {\n  CHIP_SIZE_MODIFIERS,\n  CHIP_CLOSE_BUTTON_SIZE_MODIFIERS,\n  CHIP_ICON_SIZES,\n};\n","<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\n          name=\"close\"\n          :size=\"closeButtonIconSize\"\n        />\n      </template>\n    </dt-button>\n  </span>\n</template>\n\n<script>\nimport { DtButton } from '@/components/button';\nimport { DtIcon } from '@/components/icon';\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  name: 'DtChip',\n\n  components: {\n    DtButton,\n    DtIcon,\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":["_openBlock","_createElementBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_toHandlers","_renderSlot","_createVNode"],"mappings":"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"}

package/dist/lib/codeblock.cjs

@@ -1,3 +1,24 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),o=require("../chunks/_plugin-vue_export-helper-6_y-gaV6.js"),c={name:"DtCodeblock",props:{text:{type:String,required:!0}}},r={class:"d-codeblock"};function n(d,s,t,i,u,a){return e.openBlock(),e.createElementBlock("pre",null,[e.createTextVNode("    "),e.createElementVNode("code",r,e.toDisplayString(t.text),1),e.createTextVNode(`
-  `)])}const l=o._(c,[["render",n]]);exports.DtCodeblock=l;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const _pluginVue_exportHelper = require("../chunks/_plugin-vue_export-helper-fhnQq0tA.js");
+const _sfc_main = {
+  name: "DtCodeblock",
+  props: {
+    text: {
+      type: String,
+      required: true
+    }
+  }
+};
+const _hoisted_1 = { class: "d-codeblock" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("pre", null, [
+    vue.createTextVNode("    "),
+    vue.createElementVNode("code", _hoisted_1, vue.toDisplayString($props.text), 1),
+    vue.createTextVNode("\n  ")
+  ]);
+}
+const codeblock = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render]]);
+exports.DtCodeblock = codeblock;
 //# sourceMappingURL=codeblock.cjs.map