mirror of
https://github.com/vercel/commerce.git
synced 2025-03-28 08:15:54 +00:00
35 lines
797 B
TypeScript
35 lines
797 B
TypeScript
import cn from 'clsx'
|
|
import { FC, ReactNode, Component } from 'react'
|
|
import s from './Grid.module.css'
|
|
|
|
interface GridProps {
|
|
className?: string
|
|
children?: ReactNode[] | Component[] | any[]
|
|
layout?: 'A' | 'B' | 'C' | 'D' | 'normal'
|
|
variant?: 'default' | 'filled'
|
|
}
|
|
|
|
const Grid: FC<GridProps> = ({
|
|
className,
|
|
layout = 'A',
|
|
children,
|
|
variant = 'default',
|
|
}) => {
|
|
const rootClassName = cn(
|
|
s.root,
|
|
{
|
|
[s.layoutA]: layout === 'A',
|
|
[s.layoutB]: layout === 'B',
|
|
[s.layoutC]: layout === 'C',
|
|
[s.layoutD]: layout === 'D',
|
|
[s.layoutNormal]: layout === 'normal',
|
|
[s.default]: variant === 'default',
|
|
[s.filled]: variant === 'filled',
|
|
},
|
|
className
|
|
)
|
|
return <div className={rootClassName}>{children}</div>
|
|
}
|
|
|
|
export default Grid
|