@amsterdam/design-system-react/dist/Grid/Grid.d.ts

All React components from the Amsterdam Design System. Use it to compose pages in your website or application.

/**
 * @license EUPL-1.2+
 * Copyright Gemeente Amsterdam
 */
import type { HTMLAttributes, PropsWithChildren } from 'react';
export type GridColumnNumber = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
export type GridColumnNumbers = {
    narrow: 1 | 2 | 3 | 4;
    medium: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
    wide: GridColumnNumber;
};
export type GridPaddingSize = 'small' | 'medium' | 'large';
export declare const gridTags: readonly ["article", "aside", "div", "footer", "header", "main", "nav", "section"];
export type GridTag = (typeof gridTags)[number];
type GridPaddingVerticalProp = {
    paddingBottom?: never;
    paddingTop?: never;
    /** The amount of space above and below. */
    paddingVertical?: GridPaddingSize;
};
type GridPaddingTopAndBottomProps = {
    /** The amount of space below. */
    paddingBottom?: GridPaddingSize;
    /** The amount of space above. */
    paddingTop?: GridPaddingSize;
    paddingVertical?: never;
};
export type GridProps = {
    /** The HTML tag to use. */
    as?: GridTag;
    /** The amount of space between rows. */
    gapVertical?: 'none' | 'small' | 'large';
} & (GridPaddingVerticalProp | GridPaddingTopAndBottomProps) & PropsWithChildren<HTMLAttributes<HTMLDivElement>>;
export declare const Grid: import("react").ForwardRefExoticComponent<GridProps & import("react").RefAttributes<any>> & {
    Cell: import("react").ForwardRefExoticComponent<import("./GridCell").GridCellProps & import("react").RefAttributes<unknown>>;
};
export {};