Form fields·loomora/NumberField
NumberField
A TextField wrapper that formats typed numbers and reports a numeric value (number or undefined) on change events.
Interactive live playground
Tweak props, change states, and see the live component respond in real time.
How to call
Import directly from the Loomora package root. For projects without Tailwind CSS, ensure loomora/dist/index.css is imported once in your root layout.
import { NumberField } from 'loomora'
<NumberField label="Price" decimalsMax={2} properties={{ value, onChange: (e) => setValue(e.target.value) }} />API reference
Important public props and how they affect rendering.
| Prop | Type | Default | Description |
|---|---|---|---|
| properties.value | number | null | — | Controlled numeric value. |
| properties.onChange | (e) => void | — | Event whose target.value is a number or undefined. |
| decimalsMin / decimalsMax | number | 0 / 3 | Fraction digits. |
| thousandSeparator | string | ',' | Group separator. |
| decimalSeparator | string | '.' | Decimal separator. |
| allowNegative | boolean | false | Permits a leading minus. |