| 1 | import { ReactNode } from 'react';
|
| 2 | import { Styles } from '../styles';
|
| 3 | export interface Props<T> {
|
| 4 | /**
|
| 5 | * Array of items of any type to render using a function you pass as a component child.
|
| 6 | */
|
| 7 | readonly items: T[];
|
| 8 | /**
|
| 9 | * Styles to apply to a container of child elements. See <Box> for supported properties.
|
| 10 | */
|
| 11 | readonly style?: Styles;
|
| 12 | /**
|
| 13 | * Function that is called to render every item in `items` array.
|
| 14 | * First argument is an item itself and second argument is index of that item in `items` array.
|
| 15 | * Note that `key` must be assigned to the root component.
|
| 16 | */
|
| 17 | readonly children: (item: T, index: number) => ReactNode;
|
| 18 | }
|
| 19 | /**
|
| 20 | * `<Static>` component permanently renders its output above everything else.
|
| 21 | * It's useful for displaying activity like completed tasks or logs - things that
|
| 22 | * are not changing after they're rendered (hence the name "Static").
|
| 23 | *
|
| 24 | * It's preferred to use `<Static>` for use cases like these, when you can't know
|
| 25 | * or control the amount of items that need to be rendered.
|
| 26 | *
|
| 27 | * For example, [Tap](https://github.com/tapjs/node-tap) uses `<Static>` to display
|
| 28 | * a list of completed tests. [Gatsby](https://github.com/gatsbyjs/gatsby) uses it
|
| 29 | * to display a list of generated pages, while still displaying a live progress bar.
|
| 30 | */
|
| 31 | declare const Static: {
|
| 32 | <T>(props: Props<T>): JSX.Element;
|
| 33 | displayName: string;
|
| 34 | };
|
| 35 | export default Static;
|