Data input

Number input

Themed numeric input with stepper buttons, locale formatting, and min/max/step constraints.

Import

Add the symbol to your component's imports array. The walkthrough below shows the most common usages — copy & tweak.

import { KjNumberInputComponent } from '@kouji-ui/components';

Loading editor

value

min

max

step

stepper layout

disabled

readonly

<kj-number-input
  [(kjValue)]="value"
  [kjMin]="0"
  [kjMax]="100"
  [kjStep]="5"
  kjStepperLayout="flanking"
  kjAriaLabel="Quantity"
/>