@ecomiq/storefront 2.1.3 → 3.0.0

package/dist/sections/account-order.js

@@ -0,0 +1,592 @@
+import { CustomerCsrfField } from "../customer-csrf-C1oDX-Py.js";
+import { money } from "../money-DtGOtDri.js";
+import { orderProgress } from "../order-status-BJXLJwxq.js";
+import { useStorefrontLocale, useStorefrontText } from "../storefront-language-DrMjVbmk.js";
+import { PayButton, PaymentPreview, ReorderButton, useOrderStepDetail } from "../order-display-DTt5WBbc.js";
+import { orderStepLabel, orderStepOf, paymentStatusLabel } from "../order-view-9IlBg5AF.js";
+import { orderSummaryLines } from "../cart-summary-ur2VWKr-.js";
+import { Form, Link, useNavigation } from "react-router";
+import { formatOrderDate } from "@ecomiq/core";
+import { useEffect, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@theme/ui/button";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@theme/ui/select";
+import { Textarea } from "@theme/ui/textarea";
+// src/sections/account-order.tsx
+const catalog = {
+	name: "Detalle del pedido",
+	description: "Estado de cada producto, seguimiento, pago y totales de un pedido del cliente."
+};
+const STEP_ORDER = {
+	outForDelivery: 0,
+	shipped: 1,
+	confirmed: 2,
+	pending: 3,
+	delivered: 4,
+	cancelled: 5
+};
+function shipments(items) {
+	const groups = /* @__PURE__ */ new Map();
+	for (const item of items) {
+		const step = orderStepOf(item);
+		const key = `${step}|${item.trackingNumber ?? ""}|${item.trackingLink ?? ""}`;
+		const group = groups.get(key);
+		if (group) {
+			group.items.push(item);
+			continue;
+		}
+		groups.set(key, {
+			key,
+			step,
+			carrierName: item.carrierName ?? null,
+			trackingNumber: item.trackingNumber ?? null,
+			trackingLink: item.trackingLink ?? null,
+			items: [item]
+		});
+	}
+	return [...groups.values()].sort((a, b) => STEP_ORDER[a.step] - STEP_ORDER[b.step]);
+}
+function Progress({ step }) {
+	const storefrontTranslate = useStorefrontText();
+	return /* @__PURE__ */ jsx("ol", {
+		className: "grid grid-cols-4 gap-1.5",
+		children: orderProgress(step).map((item) => /* @__PURE__ */ jsxs("li", {
+			className: "flex flex-col gap-1.5",
+			children: [/* @__PURE__ */ jsx("span", { className: `h-1 rounded-full ${item.done ? "bg-primary" : "bg-muted"}` }), /* @__PURE__ */ jsx("span", {
+				className: `text-xs ${item.current ? "font-medium text-foreground" : "text-muted-foreground"}`,
+				children: storefrontTranslate(item.label)
+			})]
+		}, item.key))
+	});
+}
+function ShipmentCard({ shipment, currency }) {
+	const storefrontTranslate = useStorefrontText();
+	const { locale } = useStorefrontLocale();
+	const stepDetail = useOrderStepDetail();
+	const tracking = [shipment.carrierName, shipment.trackingNumber].filter(Boolean).join(" · ");
+	const cancelled = shipment.step === "cancelled";
+	const detail = stepDetail(shipment.step, shipment.items);
+	return /* @__PURE__ */ jsxs("section", {
+		className: "flex flex-col gap-5 rounded-lg border bg-card p-5 text-card-foreground md:p-6",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-1",
+				children: [/* @__PURE__ */ jsx("h3", {
+					className: `font-heading text-2xl ${cancelled ? "text-muted-foreground" : ""}`,
+					children: storefrontTranslate(orderStepLabel(shipment.step))
+				}), detail === null ? null : /* @__PURE__ */ jsx("p", {
+					className: "text-sm text-muted-foreground",
+					children: detail
+				})]
+			}),
+			cancelled ? null : /* @__PURE__ */ jsx(Progress, { step: shipment.step }),
+			tracking !== "" || shipment.trackingLink ? /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-wrap items-center justify-between gap-x-4 gap-y-2 rounded-md bg-muted/60 px-4 py-3 text-sm",
+				children: [/* @__PURE__ */ jsxs("span", { children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "text-muted-foreground",
+						children: storefrontTranslate("Seguimiento")
+					}),
+					" ",
+					tracking
+				] }), shipment.trackingLink ? /* @__PURE__ */ jsx("a", {
+					href: shipment.trackingLink,
+					target: "_blank",
+					rel: "noopener noreferrer",
+					className: "font-medium underline underline-offset-4",
+					children: storefrontTranslate("Seguir envío")
+				}) : null]
+			}) : null,
+			/* @__PURE__ */ jsx("ul", {
+				className: "flex flex-col divide-y",
+				children: shipment.items.map((item) => /* @__PURE__ */ jsxs("li", {
+					className: `flex gap-4 py-4 first:pt-0 last:pb-0 ${cancelled ? "opacity-60" : ""}`,
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: "w-16 shrink-0 overflow-hidden rounded-sm bg-muted",
+							children: item.thumbnail ? /* @__PURE__ */ jsx("img", {
+								src: item.thumbnail,
+								alt: "",
+								width: 64,
+								height: 80,
+								loading: "lazy",
+								decoding: "async",
+								className: "aspect-[4/5] size-full object-cover"
+							}) : /* @__PURE__ */ jsx("span", { className: "block aspect-[4/5]" })
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex min-w-0 flex-1 flex-col gap-1",
+							children: [
+								item.productUrl ? /* @__PURE__ */ jsx(Link, {
+									to: item.productUrl,
+									className: "font-medium hover:underline",
+									children: item.title
+								}) : /* @__PURE__ */ jsx("p", {
+									className: "font-medium",
+									children: item.title
+								}),
+								item.variantTitle ? /* @__PURE__ */ jsx("p", {
+									className: "text-sm text-muted-foreground",
+									children: item.variantTitle
+								}) : null,
+								/* @__PURE__ */ jsxs("p", {
+									className: "text-sm text-muted-foreground",
+									children: [
+										money(item.unitPrice, currency, locale),
+										" × ",
+										item.quantity
+									]
+								})
+							]
+						}),
+						/* @__PURE__ */ jsx("p", {
+							className: "text-sm font-medium",
+							children: money(item.total, currency, locale)
+						})
+					]
+				}, item.id))
+			})
+		]
+	});
+}
+function Payments({ order }) {
+	const storefrontTranslate = useStorefrontText();
+	const { locale, timeZone } = useStorefrontLocale();
+	const format = (value) => money(value, order.currencyCode, locale);
+	const lines = orderSummaryLines(order, {
+		subtotal: storefrontTranslate("Subtotal"),
+		discount: storefrontTranslate("Descuentos"),
+		shipping: storefrontTranslate("Envío"),
+		tax: storefrontTranslate("Impuestos"),
+		total: storefrontTranslate("Total"),
+		free: storefrontTranslate("Gratis"),
+		pending: storefrontTranslate("Por calcular")
+	});
+	const due = Math.max(0, order.total - order.totalPaid);
+	return /* @__PURE__ */ jsxs("section", {
+		className: "flex flex-col gap-4 rounded-lg border bg-card p-5 text-card-foreground",
+		children: [
+			/* @__PURE__ */ jsx("h3", {
+				className: "font-heading text-lg",
+				children: storefrontTranslate("Pago")
+			}),
+			order.payments.length === 0 ? /* @__PURE__ */ jsx("p", {
+				className: "text-sm text-muted-foreground",
+				children: storefrontTranslate("Sin pagos registrados")
+			}) : null,
+			order.payments.map((payment) => {
+				const status = paymentStatusLabel(payment);
+				const installments = payment.installments ?? 0;
+				return /* @__PURE__ */ jsxs("div", {
+					className: "flex flex-col gap-1",
+					children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex items-start justify-between gap-3 text-sm",
+							children: [/* @__PURE__ */ jsx(PaymentPreview, {
+								payment,
+								className: "font-medium"
+							}), /* @__PURE__ */ jsx("span", {
+								className: "font-medium",
+								children: format(payment.amount)
+							})]
+						}),
+						/* @__PURE__ */ jsx("p", {
+							className: "text-xs text-muted-foreground",
+							children: [
+								formatOrderDate(payment.createdOn, locale, timeZone),
+								installments > 1 ? storefrontTranslate("{value0} cuotas", { value0: installments }) : null,
+								status ? storefrontTranslate(status) : null
+							].filter(Boolean).join(" · ")
+						}),
+						payment.receiptUrl ? /* @__PURE__ */ jsx("a", {
+							href: payment.receiptUrl,
+							target: "_blank",
+							rel: "noopener noreferrer",
+							className: "w-fit text-xs font-medium underline underline-offset-4",
+							children: storefrontTranslate("Ver comprobante")
+						}) : null
+					]
+				}, payment.id);
+			}),
+			/* @__PURE__ */ jsxs("dl", {
+				className: "flex flex-col gap-2 border-t pt-4 text-sm",
+				children: [
+					lines.map((line) => /* @__PURE__ */ jsxs("div", {
+						className: `flex justify-between gap-4 ${line.key === "total" ? "font-semibold" : "text-muted-foreground"}`,
+						children: [/* @__PURE__ */ jsx("dt", { children: line.label }), /* @__PURE__ */ jsx("dd", { children: line.amount === null ? line.text : format(line.amount) })]
+					}, line.key)),
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex justify-between gap-4 text-muted-foreground",
+						children: [/* @__PURE__ */ jsx("dt", { children: storefrontTranslate("Pagado") }), /* @__PURE__ */ jsx("dd", { children: format(order.totalPaid) })]
+					}),
+					due > 0 ? /* @__PURE__ */ jsxs("div", {
+						className: "flex justify-between gap-4 font-medium text-destructive",
+						children: [/* @__PURE__ */ jsx("dt", { children: storefrontTranslate("Por pagar") }), /* @__PURE__ */ jsx("dd", { children: format(due) })]
+					}) : null
+				]
+			})
+		]
+	});
+}
+function History({ order }) {
+	const storefrontTranslate = useStorefrontText();
+	const { locale, timeZone } = useStorefrontLocale();
+	const events = [...order.statusTimeline].reverse();
+	return /* @__PURE__ */ jsxs("section", {
+		className: "flex flex-col gap-4 rounded-lg border bg-card p-5 text-card-foreground",
+		children: [/* @__PURE__ */ jsx("h3", {
+			className: "font-heading text-lg",
+			children: storefrontTranslate("Historial")
+		}), /* @__PURE__ */ jsx("ol", {
+			className: "flex flex-col",
+			children: events.map((event, index) => /* @__PURE__ */ jsxs("li", {
+				className: "relative flex gap-3 pb-4 text-sm last:pb-0",
+				children: [
+					index < events.length - 1 ? /* @__PURE__ */ jsx("span", {
+						"aria-hidden": "true",
+						className: "absolute left-[3px] top-3 h-full w-px bg-border"
+					}) : null,
+					/* @__PURE__ */ jsx("span", {
+						"aria-hidden": "true",
+						className: `relative mt-1.5 size-[7px] shrink-0 rounded-full ${index === 0 ? "bg-foreground" : "bg-foreground/25"}`
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex flex-1 flex-wrap justify-between gap-x-4 gap-y-0.5",
+						children: [/* @__PURE__ */ jsxs("span", {
+							className: index === 0 ? "font-medium" : "",
+							children: [storefrontTranslate(event.label), event.description ? /* @__PURE__ */ jsx("span", {
+								className: "block text-xs font-normal text-muted-foreground",
+								children: event.description
+							}) : null]
+						}), /* @__PURE__ */ jsx("span", {
+							className: "text-muted-foreground",
+							children: formatOrderDate(event.occurredAt, locale, timeZone)
+						})]
+					})
+				]
+			}, `${event.key}-${event.occurredAt}`))
+		})]
+	});
+}
+const RETURN_REASONS = [
+	"La talla o medida no me quedó",
+	"Llegó dañado o con fallas",
+	"No es lo que pedí",
+	"No es como en las fotos",
+	"Ya no lo quiero",
+	"Otro motivo"
+];
+const CANCEL_REASONS = [
+	"Me equivoqué al hacer el pedido",
+	"Encontré un mejor precio",
+	"Demora mucho en llegar",
+	"Ya no lo necesito",
+	"Otro motivo"
+];
+const RETURN_STATES = {
+	requested: {
+		title: "Devolución solicitada",
+		detail: "La tienda está revisando tu solicitud. Te escribiremos por correo."
+	},
+	inProgress: {
+		title: "Devolución aprobada",
+		detail: "Te enviamos por correo los pasos para devolver los productos."
+	},
+	inspected: {
+		title: "Devolución en revisión",
+		detail: "La tienda recibió los productos y los está revisando."
+	},
+	returned: {
+		title: "Devolución completada",
+		detail: "La tienda recibió los productos."
+	},
+	rejected: {
+		title: "Devolución no aprobada",
+		detail: "Te escribimos por correo con el motivo."
+	}
+};
+function RequestStatus({ order }) {
+	const storefrontTranslate = useStorefrontText();
+	const state = order.cancellationRequestedAt ? {
+		title: "Cancelación solicitada",
+		detail: "La tienda está revisando tu solicitud. Te escribiremos por correo."
+	} : RETURN_STATES[order.returnStatus ?? ""];
+	if (!state) return null;
+	return /* @__PURE__ */ jsxs("section", {
+		role: "status",
+		className: "flex flex-col gap-1 rounded-lg border bg-card p-5 text-card-foreground",
+		children: [/* @__PURE__ */ jsx("h3", {
+			className: "font-heading text-lg",
+			children: storefrontTranslate(state.title)
+		}), /* @__PURE__ */ jsx("p", {
+			className: "text-sm text-muted-foreground",
+			children: storefrontTranslate(state.detail)
+		})]
+	});
+}
+function ReasonField({ reasons }) {
+	const storefrontTranslate = useStorefrontText();
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col gap-1.5 text-sm",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "font-medium",
+			children: storefrontTranslate("Motivo")
+		}), /* @__PURE__ */ jsxs(Select, {
+			name: "reason",
+			required: true,
+			children: [/* @__PURE__ */ jsx(SelectTrigger, {
+				"aria-label": storefrontTranslate("Motivo"),
+				className: "h-11 w-full data-[size=default]:h-11",
+				children: /* @__PURE__ */ jsx(SelectValue, { placeholder: storefrontTranslate("Elige un motivo") })
+			}), /* @__PURE__ */ jsx(SelectContent, { children: reasons.map((reason) => /* @__PURE__ */ jsx(SelectItem, {
+				value: reason,
+				children: storefrontTranslate(reason)
+			}, reason)) })]
+		})]
+	});
+}
+function RequestForm({ request, order, error, onClose }) {
+	const storefrontTranslate = useStorefrontText();
+	const { locale, timeZone } = useStorefrontLocale();
+	const busy = useNavigation().state === "submitting";
+	const returnable = order.items.filter((item) => item.returnableQuantity > 0);
+	const [quantities, setQuantities] = useState(() => Object.fromEntries(returnable.map((item) => [item.id, returnable.length === 1 ? String(item.returnableQuantity) : "0"])));
+	return /* @__PURE__ */ jsxs(Form, {
+		method: "post",
+		encType: "multipart/form-data",
+		className: "flex flex-col gap-5 rounded-lg border bg-card p-5 text-card-foreground md:p-6",
+		children: [
+			/* @__PURE__ */ jsx(CustomerCsrfField, {}),
+			/* @__PURE__ */ jsx("input", {
+				type: "hidden",
+				name: "intent",
+				value: request
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-1",
+				children: [/* @__PURE__ */ jsx("h3", {
+					className: "font-heading text-2xl",
+					children: storefrontTranslate(request === "return" ? "Solicitar devolución" : "Solicitar cancelación")
+				}), /* @__PURE__ */ jsx("p", {
+					className: "text-sm text-muted-foreground",
+					children: request === "return" && order.returnDeadline ? storefrontTranslate("Puedes pedirla hasta el {value0}. La tienda la revisa y te escribe por correo.", { value0: formatOrderDate(order.returnDeadline, locale, timeZone) }) : storefrontTranslate("La tienda la revisa antes de enviar tu pedido y te escribe por correo.")
+				})]
+			}),
+			error ? /* @__PURE__ */ jsx("p", {
+				role: "alert",
+				className: "rounded-md bg-destructive/10 px-4 py-3 text-sm text-destructive",
+				children: storefrontTranslate(error)
+			}) : null,
+			request === "return" ? /* @__PURE__ */ jsxs("ul", {
+				className: "flex flex-col divide-y",
+				children: [/* @__PURE__ */ jsx("li", {
+					className: "flex justify-end pb-2 text-xs text-muted-foreground",
+					children: storefrontTranslate("Cantidad")
+				}), returnable.map((item) => /* @__PURE__ */ jsxs("li", {
+					className: "flex items-center gap-4 py-3 first:pt-0",
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: "w-12 shrink-0 overflow-hidden rounded-sm bg-muted",
+							children: item.thumbnail ? /* @__PURE__ */ jsx("img", {
+								src: item.thumbnail,
+								alt: "",
+								width: 48,
+								height: 60,
+								loading: "lazy",
+								decoding: "async",
+								className: "aspect-[4/5] size-full object-cover"
+							}) : /* @__PURE__ */ jsx("span", { className: "block aspect-[4/5]" })
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex min-w-0 flex-1 flex-col text-sm",
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "font-medium",
+								children: item.title
+							}), item.variantTitle ? /* @__PURE__ */ jsx("span", {
+								className: "text-muted-foreground",
+								children: item.variantTitle
+							}) : null]
+						}),
+						/* @__PURE__ */ jsx("input", {
+							type: "hidden",
+							name: "itemId",
+							value: item.id
+						}),
+						/* @__PURE__ */ jsxs(Select, {
+							name: "quantity",
+							value: quantities[item.id] ?? "0",
+							onValueChange: (value) => setQuantities((current) => ({
+								...current,
+								[item.id]: value
+							})),
+							children: [/* @__PURE__ */ jsx(SelectTrigger, {
+								"aria-label": storefrontTranslate("Cantidad a devolver de {value0}", { value0: item.title }),
+								className: "w-20 shrink-0",
+								children: /* @__PURE__ */ jsx(SelectValue, { children: quantities[item.id] ?? "0" })
+							}), /* @__PURE__ */ jsx(SelectContent, { children: Array.from({ length: item.returnableQuantity + 1 }, (_, quantity) => /* @__PURE__ */ jsx(SelectItem, {
+								value: String(quantity),
+								children: quantity
+							}, quantity)) })]
+						})
+					]
+				}, item.id))]
+			}) : null,
+			/* @__PURE__ */ jsx(ReasonField, { reasons: request === "return" ? RETURN_REASONS : CANCEL_REASONS }),
+			/* @__PURE__ */ jsxs("label", {
+				className: "flex flex-col gap-1.5 text-sm",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "font-medium",
+					children: storefrontTranslate("Comentario (opcional)")
+				}), /* @__PURE__ */ jsx(Textarea, {
+					name: "comment",
+					rows: 3,
+					maxLength: 1e3
+				})]
+			}),
+			request === "return" ? /* @__PURE__ */ jsxs("label", {
+				className: "flex flex-col gap-1.5 text-sm",
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "font-medium",
+						children: storefrontTranslate("Fotos (opcional)")
+					}),
+					/* @__PURE__ */ jsx("input", {
+						type: "file",
+						name: "photos",
+						accept: "image/jpeg,image/png,image/webp",
+						multiple: true,
+						className: "text-sm file:mr-3 file:rounded-md file:border file:bg-background file:px-3 file:py-1.5 file:text-sm"
+					}),
+					/* @__PURE__ */ jsx("span", {
+						className: "text-xs text-muted-foreground",
+						children: storefrontTranslate("Hasta 3 fotos JPG, PNG o WebP de hasta 5 MB.")
+					})
+				]
+			}) : null,
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-wrap gap-2",
+				children: [/* @__PURE__ */ jsx(Button, {
+					type: "submit",
+					disabled: busy,
+					children: busy ? storefrontTranslate("Enviando…") : storefrontTranslate("Enviar solicitud")
+				}), /* @__PURE__ */ jsx(Button, {
+					type: "button",
+					variant: "ghost",
+					onClick: onClose,
+					children: storefrontTranslate("Cancelar")
+				})]
+			})
+		]
+	});
+}
+function AccountOrder({ loaderData, actionData }) {
+	const storefrontTranslate = useStorefrontText();
+	const { locale, timeZone } = useStorefrontLocale();
+	const { order } = loaderData;
+	const [request, setRequest] = useState(null);
+	const sent = actionData?.sent ?? null;
+	useEffect(() => {
+		if (sent) setRequest(null);
+	}, [sent]);
+	const units = order.items.reduce((sum, item) => sum + item.quantity, 0);
+	const address = order.shippingAddress;
+	const contact = [order.email, order.phone].filter(Boolean);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col gap-8",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-4",
+			children: [/* @__PURE__ */ jsxs(Link, {
+				to: "/account",
+				className: "w-fit text-sm text-muted-foreground hover:text-foreground",
+				children: ["← ", storefrontTranslate("Mis pedidos")]
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-wrap items-end justify-between gap-4",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "flex flex-col gap-1",
+					children: [/* @__PURE__ */ jsx("h2", {
+						className: "text-3xl md:text-4xl",
+						children: storefrontTranslate("Pedido {value0}", { value0: order.orderNumber })
+					}), /* @__PURE__ */ jsxs("p", {
+						className: "text-sm text-muted-foreground",
+						children: [
+							storefrontTranslate("Realizado el {value0}", { value0: formatOrderDate(order.orderDate, locale, timeZone) }),
+							" ·",
+							" ",
+							units === 1 ? storefrontTranslate("1 producto") : storefrontTranslate("{value0} productos", { value0: units })
+						]
+					})]
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "flex flex-wrap gap-2",
+					children: [
+						order.paymentPath ? /* @__PURE__ */ jsx(PayButton, {
+							path: order.paymentPath,
+							label: storefrontTranslate("Pagar {value0}", { value0: money(order.total - order.totalPaid, order.currencyCode, locale) })
+						}) : null,
+						/* @__PURE__ */ jsx(ReorderButton, {
+							items: order.items,
+							variant: order.paymentPath ? "outline" : "default"
+						}),
+						order.canRequestReturn && request !== "return" ? /* @__PURE__ */ jsx(Button, {
+							type: "button",
+							variant: "outline",
+							onClick: () => setRequest("return"),
+							children: storefrontTranslate("Solicitar devolución")
+						}) : null,
+						order.canRequestCancellation && request !== "cancel" ? /* @__PURE__ */ jsx(Button, {
+							type: "button",
+							variant: "outline",
+							onClick: () => setRequest("cancel"),
+							children: storefrontTranslate("Solicitar cancelación")
+						}) : null
+					]
+				})]
+			})]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "grid gap-6 lg:grid-cols-[minmax(0,1fr)_20rem]",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-4",
+				children: [
+					/* @__PURE__ */ jsx(RequestStatus, { order }),
+					request ? /* @__PURE__ */ jsx(RequestForm, {
+						request,
+						order,
+						error: actionData?.error ?? null,
+						onClose: () => setRequest(null)
+					}) : null,
+					shipments(order.items).map((shipment) => /* @__PURE__ */ jsx(ShipmentCard, {
+						shipment,
+						currency: order.currencyCode
+					}, shipment.key)),
+					order.statusTimeline.length > 0 ? /* @__PURE__ */ jsx(History, { order }) : null
+				]
+			}), /* @__PURE__ */ jsxs("aside", {
+				className: "flex flex-col gap-4",
+				children: [/* @__PURE__ */ jsx(Payments, { order }), /* @__PURE__ */ jsxs("section", {
+					className: "flex flex-col gap-3 rounded-lg border bg-card p-5 text-sm text-card-foreground",
+					children: [
+						/* @__PURE__ */ jsx("h3", {
+							className: "font-heading text-lg",
+							children: storefrontTranslate("Entrega")
+						}),
+						address.name ? /* @__PURE__ */ jsx("p", {
+							className: "font-medium",
+							children: address.name
+						}) : null,
+						/* @__PURE__ */ jsx("p", {
+							className: "text-muted-foreground",
+							children: order.shippingAddressSummary ?? address.address1
+						}),
+						contact.length > 0 ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("h3", {
+							className: "pt-2 font-heading text-lg",
+							children: storefrontTranslate("Contacto")
+						}), contact.map((value) => /* @__PURE__ */ jsx("p", {
+							className: "text-muted-foreground",
+							children: value
+						}, value))] }) : null
+					]
+				})]
+			})]
+		})]
+	});
+}
+export { AccountOrder, catalog };

package/dist/sections/account-orders.d.ts

@@ -0,0 +1,8 @@
+import { OrdersData } from "../account.js";
+import "../index.js";
+import { SectionCatalog } from "../settings.js";
+import "../entries/account.js";
+export declare const catalog: SectionCatalog;
+export declare function AccountOrders({ loaderData }: {
+  loaderData: OrdersData;
+}): import("react").JSX.Element;