Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA bottom sheet with a product summary, a quantity stepper with minimum and maximum, a live line total and an Add to cart button. Use this when a shopper picks a quantity before adding on a phone and the product page should stay visible.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it when a shopper picks a quantity before adding on a phone and the product page should stay visible.
Do not use it for a cart page where quantities are edited in place, or for items sold only one at a time.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
name | string | required | Product name. |
price | number | required | Unit price in the currency's major unit. |
max | number | 10 | Most that can be added. |
currency | string | "USD" | Currency code for formatting. |
onAdd | (quantity: number) => void | required | Called with the chosen quantity. |
The pattern ships with a Testing Library test (add-to-cart-quantity-sheet.test.tsx) that drives it through roles and the keyboard.