nalarx-uiComponents
Field
A label, a control and one line under it for the hint or the error.
bunx shadcn@latest add @nalarx/fieldUsage
children is a function: bind the id to the control so the label targets it, and describedBy to aria-describedby so the hint or error is read with it.
<Field label="Email" error={error}>
{(id, describedBy) => <Input id={id} aria-describedby={describedBy} aria-invalid={!!error} />}
</Field>Letters, numbers and dashes.
This value is not valid
Letters, numbers and dashes.
This value is not valid
Props
| Prop | Type | |
|---|---|---|
label | string | Visible label. |
hint | ReactNode | Shown under the control when there is no error. |
error | string | Replaces the hint. Set aria-invalid on the control too. |
children | (id, describedBy) => ReactNode | Renders the control. |
Replaces
The label and error of NxInput (web) and the Platform's base/Field.tsx.