Tally UI

QuantityStepper

Increment/decrement control for adjusting item quantities

Import

import { QuantityStepper } from '@tallyui/components';

Usage

<QuantityStepper defaultQuantity={1} onChangeQuantity={(qty) => console.log(qty)} />

A compact stepper with minus and plus buttons flanking a numeric display. Supports both controlled and uncontrolled modes.

Props

PropTypeDefaultDescription
defaultQuantitynumber1Initial quantity in uncontrolled mode
quantitynumber—Controlled quantity value
onChangeQuantity(quantity: number) => void—Callback when quantity changes
minnumber1Minimum allowed quantity
maxnumber999Maximum allowed quantity
classNamestring—Override container styles

Live demo