This package contains common components for https://material-ui.com/.
MilkScout want to give something back to the community.
usage npm install @milkscout/material-ui or yarn add @milkscout/material-ui
peer dependency => react, material-ui
###NumberField An Field that composite an textfield https://material-ui.com/components/text-fields/#text-field.
The input type is forced to type="text", there will be a chrome like replacement for arrows.
Hints
- no negative numbers supported, because smartphone numbers dont have an minus
- does not contain validation
Events are overridden:
onChange: (value: number | undefined) => void;
onFocus: (value: number | undefined) => void;
onBlur: (value: number | undefined) => void;
onKeyPress: (value: number | undefined) => void;
onKeyUp: (value: number | undefined) => void;
onKeyDown: (value: number | undefined) => void;
Additional attributes:
| Attribute | Type | Required | Default | Description |
| value | number | optional | undefined | The displayed number, maybe currency |
| decimalPlaces | number | optional | 2 | The amount of decimal digits |
| decimalCharacter | string | optional | '.' | The decimal divider |
| thousandCharacter | string | optional | ',' | The thousand group character, can also be empty |
| showArrow | boolean | optional | false | Show on desktop, always the arrows, not shown on mobile |
| min | number | optional | undefined | Add the minimum for stepper, if minimum > 0, no negative numbers possible |
| max | number | optional | undefined | Add the minimum for stepper |
| step | number | optional | 1 | The step size if you click on the arrow or use the keyboard |