@dialpad/dialtone/dist/vue3/lib/chip/chip.cjs

Dialpad's Dialtone design system monorepo

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(`../../localization/index.cjs`),r=require(`../button/button.cjs`),i=require(`./chip-constants.cjs`);let a=require(`vue`),o=require(`@dialpad/dialtone-icons/vue3`);var s={compatConfig:{MODE:3},name:`DtChip`,components:{DtButton:r.default,DtIconClose:o.DtIconClose},props:{disabled:{type:Boolean,default:!1},hideClose:{type:Boolean,default:!1},size:{type:String,default:`md`,validator:e=>Object.keys(i.CHIP_SIZE_MODIFIERS).includes(e)},interactive:{type:Boolean,default:!0},id:{type:String,default:function(){return e.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,hasSlotContent:e.hasSlotContent,i18n:new n.DialtoneLocalization}},computed:{chipListeners(){return{click:e=>{this.interactive&&this.$emit(`click`,e)},keydown:e=>{e.code?.toLowerCase()===`delete`?this.onClose():this.$emit(`keydown`,e)},keyup:e=>{this.$emit(`keyup`,e)}}},closeButtonIconSize(){return i.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`,i.CHIP_SIZE_MODIFIERS[this.size],this.labelClass,this.disabled&&`d-chip--disabled`]},chipCloseButtonClasses(){return[`d-chip__close`,i.CHIP_CLOSE_BUTTON_SIZE_MODIFIERS[this.size],this.disabled&&`d-chip__close--disabled`]},onClose(){this.hideClose||this.$emit(`close`)}}},c={class:`d-chip`},l={key:0,class:`d-chip__icon`,"data-qa":`dt-chip-icon`},u={key:1,"data-qa":`dt-chip-avatar`},d=[`id`];function f(e,t,n,r,i,o){let s=(0,a.resolveComponent)(`dt-icon-close`),f=(0,a.resolveComponent)(`dt-button`);return(0,a.openBlock)(),(0,a.createElementBlock)(`span`,c,[((0,a.openBlock)(),(0,a.createBlock)((0,a.resolveDynamicComponent)(n.interactive?`button`:`span`),(0,a.mergeProps)({id:n.id,"aria-label":n.ariaLabel,"aria-labelledby":n.ariaLabel?void 0:`${n.id}-content`,"aria-disabled":n.disabled,class:o.chipClasses(),type:n.interactive&&`button`,"data-qa":`dt-chip`,tabindex:n.disabled?-1:null},(0,a.toHandlers)(o.chipListeners)),{default:(0,a.withCtx)(()=>[i.hasSlotContent(e.$slots.icon)?((0,a.openBlock)(),(0,a.createElementBlock)(`span`,l,[(0,a.renderSlot)(e.$slots,`icon`)])):i.hasSlotContent(e.$slots.avatar)?((0,a.openBlock)(),(0,a.createElementBlock)(`span`,u,[(0,a.renderSlot)(e.$slots,`avatar`)])):(0,a.createCommentVNode)(``,!0),i.hasSlotContent(e.$slots.default)?((0,a.openBlock)(),(0,a.createElementBlock)(`span`,{key:2,id:`${n.id}-content`,class:(0,a.normalizeClass)([`d-chip__text`,n.contentClass]),"data-qa":`dt-chip-label`},[(0,a.renderSlot)(e.$slots,`default`)],10,d)):(0,a.createCommentVNode)(``,!0)]),_:3},16,[`id`,`aria-label`,`aria-labelledby`,`aria-disabled`,`class`,`type`,`tabindex`])),n.hideClose?(0,a.createCommentVNode)(``,!0):((0,a.openBlock)(),(0,a.createBlock)(f,{key:0,class:(0,a.normalizeClass)(o.chipCloseButtonClasses()),"data-qa":`dt-chip-close`,"aria-label":o.closeButtonTitle,"aria-disabled":n.disabled,title:o.closeButtonTitle,tabindex:n.disabled?-1:null,onClick:t[0]||(t[0]=t=>e.$emit(`close`))},{icon:(0,a.withCtx)(()=>[(0,a.createVNode)(s,{size:o.closeButtonIconSize},null,8,[`size`])]),_:1},8,[`class`,`aria-label`,`aria-disabled`,`title`,`tabindex`]))])}var p=t.t(s,[[`render`,f]]);exports.default=p;
//# sourceMappingURL=chip.cjs.map