#019
Default
An ExportMenu exporting three domain rows with custom column headers and a status line reporting the last export.
Hand this to your AI. It names the exact library parts, timings and accessibility promises of this demo.
Build the "Default" pattern (@codeatlasdev/ui demo #019, inputs/export-menu) in my app.
Call get_demo({ ids: ["#019"] }) first and keep its structure. It needs @codeatlasdev/[email protected].
Use: Table toolbars that let users download the current data set as a file in a chosen format.
Keep these library parts, with the props and tokens the demo uses:
- ExportMenu from "@codeatlasdev/ui"
Behaviour to keep:
- `data={rows}` with `const rows` of 3 objects with `domain`, `price` and `available` fields
- `filename="domains"`
- `columns` has 3 entries with `header` `Domain`, `Price (USD)` and `Available`
- `onexport` sets `last` to the exported `e.filename` and `e.rows` count
- Idle status text is `Pick a format to download.`
Reduced motion: the demo handles it; keep that branch.
Keyboard: operable; keep the focus order and key handling.
Change only the copy and the data. Use the theme tokens (--ca-*), never raw colours. Library parts
- ExportMenu
@codeatlasdev/ui
How it is built
- `data={rows}` with `const rows` of 3 objects with `domain`, `price` and `available` fields
- `filename="domains"`
- `columns` has 3 entries with `header` `Domain`, `Price (USD)` and `Available`
- `onexport` sets `last` to the exported `e.filename` and `e.rows` count
- Idle status text is `Pick a format to download.`
Related
Loading source.