{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "commerce-checkout",
  "type": "registry:component",
  "title": "Commerce checkout",
  "description": "A two column React checkout page with an editable cart line item, a shipping address form, and an order summary with subtotal, tax, total and a pay button.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/button.json",
    "https://ui.minidev.pro/r/cart-line-item.json",
    "https://ui.minidev.pro/r/order-summary.json",
    "https://ui.minidev.pro/r/page-header.json",
    "https://ui.minidev.pro/r/shipping-address.json"
  ],
  "files": [
    {
      "path": "registry/blocks/commerce-checkout.tsx",
      "type": "registry:ui",
      "target": "components/ui/commerce-checkout.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { ShippingAddress } from \"@/components/ui/shipping-address\"\nimport { OrderSummary } from \"@/components/ui/order-summary\"\nimport { CartLineItem } from \"@/components/ui/cart-line-item\"\nimport { Button } from \"@/components/ui/button\"\nimport { PageHeader } from \"@/components/ui/page-header\"\n\nfunction CommerceCheckout() {\n  const [qty, setQty] = React.useState(1)\n  return (\n    <div data-slot=\"commerce-checkout\" className=\"mx-auto grid max-w-5xl gap-8 lg:grid-cols-[1fr_320px]\">\n      <div className=\"space-y-6\">\n        <PageHeader title=\"Checkout\" description=\"Shipping and payment\" />\n        <CartLineItem title=\"Pro plan seat\" price=\"$24.00\" quantity={qty} onQuantityChange={setQty} />\n        <ShippingAddress />\n      </div>\n      <div className=\"space-y-4\">\n        <OrderSummary lines={[{ label: \"Subtotal\", value: \"$24.00\" }, { label: \"Tax\", value: \"$1.92\" }]} total=\"$25.92\" />\n        <Button className=\"w-full\">Pay now</Button>\n      </div>\n    </div>\n  )\n}\nexport { CommerceCheckout }\n"
    }
  ]
}