Shipping option picker with tone-bordered selection, a radio bullet, method icon, ETA line, and emerald price for free shipping.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
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"
/>