@lanaco/lnc-react-ui
Version:
React component library
10 lines (9 loc) • 1.09 kB
JavaScript
;const p=require("react/jsx-runtime"),u=require("react"),w=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),d={Row:"row",RowReverse:"row-reverse",Column:"column",ColumnReverse:"column-reverse"},x={NoWrap:"nowrap",Wrap:"wrap",WrapReverse:"wrap-reverse"},m={Start:"flex-start",Center:"center",End:"flex-end",SpaceAround:"space-around",SpaceBetween:"space-between",SpaceEvenly:"space-evenly"},f={Start:"flex-start",Center:"center",Stretch:"stretch",End:"flex-end",Baseline:"baseline"},y=w.styled.div`
display: flex;
flex-direction: ${e=>d[e.direction]};
flex-wrap: ${e=>x[e.wrap]};
justify-content: ${e=>m[e.justifyContent]};
align-items: ${e=>f[e.alignItems]};
column-gap: ${e=>e.columnGap?e.columnGap:e.gap};
row-gap: ${e=>e.rowGap?e.rowGap:e.gap};
`,S=u.forwardRef((e,r)=>{const{className:t="",children:n,direction:a="Row",wrap:o="NoWrap",justifyContent:s="Start",alignItems:c="Stretch",gap:l="0",...i}=e;return p.jsx(y,{className:"lnc-flexbox-container "+(t||""),ref:r,wrap:o,gap:l,alignItems:c,direction:a,justifyContent:s,...i,children:n})});module.exports=S;