website refactor

This commit is contained in:
2026-01-18 17:55:04 +01:00
parent 489deb2991
commit 9ffe47da37
75 changed files with 1596 additions and 1259 deletions

View File

@@ -1,5 +1,5 @@
import React from 'react';
import { Box } from './Box';
import React, { ElementType } from 'react';
import { Box, BoxProps } from './Box';
/**
* WARNING: DO NOT VIOLATE THE PURPOSE OF THIS PRIMITIVE.
@@ -12,15 +12,15 @@ import { Box } from './Box';
* If you need a more specific layout, create a new component in apps/website/components.
*/
export interface GridItemProps {
children: React.ReactNode;
export interface GridItemProps<T extends ElementType = 'div'> extends Omit<BoxProps<T>, 'children'> {
children?: React.ReactNode;
colSpan?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
mdSpan?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
lgSpan?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
className?: string;
}
export function GridItem({ children, colSpan, mdSpan, lgSpan, className = '' }: GridItemProps) {
export function GridItem<T extends ElementType = 'div'>({ children, colSpan, mdSpan, lgSpan, className = '', ...props }: GridItemProps<T>) {
const spanClasses = [
colSpan ? `col-span-${colSpan}` : '',
mdSpan ? `md:col-span-${mdSpan}` : '',
@@ -29,7 +29,7 @@ export function GridItem({ children, colSpan, mdSpan, lgSpan, className = '' }:
].filter(Boolean).join(' ');
return (
<Box className={spanClasses}>
<Box className={spanClasses} {...props}>
{children}
</Box>
);