Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA product name that links to its page and shows price, a written rating and stock status in a hover card, formatted with Intl for the given currency and locale.
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 this in product tables and order lists where the price and rating help but opening each page is too slow.
Do not use it as the only place a price appears, and do not put an add-to-cart button in it.
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 |
|---|---|---|---|
product | { name, href, price, rating, reviews, summary, inStock } | - | The product; price is in cents. |
currency, locale | string | USD, en-US | Formatting. |
openDelay | number | 300 | Milliseconds before opening. |
aria-hidden decoration.Intl.NumberFormat for the currency and locale you pass.| Key | Action |
|---|---|
| Tab | focuses the link and opens the card |
| Enter | opens the product page |
The pattern ships a Testing Library test (hover-card-product-quick-view.test.tsx) that covers the formatted price, the written rating, other currencies and both stock states.