51:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 52:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:T3a11,import { CheckCircle, CreditCard, Download, MapPin, Package, Printer, Truck, } from "lucide-react"; import { cn } from "cn"; import { AspectRatio } from "@/components/ui/aspect-ratio"; import { Badge } from "@/components/ui/badge"; import { Button } from "@/components/ui/button"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Separator } from "@/components/ui/separator"; interface OrderItem { id: string; name: string; image: string; price: number; quantity: number; details?: { label: string; value: string }[]; } interface ShippingAddress { name: string; street: string; city: string; state: string; zipCode: string; country: string; } interface PaymentMethod { type: "card" | "paypal" | "bank"; lastFour?: string; cardBrand?: string; email?: string; } interface OrderSummaryData { orderNumber: string; orderDate: string; status: "confirmed" | "processing" | "shipped" | "delivered"; email: string; items: OrderItem[]; subtotal: number; shipping: number; tax: number; discount?: number; total: number; shippingAddress: ShippingAddress; shippingMethod: string; estimatedDelivery: string; paymentMethod: PaymentMethod; } const DEFAULT_ORDER: OrderSummaryData = { orderNumber: "ORD-2024-78432", orderDate: "December 14, 2024", status: "confirmed", email: "customer@example.com", items: [ { id: "1", name: "Minimalist Beige Sneakers", image: "https://deifkwefumgah.cloudfront.net/shadcnblocks/block/ecommerce/clothes/Minimalist-Beige-Sneakers-2.png", price: 120.0, quantity: 1, details: [ { label: "Size", value: "42" }, { label: "Color", value: "Beige" }, ], }, { id: "2", name: "Embroidered Blue Top", image: "https://deifkwefumgah.cloudfront.net/shadcnblocks/block/ecommerce/clothes/Woman-in-Embroidered-Blue-Top-2.png", price: 140.0, quantity: 2, details: [ { label: "Size", value: "M" }, { label: "Color", value: "Blue" }, ], }, { id: "3", name: "Classic Fedora Hat", image: "https://deifkwefumgah.cloudfront.net/shadcnblocks/block/ecommerce/accessories/Classic-Fedora-Hat-2.png", price: 84.0, quantity: 1, details: [{ label: "Size", value: "One Size" }], }, ], subtotal: 484.0, shipping: 12.0, tax: 38.72, discount: 50.0, total: 484.72, shippingAddress: { name: "Alex Johnson", street: "1234 Maple Street, Apt 5B", city: "San Francisco", state: "CA", zipCode: "94102", country: "United States", }, shippingMethod: "Express Shipping", estimatedDelivery: "December 18-20, 2024", paymentMethod: { type: "card", lastFour: "4242", cardBrand: "Visa", }, }; interface OrderSummary1Props { order?: OrderSummaryData; className?: string; } const OrderSummary1 = ({ order = DEFAULT_ORDER, className, }: OrderSummary1Props) => { const formatPrice = (price: number) => { return new Intl.NumberFormat("en-US", { style: "currency", currency: "USD", }).format(price); }; const getStatusBadge = (status: OrderSummaryData["status"]) => { const variants: Record< OrderSummaryData["status"], { label: string; className: string } > = { confirmed: { label: "Order Confirmed", className: "bg-emerald-500/10 text-emerald-600 hover:bg-emerald-500/10", }, processing: { label: "Processing", className: "bg-amber-500/10 text-amber-600 hover:bg-amber-500/10", }, shipped: { label: "Shipped", className: "bg-blue-500/10 text-blue-600 hover:bg-blue-500/10", }, delivered: { label: "Delivered", className: "bg-emerald-500/10 text-emerald-600 hover:bg-emerald-500/10", }, }; return variants[status]; }; const statusBadge = getStatusBadge(order.status); return (

{/* Success Header */}

Thank you for your order!

A confirmation email has been sent to{" "} {order.email}

{/* Order Info Bar */}

Order Number

{order.orderNumber}

Order Date

{order.orderDate}

{statusBadge.label}

{/* Left Column - Items & Totals */}

{/* Order Items */} Items Ordered {order.items.map((item, index) => (

{item.name}

{item.details && (

{item.details.map((d, i) => ( {d.value} {i < item.details!.length - 1 && " · "} ))}

)}

Qty: {item.quantity}

{formatPrice(item.price * item.quantity)}

{item.quantity > 1 && (

{formatPrice(item.price)} each

)}

{index < order.items.length - 1 && ( )}

))} {/* Order Totals */}

Subtotal {formatPrice(order.subtotal)}

Shipping {order.shipping === 0 ? "Free" : formatPrice(order.shipping)}

Tax {formatPrice(order.tax)}

{order.discount && order.discount > 0 && (

Discount -{formatPrice(order.discount)}

)}

Total Paid {formatPrice(order.total)}

{/* Right Column - Shipping & Payment */}

{/* Shipping Information */} Shipping Address

{order.shippingAddress.name}

{order.shippingAddress.street}

{order.shippingAddress.city}, {order.shippingAddress.state}{" "} {order.shippingAddress.zipCode}

{order.shippingAddress.country}

{order.shippingMethod}

Estimated delivery: {order.estimatedDelivery}

{/* Payment Information */} Payment Method {order.paymentMethod.type === "card" && (

{order.paymentMethod.cardBrand} ending in{" "} {order.paymentMethod.lastFour}

Payment completed

)} {order.paymentMethod.type === "paypal" && (

PayPal

{order.paymentMethod.email}

)} {/* Actions */}

{/* Continue Shopping */}

Have a question about your order?

); }; export { OrderSummary1 }; 50:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}],["$","li","cn",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/cn","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"cn"}]]}]}]]}],["$","$L51",null,{"namespace":"@shadcnblocks","registryDependencies":["aspect-ratio","badge","button","card","separator"]}]]}],null]}],["$","$L52",null,{"files":[{"path":"block/order-summary1/order-summary1.tsx","content":"$53","type":"registry:block"}],"className":"h-[70svh] min-h-80"}]]}]