Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/culur/antd-number-picker
Ant design number picker
https://github.com/culur/antd-number-picker
antd number-picker
Last synced: 11 days ago
JSON representation
Ant design number picker
- Host: GitHub
- URL: https://github.com/culur/antd-number-picker
- Owner: culur
- License: gpl-3.0
- Created: 2023-09-22T07:16:04.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2024-04-15T22:54:09.000Z (10 months ago)
- Last Synced: 2024-04-19T10:15:07.263Z (10 months ago)
- Topics: antd, number-picker
- Language: TypeScript
- Homepage: https://culur.github.io/antd-number-picker
- Size: 4.16 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# @culur/antd-number-picker
> Ant design number picker.
[](https://www.npmjs.com/package/@culur/antd-number-picker)
[](http://www.npmtrends.com/@culur/antd-number-picker)
[](https://github.com/culur/antd-number-picker/issues)
[](https://renovatebot.com/)
[](https://github.com/culur/antd-number-picker/actions/workflows/main.yml)
[](https://github.com/culur/antd-number-picker/actions/workflows/publish.yml)
[](https://www.codefactor.io/repository/github/culur/antd-number-picker)
## Install
Add `@culur/antd-number-picker` dependency to your project.
```bash
# Using npm
npm install @culur/antd-number-picker
# Using yarn
yarn add @culur/antd-number-picker
```
## Usage
### Standalone
```tsx
function Example() {
const [value, setValue] = setState(0);
return (
setValue(value_)}
/>
);
}
```
### Antd form
```tsx
function Example() {
type FormValues = { number: number };
const [form] = Form.useForm();
const onFinish = (values: FormValues) => {
console.log(`form values: ${values.number}`);
};
return (
Submit
);
}
```
## Props
| Property | Description | Type | Default | Required |
| --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------ | ---------- | -------- |
| className | InputNumber className | `string` | - | - |
| min | The min value | `number` | - | true |
| max | The max value | `number` | - | true |
| readOnly | If readonly the input | `boolean` | false | - |
| placement | The position of the tooltip relative to the target, which can be one of `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | `string` | bottomLeft | - |
| trigger | Tooltip trigger mode. Could be multiple by passing an array | `hover` \| `focus` \| `click` \| `contextMenu` \| `string[]` | click | - |
| cols | Number of cols in popover | `number` | 7 | - |
| rows | Number of rows in popover | `number` | 7 | - |
| value | The current value | `number` | - | - |
| onChange | The callback triggered when the value is changed | `function(value: number \| string \| null)` | - | - |
## License
`@culur/antd-number-picker` is released under the GNU GPLv3 license.