Usage
import { Presets, type Preset } from '@luxfi/ui/read'<Presets
presets={[
{ key: '100', label: '$100', press: () => setAmount('100') },
{ key: '500', label: '$500', press: () => setAmount('500') },
]}
/>A press writes into the field above and nothing else follows from it. There is no chosen state: the figure above is the answer, and a chip lit beside it would be a second one.
Props
| Prop | Type | Required | Default |
|---|---|---|---|
presets | readonly Preset[] | yes | |
under | 'sum' | 'leg' | no | 'sum' |
about | string | no |
under says which panel the row stands in, which is the whole of what differs
between the two of them. Inside a sum the row is the card's own second decision,
so it is centred under the figure at reach.plain. Beside a leg it qualifies
the field next to it rather than carrying the screen, so it takes reach.dense
and the inline inset.
about is the id of the element carrying the reason none of these can be
pressed. Written once and pointed at by every chip: a reason repeated on each is
four sentences where a reader wanted four words.
Preset
| Field | Type | Required |
|---|---|---|
key | string | yes |
label | ReactNode | yes |
press | () => void | no |
press is absent where there is nothing a press would do — a part of a holding
nobody has quoted, a price the screen cannot compute — and the chip is then
named and off. What says off is the ink: the fill stays put and the word steps
back from paint.quiet to paint.faint. It stays reachable, because a chip out
of the tab order takes its own reason with it.