Tally UI

CashCountInput

Denomination-based cash counting input for register open/close workflows

Import

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

Usage

<CashCountInput onChangeTotal={(total) => console.log(total)} />

Renders a row for each cash denomination with a QuantityStepper to set the count. Automatically calculates and displays the running total. Supports both controlled and uncontrolled modes.

Props

PropTypeDefaultDescription
denominationsDenomination[]US currency denominationsCustom denominations to display
defaultCountsRecord<number, number>{}Initial counts for uncontrolled mode
countsRecord<number, number>---Controlled counts by denomination value
onChangeCounts(counts: Record<number, number>) => void---Called when any count changes
onChangeTotal(total: number) => void---Called with the recalculated total
classNamestring---Override container styles

Denomination

interface Denomination {
  label: string;
  value: number;
}

Live demo

On this page