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

Dialpad's Dialtone design system monorepo

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("@dialpad/dialtone-icons/vue3"),s=require("./chip-constants.cjs"),i=require("../../common/utils/index.cjs"),e=require("vue"),u=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),h=require("../button/button.cjs"),p={compatConfig:{MODE:3},name:"DtChip",components:{DtButton:h.default,DtIconClose:d.DtIconClose},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(s.CHIP_SIZE_MODIFIERS).includes(t)},interactive:{type:Boolean,default:!0},id:{type:String,default:function(){return i.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:i.hasSlotContent}},computed:{chipListeners(){return{click:t=>{this.interactive&&this.$emit("click",t)},keyup:t=>{var l;((l=t.code)==null?void 0:l.toLowerCase())==="delete"?this.onClose():this.$emit("keyup",t)}}},closeButtonIconSize(){return s.CHIP_ICON_SIZES[this.size]}},methods:{chipClasses(){return[this.$attrs["grouped-chip"]?"d-chip":"d-chip__label",s.CHIP_SIZE_MODIFIERS[this.size],this.labelClass]},chipCloseButtonClasses(){return["d-chip__close",s.CHIP_CLOSE_BUTTON_SIZE_MODIFIERS[this.size]]},onClose(){this.hideClose||this.$emit("close")}}},C={class:"d-chip"},_={key:0,"data-qa":"dt-chip-icon",class:"d-chip__icon"},m={key:1,"data-qa":"dt-chip-avatar"},b=["id"];function S(t,l,o,k,a,n){const c=e.resolveComponent("dt-icon-close"),r=e.resolveComponent("dt-button");return e.openBlock(),e.createElementBlock("span",C,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.interactive?"button":"span"),e.mergeProps({id:o.id,type:o.interactive&&"button",class:n.chipClasses(),"data-qa":"dt-chip","aria-labelledby":o.ariaLabel?void 0:`${o.id}-content`,"aria-label":o.ariaLabel},e.toHandlers(n.chipListeners)),{default:e.withCtx(()=>[a.hasSlotContent(t.$slots.icon)?(e.openBlock(),e.createElementBlock("span",_,[e.renderSlot(t.$slots,"icon")])):a.hasSlotContent(t.$slots.avatar)?(e.openBlock(),e.createElementBlock("span",m,[e.renderSlot(t.$slots,"avatar")])):e.createCommentVNode("",!0),a.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,b)):e.createCommentVNode("",!0)]),_:3},16,["id","type","class","aria-labelledby","aria-label"])),o.hideClose?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(r,e.mergeProps({key:0},o.closeButtonProps,{class:n.chipCloseButtonClasses(),"data-qa":"dt-chip-close","aria-label":o.closeButtonProps.ariaLabel,onClick:l[0]||(l[0]=y=>t.$emit("close"))}),{icon:e.withCtx(()=>[e.createVNode(c,{size:n.closeButtonIconSize},null,8,["size"])]),_:1},16,["class","aria-label"]))])}const f=u._(p,[["render",S]]);exports.default=f;
//# sourceMappingURL=chip.cjs.map