@dialpad/dialtone-vue/dist/lib/chip/chip.cjs

Vue component library for Dialpad's design system Dialtone

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("@dialpad/dialtone-icons/vue2"),s=require("./chip-constants.cjs"),n=require("../../common/utils/index.cjs"),l=require("../../localization/index.cjs"),o=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),c=require("../button/button.cjs"),r={name:"DtChip",components:{DtButton:c.default,DtIconClose:a.DtIconClose},props:{disabled:{type:Boolean,default:!1},hideClose:{type:Boolean,default:!1},size:{type:String,default:"md",validator:e=>Object.keys(s.CHIP_SIZE_MODIFIERS).includes(e)},interactive:{type:Boolean,default:!0},id:{type:String,default:function(){return n.getUniqueString()}},ariaLabel:{type:String,default:""},contentClass:{type:[String,Array,Object],default:""},labelClass:{type:[String,Array,Object],default:""}},emits:["click","close","keyup","keydown"],data(){return{isActive:!1,i18n:new l.DialtoneLocalization}},computed:{chipListeners(){return{...this.$listeners,click:e=>{this.interactive&&this.$emit("click",e)},keydown:e=>{var t;((t=e.code)==null?void 0:t.toLowerCase())==="delete"?this.onClose():this.$emit("keydown",e)},keyup:e=>{this.$emit("keyup",e)}}},closeButtonIconSize(){return s.CHIP_ICON_SIZES[this.size]},closeButtonTitle(){return this.i18n.$t("DIALTONE_CLOSE_BUTTON")}},methods:{chipClasses(){return[this.$attrs["grouped-chip"]?"d-chip":"d-chip__label",s.CHIP_SIZE_MODIFIERS[this.size],this.labelClass,this.disabled&&"d-chip--disabled"]},chipCloseButtonClasses(){return["d-chip__close",s.CHIP_CLOSE_BUTTON_SIZE_MODIFIERS[this.size],this.disabled&&"d-chip__close--disabled"]},onClose(){this.hideClose||this.$emit("close")}}};var d=function(){var t=this,i=t._self._c;return i("span",{staticClass:"d-chip"},[i(t.interactive?"button":"span",t._g({tag:"component",class:t.chipClasses(),attrs:{id:t.id,"aria-label":t.ariaLabel,"aria-labelledby":t.ariaLabel?void 0:`${t.id}-content`,"aria-disabled":t.disabled,type:t.interactive&&"button","data-qa":"dt-chip",tabindex:t.disabled?-1:null}},t.chipListeners),[t.$slots.icon?i("span",{staticClass:"d-chip__icon",attrs:{"data-qa":"dt-chip-icon"}},[t._t("icon")],2):t.$slots.avatar?i("span",{attrs:{"data-qa":"dt-chip-avatar"}},[t._t("avatar")],2):t._e(),t.$slots.default?i("span",{class:["d-chip__text",t.contentClass],attrs:{id:`${t.id}-content`,"data-qa":"dt-chip-label"}},[t._t("default")],2):t._e()]),t.hideClose?t._e():i("dt-button",{class:t.chipCloseButtonClasses(),attrs:{"data-qa":"dt-chip-close","aria-label":t.closeButtonTitle,"aria-disabled":t.disabled,title:t.closeButtonTitle,tabindex:t.disabled?-1:null},on:{click:function(h){return t.$emit("close")}},scopedSlots:t._u([{key:"icon",fn:function(){return[i("dt-icon-close",{attrs:{size:t.closeButtonIconSize}})]},proxy:!0}],null,!1,1341282633)})],1)},u=[],_=o.n(r,d,u);const p=_.exports;exports.default=p;
//# sourceMappingURL=chip.cjs.map