vue-amazing-ui
Version:
An Amazing Vue3 UI Components Library, Using TypeScript.
9 lines (8 loc) • 1.09 kB
JavaScript
;Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("vue"),i=a.defineComponent({__name:"Flex",props:{width:{default:"auto"},vertical:{type:Boolean,default:!1},wrap:{default:"nowrap"},justify:{default:"normal"},align:{default:"normal"},gap:{default:"middle"}},setup(t){const e=t,l=a.computed(()=>typeof e.width=="number"?`${e.width}px`:e.width),p=a.computed(()=>{if(e.gap===void 0)return 0;if(typeof e.gap=="number")return`${e.gap}px`;if(Array.isArray(e.gap))return`${e.gap[1]}px ${e.gap[0]}px`;if(["small","middle","large"].includes(e.gap))return{small:"8px",middle:"16px",large:"24px"}[e.gap]});return(r,u)=>(a.openBlock(),a.createElementBlock("div",{class:a.normalizeClass(["m-flex",{"flex-vertical":r.vertical}]),style:a.normalizeStyle(`
width: ${l.value};
gap: ${p.value};
margin-bottom: -${Array.isArray(e.gap)&&r.wrap?e.gap[1]:0}px;
--wrap: ${r.wrap};
--justify: ${r.justify};
--align: ${r.align};
`)},[a.renderSlot(r.$slots,"default",{},void 0,!0)],6))}});exports.default=i;