Stock Alert

Urgency row with a pulsing dot that flips emerald, amber, or rose by remaining stock, a watchers count, and a thin stock bar.

Only 3 left in stock
18 watching

New here? Read the installation guide.

Import & use
import { Commerce4 } from "@/components/beste/piece/commerce4";

<Commerce4
  remaining={3}
  total={50}
  watchers={18}
/>

More Commerce pieces

View all Commerce
Tracking1Z999AA10123456784
  1. Order placedApr 20, 2:14pm
  2. PackedApr 21, 9:00am
  3. ShippedApr 21, 4:30pm
  4. DeliveredEstimated Apr 22

Order Tracking

Vertical shipment status with check, spinning, and pending dots connected by a tone-colored line, each row showing label and timestamp.

Add $27 more for free shipping.
$48$75 goal

Free Shipping Bar

Shipping threshold card with a truck icon, an amount-to-go message that flips emerald on qualifying, and a tone progress fill toward the goal.

Mia R.

Mia R. in Los Angeles just bought Air Max 90

3 min ago

Live Sale Toast

Social-proof popup with a gradient initials avatar and an emerald shopping-bag dot, a who-bought-what sentence, and a relative time stamp.

Order confirmed#SO-8241
$284.00
Arrives Apr 26 – Apr 28
Receipt sent to hello@beste.co

Order Confirmation

Post-purchase card with an emerald check, order id, total price, a package-arrival line, and the receipt email destination.

Beste Goods · SF
INV-2026-0421
2× Air Max 90$258.00
1× Cotton Tee$48.00
1× Retro Shades$38.00
Subtotal$344.00
Total$368.14
Paid · Visa ending 4242

Receipt Lines

Dashed-border receipt with the store name and order id, three monospaced quantity-name-price rows, a subtotal, and a bold final total with payment method.

Find in store
  • SF Union SquareIn stock · 0.4 mi
  • Hayes ValleyLow stock · 1.2 mi
  • Mission DistrictOut of stock · 2.8 mi

Store Locator

Nearby stores list where each row carries a semantic stock dot, store name, distance, and a chevron to drill into the location.

Markdown version