Founding price: $35, then $79.99 after 23:59 UTC on 4 November, then $79.99
Get ProShow form values as read-only text instead of disabled inputs: a description list with typed values (date, currency, list, link, secret, color, file) and a mode switch that swaps controls for their preview.
This item has no props to tune. Use the lens above to change theme, density, direction and more.
| Export | Description |
|---|---|
ReadOnlyValue | One value as text, by type. |
ReadOnlyList, ReadOnlyItem | A dl of label and value pairs. |
ReadOnlyProvider, ModeField, useReadOnly | Switch a form between edit and preview. |
| Prop | Type | Description |
|---|---|---|
value | unknown | The value. Empty strings, null, undefined and [] show the empty text. |
type | text, multiline, boolean, number, currency, percent, date, datetime, list, link, email, secret, color, file | How to format it. |
empty | ReactNode | Default "Not set". |
locale, currency | string | For number, currency and date formats. |
dd elements, paired with a dt label, so a screen reader reads "Plan, Team". A disabled input would be skipped or announced as dimmed; text is read like any other content.false boolean says "No".aria-pressed and a name that tells the next action.time element with a machine-readable datetime; links open in a new tab with rel="noreferrer noopener".The component ships with a Testing Library test (read-only-field.test.tsx) that covers: its main behaviour, the keyboard path and the error or empty states.