Components
UI primitives for point-of-sale interfaces
Overview
Tally UI components are React Native primitives that work on iOS, Android, and Web via Expo. They use the trait layer to read data from any connector and Uniwind for className-based styling.
Every component accepts a className prop for style overrides. Defaults are merged using cn() from @tallyui/theme, so your classes cleanly override the built-in styles. See Design System for details.
Product Components
- ProductTitle -- Displays product name
- ProductPrice -- Price with sale price support
- ProductImage -- Primary product image
- ProductSku -- SKU with fallback
- ProductStockBadge -- Stock status indicator
- ProductCard -- Compact card with image, title, and price
Grid Components
- SearchInput -- Styled search text input
- FilterChipGroup -- Horizontally scrollable category chips
- ProductGrid -- Scrollable grid with search and filter slots
Cart Components
- CartLine -- Single cart line item
- CartTotal -- Cart summary with subtotal, tax, total
- CartPanel -- Scrollable cart with header and footer slots
Customer Components
- CustomerCard -- Customer name, email, and address
- CustomerSelect -- Customer picker with search
Checkout Components
- PaymentMethodCard -- Selectable payment method card
- PaymentSelector -- Radio-style payment method selector
- OrderSummaryLine -- Single label-amount row
- OrderSummary -- Full receipt with payment breakdown