@burdenoff/microfe-movethewheels 2026.703.3 → 2026.703.5

package/dist/{StatusBadge-BZurYHMy.js → StatusBadge-BNHXYvZx.js}

@@ -1,4 +1,4 @@
-import { l as e, rt as t } from "./PageLayout-D4LDHJJq.js";
+import { l as e, rt as t } from "./PageLayout-BniRJaQ6.js";
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/movethewheels/constants/index.ts
 var i = {
@@ -75,10 +75,10 @@ function h({ status: i, type: a = "custom", customColors: o, size: s = "md", sho
 	let g = i.replace(/_/g, " ").replace(/\b\w/g, (e) => e.toUpperCase());
 	return /* @__PURE__ */ r(e, {
 		variant: "outline",
-		className: t("font-medium capitalize border-0 whitespace-nowrap inline-flex items-center", p.bg, p.text, m[s], f),
+		className: t("inline-flex items-center gap-1.5 whitespace-nowrap rounded-full border-0 font-medium capitalize", "ring-1 ring-inset ring-border-seam/60", p.bg, p.text, m[s], f),
 		children: [c && /* @__PURE__ */ n("span", {
 			"aria-hidden": "true",
-			className: t("w-1.5 h-1.5 rounded-full mr-1.5 flex-shrink-0 motion-safe:animate-vc-glow-pulse", p.text.replace("text-", "bg-"))
+			className: t("h-1.5 w-1.5 flex-shrink-0 rounded-full motion-safe:animate-vc-glow-pulse", p.text.replace("text-", "bg-"))
 		}), g]
 	});
 }
@@ -86,7 +86,7 @@ function g({ priority: r, size: i = "md", className: a }) {
 	let o = f[r];
 	return /* @__PURE__ */ n(e, {
 		variant: "outline",
-		className: t("font-medium capitalize border-0 whitespace-nowrap", o.bg, o.text, m[i], a),
+		className: t("rounded-full font-medium capitalize border-0 whitespace-nowrap ring-1 ring-inset ring-border-seam/60", o.bg, o.text, m[i], a),
 		children: r
 	});
 }
@@ -103,7 +103,7 @@ function _({ type: r, size: i = "md", className: a }) {
 	}[r];
 	return /* @__PURE__ */ n(e, {
 		variant: "outline",
-		className: t("font-medium uppercase border-0 whitespace-nowrap", o.bg, o.text, m[i], a),
+		className: t("rounded-full font-medium uppercase border-0 whitespace-nowrap ring-1 ring-inset ring-border-seam/60", o.bg, o.text, m[i], a),
 		children: r
 	});
 }
@@ -128,14 +128,14 @@ function v({ status: r, size: i = "md", className: a }) {
 	}[r];
 	return /* @__PURE__ */ n(e, {
 		variant: "outline",
-		className: t("font-medium capitalize border-0 whitespace-nowrap", o.bg, o.text, m[i], a),
+		className: t("rounded-full font-medium capitalize border-0 whitespace-nowrap ring-1 ring-inset ring-border-seam/60", o.bg, o.text, m[i], a),
 		children: r
 	});
 }
 function y({ type: i, size: a = "md", className: o }) {
 	return /* @__PURE__ */ r(e, {
 		variant: "outline",
-		className: t("font-medium capitalize whitespace-nowrap inline-flex items-center", m[a], o),
+		className: t("rounded-full font-medium capitalize whitespace-nowrap inline-flex items-center ring-1 ring-inset ring-border-seam/60", m[a], o),
 		children: [/* @__PURE__ */ n("span", {
 			className: "mr-1",
 			children: {

package/dist/TrackingPage-BZrg4RCu.js

@@ -0,0 +1,368 @@
+import { A as e, d as t, f as n, g as r, h as i, i as a, lt as o, st as s, t as c, u as l } from "./PageLayout-BniRJaQ6.js";
+import { t as u } from "./circle-alert-CNkuDNc6.js";
+import { t as d } from "./circle-check-big-C-p4eNwn.js";
+import { t as f } from "./clock-dRGG4rkF.js";
+import { t as p } from "./map-pin-CqN1bbT1.js";
+import { t as m } from "./package-DmRF7iQD.js";
+import { t as h } from "./search-DNIG5Ck7.js";
+import { t as g } from "./truck-9rLDncav.js";
+import { i as _ } from "./useTracking-BKG0I2ln.js";
+import { t as v } from "./maps-yzLqiK_C.js";
+import { r as y } from "./StatusBadge-BNHXYvZx.js";
+import { r as b, t as x } from "./formatters-FWJDwTFv.js";
+import { n as S } from "./mapMarkers-NCV9MRKR.js";
+import { useMemo as C, useState as w } from "react";
+import { useSearchParams as T } from "react-router-dom";
+import { jsx as E, jsxs as D } from "react/jsx-runtime";
+import { EmphasisPanel as O, PagePurpose as k } from "@burdenoff/fe-libs/ui";
+import { useI18n as A } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+//#region src/movethewheels/pages/TrackingPage.tsx
+function j() {
+	let { t: j } = A(), M = (e, t) => {
+		let n = j(e);
+		return n === e ? t : n;
+	}, { basePath: N, navigate: P } = s(), [F] = T(), I = F.get("order") || "", [L, R] = w(I), [z, B] = w(I), { tracking: V, order: H, isLoading: U, error: W } = _(z || void 0), G = (e) => {
+		e.preventDefault(), B(L);
+	}, K = (e) => {
+		P && P(o(N, e));
+	}, q = C(() => {
+		if (!H) return null;
+		let e = S(H.pickupAddress), t = S(H.deliveryAddress), n = e ? {
+			...e,
+			label: `Pickup · ${H.pickupAddress.city || "Origin"}`
+		} : null, r = t ? {
+			...t,
+			label: `Delivery · ${H.deliveryAddress.city || "Destination"}`
+		} : null, i = H.timeline.map((e) => {
+			let t = e.location ? S(e.location) : null;
+			return t ? {
+				lat: t.lat,
+				lng: t.lng,
+				timestamp: new Date(e.timestamp).toISOString()
+			} : null;
+		}).filter((e) => e !== null), a = V ? S(V.currentLocation) : null, o = a ? {
+			...a,
+			label: V?.currentLocation.address || "Current position"
+		} : null;
+		return {
+			origin: n,
+			destination: r,
+			trail: i,
+			current: o,
+			hasAny: !!(n || r || o || i.length > 0)
+		};
+	}, [H, V]);
+	return /* @__PURE__ */ D(a, {
+		title: M("movethewheels.tracking.title", "Track Shipment"),
+		subtitle: M("movethewheels.tracking.subtitle", "Enter a tracking number or order ID to track your shipment"),
+		icon: /* @__PURE__ */ E(p, { size: 24 }),
+		headerActions: /* @__PURE__ */ D(l, {
+			variant: "outline",
+			onClick: () => K("tracking/live"),
+			children: [/* @__PURE__ */ E(p, { size: 16 }), M("movethewheels.tracking.actions.liveMapView", "Live Map View")]
+		}),
+		children: [
+			/* @__PURE__ */ E(k, {
+				icon: /* @__PURE__ */ E(p, { size: 18 }),
+				children: M("movethewheels.tracking.purpose", "Look up any single shipment by its tracking number or order ID to see exactly where it is, its progress through pickup and delivery, the current location and any alerts — the same view you can share with a customer.")
+			}),
+			/* @__PURE__ */ E(t, { children: /* @__PURE__ */ E(n, {
+				className: "p-6",
+				children: /* @__PURE__ */ D("form", {
+					onSubmit: G,
+					className: "flex gap-4",
+					children: [/* @__PURE__ */ D("div", {
+						className: "flex-1 relative",
+						children: [/* @__PURE__ */ E(h, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-text-secondary" }), /* @__PURE__ */ E(e, {
+							value: L,
+							onChange: (e) => R(e.target.value),
+							placeholder: M("movethewheels.tracking.search.placeholder", "Enter tracking number or order ID (e.g., order-1 or TRK123456789)"),
+							className: "pl-10 h-12 text-lg"
+						})]
+					}), /* @__PURE__ */ E(l, {
+						type: "submit",
+						size: "lg",
+						disabled: !L || U,
+						children: U ? M("movethewheels.tracking.search.searching", "Searching...") : M("movethewheels.tracking.search.track", "Track")
+					})]
+				})
+			}) }),
+			W && /* @__PURE__ */ E(t, {
+				className: "border-status-error-border",
+				children: /* @__PURE__ */ E(n, {
+					className: "p-6",
+					children: /* @__PURE__ */ D("div", {
+						className: "flex items-center gap-4",
+						children: [/* @__PURE__ */ E(u, { className: "w-8 h-8 text-status-error-text" }), /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
+							className: "font-medium text-status-error-text",
+							children: M("movethewheels.tracking.error.title", "Unable to find shipment")
+						}), /* @__PURE__ */ E("p", {
+							className: "text-sm text-text-secondary",
+							children: M("movethewheels.tracking.error.description", "Please check the tracking number and try again")
+						})] })]
+					})
+				})
+			}),
+			!z && !W && /* @__PURE__ */ E(c, {
+				illustration: "onboarding",
+				title: M("movethewheels.tracking.empty.title", "Enter a tracking number"),
+				description: M("movethewheels.tracking.empty.description", "Use your tracking number or order ID to see the current status of your shipment")
+			}),
+			H && V && /* @__PURE__ */ D("div", {
+				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
+				children: [/* @__PURE__ */ D("div", {
+					className: "lg:col-span-2 space-y-6",
+					children: [
+						/* @__PURE__ */ D(O, { children: [/* @__PURE__ */ D("div", {
+							className: "flex items-center justify-between mb-4",
+							children: [/* @__PURE__ */ D("h2", {
+								className: "flex items-center gap-2 text-base font-semibold text-text-primary",
+								children: [
+									/* @__PURE__ */ E(m, { size: 20 }),
+									M("movethewheels.tracking.orderLabel", "Order"),
+									" ",
+									H.orderNumber
+								]
+							}), /* @__PURE__ */ E(y, {
+								status: H.status,
+								type: "order"
+							})]
+						}), /* @__PURE__ */ D("div", {
+							className: "grid grid-cols-2 md:grid-cols-4 gap-4",
+							children: [
+								/* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
+									className: "text-sm text-text-secondary",
+									children: M("movethewheels.tracking.details.trackingNumber", "Tracking Number")
+								}), /* @__PURE__ */ E("p", {
+									className: "font-mono font-medium",
+									children: H.trackingNumber
+								})] }),
+								/* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
+									className: "text-sm text-text-secondary",
+									children: M("movethewheels.tracking.details.estimatedDelivery", "Estimated Delivery")
+								}), /* @__PURE__ */ E("p", {
+									className: "font-medium",
+									children: V.estimatedArrival ? b(V.estimatedArrival, "full") : H.scheduledDelivery ? b(H.scheduledDelivery, "full") : M("movethewheels.tracking.details.tbd", "TBD")
+								})] }),
+								/* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
+									className: "text-sm text-text-secondary",
+									children: M("movethewheels.tracking.details.items", "Items")
+								}), /* @__PURE__ */ D("p", {
+									className: "font-medium",
+									children: [
+										H.items.length,
+										" ",
+										M("movethewheels.tracking.details.itemsSuffix", "items")
+									]
+								})] }),
+								/* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
+									className: "text-sm text-text-secondary",
+									children: M("movethewheels.tracking.details.lastUpdated", "Last Updated")
+								}), /* @__PURE__ */ E("p", {
+									className: "font-medium",
+									children: b(V.lastUpdated, "relative")
+								})] })
+							]
+						})] }),
+						/* @__PURE__ */ D(t, { children: [/* @__PURE__ */ E(i, { children: /* @__PURE__ */ D(r, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ E(p, { size: 18 }), M("movethewheels.tracking.routeMap.title", "Route map")]
+						}) }), /* @__PURE__ */ E(n, { children: /* @__PURE__ */ E(v, {
+							className: "overflow-hidden rounded-lg border border-border-seam",
+							height: 320,
+							origin: q?.origin ?? null,
+							destination: q?.destination ?? null,
+							trail: q?.trail ?? [],
+							current: q?.current ?? null,
+							emptyMessage: M("movethewheels.tracking.routeMap.empty", "No location coordinates recorded for this shipment yet")
+						}) })] }),
+						/* @__PURE__ */ D(t, { children: [/* @__PURE__ */ E(i, { children: /* @__PURE__ */ D(r, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ E(f, { size: 18 }), M("movethewheels.tracking.progress.title", "Shipment Progress")]
+						}) }), /* @__PURE__ */ D(n, { children: [/* @__PURE__ */ E("div", {
+							className: "relative",
+							children: /* @__PURE__ */ E("div", {
+								className: "flex justify-between mb-4",
+								children: [
+									{
+										status: "confirmed",
+										label: M("movethewheels.tracking.progress.confirmed", "Confirmed"),
+										icon: d
+									},
+									{
+										status: "picked_up",
+										label: M("movethewheels.tracking.progress.pickedUp", "Picked Up"),
+										icon: m
+									},
+									{
+										status: "in_transit",
+										label: M("movethewheels.tracking.progress.inTransit", "In Transit"),
+										icon: g
+									},
+									{
+										status: "delivered",
+										label: M("movethewheels.tracking.progress.delivered", "Delivered"),
+										icon: p
+									}
+								].map((e, t) => {
+									let n = [
+										"pending",
+										"confirmed",
+										"assigned",
+										"picked_up",
+										"in_transit",
+										"out_for_delivery",
+										"delivered"
+									], r = n.indexOf(H.status), i = n.indexOf(e.status) <= r, a = e.status === H.status || H.status === "out_for_delivery" && e.status === "in_transit";
+									return /* @__PURE__ */ D("div", {
+										className: "flex flex-col items-center flex-1",
+										children: [
+											/* @__PURE__ */ E("div", {
+												className: `w-10 h-10 rounded-full flex items-center justify-center ${i ? "bg-action-primary-bg text-action-primary-text" : "bg-bg-sunken text-text-secondary"} ${a ? "ring-4 ring-primary/20" : ""}`,
+												children: /* @__PURE__ */ E(e.icon, { size: 20 })
+											}),
+											/* @__PURE__ */ E("p", {
+												className: `text-xs mt-2 text-center ${i ? "font-medium" : "text-text-secondary"}`,
+												children: e.label
+											}),
+											t < 3 && /* @__PURE__ */ E("div", {
+												className: `absolute top-5 h-0.5 ${i ? "bg-action-primary-bg" : "bg-bg-sunken"}`,
+												style: {
+													left: `calc(${(t + .5) * 25}% + 20px)`,
+													width: "calc(25% - 40px)"
+												}
+											})
+										]
+									}, e.status);
+								})
+							})
+						}), /* @__PURE__ */ E("div", {
+							className: "mt-8 space-y-4",
+							children: H.timeline.slice().reverse().map((e, t) => /* @__PURE__ */ D("div", {
+								className: "flex gap-4",
+								children: [/* @__PURE__ */ D("div", {
+									className: "relative",
+									children: [/* @__PURE__ */ E("div", { className: `w-3 h-3 rounded-full ${t === 0 ? "bg-action-primary-bg" : "bg-bg-sunken"}` }), t < H.timeline.length - 1 && /* @__PURE__ */ E("div", { className: "absolute top-3 left-1.5 w-px h-8 -ml-px bg-border" })]
+								}), /* @__PURE__ */ D("div", {
+									className: "flex-1 pb-4",
+									children: [
+										/* @__PURE__ */ D("div", {
+											className: "flex items-center gap-2",
+											children: [/* @__PURE__ */ E(y, {
+												status: e.status,
+												type: "order",
+												size: "sm"
+											}), /* @__PURE__ */ E("span", {
+												className: "text-sm text-text-secondary",
+												children: b(e.timestamp, "full")
+											})]
+										}),
+										e.notes && /* @__PURE__ */ E("p", {
+											className: "text-sm mt-1",
+											children: e.notes
+										}),
+										e.location && /* @__PURE__ */ D("p", {
+											className: "text-xs text-text-secondary mt-1",
+											children: [/* @__PURE__ */ E(p, {
+												size: 12,
+												className: "inline mr-1"
+											}), x(e.location)]
+										})
+									]
+								})]
+							}, t))
+						})] })] }),
+						V.alerts && V.alerts.length > 0 && /* @__PURE__ */ D(t, { children: [/* @__PURE__ */ E(i, { children: /* @__PURE__ */ D(r, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ E(u, { size: 18 }), M("movethewheels.tracking.alerts.title", "Alerts")]
+						}) }), /* @__PURE__ */ E(n, { children: /* @__PURE__ */ E("div", {
+							className: "space-y-3",
+							children: V.alerts.map((e) => /* @__PURE__ */ D("div", {
+								className: `flex items-start gap-3 p-3 rounded-lg ${e.severity === "critical" ? "bg-status-error-bg-subtle" : (e.severity, "bg-status-warning-bg-subtle")}`,
+								children: [/* @__PURE__ */ E(u, {
+									size: 16,
+									className: e.severity === "critical" ? "text-status-error-text" : (e.severity, "text-status-warning-text")
+								}), /* @__PURE__ */ D("div", { children: [/* @__PURE__ */ E("p", {
+									className: "text-sm font-medium",
+									children: e.message
+								}), /* @__PURE__ */ D("p", {
+									className: "text-xs text-text-secondary",
+									children: [b(e.timestamp, "relative"), e.resolvedAt && ` - ${M("movethewheels.tracking.alerts.resolved", "Resolved")}`]
+								})] })]
+							}, e.id))
+						}) })] })
+					]
+				}), /* @__PURE__ */ D("div", {
+					className: "space-y-6",
+					children: [
+						/* @__PURE__ */ D(t, { children: [/* @__PURE__ */ E(i, { children: /* @__PURE__ */ D(r, {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ E(p, { size: 18 }), M("movethewheels.tracking.location.title", "Current Location")]
+						}) }), /* @__PURE__ */ D(n, { children: [
+							q?.current ? /* @__PURE__ */ E(v, {
+								className: "mb-4 overflow-hidden rounded-lg border border-border-seam",
+								height: 180,
+								current: q.current,
+								destination: q.destination ?? null,
+								trail: q.trail
+							}) : /* @__PURE__ */ D("div", {
+								className: "mb-4 rounded-lg bg-bg-sunken p-4 text-center text-text-secondary",
+								children: [/* @__PURE__ */ E(p, {
+									size: 28,
+									className: "mx-auto mb-2 opacity-60"
+								}), /* @__PURE__ */ E("p", {
+									className: "text-sm",
+									children: M("movethewheels.tracking.location.noFix", "No live position fix yet")
+								})]
+							}),
+							/* @__PURE__ */ E("p", {
+								className: "text-sm",
+								children: V.currentLocation.address || M("movethewheels.tracking.location.updating", "Location updating...")
+							}),
+							/* @__PURE__ */ D("p", {
+								className: "text-xs text-text-secondary mt-1",
+								children: [
+									M("movethewheels.tracking.location.updated", "Updated"),
+									" ",
+									b(V.currentLocation.timestamp || /* @__PURE__ */ new Date(), "relative")
+								]
+							})
+						] })] }),
+						/* @__PURE__ */ D(t, { children: [/* @__PURE__ */ E(i, { children: /* @__PURE__ */ E(r, { children: M("movethewheels.tracking.deliveryAddress.title", "Delivery Address") }) }), /* @__PURE__ */ D(n, { children: [/* @__PURE__ */ E("p", {
+							className: "text-sm",
+							children: H.customerInfo.name
+						}), /* @__PURE__ */ E("p", {
+							className: "text-sm text-text-secondary mt-2",
+							children: x(H.deliveryAddress)
+						})] })] }),
+						/* @__PURE__ */ E(t, { children: /* @__PURE__ */ D(n, {
+							className: "p-4 space-y-2",
+							children: [/* @__PURE__ */ E(l, {
+								variant: "outline",
+								className: "w-full",
+								onClick: () => K(`orders/${H.id}`),
+								children: M("movethewheels.tracking.actions.viewOrderDetails", "View Order Details")
+							}), /* @__PURE__ */ E(l, {
+								variant: "outline",
+								className: "w-full",
+								children: M("movethewheels.tracking.actions.contactDriver", "Contact Driver")
+							})]
+						}) })
+					]
+				})]
+			}),
+			z && !H && !U && !W && /* @__PURE__ */ E(c, {
+				illustration: "empty-search",
+				title: M("movethewheels.tracking.notFound.title", "Shipment not found"),
+				description: `${M("movethewheels.tracking.notFound.descriptionPrefix", "No shipment found with tracking number")} "${z}"`,
+				action: /* @__PURE__ */ E(l, {
+					variant: "outline",
+					onClick: () => R(""),
+					children: M("movethewheels.tracking.notFound.tryAnother", "Try another number")
+				})
+			})
+		]
+	});
+}
+//#endregion
+export { j as default };