admin-ui-starter-kit 0.1.4 → 0.4.3

package/dist/components/composed/commerce/index.js

@@ -1,20 +1,20 @@
 import { useStrings as e } from "../../../lib/strings.js";
 import { cn as t } from "../../../lib/utils.js";
-import { t as n } from "../../../_shared/text-qsEg5GdP.js";
-import { t as r } from "../../../_shared/heading-CrNpYcUr.js";
+import { n, t as r } from "../../../_shared/heading-HeP06nXG.js";
 import { t as i } from "../../../_shared/icon-badge-zTBVtgt9.js";
-import { t as a } from "../../../_shared/badge-BK5VvEgg.js";
-import { t as o } from "../../../_shared/button-cnkCF8q8.js";
-import { t as s } from "../../../_shared/smart-card-eBfUvQ9r.js";
-import { t as c } from "../../../_shared/input-DJo8d1Rr.js";
-import { t as l } from "../../../_shared/separator-B8FBp-7E.js";
-import { M as u, i as d } from "../../../_shared/display-Cuj4td-V.js";
-import { c as f, i as p, n as m, o as h, r as g, t as _, u as v } from "../../../_shared/item-BxlP5TO3.js";
-import { useState as y } from "react";
-import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
-import { Calendar as C, Check as w, ChevronRight as T, CreditCard as E, Edit2 as D, Gift as O, MapPin as ee, Package as te, Receipt as ne, Repeat as re, RotateCcw as ie, ShoppingBag as k, Sparkles as ae, Star as oe, TicketPercent as A, Trash2 as se, Trophy as ce, X as j } from "lucide-react";
+import { t as a } from "../../../_shared/badge-yGlx9trX.js";
+import { t as o } from "../../../_shared/button-SuocMQFT.js";
+import { t as s } from "../../../_shared/smart-card-DYZGY_Su.js";
+import { t as c } from "../../../_shared/input-C7t-RHYq.js";
+import { n as l } from "../../../_shared/form-field-B7taMVbC.js";
+import { t as u } from "../../../_shared/separator-B8FBp-7E.js";
+import { E as d, i as f } from "../../../_shared/display-C4n0uuxl.js";
+import { a as p, c as m, i as h, n as g, o as _, r as v, t as y, u as b } from "../../../_shared/item-DAjqQhhj.js";
+import { useId as x, useState as S } from "react";
+import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
+import { Calendar as E, CalendarClock as D, Check as O, ChevronRight as k, Circle as A, CreditCard as j, Edit2 as M, Gift as N, MapPin as P, Package as ee, Receipt as te, Repeat as ne, RotateCcw as re, ShoppingBag as ie, Sparkles as ae, Star as oe, TicketPercent as se, Trash2 as ce, Trophy as le, X as ue } from "lucide-react";
 //#region src/components/composed/commerce/upcoming-booking/upcoming-booking.tsx
-function le(e) {
+function de(e) {
 	if (e.date != null) return e.date;
 	if (e.day && e.month) {
 		let t = (/* @__PURE__ */ new Date()).getFullYear(), n = /* @__PURE__ */ new Date(`${e.month} ${e.day}, ${t}`);
@@ -22,15 +22,15 @@ function le(e) {
 	}
 	return null;
 }
-function M({ bookings: e, className: r, locale: i, dateTone: a = "primary", timePlacement: o = "below" }) {
-	return /* @__PURE__ */ x(h, {
+function F({ bookings: e, className: r, locale: i, dateTone: a = "inverse", timePlacement: o = "below" }) {
+	return /* @__PURE__ */ w(_, {
 		className: t("upcoming-booking--component w-full gap-2", r),
 		children: e.map((e, t) => {
-			let r = le(e);
-			return /* @__PURE__ */ S(_, {
+			let r = de(e);
+			return /* @__PURE__ */ T(y, {
 				className: "items-center px-0 py-1.5",
 				children: [
-					!!r && /* @__PURE__ */ x(f, { children: /* @__PURE__ */ x(u, {
+					!!r && /* @__PURE__ */ w(m, { children: /* @__PURE__ */ w(d, {
 						date: r,
 						time: o === "below" ? e.time : void 0,
 						tone: a,
@@ -38,117 +38,123 @@ function M({ bookings: e, className: r, locale: i, dateTone: a = "primary", time
 						timePlacement: "below",
 						layout: "stacked"
 					}) }),
-					/* @__PURE__ */ S(g, { children: [/* @__PURE__ */ x(v, { children: e.service }), /* @__PURE__ */ x(p, {
-						clamp: 1,
-						children: e.customer
-					})] }),
-					/* @__PURE__ */ S(m, { children: [o === "inline-trailing" && /* @__PURE__ */ x(n, {
-						size: "xs",
-						type: "secondary",
-						className: "shrink-0 tabular-nums",
-						children: e.time
-					}), /* @__PURE__ */ x(n, {
-						weight: "semibold",
-						className: "shrink-0 tabular-nums",
-						children: e.amount
-					})] })
+					/* @__PURE__ */ T(v, {
+						className: "min-w-[min(12rem,100%)]",
+						children: [/* @__PURE__ */ w(b, { children: e.service }), /* @__PURE__ */ w(h, {
+							clamp: 1,
+							children: e.customer
+						})]
+					}),
+					/* @__PURE__ */ T(g, {
+						className: "ml-auto shrink-0 flex-wrap justify-end",
+						children: [o === "inline-trailing" && /* @__PURE__ */ w(n, {
+							size: "xs",
+							type: "secondary",
+							className: "shrink-0 tabular-nums",
+							children: e.time
+						}), /* @__PURE__ */ w(n, {
+							weight: "semibold",
+							className: "shrink-0 tabular-nums",
+							children: e.amount
+						})]
+					})
 				]
 			}, e.id ?? `${e.service}-${e.time}-${t}`);
 		})
 	});
 }
-M.displayName = "UpcomingBookingRow";
+F.displayName = "UpcomingBookingRow";
 //#endregion
 //#region src/components/composed/commerce/loyalty-points/types.ts
-var N = {
+var I = {
 	balanceLabel: "Loyalty Balance",
 	pointsAvailable: "points available",
 	redeem: "Redeem Points"
 };
 //#endregion
 //#region src/components/composed/commerce/loyalty-points/loyalty-points.tsx
-function P({ balance: i, tier: c = "Gold Tier", tierVariant: u, history: f = [], redeemLabel: y, onRedeem: b, className: C, strings: w }) {
-	let T = e(N, {
-		...y === void 0 ? {} : { redeem: y },
-		...w
+function L({ balance: i, tier: c = "Gold Tier", tierVariant: l, history: d = [], redeemLabel: p, onRedeem: m, className: x, strings: S }) {
+	let C = e(I, {
+		...p === void 0 ? {} : { redeem: p },
+		...S
 	});
-	return /* @__PURE__ */ S(s, {
-		className: t("loyalty-points--component w-full", C),
+	return /* @__PURE__ */ T(s, {
+		className: t("loyalty-points--component w-full", x),
 		children: [
-			/* @__PURE__ */ x(d, {
-				label: T.balanceLabel,
-				value: /* @__PURE__ */ S(a, {
+			/* @__PURE__ */ w(f, {
+				label: C.balanceLabel,
+				value: /* @__PURE__ */ T(a, {
 					variant: "warning",
-					children: [/* @__PURE__ */ x(ce, { className: "mr-1 inline size-3" }), c]
+					children: [/* @__PURE__ */ w(le, { className: "mr-1 inline size-3" }), c]
 				}),
 				labelClassName: "text-xs font-medium uppercase tracking-wider text-muted-foreground"
 			}),
-			/* @__PURE__ */ x(r, {
+			/* @__PURE__ */ w(r, {
 				tag: "h3",
 				className: "text-4xl tabular-nums tracking-tight",
 				children: typeof i == "number" ? i.toLocaleString() : i
 			}),
-			/* @__PURE__ */ x(n, {
+			/* @__PURE__ */ w(n, {
 				size: "xs",
 				type: "secondary",
-				children: T.pointsAvailable
+				children: C.pointsAvailable
 			}),
-			/* @__PURE__ */ x(l, { className: "my-4" }),
-			/* @__PURE__ */ x(h, { children: f.map((e) => /* @__PURE__ */ S(_, {
+			/* @__PURE__ */ w(u, { className: "my-4" }),
+			/* @__PURE__ */ w(_, { children: d.map((e) => /* @__PURE__ */ T(y, {
 				size: "xs",
-				className: "px-0",
-				children: [/* @__PURE__ */ S(g, { children: [/* @__PURE__ */ x(v, {
+				className: "px-0 py-1",
+				children: [/* @__PURE__ */ T(v, { children: [/* @__PURE__ */ w(b, {
 					bold: !1,
 					children: e.label
-				}), /* @__PURE__ */ x(p, {
+				}), /* @__PURE__ */ w(h, {
 					clamp: 1,
 					children: e.date
-				})] }), /* @__PURE__ */ x(m, { children: /* @__PURE__ */ x(n, {
+				})] }), /* @__PURE__ */ w(g, { children: /* @__PURE__ */ w(n, {
 					weight: "semibold",
 					className: t("tabular-nums", e.positive ? "text-success" : "text-destructive"),
 					children: e.points
 				}) })]
 			}, e.date + e.label)) }),
-			/* @__PURE__ */ S(o, {
+			/* @__PURE__ */ T(o, {
 				variant: "dark",
 				className: "mt-5 w-full rounded-full",
-				onClick: b,
-				children: [/* @__PURE__ */ x(O, { className: "mr-1.5 size-3.5" }), T.redeem]
+				onClick: m,
+				children: [/* @__PURE__ */ w(N, { className: "mr-1.5 size-3.5" }), C.redeem]
 			})
 		]
 	});
 }
-P.displayName = "LoyaltyPointsCard";
+L.displayName = "LoyaltyPointsCard";
 //#endregion
 //#region src/components/composed/commerce/discount-stack/types.ts
-var F = {
+var R = {
 	title: "Applied Discounts",
 	totalSavings: "Total Savings"
 };
 //#endregion
 //#region src/components/composed/commerce/discount-stack/discount-stack.tsx
-function I({ discounts: i, totalSavings: o, className: c, strings: u }) {
-	let p = e(F, u);
-	return /* @__PURE__ */ S(s, {
-		title: p.title,
+function z({ discounts: i, totalSavings: o, className: c, strings: l }) {
+	let d = e(R, l);
+	return /* @__PURE__ */ T(s, {
+		title: d.title,
 		className: t("discount-stack--component w-full", c),
 		children: [
-			/* @__PURE__ */ x(h, {
+			/* @__PURE__ */ w(_, {
 				className: "mt-4",
-				children: i.map((e) => /* @__PURE__ */ S(_, {
+				children: i.map((e) => /* @__PURE__ */ T(y, {
 					size: "xs",
-					className: "px-0",
+					className: "px-0 py-1",
 					children: [
-						/* @__PURE__ */ x(f, { children: /* @__PURE__ */ x(a, {
+						/* @__PURE__ */ w(m, { children: /* @__PURE__ */ w(a, {
 							variant: e.badge,
 							className: "w-16 justify-center text-xxs",
 							children: e.type
 						}) }),
-						/* @__PURE__ */ x(g, { children: /* @__PURE__ */ x(v, {
+						/* @__PURE__ */ w(v, { children: /* @__PURE__ */ w(b, {
 							bold: !1,
 							children: e.label
 						}) }),
-						/* @__PURE__ */ x(m, { children: /* @__PURE__ */ x(n, {
+						/* @__PURE__ */ w(g, { children: /* @__PURE__ */ w(n, {
 							weight: "semibold",
 							className: "tabular-nums text-success",
 							children: e.amount
@@ -156,10 +162,10 @@ function I({ discounts: i, totalSavings: o, className: c, strings: u }) {
 					]
 				}, e.type))
 			}),
-			/* @__PURE__ */ x(l, { className: "my-4" }),
-			/* @__PURE__ */ x(d, {
-				label: p.totalSavings,
-				value: /* @__PURE__ */ x(r, {
+			/* @__PURE__ */ w(u, { className: "my-4" }),
+			/* @__PURE__ */ w(f, {
+				label: d.totalSavings,
+				value: /* @__PURE__ */ w(r, {
 					tag: "h4",
 					className: "text-xl tabular-nums tracking-tight text-success border-none pb-0",
 					children: o
@@ -169,40 +175,40 @@ function I({ discounts: i, totalSavings: o, className: c, strings: u }) {
 		]
 	});
 }
-I.displayName = "DiscountStackPreview";
+z.displayName = "DiscountStackPreview";
 //#endregion
 //#region src/components/composed/commerce/shipment-tracking/shipment-tracking.tsx
-function L({ trackingNumber: e, carrier: r, status: i, steps: o, details: c = [], className: u }) {
-	return /* @__PURE__ */ S(s, {
-		className: t("shipment-tracking--component w-full", u),
+function B({ trackingNumber: e, carrier: r, status: i, steps: o, details: c = [], className: l }) {
+	return /* @__PURE__ */ T(s, {
+		className: t("shipment-tracking--component w-full", l),
 		children: [
-			/* @__PURE__ */ S("div", {
+			/* @__PURE__ */ T("div", {
 				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ x(n, {
+				children: [/* @__PURE__ */ w(n, {
 					size: "xs",
 					weight: "medium",
 					className: "font-mono text-muted-foreground tracking-wide",
 					children: e
-				}), !!r && /* @__PURE__ */ x(a, {
+				}), !!r && /* @__PURE__ */ w(a, {
 					variant: "info",
 					children: r
 				})]
 			}),
-			/* @__PURE__ */ S("div", {
+			/* @__PURE__ */ T("div", {
 				className: "mt-4 flex items-center gap-1.5",
-				children: [/* @__PURE__ */ x("span", { className: "h-2 w-2 rounded-full bg-success" }), /* @__PURE__ */ x(n, {
+				children: [/* @__PURE__ */ w("span", { className: "h-2 w-2 rounded-full bg-success" }), /* @__PURE__ */ w(n, {
 					weight: "semibold",
 					children: i
 				})]
 			}),
-			/* @__PURE__ */ x("div", {
+			/* @__PURE__ */ w("div", {
 				className: "mt-5 flex items-center justify-between",
-				children: o.map((e, r) => /* @__PURE__ */ S("div", {
+				children: o.map((e, r) => /* @__PURE__ */ T("div", {
 					className: "flex flex-1 flex-col items-center gap-2",
-					children: [/* @__PURE__ */ S("div", {
+					children: [/* @__PURE__ */ T("div", {
 						className: "flex w-full items-center",
-						children: [/* @__PURE__ */ x("div", { className: t("size-3 shrink-0 rounded-full", e.done ? "bg-success" : "bg-muted") }), r < o.length - 1 && /* @__PURE__ */ x("div", { className: t("h-0.5 flex-1", e.done ? "bg-success" : "bg-muted") })]
-					}), /* @__PURE__ */ x(n, {
+						children: [/* @__PURE__ */ w("div", { className: t("size-3 shrink-0 rounded-full", e.done ? "bg-success" : "bg-muted") }), r < o.length - 1 && /* @__PURE__ */ w("div", { className: t("h-0.5 flex-1", e.done ? "bg-success" : "bg-muted") })]
+					}), /* @__PURE__ */ w(n, {
 						size: "xs",
 						type: "secondary",
 						className: "text-center leading-tight",
@@ -210,9 +216,9 @@ function L({ trackingNumber: e, carrier: r, status: i, steps: o, details: c = []
 					})]
 				}, e.label))
 			}),
-			c.length > 0 && /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(l, { className: "my-4" }), /* @__PURE__ */ x("div", {
+			c.length > 0 && /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w(u, { className: "my-4" }), /* @__PURE__ */ w("div", {
 				className: "space-y-2",
-				children: c.map((e) => /* @__PURE__ */ x(d, {
+				children: c.map((e) => /* @__PURE__ */ w(f, {
 					label: e.label,
 					value: e.value,
 					labelClassName: "text-xs",
@@ -222,10 +228,10 @@ function L({ trackingNumber: e, carrier: r, status: i, steps: o, details: c = []
 		]
 	});
 }
-L.displayName = "ShipmentTrackingCard";
+B.displayName = "ShipmentTrackingCard";
 //#endregion
 //#region src/components/composed/commerce/tax-breakdown/types.ts
-var R = {
+var V = {
 	title: "Tax Breakdown",
 	subtotal: "Subtotal",
 	totalTax: "Total Tax",
@@ -233,46 +239,46 @@ var R = {
 };
 //#endregion
 //#region src/components/composed/commerce/tax-breakdown/tax-breakdown.tsx
-function z({ subtotal: r, taxes: i, totalTax: a, total: o, className: c, strings: u }) {
-	let f = e(R, u);
-	return /* @__PURE__ */ S(s, {
-		icon: /* @__PURE__ */ x(ne, { className: "size-4" }),
-		title: f.title,
+function H({ subtotal: r, taxes: i, totalTax: a, total: o, className: c, strings: l }) {
+	let d = e(V, l);
+	return /* @__PURE__ */ T(s, {
+		icon: /* @__PURE__ */ w(te, { className: "size-4" }),
+		title: d.title,
 		className: t("tax-breakdown--component w-full", c),
 		children: [
-			/* @__PURE__ */ x(d, {
-				label: f.subtotal,
+			/* @__PURE__ */ w(f, {
+				label: d.subtotal,
 				value: r,
 				mono: !0,
 				labelClassName: "text-sm",
 				valueClassName: "text-sm font-medium"
 			}),
-			/* @__PURE__ */ S("div", {
+			/* @__PURE__ */ T("div", {
 				className: "mt-3 space-y-1.5 rounded-lg border border-border/50 bg-muted/30 px-3 py-2.5",
-				children: [i.map((e, t) => /* @__PURE__ */ S("div", {
+				children: [i.map((e, t) => /* @__PURE__ */ T("div", {
 					className: "flex items-baseline justify-between gap-3",
-					children: [/* @__PURE__ */ S("div", {
+					children: [/* @__PURE__ */ T("div", {
 						className: "flex items-baseline gap-1.5 min-w-0",
-						children: [/* @__PURE__ */ x(n, {
+						children: [/* @__PURE__ */ w(n, {
 							size: "xs",
 							className: "truncate",
 							children: e.label
-						}), !!e.rate && /* @__PURE__ */ x(n, {
+						}), !!e.rate && /* @__PURE__ */ w(n, {
 							tag: "span",
 							size: "xxs",
 							type: "discrete",
 							className: "shrink-0",
 							children: e.rate
 						})]
-					}), /* @__PURE__ */ x(n, {
+					}), /* @__PURE__ */ w(n, {
 						tag: "span",
 						size: "xs",
 						weight: "medium",
 						className: "tabular-nums shrink-0",
 						children: e.amount
 					})]
-				}, e.id ?? `${e.label}-${t}`)), !!a && i.length > 1 && /* @__PURE__ */ x(d, {
-					label: f.totalTax,
+				}, e.id ?? `${e.label}-${t}`)), !!a && i.length > 1 && /* @__PURE__ */ w(f, {
+					label: d.totalTax,
 					value: a,
 					mono: !0,
 					className: "border-t border-border/50 pt-1.5 mt-0.5",
@@ -280,9 +286,9 @@ function z({ subtotal: r, taxes: i, totalTax: a, total: o, className: c, strings
 					valueClassName: "text-xs font-semibold"
 				})]
 			}),
-			/* @__PURE__ */ x(l, { className: "my-3" }),
-			/* @__PURE__ */ x(d, {
-				label: f.total,
+			/* @__PURE__ */ w(u, { className: "my-3" }),
+			/* @__PURE__ */ w(f, {
+				label: d.total,
 				value: o,
 				mono: !0,
 				labelClassName: "text-sm font-semibold",
@@ -291,10 +297,10 @@ function z({ subtotal: r, taxes: i, totalTax: a, total: o, className: c, strings
 		]
 	});
 }
-z.displayName = "TaxBreakdownCard";
+H.displayName = "TaxBreakdownCard";
 //#endregion
 //#region src/components/composed/commerce/subscription-summary/types.ts
-var B = {
+var U = {
 	title: "Subscription",
 	plan: "Plan",
 	nextBilling: "Next billing",
@@ -304,106 +310,106 @@ var B = {
 };
 //#endregion
 //#region src/components/composed/commerce/subscription-summary/subscription-summary.tsx
-function V({ planName: c, priceLabel: l, cycleLabel: u, nextBillingDate: d, statusLabel: p, perks: m = [], onManage: y, onUpgrade: b, className: E, strings: D }) {
-	let O = e(B, D);
-	return /* @__PURE__ */ S(s, {
-		icon: /* @__PURE__ */ x(re, { className: "size-4" }),
-		title: O.title,
-		headerEnd: p ? /* @__PURE__ */ x(a, {
+function W({ planName: c, priceLabel: l, cycleLabel: u, nextBillingDate: d, statusLabel: f, perks: p = [], onManage: h, onUpgrade: g, className: x, strings: S }) {
+	let C = e(U, S);
+	return /* @__PURE__ */ T(s, {
+		icon: /* @__PURE__ */ w(ne, { className: "size-4" }),
+		title: C.title,
+		headerEnd: f ? /* @__PURE__ */ w(a, {
 			variant: "success",
-			children: p
+			children: f
 		}) : null,
-		className: t("subscription-summary--component w-full", E),
+		className: t("subscription-summary--component w-full", x),
 		children: [
-			/* @__PURE__ */ S("div", {
+			/* @__PURE__ */ T("div", {
 				className: "rounded-lg border border-border/60 bg-muted/30 p-4",
 				children: [
-					/* @__PURE__ */ x(n, {
+					/* @__PURE__ */ w(n, {
 						size: "xxs",
 						type: "secondary",
 						weight: "medium",
 						className: "uppercase tracking-wider",
-						children: O.plan
+						children: C.plan
 					}),
-					/* @__PURE__ */ x(r, {
+					/* @__PURE__ */ w(r, {
 						tag: "h3",
 						className: "mt-1 text-xl font-semibold tracking-tight border-none pb-0",
 						children: c
 					}),
-					/* @__PURE__ */ S("div", {
+					/* @__PURE__ */ T("div", {
 						className: "mt-1 flex items-baseline gap-1",
-						children: [/* @__PURE__ */ x(n, {
+						children: [/* @__PURE__ */ w(n, {
 							tag: "span",
 							size: "xl",
 							weight: "bold",
 							className: "tabular-nums",
 							children: l
-						}), /* @__PURE__ */ x(n, {
+						}), /* @__PURE__ */ w(n, {
 							type: "secondary",
 							children: u
 						})]
 					})
 				]
 			}),
-			/* @__PURE__ */ S("div", {
+			/* @__PURE__ */ T("div", {
 				className: "mt-3 flex items-center justify-between rounded-md bg-card px-1",
-				children: [/* @__PURE__ */ S("div", {
+				children: [/* @__PURE__ */ T("div", {
 					className: "flex items-center gap-2",
-					children: [/* @__PURE__ */ x(C, { className: "size-3.5 text-muted-foreground" }), /* @__PURE__ */ x(n, {
+					children: [/* @__PURE__ */ w(E, { className: "size-3.5 text-muted-foreground" }), /* @__PURE__ */ w(n, {
 						size: "xs",
 						type: "secondary",
-						children: O.nextBilling
+						children: C.nextBilling
 					})]
-				}), /* @__PURE__ */ x(n, {
+				}), /* @__PURE__ */ w(n, {
 					size: "xs",
 					weight: "semibold",
 					className: "tabular-nums",
 					children: d
 				})]
 			}),
-			m.length > 0 && /* @__PURE__ */ S("div", {
+			p.length > 0 && /* @__PURE__ */ T("div", {
 				className: "mt-4 space-y-2",
-				children: [/* @__PURE__ */ x(n, {
+				children: [/* @__PURE__ */ w(n, {
 					size: "xxs",
 					type: "secondary",
 					weight: "medium",
 					className: "uppercase tracking-wider",
-					children: O.perks
-				}), /* @__PURE__ */ x(h, { children: m.map((e, t) => /* @__PURE__ */ S(_, {
+					children: C.perks
+				}), /* @__PURE__ */ w(_, { children: p.map((e, t) => /* @__PURE__ */ T(y, {
 					size: "xs",
 					className: "px-0",
-					children: [/* @__PURE__ */ x(f, { children: /* @__PURE__ */ x(i, {
-						icon: e.icon ?? w,
+					children: [/* @__PURE__ */ w(m, { children: /* @__PURE__ */ w(i, {
+						icon: e.icon ?? O,
 						tone: "success",
 						size: "xs"
-					}) }), /* @__PURE__ */ x(g, { children: /* @__PURE__ */ x(v, {
+					}) }), /* @__PURE__ */ w(v, { children: /* @__PURE__ */ w(b, {
 						bold: !1,
 						children: e.label
 					}) })]
 				}, `${e.label}-${t}`)) })]
 			}),
-			(y || b) && /* @__PURE__ */ S("div", {
+			(h || g) && /* @__PURE__ */ T("div", {
 				className: "mt-4 flex items-center gap-2",
-				children: [!!y && /* @__PURE__ */ x(o, {
+				children: [!!h && /* @__PURE__ */ w(o, {
 					variant: "secondary",
 					buttonStyle: "outline",
-					onClick: y,
+					onClick: h,
 					className: "flex-1",
-					children: O.manage
-				}), !!b && /* @__PURE__ */ S(o, {
+					children: C.manage
+				}), !!g && /* @__PURE__ */ T(o, {
 					variant: "primary",
-					onClick: b,
+					onClick: g,
 					className: "flex-1",
-					children: [O.upgrade, /* @__PURE__ */ x(T, { className: "ml-1 size-3.5" })]
+					children: [C.upgrade, /* @__PURE__ */ w(k, { className: "ml-1 size-3.5" })]
 				})]
 			})
 		]
 	});
 }
-V.displayName = "SubscriptionSummaryCard";
+W.displayName = "SubscriptionSummaryCard";
 //#endregion
 //#region src/components/composed/commerce/refund-status/types.ts
-var H = {
+var G = {
 	title: "Refund Status",
 	requested: "Requested",
 	approved: "Approved",
@@ -413,65 +419,65 @@ var H = {
 	reason: "Reason",
 	eta: "Expected by",
 	method: "Refund to"
-}, U = [
+}, K = [
 	"requested",
 	"approved",
 	"processing",
 	"completed"
 ];
-function W({ stage: i, amount: a, reason: o, method: c, eta: u, requestedAt: f, className: p, strings: m }) {
-	let h = e(H, m), g = U.indexOf(i);
-	return /* @__PURE__ */ S(s, {
-		icon: /* @__PURE__ */ x(ie, { className: "size-4" }),
+function q({ stage: i, amount: a, reason: o, method: c, eta: l, requestedAt: d, className: p, strings: m }) {
+	let h = e(G, m), g = K.indexOf(i);
+	return /* @__PURE__ */ T(s, {
+		icon: /* @__PURE__ */ w(re, { className: "size-4" }),
 		title: h.title,
 		className: t("refund-status--component w-full", p),
 		children: [
-			/* @__PURE__ */ S("div", {
+			/* @__PURE__ */ T("div", {
 				className: "rounded-lg bg-muted/40 px-4 py-3",
 				children: [
-					/* @__PURE__ */ x(n, {
+					/* @__PURE__ */ w(n, {
 						size: "xxs",
 						type: "secondary",
 						weight: "medium",
 						className: "uppercase tracking-wider",
 						children: h.amount
 					}),
-					/* @__PURE__ */ x(r, {
+					/* @__PURE__ */ w(r, {
 						tag: "h3",
 						className: "text-3xl tabular-nums tracking-tight",
 						children: a
 					}),
-					!!f && /* @__PURE__ */ S(n, {
+					!!d && /* @__PURE__ */ T(n, {
 						size: "xs",
 						type: "secondary",
 						className: "mt-0.5",
 						children: [
 							h.requested,
 							": ",
-							f
+							d
 						]
 					})
 				]
 			}),
-			/* @__PURE__ */ x("div", {
+			/* @__PURE__ */ w("div", {
 				className: "mt-4 flex items-center justify-between",
-				children: U.map((e, r) => {
+				children: K.map((e, r) => {
 					let i = r <= g, a = r === g;
-					return /* @__PURE__ */ S("div", {
+					return /* @__PURE__ */ T("div", {
 						className: "flex flex-1 flex-col items-center gap-1.5",
-						children: [/* @__PURE__ */ S("div", {
+						children: [/* @__PURE__ */ T("div", {
 							className: "flex w-full items-center",
-							children: [/* @__PURE__ */ x("div", {
+							children: [/* @__PURE__ */ w("div", {
 								className: t("relative flex size-5 shrink-0 items-center justify-center rounded-full", i ? "bg-success text-success-foreground" : "border border-border bg-card text-muted-foreground", a && "ring-2 ring-success/30 ring-offset-2 ring-offset-background"),
-								children: i ? /* @__PURE__ */ x(w, { className: "size-3" }) : /* @__PURE__ */ x(n, {
+								children: i ? /* @__PURE__ */ w(O, { className: "size-3" }) : /* @__PURE__ */ w(n, {
 									tag: "span",
 									size: "xxs",
 									weight: "medium",
 									className: "tabular-nums",
 									children: r + 1
 								})
-							}), r < U.length - 1 && /* @__PURE__ */ x("div", { className: t("h-0.5 flex-1", r < g ? "bg-success" : "bg-border") })]
-						}), /* @__PURE__ */ x(n, {
+							}), r < K.length - 1 && /* @__PURE__ */ w("div", { className: t("h-0.5 flex-1", r < g ? "bg-success" : "bg-border") })]
+						}), /* @__PURE__ */ w(n, {
 							size: "xxs",
 							weight: a ? "semibold" : "medium",
 							type: i ? "main" : "secondary",
@@ -481,23 +487,23 @@ function W({ stage: i, amount: a, reason: o, method: c, eta: u, requestedAt: f,
 					}, e);
 				})
 			}),
-			(o || c || u) && /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(l, { className: "my-4" }), /* @__PURE__ */ S("div", {
+			(o || c || l) && /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w(u, { className: "my-4" }), /* @__PURE__ */ T("div", {
 				className: "space-y-2",
 				children: [
-					!!o && /* @__PURE__ */ x(d, {
+					!!o && /* @__PURE__ */ w(f, {
 						label: h.reason,
 						value: o,
 						className: "items-start",
 						valueClassName: "text-sm font-medium text-right"
 					}),
-					!!c && /* @__PURE__ */ x(d, {
+					!!c && /* @__PURE__ */ w(f, {
 						label: h.method,
 						value: c,
 						valueClassName: "text-sm font-medium"
 					}),
-					!!u && /* @__PURE__ */ x(d, {
+					!!l && /* @__PURE__ */ w(f, {
 						label: h.eta,
-						value: u,
+						value: l,
 						mono: !0,
 						valueClassName: "text-sm font-medium"
 					})
@@ -506,10 +512,10 @@ function W({ stage: i, amount: a, reason: o, method: c, eta: u, requestedAt: f,
 		]
 	});
 }
-W.displayName = "RefundStatusCard";
+q.displayName = "RefundStatusCard";
 //#endregion
 //#region src/components/composed/commerce/address-card/types.ts
-var G = {
+var J = {
 	defaultBadge: "Default",
 	edit: "Edit",
 	remove: "Remove",
@@ -520,55 +526,55 @@ var G = {
 };
 //#endregion
 //#region src/components/composed/commerce/address-card/address-card.tsx
-function K({ kind: r = "shipping", name: i, line1: o, line2: c, city: l, region: u, postalCode: d, country: f, phone: p, isDefault: m = !1, onEdit: h, onRemove: g, onMakeDefault: _, className: v, strings: y }) {
-	let b = e(G, y), C = {
+function Y({ kind: r = "shipping", name: i, line1: o, line2: c, city: l, region: u, postalCode: d, country: f, phone: p, isDefault: m = !1, onEdit: h, onRemove: g, onMakeDefault: _, className: v, strings: y }) {
+	let b = e(J, y), x = {
 		shipping: b.shipping,
 		billing: b.billing,
 		pickup: b.pickup
-	}, w = [
+	}, S = [
 		l,
 		u,
 		d
-	].filter(Boolean).join(", "), T = [];
-	return h && T.push({
+	].filter(Boolean).join(", "), C = [];
+	return h && C.push({
 		id: "edit",
 		label: b.edit,
-		icon: /* @__PURE__ */ x(D, { className: "size-3.5" }),
+		icon: /* @__PURE__ */ w(M, { className: "size-3.5" }),
 		onClick: h
-	}), _ && !m && T.push({
+	}), _ && !m && C.push({
 		id: "make-default",
 		label: b.makeDefault,
-		icon: /* @__PURE__ */ x(oe, { className: "size-3.5" }),
+		icon: /* @__PURE__ */ w(oe, { className: "size-3.5" }),
 		onClick: _
-	}), g && T.push({
+	}), g && C.push({
 		id: "remove",
 		label: b.remove,
-		icon: /* @__PURE__ */ x(se, { className: "size-3.5" }),
+		icon: /* @__PURE__ */ w(ce, { className: "size-3.5" }),
 		onClick: g
-	}), /* @__PURE__ */ x(s, {
-		icon: /* @__PURE__ */ x(ee, { className: "size-4" }),
-		title: C[r],
-		titleSuffix: m ? /* @__PURE__ */ x(a, {
+	}), /* @__PURE__ */ w(s, {
+		icon: /* @__PURE__ */ w(P, { className: "size-4" }),
+		title: x[r],
+		titleSuffix: m ? /* @__PURE__ */ w(a, {
 			variant: "primary",
 			children: b.defaultBadge
 		}) : null,
-		actions: T.length > 0 ? T : void 0,
+		actions: C.length > 0 ? C : void 0,
 		className: t("address-card--component w-full", v),
-		children: /* @__PURE__ */ S("div", {
+		children: /* @__PURE__ */ T("div", {
 			className: "space-y-0.5",
 			children: [
-				/* @__PURE__ */ x(n, {
+				/* @__PURE__ */ w(n, {
 					weight: "semibold",
 					children: i
 				}),
-				/* @__PURE__ */ x(n, { children: o }),
-				!!c && /* @__PURE__ */ x(n, { children: c }),
-				!!w && /* @__PURE__ */ x(n, { children: w }),
-				/* @__PURE__ */ x(n, {
+				/* @__PURE__ */ w(n, { children: o }),
+				!!c && /* @__PURE__ */ w(n, { children: c }),
+				!!S && /* @__PURE__ */ w(n, { children: S }),
+				/* @__PURE__ */ w(n, {
 					type: "secondary",
 					children: f
 				}),
-				!!p && /* @__PURE__ */ x(n, {
+				!!p && /* @__PURE__ */ w(n, {
 					size: "xs",
 					type: "secondary",
 					className: "mt-1.5 tabular-nums",
@@ -578,95 +584,123 @@ function K({ kind: r = "shipping", name: i, line1: o, line2: c, city: l, region:
 		})
 	});
 }
-K.displayName = "AddressCard";
+Y.displayName = "AddressCard";
 //#endregion
 //#region src/components/composed/commerce/voucher-entry/types.ts
-var q = {
+var X = {
 	title: "Redeem a gift card",
+	inputLabel: "Gift card code",
 	placeholder: "Enter gift card code",
+	helperText: "Apply one gift card or voucher to this order.",
 	check: "Check balance",
 	remove: "Remove",
 	balance: "Available balance",
+	applied: "Applied",
 	notFound: "That gift card code is not valid."
-};
-//#endregion
-//#region src/components/composed/commerce/voucher-entry/voucher-entry.tsx
-function J({ appliedCode: r, balance: a, error: l, loading: u, onCheck: d, onRemove: h, className: b, strings: C }) {
-	let T = e(q, C), [E, D] = y("");
-	return r ? /* @__PURE__ */ x(s, {
-		icon: /* @__PURE__ */ x(O, { className: "size-4" }),
-		title: T.title,
-		className: t("voucher-entry--component w-full", b),
-		children: /* @__PURE__ */ S(_, {
-			variant: "muted",
-			className: "border border-success/30 bg-success/8",
+}, fe = (e) => e.toUpperCase();
+function Z({ appliedCode: r, balance: u, error: d, loading: f, onCheck: _, onRemove: C, className: E, strings: D }) {
+	let k = e(X, D), A = x(), [j, M] = S(""), P = j.trim();
+	return r ? /* @__PURE__ */ w(s, {
+		icon: /* @__PURE__ */ w(N, { className: "size-4" }),
+		title: k.title,
+		className: t("voucher-entry--component w-full", E),
+		children: /* @__PURE__ */ T(y, {
+			size: "xs",
+			variant: "outline",
+			className: "items-center gap-x-2.5 gap-y-1.5 border-success/30 bg-success/5 px-2.5 py-2",
 			children: [
-				/* @__PURE__ */ x(f, { children: /* @__PURE__ */ x(i, {
-					icon: w,
+				/* @__PURE__ */ w(m, { children: /* @__PURE__ */ w(i, {
+					icon: O,
 					tone: "success",
-					size: "md",
+					size: "sm",
 					className: "ring-1 ring-success/20"
 				}) }),
-				/* @__PURE__ */ S(g, { children: [/* @__PURE__ */ x(v, {
-					className: "font-mono tracking-wider",
-					children: r
-				}), /* @__PURE__ */ x(p, {
-					className: "uppercase tracking-wide",
-					clamp: 1,
-					children: T.balance
-				})] }),
-				/* @__PURE__ */ S(m, { children: [!!a && /* @__PURE__ */ x(n, {
-					tag: "span",
-					size: "base",
-					weight: "semibold",
-					type: "success",
-					className: "tabular-nums shrink-0",
-					children: a
-				}), !!h && /* @__PURE__ */ x(o, {
-					type: "button",
-					variant: "error",
-					buttonStyle: "ghost",
-					size: "icon-xs",
-					onClick: h,
-					"aria-label": T.remove,
-					className: "size-7 shrink-0 text-muted-foreground hover:text-destructive",
-					children: /* @__PURE__ */ x(j, { className: "size-3.5" })
-				})] })
+				/* @__PURE__ */ T(v, {
+					className: "min-w-0",
+					children: [/* @__PURE__ */ T("div", {
+						className: "flex flex-wrap items-center gap-1.5",
+						children: [/* @__PURE__ */ w(b, {
+							className: "max-w-full font-mono tracking-wider",
+							children: r
+						}), /* @__PURE__ */ w(a, {
+							variant: "success",
+							size: "xs",
+							children: k.applied
+						})]
+					}), /* @__PURE__ */ w(h, {
+						clamp: 1,
+						children: k.balance
+					})]
+				}),
+				/* @__PURE__ */ T(p, {
+					className: "border-t border-success/15 pt-1",
+					children: [/* @__PURE__ */ w("span", {}), /* @__PURE__ */ T(g, {
+						className: "shrink-0 gap-1.5",
+						children: [!!u && /* @__PURE__ */ w(n, {
+							tag: "span",
+							size: "xs",
+							weight: "semibold",
+							type: "success",
+							className: "tabular-nums shrink-0",
+							children: u
+						}), !!C && /* @__PURE__ */ w(o, {
+							type: "button",
+							variant: "error",
+							buttonStyle: "ghost",
+							size: "icon-xs",
+							onClick: C,
+							"aria-label": k.remove,
+							className: "size-7 shrink-0 text-muted-foreground hover:text-destructive",
+							children: /* @__PURE__ */ w(ue, { className: "size-3.5" })
+						})]
+					})]
+				})
 			]
 		})
-	}) : /* @__PURE__ */ x(s, {
-		icon: /* @__PURE__ */ x(O, { className: "size-4" }),
-		title: T.title,
-		className: t("voucher-entry--component w-full", b),
-		children: /* @__PURE__ */ S("div", {
-			className: "flex flex-col gap-2",
-			children: [/* @__PURE__ */ S("div", {
-				className: "flex gap-2",
-				children: [/* @__PURE__ */ x(c, {
-					value: E,
-					onChange: (e) => D(e.target.value),
-					placeholder: T.placeholder,
-					startIcon: O,
-					className: "flex-1 font-mono uppercase tracking-wider",
-					invalid: !!l
-				}), /* @__PURE__ */ x(o, {
-					onClick: () => d?.(E),
-					loading: u,
-					disabled: !E.trim(),
-					children: T.check
-				})]
-			}), !!l && /* @__PURE__ */ x(n, {
-				size: "xs",
-				type: "error",
-				children: l || T.notFound
-			})]
+	}) : /* @__PURE__ */ w(s, {
+		icon: /* @__PURE__ */ w(N, { className: "size-4" }),
+		title: k.title,
+		className: t("voucher-entry--component w-full", E),
+		children: /* @__PURE__ */ w("form", {
+			onSubmit: (e) => {
+				e.preventDefault(), P && _?.(P);
+			},
+			children: /* @__PURE__ */ w(l, {
+				label: k.inputLabel,
+				htmlFor: A,
+				error: d,
+				hint: d ? void 0 : k.helperText,
+				children: /* @__PURE__ */ T("div", {
+					className: "flex flex-wrap gap-2",
+					children: [/* @__PURE__ */ w("div", {
+						className: "min-w-[12rem] flex-1",
+						children: /* @__PURE__ */ w(c, {
+							id: A,
+							value: j,
+							onChange: (e) => M(fe(e.target.value)),
+							placeholder: k.placeholder,
+							startIcon: N,
+							autoCapitalize: "characters",
+							spellCheck: !1,
+							className: "font-mono",
+							invalid: !!d
+						})
+					}), /* @__PURE__ */ w(o, {
+						type: "submit",
+						loading: f,
+						disabled: !P,
+						className: "shrink-0",
+						children: k.check
+					})]
+				})
+			})
 		})
 	});
 }
-J.displayName = "VoucherEntryCard";
+Z.displayName = "VoucherEntryCard";
 //#endregion
 //#region src/components/composed/commerce/cart-summary/types.ts
-var Y = {
+var Q = {
 	title: "Cart",
 	subtotal: "Subtotal",
 	tax: "Tax",
@@ -674,179 +708,231 @@ var Y = {
 	discount: "Discount",
 	total: "Total",
 	checkout: "Checkout"
-}, ue = (e) => e.replace(/^[\s−-]+/, "");
-function X({ items: r, subtotal: i, tax: a, shipping: c, discount: u, total: y, onCheckout: b, className: C, strings: w }) {
-	let T = e(Y, w), E = !!(i || a || c || u);
-	return /* @__PURE__ */ S(s, {
-		icon: /* @__PURE__ */ x(k, { className: "size-4" }),
-		title: T.title,
-		className: t("cart-summary--component w-full", C),
+}, pe = (e) => e.replace(/^[\s−-]+/, ""), me = (e) => [
+	e.productTitle,
+	e.title,
+	e.name
+].find((e) => !!e?.trim()) ?? e.id, he = (e) => [
+	e.imageUrl,
+	e.imageSrc,
+	e.src,
+	e.url
+].find((e) => !!e?.trim()), ge = (e) => e.trim().split(/\s+/).map((e) => e[0]).join("").slice(0, 2).toUpperCase() || e.trim().slice(0, 2).toUpperCase();
+function _e({ title: e }) {
+	return /* @__PURE__ */ w("div", {
+		"aria-hidden": "true",
+		className: "flex size-full items-center justify-center rounded-[inherit] bg-muted text-[length:var(--text-xxs)] font-semibold text-muted-foreground ring-1 ring-border/60",
+		children: ge(e)
+	});
+}
+function ve({ items: r, subtotal: i, tax: a, shipping: c, discount: l, total: d, onCheckout: p, className: x, strings: S }) {
+	let C = e(Q, S), E = !!(i || a || c || l);
+	return /* @__PURE__ */ T(s, {
+		icon: /* @__PURE__ */ w(ie, { className: "size-4" }),
+		title: C.title,
+		className: t("cart-summary--component w-full", x),
 		children: [
-			/* @__PURE__ */ x(h, { children: r.map((e) => /* @__PURE__ */ S(_, {
-				size: "xs",
-				className: "px-0",
-				children: [
-					/* @__PURE__ */ x(f, {
-						variant: "image",
-						children: e.imageUrl ? /* @__PURE__ */ x("img", {
-							src: e.imageUrl,
-							alt: e.name
-						}) : /* @__PURE__ */ x(k, {})
-					}),
-					/* @__PURE__ */ S(g, { children: [/* @__PURE__ */ x(v, { children: e.name }), /* @__PURE__ */ S(p, {
-						clamp: 1,
-						className: "tabular-nums",
-						children: ["x", e.qty]
-					})] }),
-					/* @__PURE__ */ x(m, { children: /* @__PURE__ */ x(n, {
-						tag: "span",
-						weight: "semibold",
-						className: "tabular-nums shrink-0",
-						children: e.price
-					}) })
-				]
-			}, e.id)) }),
-			!!E && /* @__PURE__ */ S("div", {
+			/* @__PURE__ */ w(_, { children: r.map((e) => {
+				let t = me(e), r = he(e);
+				return /* @__PURE__ */ T(y, {
+					className: "cart-summary--item px-0",
+					children: [
+						/* @__PURE__ */ w(m, {
+							variant: "image",
+							className: "cart-summary--item-media",
+							children: r ? /* @__PURE__ */ w("img", {
+								src: r,
+								alt: e.imageAlt ?? t
+							}) : /* @__PURE__ */ w(_e, { title: t })
+						}),
+						/* @__PURE__ */ T(v, {
+							className: "cart-summary--item-content",
+							children: [/* @__PURE__ */ w(b, { children: t }), !!e.variantTitle && /* @__PURE__ */ w(h, {
+								clamp: 1,
+								children: e.variantTitle
+							})]
+						}),
+						/* @__PURE__ */ w(g, {
+							className: "cart-summary--item-actions",
+							children: /* @__PURE__ */ T("div", {
+								className: "flex shrink-0 flex-col items-end gap-0.5",
+								children: [/* @__PURE__ */ T(n, {
+									tag: "span",
+									size: "xs",
+									type: "secondary",
+									className: "tabular-nums",
+									children: ["x", e.qty]
+								}), /* @__PURE__ */ w(n, {
+									tag: "span",
+									weight: "semibold",
+									className: "tabular-nums",
+									children: e.price
+								})]
+							})
+						})
+					]
+				}, e.id);
+			}) }),
+			!!E && /* @__PURE__ */ T("div", {
 				className: "mt-3 space-y-1.5 rounded-lg bg-muted/30 px-3 py-2.5",
 				children: [
-					!!i && /* @__PURE__ */ x(d, {
-						label: T.subtotal,
+					!!i && /* @__PURE__ */ w(f, {
+						label: C.subtotal,
 						value: i,
 						mono: !0,
 						valueClassName: "text-xs font-medium",
 						labelClassName: "text-xs"
 					}),
-					!!a && /* @__PURE__ */ x(d, {
-						label: T.tax,
+					!!a && /* @__PURE__ */ w(f, {
+						label: C.tax,
 						value: a,
 						mono: !0,
 						valueClassName: "text-xs font-medium",
 						labelClassName: "text-xs"
 					}),
-					!!c && /* @__PURE__ */ x(d, {
-						label: T.shipping,
+					!!c && /* @__PURE__ */ w(f, {
+						label: C.shipping,
 						value: c,
 						mono: !0,
 						valueClassName: "text-xs font-medium",
 						labelClassName: "text-xs"
 					}),
-					!!u && /* @__PURE__ */ x(d, {
-						label: T.discount,
-						value: `−${ue(u)}`,
+					!!l && /* @__PURE__ */ w(f, {
+						label: C.discount,
+						value: `−${pe(l)}`,
 						mono: !0,
 						labelClassName: "text-xs",
 						valueClassName: "text-xs font-semibold text-success"
 					})
 				]
 			}),
-			/* @__PURE__ */ x(l, { className: "my-3" }),
-			/* @__PURE__ */ x(d, {
-				label: T.total,
-				value: y,
+			/* @__PURE__ */ w(u, { className: "my-3" }),
+			/* @__PURE__ */ w(f, {
+				label: C.total,
+				value: d,
 				mono: !0,
 				labelClassName: "text-sm font-semibold",
 				valueClassName: "text-lg font-bold"
 			}),
-			!!b && /* @__PURE__ */ x(o, {
-				onClick: b,
+			!!p && /* @__PURE__ */ w(o, {
+				onClick: p,
 				fullWidth: !0,
 				className: "mt-4",
-				children: T.checkout
+				children: C.checkout
 			})
 		]
 	});
 }
-X.displayName = "CartSummaryCard";
+ve.displayName = "CartSummaryCard";
 //#endregion
 //#region src/components/composed/commerce/coupon-input/types.ts
-var Z = {
+var ye = {
 	title: "Have a code?",
 	placeholder: "Enter coupon code",
 	apply: "Apply",
 	remove: "Remove",
 	applied: "Applied",
 	invalid: "That code is not valid"
-}, de = (e) => e.replace(/^[\s−-]+/, "");
-function Q({ appliedCode: r, appliedDiscount: a, error: l, onApply: u, onRemove: d, loading: h, className: b, strings: C }) {
-	let T = e(Z, C), [E, D] = y("");
-	return r ? /* @__PURE__ */ x(s, {
-		icon: /* @__PURE__ */ x(A, { className: "size-4" }),
-		title: T.title,
-		className: t("coupon-input--component w-full", b),
-		children: /* @__PURE__ */ S(_, {
+}, be = (e) => e.replace(/^[\s−-]+/, ""), xe = (e) => e.toUpperCase();
+function $({ appliedCode: r, appliedDiscount: a, error: l, onApply: u, onRemove: d, loading: f, className: _, strings: x }) {
+	let C = e(ye, x), [E, D] = S(""), k = E.trim();
+	return r ? /* @__PURE__ */ w(s, {
+		icon: /* @__PURE__ */ w(se, { className: "size-4" }),
+		title: C.title,
+		className: t("coupon-input--component w-full", _),
+		children: /* @__PURE__ */ T(y, {
+			size: "xs",
 			variant: "muted",
-			className: "border border-success/30 bg-success/8",
+			className: "items-center gap-x-2.5 gap-y-1.5 border border-success/30 bg-success/8 px-2.5 py-2",
 			children: [
-				/* @__PURE__ */ x(f, { children: /* @__PURE__ */ x(i, {
-					icon: w,
+				/* @__PURE__ */ w(m, { children: /* @__PURE__ */ w(i, {
+					icon: O,
 					tone: "success",
-					size: "md",
+					size: "sm",
 					className: "ring-1 ring-success/20"
 				}) }),
-				/* @__PURE__ */ S(g, { children: [/* @__PURE__ */ x(v, {
-					className: "font-mono tracking-wider",
-					children: r
-				}), /* @__PURE__ */ x(p, {
-					className: "uppercase tracking-wide",
-					clamp: 1,
-					children: T.applied
-				})] }),
-				/* @__PURE__ */ S(m, { children: [!!a && /* @__PURE__ */ S(n, {
-					tag: "span",
-					weight: "semibold",
-					type: "success",
-					className: "tabular-nums shrink-0",
-					children: ["−", de(a)]
-				}), !!d && /* @__PURE__ */ x(o, {
-					type: "button",
-					variant: "error",
-					buttonStyle: "ghost",
-					size: "icon-xs",
-					onClick: d,
-					"aria-label": T.remove,
-					className: "size-7 shrink-0 text-muted-foreground hover:text-destructive",
-					children: /* @__PURE__ */ x(j, { className: "size-3.5" })
-				})] })
+				/* @__PURE__ */ T(v, {
+					className: "min-w-0",
+					children: [/* @__PURE__ */ w(b, {
+						className: "max-w-full font-mono tracking-wider",
+						children: r
+					}), /* @__PURE__ */ w(h, {
+						className: "uppercase tracking-wide",
+						clamp: 1,
+						children: C.applied
+					})]
+				}),
+				/* @__PURE__ */ T(p, {
+					className: "border-t border-success/15 pt-1",
+					children: [/* @__PURE__ */ w("span", {}), /* @__PURE__ */ T(g, {
+						className: "shrink-0 gap-1.5",
+						children: [!!a && /* @__PURE__ */ T(n, {
+							tag: "span",
+							size: "xs",
+							weight: "semibold",
+							type: "success",
+							className: "tabular-nums shrink-0",
+							children: ["−", be(a)]
+						}), !!d && /* @__PURE__ */ w(o, {
+							type: "button",
+							variant: "error",
+							buttonStyle: "ghost",
+							size: "icon-xs",
+							onClick: d,
+							"aria-label": C.remove,
+							className: "size-7 shrink-0 text-muted-foreground hover:text-destructive",
+							children: /* @__PURE__ */ w(ue, { className: "size-3.5" })
+						})]
+					})]
+				})
 			]
 		})
-	}) : /* @__PURE__ */ x(s, {
-		icon: /* @__PURE__ */ x(A, { className: "size-4" }),
-		title: T.title,
-		className: t("coupon-input--component w-full", b),
-		children: /* @__PURE__ */ S("div", {
+	}) : /* @__PURE__ */ w(s, {
+		icon: /* @__PURE__ */ w(se, { className: "size-4" }),
+		title: C.title,
+		className: t("coupon-input--component w-full", _),
+		children: /* @__PURE__ */ T("div", {
 			className: "flex flex-col gap-2",
-			children: [/* @__PURE__ */ S("div", {
-				className: "flex gap-2",
-				children: [/* @__PURE__ */ x(c, {
-					value: E,
-					onChange: (e) => D(e.target.value),
-					placeholder: T.placeholder,
-					startIcon: ae,
-					className: "flex-1 font-mono uppercase tracking-wider",
-					invalid: !!l
-				}), /* @__PURE__ */ x(o, {
+			children: [/* @__PURE__ */ T("div", {
+				className: "flex flex-wrap gap-2",
+				children: [/* @__PURE__ */ w("div", {
+					className: "min-w-[11rem] flex-1",
+					children: /* @__PURE__ */ w(c, {
+						value: E,
+						onChange: (e) => D(xe(e.target.value)),
+						placeholder: C.placeholder,
+						startIcon: ae,
+						autoCapitalize: "characters",
+						spellCheck: !1,
+						className: "font-mono",
+						invalid: !!l
+					})
+				}), /* @__PURE__ */ w(o, {
 					size: "default",
-					onClick: () => u?.(E),
-					loading: h,
-					disabled: !E.trim(),
-					children: T.apply
+					onClick: () => u?.(k),
+					loading: f,
+					disabled: !k,
+					className: "shrink-0",
+					children: C.apply
 				})]
-			}), !!l && /* @__PURE__ */ x(n, {
+			}), !!l && /* @__PURE__ */ w(n, {
 				size: "xs",
 				type: "error",
-				children: l || T.invalid
+				children: l || C.invalid
 			})]
 		})
 	});
 }
-Q.displayName = "CouponInputCard";
+$.displayName = "CouponInputCard";
 //#endregion
 //#region src/components/composed/commerce/order-status/types.ts
-var fe = {
+var Se = {
 	title: "Order status",
 	statusLabel: "Current status",
-	eta: "ETA"
-}, pe = {
+	eta: "ETA",
+	latestEvent: "Latest event",
+	currentStep: "Current step"
+}, Ce = {
 	pending: "warning",
 	paid: "info",
 	fulfilled: "info",
@@ -854,90 +940,101 @@ var fe = {
 	delivered: "success",
 	cancelled: "error"
 };
-function me({ orderNumber: r, status: i, statusVariant: o, events: c, currentEta: l, className: u, strings: d }) {
-	let f = e(fe, d), p = o ?? pe[i], m = c.reduce((e, t, n) => t.complete ? n : e, -1);
-	return /* @__PURE__ */ S(s, {
-		icon: /* @__PURE__ */ x(te, { className: "size-4" }),
+function we({ orderNumber: r, status: i, statusVariant: o, events: c, currentEta: l, className: u, strings: d }) {
+	let f = e(Se, d), p = o ?? Ce[i], m = c.reduce((e, t, n) => t.complete ? n : e, -1), h = c[m] ?? c[0], g = c.find((e) => !e.complete);
+	return /* @__PURE__ */ T(s, {
+		icon: /* @__PURE__ */ w(ee, { className: "size-4" }),
 		title: f.title,
-		titleSuffix: /* @__PURE__ */ x(a, {
+		titleSuffix: /* @__PURE__ */ w(a, {
 			variant: p,
 			className: "capitalize",
 			children: i
 		}),
 		description: `#${r}`,
 		className: t("order-status--component w-full", u),
-		children: [/* @__PURE__ */ x("div", {
-			className: "overflow-x-auto pb-1",
-			children: /* @__PURE__ */ x("div", {
-				className: "flex min-w-[22rem] items-start",
-				children: c.map((e, r) => {
-					let i = r === c.length - 1, a = r < m, o = r === m + 1 || e.complete && r === m;
-					return /* @__PURE__ */ S("div", {
-						className: "flex min-w-14 flex-1 flex-col items-center gap-1.5 px-1",
-						children: [
-							/* @__PURE__ */ S("div", {
-								className: "relative flex w-full items-center",
-								children: [
-									r > 0 && /* @__PURE__ */ x("div", { className: t("h-0.5 flex-1", r <= m ? "bg-success" : "bg-border") }),
-									r === 0 && /* @__PURE__ */ x("div", {
-										className: "flex-1",
-										"aria-hidden": "true"
-									}),
-									/* @__PURE__ */ x("div", {
-										className: t("relative flex size-5 shrink-0 items-center justify-center rounded-full", e.complete ? "bg-success text-success-foreground" : "border-2 border-border bg-card text-muted-foreground", o && !e.complete && "border-primary text-primary"),
-										children: e.complete ? /* @__PURE__ */ x(w, {
-											className: "size-3",
-											strokeWidth: 2.5
-										}) : /* @__PURE__ */ x("span", { className: "size-1.5 rounded-full bg-current" })
-									}),
-									i ? /* @__PURE__ */ x("div", {
-										className: "flex-1",
-										"aria-hidden": "true"
-									}) : /* @__PURE__ */ x("div", { className: t("h-0.5 flex-1", a ? "bg-success" : "bg-border") })
-								]
-							}),
-							/* @__PURE__ */ x(n, {
-								size: "xxs",
-								weight: e.complete || o ? "semibold" : "medium",
-								className: t("max-w-20 text-center leading-tight", !e.complete && !o && "text-muted-foreground"),
-								children: e.label
-							}),
-							!!e.timestamp && /* @__PURE__ */ x(n, {
-								size: "xxs",
-								type: "discrete",
-								className: "text-center tabular-nums",
-								children: e.timestamp
-							})
-						]
-					}, `${e.label}-${r}`);
-				})
+		children: [/* @__PURE__ */ w("div", {
+			className: "rounded-lg border border-border bg-muted/20 p-3",
+			children: /* @__PURE__ */ T("div", {
+				className: "grid gap-3 sm:grid-cols-3",
+				children: [
+					/* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w(n, {
+						size: "xxs",
+						type: "secondary",
+						className: "uppercase tracking-wide",
+						children: f.statusLabel
+					}), /* @__PURE__ */ w(n, {
+						weight: "semibold",
+						className: "mt-0.5 capitalize",
+						children: i
+					})] }),
+					!!h && /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w(n, {
+						size: "xxs",
+						type: "secondary",
+						className: "uppercase tracking-wide",
+						children: h.complete ? f.latestEvent : f.currentStep
+					}), /* @__PURE__ */ w(n, {
+						weight: "semibold",
+						className: "mt-0.5",
+						children: h.label
+					})] }),
+					!!l && /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w(n, {
+						size: "xxs",
+						type: "secondary",
+						className: "uppercase tracking-wide",
+						children: f.eta
+					}), /* @__PURE__ */ w(n, {
+						weight: "semibold",
+						className: "mt-0.5 tabular-nums",
+						children: l
+					})] })
+				]
+			})
+		}), c.length > 0 && /* @__PURE__ */ w("ol", {
+			className: "mt-4",
+			children: c.map((e, r) => {
+				let i = r === c.length - 1, a = g ? e === g : r === m;
+				return /* @__PURE__ */ T("li", {
+					className: "relative flex gap-3",
+					children: [/* @__PURE__ */ T("div", {
+						className: "flex flex-col items-center",
+						children: [/* @__PURE__ */ w("span", {
+							className: t("flex size-6 shrink-0 items-center justify-center rounded-full border", e.complete ? "border-success bg-success text-success-foreground" : "border-border bg-card text-muted-foreground", a && !e.complete && "border-primary text-primary ring-4 ring-primary/10"),
+							children: e.complete ? /* @__PURE__ */ w(O, {
+								className: "size-3.5",
+								strokeWidth: 2.5
+							}) : a ? /* @__PURE__ */ w(D, { className: "size-3.5" }) : /* @__PURE__ */ w(A, { className: "size-3" })
+						}), !i && /* @__PURE__ */ w("span", {
+							"aria-hidden": "true",
+							className: t("min-h-6 w-px flex-1", r < m ? "bg-success" : "bg-border")
+						})]
+					}), /* @__PURE__ */ T("div", {
+						className: t("min-w-0 flex-1 pb-4", i && "pb-0"),
+						children: [/* @__PURE__ */ w(n, {
+							weight: e.complete || a ? "semibold" : "medium",
+							className: t(!e.complete && !a && "text-muted-foreground"),
+							children: e.label
+						}), !!e.timestamp && /* @__PURE__ */ w(n, {
+							size: "xs",
+							type: "secondary",
+							className: "mt-0.5 tabular-nums",
+							children: e.timestamp
+						})]
+					})]
+				}, `${e.label}-${r}`);
 			})
-		}), !!l && /* @__PURE__ */ S("div", {
-			className: "mt-3 flex items-center justify-between rounded-lg border border-border/50 bg-primary/5 px-3 py-2",
-			children: [/* @__PURE__ */ x(n, {
-				size: "xs",
-				type: "secondary",
-				weight: "medium",
-				className: "uppercase tracking-wider",
-				children: f.eta
-			}), /* @__PURE__ */ x(n, {
-				tag: "span",
-				weight: "semibold",
-				children: l
-			})]
 		})]
 	});
 }
-me.displayName = "OrderStatusCard";
+we.displayName = "OrderStatusCard";
 //#endregion
 //#region src/components/composed/commerce/payment-method/types.ts
-var he = {
+var Te = {
 	title: "Payment method",
 	default: "Default",
 	cardHolder: "Card holder",
 	expires: "Expires",
 	change: "Change"
-}, ge = {
+}, Ee = {
 	visa: "VISA",
 	mastercard: "MasterCard",
 	amex: "AMEX",
@@ -945,92 +1042,89 @@ var he = {
 	applepay: "Apple Pay",
 	googlepay: "Google Pay",
 	unknown: "Card"
-}, _e = {
-	visa: "from-blue-700 via-blue-800 to-indigo-900",
-	mastercard: "from-orange-600 via-rose-700 to-rose-900",
-	amex: "from-sky-600 via-cyan-700 to-cyan-900",
-	paypal: "from-blue-600 via-indigo-700 to-blue-900",
-	applepay: "from-zinc-700 via-zinc-800 to-zinc-950",
-	googlepay: "from-emerald-600 via-teal-700 to-teal-900",
-	unknown: "from-zinc-700 via-zinc-800 to-zinc-950"
+}, De = {
+	visa: "from-info via-primary to-info",
+	mastercard: "from-warning via-destructive to-destructive",
+	amex: "from-info via-primary to-info",
+	paypal: "from-info via-primary to-info",
+	applepay: "from-foreground via-muted-foreground to-foreground",
+	googlepay: "from-success via-primary to-success",
+	unknown: "from-foreground via-muted-foreground to-foreground"
 };
-function $({ brand: r, last4: i, expiry: c, holderName: l, isDefault: u, onChange: d, className: f, strings: p }) {
-	let m = e(he, p), h = ge[r], g = _e[r];
-	return /* @__PURE__ */ S(s, {
-		icon: /* @__PURE__ */ x(E, { className: "size-4" }),
+function Oe({ brand: r, last4: i, expiry: c, holderName: l, isDefault: u, onChange: d, className: f, strings: p }) {
+	let m = e(Te, p), h = Ee[r], g = De[r];
+	return /* @__PURE__ */ w(s, {
+		icon: /* @__PURE__ */ w(j, { className: "size-4" }),
 		title: m.title,
-		titleSuffix: u ? /* @__PURE__ */ x(a, {
+		titleSuffix: u ? /* @__PURE__ */ w(a, {
 			variant: "primary",
 			children: m.default
 		}) : null,
+		headerAction: d ? /* @__PURE__ */ w(o, {
+			buttonStyle: "ghost",
+			variant: "secondary",
+			onClick: d,
+			children: m.change
+		}) : void 0,
 		className: t("payment-method--component w-full", f),
-		children: [/* @__PURE__ */ S("div", {
-			className: t("relative flex aspect-[1.586] min-h-40 flex-col justify-between overflow-hidden rounded-lg bg-gradient-to-br p-4 text-white shadow-sm ring-1 ring-white/10", g),
+		children: /* @__PURE__ */ T("div", {
+			className: t("relative mx-auto flex aspect-[85.6/53.98] w-full max-w-[22rem] flex-col justify-between overflow-hidden rounded-lg bg-gradient-to-br p-3.5 text-inverse-foreground shadow-sm ring-1 ring-inverse-border", g),
 			children: [
-				/* @__PURE__ */ S("div", {
+				/* @__PURE__ */ T("div", {
 					className: "relative flex items-start justify-between",
-					children: [/* @__PURE__ */ x("div", {
+					children: [/* @__PURE__ */ w("div", {
 						className: "flex size-7 items-center justify-center rounded-md bg-gradient-to-br from-warning/80 to-warning shadow-sm",
-						children: /* @__PURE__ */ x("div", { className: "size-4 rounded-sm border border-warning-foreground/25 bg-warning-foreground/15" })
-					}), /* @__PURE__ */ x(n, {
+						children: /* @__PURE__ */ w("div", { className: "size-4 rounded-sm border border-warning-foreground/25 bg-warning-foreground/15" })
+					}), /* @__PURE__ */ w(n, {
 						tag: "span",
 						weight: "bold",
-						className: "rounded bg-white/15 px-2 py-0.5 tracking-[0.15em] text-white backdrop-blur-sm",
+						className: "rounded bg-inverse-surface px-2 py-0.5 tracking-[0.15em] text-inverse-foreground backdrop-blur-sm",
 						children: h
 					})]
 				}),
-				/* @__PURE__ */ x("div", {
+				/* @__PURE__ */ w("div", {
 					className: "relative",
-					children: /* @__PURE__ */ S(n, {
+					children: /* @__PURE__ */ T(n, {
 						tag: "span",
 						size: "base",
 						weight: "semibold",
-						className: "block font-mono tracking-[0.25em] text-white",
+						className: "block font-mono tracking-[0.25em] text-inverse-foreground",
 						children: ["•••• •••• •••• ", i]
 					})
 				}),
-				/* @__PURE__ */ S("div", {
+				/* @__PURE__ */ T("div", {
 					className: "relative flex items-end justify-between gap-3",
-					children: [/* @__PURE__ */ x("div", {
+					children: [/* @__PURE__ */ w("div", {
 						className: "min-w-0",
-						children: !!l && /* @__PURE__ */ S(b, { children: [/* @__PURE__ */ x(n, {
+						children: !!l && /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w(n, {
 							size: "xxs",
-							className: "block uppercase tracking-wider text-white/60",
+							className: "block uppercase tracking-wider text-inverse-subtle",
 							children: m.cardHolder
-						}), /* @__PURE__ */ x(n, {
+						}), /* @__PURE__ */ w(n, {
 							weight: "semibold",
-							className: "truncate text-white",
+							className: "truncate text-inverse-foreground",
 							children: l
 						})] })
-					}), !!c && /* @__PURE__ */ S("div", {
+					}), !!c && /* @__PURE__ */ T("div", {
 						className: "text-right shrink-0",
-						children: [/* @__PURE__ */ x(n, {
+						children: [/* @__PURE__ */ w(n, {
 							size: "xxs",
-							className: "block uppercase tracking-wider text-white/60",
+							className: "block uppercase tracking-wider text-inverse-subtle",
 							children: m.expires
-						}), /* @__PURE__ */ x(n, {
+						}), /* @__PURE__ */ w(n, {
 							tag: "span",
 							weight: "semibold",
-							className: "tabular-nums text-white",
+							className: "tabular-nums text-inverse-foreground",
 							children: c
 						})]
 					})]
 				})
 			]
-		}), !!d && /* @__PURE__ */ x("div", {
-			className: "mt-3 flex justify-end",
-			children: /* @__PURE__ */ x(o, {
-				buttonStyle: "ghost",
-				variant: "secondary",
-				onClick: d,
-				size: "default",
-				children: m.change
-			})
-		})]
+		})
 	});
 }
-$.displayName = "PaymentMethodCard";
+Oe.displayName = "PaymentMethodCard";
 //#endregion
-export { K as AddressCard, X as CartSummaryCard, Q as CouponInputCard, I as DiscountStackPreview, P as LoyaltyPointsCard, me as OrderStatusCard, $ as PaymentMethodCard, W as RefundStatusCard, L as ShipmentTrackingCard, V as SubscriptionSummaryCard, z as TaxBreakdownCard, M as UpcomingBookingRow, J as VoucherEntryCard, G as defaultAddressCardStrings, Y as defaultCartSummaryStrings, Z as defaultCouponInputStrings, F as defaultDiscountStackStrings, N as defaultLoyaltyPointsStrings, fe as defaultOrderStatusStrings, he as defaultPaymentMethodStrings, H as defaultRefundStatusStrings, B as defaultSubscriptionSummaryStrings, R as defaultTaxBreakdownStrings, q as defaultVoucherEntryStrings };
+export { Y as AddressCard, ve as CartSummaryCard, $ as CouponInputCard, z as DiscountStackPreview, L as LoyaltyPointsCard, we as OrderStatusCard, Oe as PaymentMethodCard, q as RefundStatusCard, B as ShipmentTrackingCard, W as SubscriptionSummaryCard, H as TaxBreakdownCard, F as UpcomingBookingRow, Z as VoucherEntryCard, J as defaultAddressCardStrings, Q as defaultCartSummaryStrings, ye as defaultCouponInputStrings, R as defaultDiscountStackStrings, I as defaultLoyaltyPointsStrings, Se as defaultOrderStatusStrings, Te as defaultPaymentMethodStrings, G as defaultRefundStatusStrings, U as defaultSubscriptionSummaryStrings, V as defaultTaxBreakdownStrings, X as defaultVoucherEntryStrings };
 
 //# sourceMappingURL=index.js.map