import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
import { HTMLAttributes } from 'react';
import { Props } from '../@types/Props.js';
import { Columns } from './@types/Columns.js';
import { Breakpoint } from '../../foundations/__generated__/breakpoints.js';

type GridBreakpoint = Extract<Breakpoint, 'mobile' | 'tablet' | 'desktop' | 'leftCol' | 'wide'>;
type CollapseBreakpoint = Extract<GridBreakpoint, 'tablet' | 'desktop' | 'leftCol' | 'wide'>;
interface TilesProps extends HTMLAttributes<HTMLDivElement>, Props {
    /**
     * The number of columns you want.
     */
    columns: Columns;
    /**
     * Child components will be stacked in a single column at viewport widths narrower than the
     * specified breakpoint (they will always be collapsed into a single column if the viewport is narrower than `mobileLandscape`).
     */
    collapseUntil?: CollapseBreakpoint;
    /**
     * **Deprecated**
     *
     * Use `collapseUntil` instead.
     *
     * @deprecated Use `collapseUntil` instead.
     */
    collapseBelow?: CollapseBreakpoint;
}
/**
 * [Storybook](https://guardian.github.io/storybooks/?path=/story/source_react-components-textinput--default-default-theme) •
 * [Design System](https://theguardian.design/2a1e5182b/p/00e9f5-tiles) •
 * [GitHub](https://github.com/guardian/csnx/tree/main/libs/@guardian/source/src/react-components/layout/Tiles.tsx) •
 * [NPM](https://www.npmjs.com/package/@guardian/source)
 *
 * Child components will be arranged with equal width and spacing with the specified number of columns,
 * wrapping onto a new row as necessary.
 *
 * Until `mobileLandscape`, child components will be collapsed into a single column.
 */
declare const Tiles: ({ columns, collapseBelow, collapseUntil, cssOverrides, children, ...props }: TilesProps) => _emotion_react_jsx_runtime.JSX.Element;

export { Tiles };
export type { TilesProps };