Receipt Printer
A tactile checkout experience that turns payment processing into a printed receipt, complete with order details.
Last updated August 13, 2026
CreditsModifiedPublished
Copied from Dqnamo Receipt Printer experiment.
- Rebuilt as an original compound component for the PersianLabs registry.
- Added status stages, product imagery, subscription receipts, and RTL Persian content.
Overview
Installation
$ npx shadcn@latest add https://ui.persian-labs.ir/r/receipt-printer.jsonUsage
import { ReceiptPrinter } from "@/components/ui/receipt-printer"
export function Example() {
return (
<ReceiptPrinter.Root stage="complete">
<ReceiptPrinter.Machine>
<ReceiptPrinter.Header>
<ReceiptPrinter.Status>Payment approved</ReceiptPrinter.Status>
</ReceiptPrinter.Header>
<ReceiptPrinter.Screen>READY · 12:48</ReceiptPrinter.Screen>
</ReceiptPrinter.Machine>
<ReceiptPrinter.Output>
<ReceiptPrinter.Paper>Your receipt content</ReceiptPrinter.Paper>
</ReceiptPrinter.Output>
</ReceiptPrinter.Root>
)
}Examples
Subscription renewal
RTL
The printer uses logical layout and accepts dir="rtl", keeping Persian labels and item rows natural while amounts remain easy to scan.