website refactor

This commit is contained in:
2026-01-18 22:55:55 +01:00
parent b43a23a48c
commit aeaa43f4d3
179 changed files with 4736 additions and 6832 deletions

View File

@@ -12,7 +12,7 @@ import React, { forwardRef, ForwardedRef, ElementType } from 'react';
* If you need more complex behavior, create a specific component in apps/website/components.
*/
type Spacing = 0 | 0.5 | 1 | 1.5 | 2 | 2.5 | 3 | 3.5 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 14 | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 52 | 56 | 60 | 64 | 72 | 80 | 96;
export type Spacing = 0 | 0.5 | 1 | 1.5 | 2 | 2.5 | 3 | 3.5 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 14 | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 52 | 56 | 60 | 64 | 72 | 80 | 96;
interface ResponsiveSpacing {
base?: Spacing;
@@ -36,12 +36,12 @@ export interface BoxProps<T extends ElementType> {
children?: React.ReactNode;
// Spacing
margin?: Spacing | ResponsiveSpacing;
marginTop?: Spacing | ResponsiveSpacing;
marginBottom?: Spacing | ResponsiveSpacing;
marginTop?: Spacing | 'auto' | ResponsiveSpacing;
marginBottom?: Spacing | 'auto' | ResponsiveSpacing;
marginLeft?: Spacing | 'auto' | ResponsiveSpacing;
marginRight?: Spacing | 'auto' | ResponsiveSpacing;
marginX?: Spacing | 'auto' | ResponsiveSpacing;
marginY?: Spacing | ResponsiveSpacing;
marginY?: Spacing | 'auto' | ResponsiveSpacing;
padding?: Spacing | ResponsiveSpacing;
paddingTop?: Spacing | ResponsiveSpacing;
paddingBottom?: Spacing | ResponsiveSpacing;
@@ -176,6 +176,10 @@ export interface BoxProps<T extends ElementType> {
value?: string | number;
onChange?: React.ChangeEventHandler<any>;
onError?: React.ReactEventHandler<any>;
onScroll?: React.UIEventHandler<any>;
onDragOver?: React.DragEventHandler<any>;
onDragLeave?: React.DragEventHandler<any>;
onDrop?: React.DragEventHandler<any>;
placeholder?: string;
title?: string;
size?: string | number | ResponsiveValue<string | number>;
@@ -194,7 +198,6 @@ export interface BoxProps<T extends ElementType> {
onMouseDown?: React.MouseEventHandler<any>;
onMouseUp?: React.MouseEventHandler<any>;
onMouseMove?: React.MouseEventHandler<any>;
onScroll?: React.UIEventHandler<any>;
responsiveColSpan?: number | ResponsiveValue<number>;
responsiveGridCols?: number | ResponsiveValue<number>;
clickable?: boolean;
@@ -311,6 +314,10 @@ export const Box = forwardRef(<T extends ElementType = 'div'>(
value,
onChange,
onError,
onScroll,
onDragOver,
onDragLeave,
onDrop,
placeholder,
title,
size,
@@ -329,7 +336,6 @@ export const Box = forwardRef(<T extends ElementType = 'div'>(
onMouseDown,
onMouseUp,
onMouseMove,
onScroll,
responsiveColSpan,
responsiveGridCols,
clickable,
@@ -436,7 +442,7 @@ export const Box = forwardRef(<T extends ElementType = 'div'>(
getResponsiveClasses('items', alignItems),
getResponsiveClasses('justify', justifyContent),
alignSelf !== undefined ? `self-${alignSelf}` : '',
getResponsiveClasses('gap', gap),
gap ? getResponsiveClasses('gap', gap) : '',
getResponsiveClasses('grid-cols', gridCols || responsiveGridCols),
getResponsiveClasses('col-span', colSpan || responsiveColSpan),
getResponsiveClasses('order', order),
@@ -501,6 +507,9 @@ export const Box = forwardRef(<T extends ElementType = 'div'>(
onBlur={onBlur}
onSubmit={onSubmit}
onScroll={onScroll}
onDragOver={onDragOver}
onDragLeave={onDragLeave}
onDrop={onDrop}
onError={onError}
style={Object.keys(style).length > 0 ? style : undefined}
id={id}