Components / Number Input
Number Input
Number input with +/- increment buttons, long-press repeat, keyboard arrows.
forms v0.5.0
Playground
Examples
Basic
<cg-number-input value="5" min="0" max="100" label="Quantity" style="max-width:200px;"></cg-number-input> Import
import { CgNumberInput } from '@cognivo/components'; // Or tree-shake: import '@cognivo/components/cg-number-input'; Per-component imports ship only that component (~8 kB gzip).
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
value | number | 0 | Current value |
min | number | — | Minimum |
max | number | — | Maximum |
step | number | 1 | Step increment |
rounded | "none" | "sm" | "md" | "lg" | "full" | "lg" | Border radius variant |
Events
| Event | Detail | Description |
|---|---|---|
cg-change | {value} | Value changed |