4
0
forked from crowetic/commerce

35 lines
795 B
TypeScript
Raw Normal View History

2020-10-04 15:16:56 -03:00
import cn from 'classnames'
import { FC, ReactNode, Component } from 'react'
import s from './Grid.module.css'
interface Props {
className?: string
2020-10-16 12:46:02 -03:00
children?: ReactNode[] | Component[] | any[]
2020-10-05 11:44:14 -03:00
layout?: 'A' | 'B' | 'C' | 'D' | 'normal'
2020-10-05 14:28:59 -03:00
variant?: 'default' | 'filled'
2020-10-04 15:16:56 -03:00
}
const Grid: FC<Props> = ({
className,
layout = 'A',
2020-10-16 12:46:02 -03:00
children,
2020-10-05 14:28:59 -03:00
variant = 'default',
2020-10-04 15:16:56 -03:00
}) => {
const rootClassName = cn(
s.root,
{
[s.layoutA]: layout === 'A',
[s.layoutB]: layout === 'B',
[s.layoutC]: layout === 'C',
[s.layoutD]: layout === 'D',
2020-10-05 11:44:14 -03:00
[s.layoutNormal]: layout === 'normal',
2020-10-05 14:28:59 -03:00
[s.default]: variant === 'default',
[s.filled]: variant === 'filled',
2020-10-04 15:16:56 -03:00
},
className
)
2020-10-16 12:46:02 -03:00
return <div className={rootClassName}>{children}</div>
2020-10-04 15:16:56 -03:00
}
export default Grid