@fifteen/design-system-vue
Version:
Vue 3 (Composition API + Typescript) implementation of the Fifteen Design System
2 lines (1 loc) • 870 B
JavaScript
;const o=require("vue"),a=require("../utils/genSize.js"),r=require("../utils/getCssColor.js"),d=o.defineComponent({__name:"FCard",props:{color:{default:"primary"},hoverColor:{default:void 0},textColor:{default:"neutral--light-5"},hoverTextColor:{default:void 0},width:{default:""}},setup(t){const e=t,l=o.computed(()=>({"--fcard--color":r.getCssColor(e.color),"--fcard--hover-color":r.getCssColor(e.hoverColor??e.color),"--fcard--width":a.genSize(e.width),"--fcard--text-color":r.getCssColor(e.textColor),"--fcard--hover-text-color":r.getCssColor(e.hoverTextColor??e.textColor)})),s=o.computed(()=>({"FCard--hoverAnimated":!!e.hoverColor||!!e.hoverTextColor}));return(c,n)=>(o.openBlock(),o.createElementBlock("div",{class:o.normalizeClass(["FCard",o.unref(s)]),style:o.normalizeStyle(o.unref(l))},[o.renderSlot(c.$slots,"default")],6))}});module.exports=d;