Shipping Methods

Shipping option picker with tone-bordered selection, a radio bullet, method icon, ETA line, and emerald price for free shipping.

Standard3–5 business days
Free
Express1–2 business days
$9.99
Same-dayBy 9pm today
$19.99

New here? Read the installation guide.

Import & use
import { Commerce14 } from "@/components/beste/piece/commerce14";

<Commerce14
  selected="Standard"
  methods={[
    {
      "label": "Standard",
      "eta": "3–5 business days",
      "price": "Free",
      "icon": "truck"
    },
    {
      "label": "Express",
      "eta": "1–2 business days",
      "price": "$9.99",
      "icon": "plane"
    },
    {
      "label": "Same-day",
      "eta": "By 9pm today",
      "price": "$19.99",
      "icon": "bolt"
    }
  ]}
  tone="foreground"
/>

More Commerce pieces

View all Commerce
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.

Frequently bought together
Air Max 90
$129
Cotton Tee
$48
Retro Shades
$38
$215Save $20

Bundle Picker

Frequently-bought-together row with product thumbnails joined by plus icons, a bundle total with a Save emerald chip, and a tone Add-items CTA.

Subtotal$284.00
ShippingFree
Tax (8.5%)$24.14
Discount · SUMMER20−$56.80
Total$251.34

Cart Summary

Order math card with subtotal, shipping, tax, and an emerald discount line, separated from a bold final total below.

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.

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.

Size

Size Picker

Six-slot size grid with a tone-filled selected cell and a diagonal line over sold-out sizes, plus an optional size guide link.

Markdown version