UNPKG

@dialpad/dialtone-vue

Version:

Vue component library for Dialpad's design system Dialtone

3 lines (2 loc) 2.56 kB
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("./badge-constants.cjs"),n=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),i={name:"DtBadge",props:{text:{type:String,default:""},kind:{type:String,default:"label",validator:t=>Object.keys(a.BADGE_KIND_MODIFIERS).includes(t)},type:{type:String,default:"default",validator:t=>Object.keys(a.BADGE_TYPE_MODIFIERS).includes(t)},decoration:{type:String,default:void 0,validator:t=>Object.keys(a.BADGE_DECORATION_MODIFIERS).includes(t)},labelClass:{type:[String,Array,Object],default:""},subtle:{type:Boolean,default:!1},outlined:{type:Boolean,default:!1}},data(){return{BADGE_TYPE_MODIFIERS:a.BADGE_TYPE_MODIFIERS,BADGE_KIND_MODIFIERS:a.BADGE_KIND_MODIFIERS,BADGE_DECORATION_MODIFIERS:a.BADGE_DECORATION_MODIFIERS}},computed:{hasLeftIcon(){return this.$scopedSlots.leftIcon&&this.$scopedSlots.leftIcon()},hasRightIcon(){return this.$scopedSlots.rightIcon&&this.$scopedSlots.rightIcon()},hasIcons(){return this.hasLeftIcon||this.hasRightIcon}},updated(){this.validateProps()},methods:{validateProps(){this.validateTypePropCombination(),this.validateDecorationPropCombination()},validateTypePropCombination(){this.type==="ai"&&this.kind==="count"&&console.error("DtBadge error: type: 'ai' with kind: 'count' is an invalid combination."),this.type!=="bulletin"&&this.subtle&&console.error("DtBadge error: subtle can only be used with type 'bulletin'")},validateDecorationPropCombination(){this.decoration&&((this.kind!=="label"||this.type!=="default")&&console.error("DtBadge error: decoration prop can only be used with kind: 'label' and type: 'default'."),this.hasIcons&&console.error("DtBadge error: decoration prop cannot be used with leftIcon or rightIcon."))}}};var s=function(){var e=this,o=e._self._c;return o("span",{class:["d-badge",e.BADGE_TYPE_MODIFIERS[e.type],e.BADGE_KIND_MODIFIERS[e.kind],e.BADGE_DECORATION_MODIFIERS[e.decoration],{"d-badge--subtle":e.subtle},{"d-badge--outlined":e.outlined}],attrs:{"data-qa":"dt-badge"}},[e.decoration?o("span",{staticClass:"d-badge__decorative"}):e._e(),e.hasLeftIcon?o("span",{staticClass:"d-badge__icon-left"},[e._t("leftIcon",null,{iconSize:"200"})],2):e._e(),o("span",{class:["d-badge__label",e.labelClass]},[e._t("default",function(){return[e._v(" "+e._s(e.text)+" ")]})],2),e.hasRightIcon?o("span",{staticClass:"d-badge__icon-right"},[e._t("rightIcon",null,{iconSize:"200"})],2):e._e()])},r=[],l=n.n(i,s,r);const d=l.exports;exports.default=d; //# sourceMappingURL=badge.cjs.map