Tally UI

OrderSummaryLine

A single label-amount row for order summaries and receipts

Import

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

Usage

<OrderSummaryLine label="Subtotal" amount="$599.99" />
<OrderSummaryLine label="Total" amount="$659.99" bold />

Renders a horizontal row with a label on the left and an amount on the right. When bold is true, both label and amount use heavier font weight -- useful for the total line.

Props

PropTypeDefaultDescription
labelstringrequiredLeft-side label text
amountstringrequiredRight-side formatted amount
boldbooleanfalseBold styling for emphasis (e.g. total row)
classNamestring---Override row styles

Regular styles: label uses text-muted, amount uses text-foreground Bold styles: both use font-bold text-foreground

Live demo

On this page