4
0
forked from crowetic/commerce
2020-10-04 15:16:56 -03:00

41 lines
854 B
TypeScript

import cn from 'classnames'
import { FC, ReactNode, Component } from 'react'
import s from './Grid.module.css'
interface Props {
className?: string
children?: any
items: [any] | any
layout?: 'A' | 'B' | 'C' | 'D'
wrapper?: ReactNode | Component | any
}
const DefaultWrapper: FC<Props> = ({ children }) => <div>{children}</div> // DEFAULT ITEMS WRAPPER
const Grid: FC<Props> = ({
items = [],
className,
layout = 'A',
wrapper: Component = DefaultWrapper,
}) => {
const rootClassName = cn(
s.root,
{
[s.layoutA]: layout === 'A',
[s.layoutB]: layout === 'B',
[s.layoutC]: layout === 'C',
[s.layoutD]: layout === 'D',
},
className
)
return (
<div className={rootClassName}>
{items.map((data: any) => (
<Component {...data} />
))}
</div>
)
}
export default Grid