17 lines
539 B
TypeScript
17 lines
539 B
TypeScript
import * as React from 'react';
|
|
import { clsx } from 'clsx';
|
|
|
|
export interface FieldGridProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
columns?: 1 | 2 | 3;
|
|
}
|
|
|
|
const columnClass: Record<NonNullable<FieldGridProps['columns']>, string> = {
|
|
1: 'grid-cols-1',
|
|
2: 'grid-cols-1 md:grid-cols-2',
|
|
3: 'grid-cols-1 md:grid-cols-2 xl:grid-cols-3',
|
|
};
|
|
|
|
export function FieldGrid({ columns = 2, className, ...props }: FieldGridProps) {
|
|
return <div className={clsx('grid min-w-0 gap-4', columnClass[columns], className)} {...props} />;
|
|
}
|