@burdenoff/microfe-movethewheels 2026.929.4 → 2026.930.1

package/dist/pages/CreateOrderPage.js

@@ -7,157 +7,168 @@ import { Plus as a } from "../node_modules/lucide-react/dist/esm/icons/plus.js";
 import { Save as ee } from "../node_modules/lucide-react/dist/esm/icons/save.js";
 import { Users as te } from "../node_modules/lucide-react/dist/esm/icons/users.js";
 import { buildCustomerCreatePath as ne, joinPath as o } from "../utils/navigation.js";
-import { useMoveTheWheels as s } from "../providers/MoveTheWheelsProvider.js";
-import { useRoute as re, useRoutes as ie } from "../hooks/useRoutes.js";
-import { useOrder as ae, useOrders as oe } from "../hooks/useOrders.js";
+import { useMoveTheWheels as re } from "../providers/MoveTheWheelsProvider.js";
+import { useRoute as ie, useRoutes as ae } from "../hooks/useRoutes.js";
+import { useOrder as s, useOrders as oe } from "../hooks/useOrders.js";
 import { useProducts as se } from "../hooks/useInventory.js";
 import { useCustomer as ce, useCustomers as le } from "../hooks/useCustomers.js";
 import { Badge as c, Button as l, Card as u, CardContent as d, CardDescription as f, CardHeader as p, CardTitle as m, Input as h, Label as g, Select as ue, SelectContent as de, SelectItem as _, SelectTrigger as fe, SelectValue as pe, Separator as me, Textarea as he } from "../components/ui.js";
 import { EmptyState as ge, PageLayout as _e } from "../components/PageLayout.js";
 import { FormError as ve } from "../components/FormError.js";
 import { EntityCombobox as ye } from "../components/EntityCombobox.js";
-import { CustomerPicker as v } from "../components/CustomerPicker.js";
-import { OrderItemRow as y } from "../components/OrderItemRow.js";
-import { useEffect as b, useState as x } from "react";
-import { useParams as be, useSearchParams as xe } from "react-router";
-import { Fragment as Se, jsx as S, jsxs as C } from "react/jsx-runtime";
-import { EmphasisPanel as Ce, PagePurpose as we, Stepper as Te } from "@burdenoff/fe-libs/ui";
-import { FormSection as w } from "@burdenoff/fe-libs/form";
+import { CustomerPicker as be } from "../components/CustomerPicker.js";
+import { OrderItemRow as xe } from "../components/OrderItemRow.js";
+import { validateOrderItems as Se } from "../utils/orderValidation.js";
+import { useEffect as v, useState as y } from "react";
+import { useParams as Ce, useSearchParams as we } from "react-router";
+import { Fragment as Te, jsx as b, jsxs as x } from "react/jsx-runtime";
+import { EmphasisPanel as Ee, PagePurpose as De, Stepper as Oe } from "@burdenoff/fe-libs/ui";
+import { FormSection as S } from "@burdenoff/fe-libs/form";
 //#region src/movethewheels/pages/CreateOrderPage.tsx
-function T(e) {
+function C(e) {
 	if (!e || Number.isNaN(e.getTime())) return "";
 	let t = (e) => String(e).padStart(2, "0");
 	return `${e.getFullYear()}-${t(e.getMonth() + 1)}-${t(e.getDate())}T${t(e.getHours())}:${t(e.getMinutes())}`;
 }
-function E() {
-	let { orderId: E } = be(), [D] = xe(), O = D.get("customerId")?.trim() || void 0, { basePath: k, navigate: A } = s(), { order: j } = ae(E), { createOrder: Ee, updateOrder: De } = oe(), [Oe, ke] = x(""), { customers: M, createCustomer: Ae, isLoading: N, error: P, refetch: je } = le({
+function w() {
+	let { orderId: w } = Ce(), [T] = we(), E = T.get("customerId")?.trim() || void 0, { basePath: D, navigate: O } = re(), { order: k } = s(w), { createOrder: ke, updateOrder: Ae } = oe(), [je, Me] = y(""), { customers: A, createCustomer: Ne, isLoading: j, isLoadingMore: Pe, error: M, refetch: Fe, loadMore: Ie, hasMore: Le, totalCustomers: Re } = le({
 		limit: 20,
-		filters: { search: Oe || void 0 }
-	}), { customer: F } = ce(O ?? j?.customerId), [Me, Ne] = x(""), { routes: I, isLoading: L, error: R, hasMore: Pe, totalRoutes: Fe } = ie({
+		filters: { search: je || void 0 }
+	}), { customer: N } = ce(E ?? k?.customerId), [ze, Be] = y(""), { routes: P, isLoading: F, error: I, hasMore: L, totalRoutes: Ve, loadMore: He, isLoadingMore: Ue } = ae({
 		status: "planned",
-		search: Me || void 0,
+		search: ze || void 0,
 		limit: 20
-	}), [z, Ie] = x(""), { products: Le, isLoading: Re } = se({
-		search: z || void 0,
+	}), [R, We] = y(""), { products: Ge, isLoading: Ke, isLoadingMore: qe, hasMore: Je, totalProducts: Ye, loadMore: Xe } = se({
+		search: R || void 0,
 		limit: 20
-	}), B = !!E && !!j, [V, H] = x(null), [U, W] = x({
-		customerId: O || j?.customerId || "",
-		priority: j?.priority || "normal",
-		routeId: j?.routeId || "",
+	}), z = !!w && !!k, [B, V] = y(null), [H, U] = y({
+		customerId: E || k?.customerId || "",
+		priority: k?.priority || "normal",
+		routeId: k?.routeId || "",
 		pickupAddress: {
-			street: j?.pickupAddress.street || "",
-			city: j?.pickupAddress.city || "",
-			state: j?.pickupAddress.state || "",
-			postalCode: j?.pickupAddress.postalCode || "",
-			country: j?.pickupAddress.country || "USA"
+			street: k?.pickupAddress.street || "",
+			city: k?.pickupAddress.city || "",
+			state: k?.pickupAddress.state || "",
+			postalCode: k?.pickupAddress.postalCode || "",
+			country: k?.pickupAddress.country || "USA"
 		},
 		deliveryAddress: {
-			street: j?.deliveryAddress.street || "",
-			city: j?.deliveryAddress.city || "",
-			state: j?.deliveryAddress.state || "",
-			postalCode: j?.deliveryAddress.postalCode || "",
-			country: j?.deliveryAddress.country || "USA"
+			street: k?.deliveryAddress.street || "",
+			city: k?.deliveryAddress.city || "",
+			state: k?.deliveryAddress.state || "",
+			postalCode: k?.deliveryAddress.postalCode || "",
+			country: k?.deliveryAddress.country || "USA"
 		},
-		items: j?.items || [],
-		scheduledDelivery: T(j?.scheduledDelivery),
-		specialInstructions: j?.specialInstructions || ""
-	}), { route: ze, isLoading: Be } = re(U.routeId || void 0), [G, K] = x(!1), [Ve, q] = x(null);
-	b(() => {
-		F && (H((e) => e?.id === F.id ? e : F), W((e) => e.customerId ? e : {
+		items: k?.items || [],
+		trackingNumber: k?.trackingNumber || "",
+		scheduledDelivery: C(k?.scheduledDelivery),
+		specialInstructions: k?.specialInstructions || ""
+	}), { route: Ze, isLoading: Qe } = ie(H.routeId || void 0), [W, G] = y(!1), [$e, K] = y(null), [q, J] = y({});
+	v(() => {
+		N && (V((e) => e?.id === N.id ? e : N), U((e) => e.customerId ? e : {
 			...e,
-			customerId: F.id
+			customerId: N.id
 		}));
-	}, [F]), b(() => {
-		j && W({
-			customerId: j.customerId || "",
-			priority: j.priority || "normal",
-			routeId: j.routeId || "",
+	}, [N]), v(() => {
+		k && U({
+			customerId: k.customerId || "",
+			priority: k.priority || "normal",
+			routeId: k.routeId || "",
 			pickupAddress: {
-				street: j.pickupAddress.street || "",
-				city: j.pickupAddress.city || "",
-				state: j.pickupAddress.state || "",
-				postalCode: j.pickupAddress.postalCode || "",
-				country: j.pickupAddress.country || "USA"
+				street: k.pickupAddress.street || "",
+				city: k.pickupAddress.city || "",
+				state: k.pickupAddress.state || "",
+				postalCode: k.pickupAddress.postalCode || "",
+				country: k.pickupAddress.country || "USA"
 			},
 			deliveryAddress: {
-				street: j.deliveryAddress.street || "",
-				city: j.deliveryAddress.city || "",
-				state: j.deliveryAddress.state || "",
-				postalCode: j.deliveryAddress.postalCode || "",
-				country: j.deliveryAddress.country || "USA"
+				street: k.deliveryAddress.street || "",
+				city: k.deliveryAddress.city || "",
+				state: k.deliveryAddress.state || "",
+				postalCode: k.deliveryAddress.postalCode || "",
+				country: k.deliveryAddress.country || "USA"
 			},
-			items: j.items || [],
-			scheduledDelivery: T(j.scheduledDelivery),
-			specialInstructions: j.specialInstructions || ""
+			items: k.items || [],
+			trackingNumber: k.trackingNumber || "",
+			scheduledDelivery: C(k.scheduledDelivery),
+			specialInstructions: k.specialInstructions || ""
 		});
-	}, [j]);
-	let J = () => {
-		if (A) {
-			if (!B && O) {
-				A(o(k, `customers/${O}`));
+	}, [k]);
+	let Y = () => {
+		if (O) {
+			if (!z && E) {
+				O(o(D, `customers/${E}`));
 				return;
 			}
-			A(o(k, "orders"));
+			O(o(D, "orders"));
 		}
-	}, Y = () => V ?? M.find((e) => e.id === U.customerId), He = () => !U.customerId || !Y() ? P ? "Customers could not be loaded. Retry or create a customer before continuing." : "Select a customer for this order." : U.pickupAddress.street.trim() ? U.deliveryAddress.street.trim() ? U.items.length === 0 ? "Add at least one item to the order." : U.scheduledDelivery && Number.isNaN(Date.parse(U.scheduledDelivery)) ? "Enter a valid scheduled delivery date and time." : null : "Enter a delivery street address." : "Enter a pickup street address.", X = async (e) => {
-		e.preventDefault(), q(null);
-		let t = He();
+	}, X = () => B ?? A.find((e) => e.id === H.customerId), et = () => {
+		if (!H.customerId || !X()) return M ? "Customers could not be loaded. Retry or create a customer before continuing." : "Select a customer for this order.";
+		if (!H.pickupAddress.street.trim()) return "Enter a pickup street address.";
+		if (!H.deliveryAddress.street.trim()) return "Enter a delivery street address.";
+		if (H.items.length === 0) return "Add at least one item to the order.";
+		let e = Se(H.items);
+		return J(e), Object.keys(e).length > 0 ? "Fix the highlighted shipment item fields before continuing." : H.scheduledDelivery && Number.isNaN(Date.parse(H.scheduledDelivery)) ? "Enter a valid scheduled delivery date and time." : null;
+	}, tt = async (e) => {
+		e.preventDefault(), K(null);
+		let t = et();
 		if (t) {
-			q(t);
+			K(t);
 			return;
 		}
-		let n = Y();
+		let n = X();
 		if (!n) {
-			q(P ? "Customers could not be loaded. Retry or create a customer before continuing." : "Select a customer for this order.");
+			K(M ? "Customers could not be loaded. Retry or create a customer before continuing." : "Select a customer for this order.");
 			return;
 		}
-		K(!0);
+		G(!0);
 		try {
 			let e = {
-				customerId: U.customerId,
+				customerId: H.customerId,
 				customerInfo: {
 					name: n.name,
 					email: n.email,
 					phone: n.phone,
 					company: n.company
 				},
-				priority: U.priority,
-				pickupAddress: U.pickupAddress,
-				deliveryAddress: U.deliveryAddress,
-				items: U.items,
-				scheduledDelivery: U.scheduledDelivery ? new Date(U.scheduledDelivery) : null,
-				routeId: U.routeId || void 0,
-				specialInstructions: U.specialInstructions
+				priority: H.priority,
+				pickupAddress: H.pickupAddress,
+				deliveryAddress: H.deliveryAddress,
+				items: H.items,
+				trackingNumber: H.trackingNumber.trim() || void 0,
+				scheduledDelivery: H.scheduledDelivery ? new Date(H.scheduledDelivery) : null,
+				routeId: H.routeId || void 0,
+				specialInstructions: H.specialInstructions
 			};
-			if (B && E) await De(E, e), A && A(o(k, `orders/${E}`));
+			if (z && w) await Ae(w, e), O && O(o(D, `orders/${w}`));
 			else {
-				let t = await Ee(e);
-				A ? A(o(k, `orders/${t.id}`)) : J();
+				let t = await ke(e);
+				O ? O(o(D, `orders/${t.id}`)) : Y();
 			}
 		} catch (e) {
-			q(e instanceof Error ? e.message : B ? "Could not update the order. Please try again." : "Could not create the order. Please try again.");
+			K(e instanceof Error ? e.message : z ? "Could not update the order. Please try again." : "Could not create the order. Please try again.");
 		} finally {
-			K(!1);
+			G(!1);
 		}
 	}, Z = (e, t) => {
-		W((n) => ({
+		U((n) => ({
 			...n,
 			[e]: t
 		}));
 	}, Q = (e, t, n) => {
-		W((r) => ({
+		U((r) => ({
 			...r,
 			[e]: {
 				...r[e],
 				[t]: n
 			}
 		}));
-	}, Ue = (e) => {
+	}, nt = (e) => {
 		if (!e) {
 			Z("routeId", "");
 			return;
 		}
-		let t = I.find((t) => t.id === e);
+		let t = P.find((t) => t.id === e);
 		if (!t) return;
 		let n = t.stops.find((e) => e.type === "pickup")?.address, r = [...t.stops].reverse().find((e) => e.type === "delivery")?.address, i = (e, t) => t ? {
 			street: e.street.trim() ? e.street : t.street,
@@ -166,14 +177,14 @@ function E() {
 			postalCode: e.postalCode.trim() ? e.postalCode : t.postalCode,
 			country: e.country.trim() ? e.country : t.country
 		} : e;
-		W((e) => ({
+		U((e) => ({
 			...e,
 			routeId: t.id,
 			pickupAddress: i(e.pickupAddress, n),
 			deliveryAddress: i(e.deliveryAddress, r)
 		}));
 	}, $ = () => {
-		W((e) => ({
+		U((e) => ({
 			...e,
 			items: [...e.items, {
 				id: `item-${Date.now()}`,
@@ -191,48 +202,56 @@ function E() {
 				sku: ""
 			}]
 		}));
-	}, We = (e) => {
-		W((t) => ({
+	}, rt = (e) => {
+		let t = H.items[e]?.id;
+		t && J((e) => {
+			let n = { ...e };
+			return delete n[t], n;
+		}), U((t) => ({
 			...t,
 			items: t.items.filter((t, n) => n !== e)
 		}));
-	}, Ge = (e, t, n) => {
-		W((r) => ({
+	}, it = (e, t, n) => {
+		let r = H.items[e]?.id;
+		r && q[r] && J((e) => {
+			let t = { ...e };
+			return delete t[r], t;
+		}), U((r) => ({
 			...r,
 			items: r.items.map((r, i) => i === e ? {
 				...r,
 				[t]: n
 			} : r)
 		}));
-	}, Ke = () => {
-		A && A(o(k, ne(B && E ? `orders/${E}/edit` : "orders/new")));
-	}, qe = U.customerId ? !U.pickupAddress.street || !U.deliveryAddress.street ? 1 : U.items.length === 0 ? 2 : 3 : 0;
-	return /* @__PURE__ */ C(_e, {
-		title: B ? "Edit Order" : "Create Order",
-		subtitle: B ? `Editing ${j?.orderNumber}` : "Create a new delivery order",
-		icon: /* @__PURE__ */ S(i, { size: 24 }),
+	}, at = () => {
+		O && O(o(D, ne(z && w ? `orders/${w}/edit` : "orders/new")));
+	}, ot = H.customerId ? !H.pickupAddress.street || !H.deliveryAddress.street ? 1 : H.items.length === 0 ? 2 : 3 : 0;
+	return /* @__PURE__ */ x(_e, {
+		title: z ? "Edit Order" : "Create Order",
+		subtitle: z ? `Editing ${k?.orderNumber}` : "Create a new delivery order",
+		icon: /* @__PURE__ */ b(i, { size: 24 }),
 		maxWidth: "2xl",
-		headerActions: /* @__PURE__ */ C("div", {
+		headerActions: /* @__PURE__ */ x("div", {
 			className: "flex w-full flex-col-reverse gap-2 sm:w-auto sm:flex-row",
-			children: [/* @__PURE__ */ C(l, {
+			children: [/* @__PURE__ */ x(l, {
 				type: "button",
 				variant: "outline",
-				onClick: J,
-				disabled: G,
-				children: [/* @__PURE__ */ S(e, { size: 16 }), "Cancel"]
-			}), /* @__PURE__ */ C(l, {
+				onClick: Y,
+				disabled: W,
+				children: [/* @__PURE__ */ b(e, { size: 16 }), "Cancel"]
+			}), /* @__PURE__ */ x(l, {
 				type: "submit",
 				form: "order-form",
-				disabled: G || N,
-				children: [/* @__PURE__ */ S(ee, { size: 16 }), G ? "Saving..." : B ? "Save Changes" : "Create Order"]
+				disabled: W || j,
+				children: [/* @__PURE__ */ b(ee, { size: 16 }), W ? "Saving..." : z ? "Save Changes" : "Create Order"]
 			})]
 		}),
 		children: [
-			/* @__PURE__ */ S(we, {
-				icon: /* @__PURE__ */ S(i, { size: 18 }),
-				children: B ? "Update the customer, delivery plan, shipment contents, or handling details before saving." : "Set the customer and delivery plan, add what is being shipped, then choose any timing or handling preferences."
+			/* @__PURE__ */ b(De, {
+				icon: /* @__PURE__ */ b(i, { size: 18 }),
+				children: z ? "Update the customer, delivery plan, shipment contents, or handling details before saving." : "Set the customer and delivery plan, add what is being shipped, then choose any timing or handling preferences."
 			}),
-			/* @__PURE__ */ S(Te, {
+			/* @__PURE__ */ b(Oe, {
 				steps: [
 					{
 						key: "customer",
@@ -255,7 +274,7 @@ function E() {
 						description: "Add optional delivery instructions."
 					}
 				],
-				active: qe,
+				active: ot,
 				onStepClick: (e) => {
 					let t = document.getElementById([
 						"customer",
@@ -274,89 +293,93 @@ function E() {
 				},
 				allowSkipAhead: !0
 			}),
-			/* @__PURE__ */ C("form", {
+			/* @__PURE__ */ x("form", {
 				id: "order-form",
-				onSubmit: X,
+				onSubmit: tt,
 				className: "space-y-6",
 				children: [
-					/* @__PURE__ */ S(ve, { message: Ve }),
-					/* @__PURE__ */ S("section", {
+					/* @__PURE__ */ b(ve, { message: $e }),
+					/* @__PURE__ */ b("section", {
 						"aria-labelledby": "order-details-title",
-						children: /* @__PURE__ */ C(Ce, {
+						children: /* @__PURE__ */ x(Ee, {
 							className: "space-y-5",
-							children: [/* @__PURE__ */ C("div", {
+							children: [/* @__PURE__ */ x("div", {
 								className: "flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between",
-								children: [/* @__PURE__ */ C("div", {
+								children: [/* @__PURE__ */ x("div", {
 									className: "flex items-start gap-3",
-									children: [/* @__PURE__ */ S("div", {
+									children: [/* @__PURE__ */ b("div", {
 										className: "rounded-xl bg-action-primary-bg/10 p-2 text-action-primary-bg",
-										children: /* @__PURE__ */ S(te, {
+										children: /* @__PURE__ */ b(te, {
 											size: 18,
 											"aria-hidden": "true"
 										})
-									}), /* @__PURE__ */ C("div", { children: [/* @__PURE__ */ S("h2", {
+									}), /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("h2", {
 										id: "order-details-title",
 										className: "text-base font-semibold text-text-primary",
 										children: "Customer & priority"
-									}), /* @__PURE__ */ S("p", {
+									}), /* @__PURE__ */ b("p", {
 										className: "mt-1 text-sm text-text-secondary",
 										children: "Choose who this delivery is for and how urgently it should be handled."
 									})] })]
-								}), /* @__PURE__ */ S(c, {
+								}), /* @__PURE__ */ b(c, {
 									variant: "outline",
 									children: "Required"
 								})]
-							}), /* @__PURE__ */ C("div", {
+							}), /* @__PURE__ */ x("div", {
 								className: "grid grid-cols-1 gap-4 md:grid-cols-2",
-								children: [/* @__PURE__ */ S(v, {
-									customers: M,
-									value: U.customerId,
+								children: [/* @__PURE__ */ b(be, {
+									customers: A,
+									value: H.customerId,
 									onValueChange: (e) => {
-										e && (Z("customerId", e), H(M.find((t) => t.id === e) ?? (V?.id === e ? V : null)), q(null));
+										e && (Z("customerId", e), V(A.find((t) => t.id === e) ?? (B?.id === e ? B : null)), K(null));
 									},
 									onCreated: (e) => {
-										H(e), Z("customerId", e.id), q(null);
+										V(e), Z("customerId", e.id), K(null);
 									},
-									createCustomer: Ae,
-									isLoading: N,
-									error: P,
-									onRetry: je,
-									onOpenCustomers: Ke,
-									selectedCustomer: V,
-									onSearchQueryChange: ke
-								}), /* @__PURE__ */ C("div", {
+									createCustomer: Ne,
+									isLoading: j,
+									error: M,
+									onRetry: Fe,
+									onOpenCustomers: at,
+									selectedCustomer: B,
+									onSearchQueryChange: Me,
+									hasMore: Le,
+									totalCount: Re,
+									onLoadMore: Ie,
+									isLoadingMore: Pe
+								}), /* @__PURE__ */ x("div", {
 									className: "space-y-2",
 									children: [
-										/* @__PURE__ */ S(g, {
+										/* @__PURE__ */ b(g, {
 											htmlFor: "priority",
 											children: "Priority"
 										}),
-										/* @__PURE__ */ C(ue, {
-											value: U.priority,
+										/* @__PURE__ */ x(ue, {
+											value: H.priority,
 											onValueChange: (e) => Z("priority", e),
-											children: [/* @__PURE__ */ S(fe, {
+											children: [/* @__PURE__ */ b(fe, {
 												id: "priority",
-												children: /* @__PURE__ */ S(pe, {})
-											}), /* @__PURE__ */ C(de, { children: [
-												/* @__PURE__ */ S(_, {
+												children: /* @__PURE__ */ b(pe, {})
+											}), /* @__PURE__ */ x(de, { children: [
+												/* @__PURE__ */ b(_, {
 													value: "low",
 													children: "Low"
 												}),
-												/* @__PURE__ */ S(_, {
+												/* @__PURE__ */ b(_, {
 													value: "normal",
 													children: "Normal"
 												}),
-												/* @__PURE__ */ S(_, {
+												/* @__PURE__ */ b(_, {
 													value: "high",
 													children: "High"
 												}),
-												/* @__PURE__ */ S(_, {
+												/* @__PURE__ */ b(_, {
 													value: "urgent",
 													children: "Urgent"
 												})
 											] })]
 										}),
-										/* @__PURE__ */ S("p", {
+										/* @__PURE__ */ b("p", {
 											className: "text-xs text-text-secondary",
 											children: "Normal is selected by default."
 										})
@@ -365,158 +388,160 @@ function E() {
 							})]
 						})
 					}),
-					/* @__PURE__ */ S("div", {
+					/* @__PURE__ */ b("div", {
 						id: "locations-section",
-						children: /* @__PURE__ */ C(w, {
-							title: /* @__PURE__ */ C("span", {
+						children: /* @__PURE__ */ x(S, {
+							title: /* @__PURE__ */ x("span", {
 								className: "flex items-center gap-2",
-								children: [/* @__PURE__ */ S(r, {
+								children: [/* @__PURE__ */ b(r, {
 									size: 18,
 									"aria-hidden": "true"
 								}), "Route & addresses"]
 							}),
 							description: "Choose an optional saved route, then review or enter the collection and destination details.",
 							children: [
-								/* @__PURE__ */ C("div", {
+								/* @__PURE__ */ x("div", {
 									className: "rounded-card border border-border-subtle bg-bg-sunken/40 p-4",
 									children: [
-										/* @__PURE__ */ C("div", {
+										/* @__PURE__ */ x("div", {
 											className: "mb-3 flex flex-col gap-2 sm:flex-row sm:items-start sm:justify-between",
-											children: [/* @__PURE__ */ C("div", { children: [/* @__PURE__ */ S("h3", {
+											children: [/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("h3", {
 												className: "text-sm font-semibold text-text-primary",
 												children: "Use a saved route"
-											}), /* @__PURE__ */ S("p", {
+											}), /* @__PURE__ */ b("p", {
 												className: "mt-1 text-xs text-text-secondary",
 												children: "Optional — fills only blank address fields; you can always edit them below."
-											})] }), /* @__PURE__ */ S(c, {
+											})] }), /* @__PURE__ */ b(c, {
 												variant: "secondary",
 												children: "Optional"
 											})]
 										}),
-										/* @__PURE__ */ S(ye, {
+										/* @__PURE__ */ b(ye, {
 											id: "saved-route",
-											value: U.routeId,
-											onChange: Ue,
-											options: I,
-											loading: L,
+											value: H.routeId,
+											onChange: nt,
+											options: P,
+											loading: F,
 											getId: (e) => e.id,
 											getLabel: (e) => `${e.name} · ${e.stops.length} stops`,
-											renderOption: (e) => /* @__PURE__ */ C(Se, { children: [
+											renderOption: (e) => /* @__PURE__ */ x(Te, { children: [
 												e.name,
 												" · ",
 												e.stops.length,
 												" stops"
 											] }),
-											selectedOption: ze,
-											selectedLoading: Be,
+											selectedOption: Ze,
+											selectedLoading: Qe,
 											placeholder: "Choose a saved route",
 											searchPlaceholder: "Search saved routes",
 											emptyText: "No saved routes found.",
 											noneLabel: "No saved route",
-											error: R ? "Saved routes are unavailable" : void 0,
-											onSearchChange: Ne,
-											hasMore: Pe,
-											totalCount: Fe
+											error: I ? "Saved routes are unavailable" : void 0,
+											onSearchChange: Be,
+											hasMore: L,
+											totalCount: Ve,
+											onLoadMore: He,
+											loadingMore: Ue
 										}),
-										/* @__PURE__ */ S("p", {
+										/* @__PURE__ */ b("p", {
 											className: "mt-2 text-xs text-text-secondary",
 											role: "status",
-											children: L ? "Loading planned routes…" : R ? "Saved routes are unavailable; enter pickup and delivery addresses manually." : "Manual values always remain authoritative when a route is selected."
+											children: F ? "Loading planned routes…" : I ? "Saved routes are unavailable; enter pickup and delivery addresses manually." : "Manual values always remain authoritative when a route is selected."
 										})
 									]
 								}),
-								/* @__PURE__ */ S(me, {}),
-								/* @__PURE__ */ C("div", {
+								/* @__PURE__ */ b(me, {}),
+								/* @__PURE__ */ x("div", {
 									className: "grid grid-cols-1 gap-4 lg:grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] lg:items-stretch",
 									children: [
-										/* @__PURE__ */ C(u, {
+										/* @__PURE__ */ x(u, {
 											className: "border-border-seam shadow-none",
-											children: [/* @__PURE__ */ C(p, { children: [/* @__PURE__ */ C(m, {
+											children: [/* @__PURE__ */ x(p, { children: [/* @__PURE__ */ x(m, {
 												className: "flex items-center gap-2 text-base",
 												children: [
-													/* @__PURE__ */ S(r, {
+													/* @__PURE__ */ b(r, {
 														size: 17,
 														className: "text-text-secondary",
 														"aria-hidden": "true"
 													}),
 													"Pickup address ",
-													/* @__PURE__ */ S("span", {
+													/* @__PURE__ */ b("span", {
 														className: "text-status-error-text",
 														children: "*"
 													})
 												]
-											}), /* @__PURE__ */ S(f, { children: "Where the shipment is collected." })] }), /* @__PURE__ */ S(d, {
+											}), /* @__PURE__ */ b(f, { children: "Where the shipment is collected." })] }), /* @__PURE__ */ b(d, {
 												className: "space-y-4",
-												children: /* @__PURE__ */ C("fieldset", {
+												children: /* @__PURE__ */ x("fieldset", {
 													className: "space-y-4",
 													children: [
-														/* @__PURE__ */ S("legend", {
+														/* @__PURE__ */ b("legend", {
 															className: "sr-only",
 															children: "Pickup address details"
 														}),
-														/* @__PURE__ */ C("div", {
+														/* @__PURE__ */ x("div", {
 															className: "space-y-2",
-															children: [/* @__PURE__ */ C(g, {
+															children: [/* @__PURE__ */ x(g, {
 																htmlFor: "pickupStreet",
-																children: ["Street address ", /* @__PURE__ */ S("span", {
+																children: ["Street address ", /* @__PURE__ */ b("span", {
 																	className: "text-status-error-text",
 																	children: "*"
 																})]
-															}), /* @__PURE__ */ S(h, {
+															}), /* @__PURE__ */ b(h, {
 																id: "pickupStreet",
-																value: U.pickupAddress.street,
+																value: H.pickupAddress.street,
 																onChange: (e) => Q("pickupAddress", "street", e.target.value),
 																placeholder: "123 Main St",
 																"aria-required": "true"
 															})]
 														}),
-														/* @__PURE__ */ C("div", {
+														/* @__PURE__ */ x("div", {
 															className: "grid grid-cols-1 sm:grid-cols-2 gap-4",
-															children: [/* @__PURE__ */ C("div", {
+															children: [/* @__PURE__ */ x("div", {
 																className: "space-y-2",
-																children: [/* @__PURE__ */ S(g, {
+																children: [/* @__PURE__ */ b(g, {
 																	htmlFor: "pickupCity",
 																	children: "City"
-																}), /* @__PURE__ */ S(h, {
+																}), /* @__PURE__ */ b(h, {
 																	id: "pickupCity",
-																	value: U.pickupAddress.city,
+																	value: H.pickupAddress.city,
 																	onChange: (e) => Q("pickupAddress", "city", e.target.value),
 																	placeholder: "San Francisco"
 																})]
-															}), /* @__PURE__ */ C("div", {
+															}), /* @__PURE__ */ x("div", {
 																className: "space-y-2",
-																children: [/* @__PURE__ */ S(g, {
+																children: [/* @__PURE__ */ b(g, {
 																	htmlFor: "pickupState",
 																	children: "State"
-																}), /* @__PURE__ */ S(h, {
+																}), /* @__PURE__ */ b(h, {
 																	id: "pickupState",
-																	value: U.pickupAddress.state,
+																	value: H.pickupAddress.state,
 																	onChange: (e) => Q("pickupAddress", "state", e.target.value),
 																	placeholder: "CA"
 																})]
 															})]
 														}),
-														/* @__PURE__ */ C("div", {
+														/* @__PURE__ */ x("div", {
 															className: "grid grid-cols-1 sm:grid-cols-2 gap-4",
-															children: [/* @__PURE__ */ C("div", {
+															children: [/* @__PURE__ */ x("div", {
 																className: "space-y-2",
-																children: [/* @__PURE__ */ S(g, {
+																children: [/* @__PURE__ */ b(g, {
 																	htmlFor: "pickupPostal",
 																	children: "Postal Code"
-																}), /* @__PURE__ */ S(h, {
+																}), /* @__PURE__ */ b(h, {
 																	id: "pickupPostal",
-																	value: U.pickupAddress.postalCode,
+																	value: H.pickupAddress.postalCode,
 																	onChange: (e) => Q("pickupAddress", "postalCode", e.target.value),
 																	placeholder: "94103"
 																})]
-															}), /* @__PURE__ */ C("div", {
+															}), /* @__PURE__ */ x("div", {
 																className: "space-y-2",
-																children: [/* @__PURE__ */ S(g, {
+																children: [/* @__PURE__ */ b(g, {
 																	htmlFor: "pickupCountry",
 																	children: "Country"
-																}), /* @__PURE__ */ S(h, {
+																}), /* @__PURE__ */ b(h, {
 																	id: "pickupCountry",
-																	value: U.pickupAddress.country,
+																	value: H.pickupAddress.country,
 																	onChange: (e) => Q("pickupAddress", "country", e.target.value),
 																	placeholder: "USA"
 																})]
@@ -526,102 +551,102 @@ function E() {
 												})
 											})]
 										}),
-										/* @__PURE__ */ S("div", {
+										/* @__PURE__ */ b("div", {
 											className: "hidden items-center justify-center lg:flex",
 											"aria-hidden": "true",
-											children: /* @__PURE__ */ S(t, {
+											children: /* @__PURE__ */ b(t, {
 												size: 18,
 												className: "text-text-muted"
 											})
 										}),
-										/* @__PURE__ */ C(u, {
+										/* @__PURE__ */ x(u, {
 											className: "border-border-seam shadow-none",
-											children: [/* @__PURE__ */ C(p, { children: [/* @__PURE__ */ C(m, {
+											children: [/* @__PURE__ */ x(p, { children: [/* @__PURE__ */ x(m, {
 												className: "flex items-center gap-2 text-base",
 												children: [
-													/* @__PURE__ */ S(r, {
+													/* @__PURE__ */ b(r, {
 														size: 17,
 														className: "text-text-secondary",
 														"aria-hidden": "true"
 													}),
 													"Delivery address ",
-													/* @__PURE__ */ S("span", {
+													/* @__PURE__ */ b("span", {
 														className: "text-status-error-text",
 														children: "*"
 													})
 												]
-											}), /* @__PURE__ */ S(f, { children: "Where the shipment is delivered." })] }), /* @__PURE__ */ S(d, {
+											}), /* @__PURE__ */ b(f, { children: "Where the shipment is delivered." })] }), /* @__PURE__ */ b(d, {
 												className: "space-y-4",
-												children: /* @__PURE__ */ C("fieldset", {
+												children: /* @__PURE__ */ x("fieldset", {
 													className: "space-y-4",
 													children: [
-														/* @__PURE__ */ S("legend", {
+														/* @__PURE__ */ b("legend", {
 															className: "sr-only",
 															children: "Delivery address details"
 														}),
-														/* @__PURE__ */ C("div", {
+														/* @__PURE__ */ x("div", {
 															className: "space-y-2",
-															children: [/* @__PURE__ */ C(g, {
+															children: [/* @__PURE__ */ x(g, {
 																htmlFor: "deliveryStreet",
-																children: ["Street address ", /* @__PURE__ */ S("span", {
+																children: ["Street address ", /* @__PURE__ */ b("span", {
 																	className: "text-status-error-text",
 																	children: "*"
 																})]
-															}), /* @__PURE__ */ S(h, {
+															}), /* @__PURE__ */ b(h, {
 																id: "deliveryStreet",
-																value: U.deliveryAddress.street,
+																value: H.deliveryAddress.street,
 																onChange: (e) => Q("deliveryAddress", "street", e.target.value),
 																placeholder: "456 Oak Ave",
 																"aria-required": "true"
 															})]
 														}),
-														/* @__PURE__ */ C("div", {
+														/* @__PURE__ */ x("div", {
 															className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
-															children: [/* @__PURE__ */ C("div", {
+															children: [/* @__PURE__ */ x("div", {
 																className: "space-y-2",
-																children: [/* @__PURE__ */ S(g, {
+																children: [/* @__PURE__ */ b(g, {
 																	htmlFor: "deliveryCity",
 																	children: "City"
-																}), /* @__PURE__ */ S(h, {
+																}), /* @__PURE__ */ b(h, {
 																	id: "deliveryCity",
-																	value: U.deliveryAddress.city,
+																	value: H.deliveryAddress.city,
 																	onChange: (e) => Q("deliveryAddress", "city", e.target.value),
 																	placeholder: "Los Angeles"
 																})]
-															}), /* @__PURE__ */ C("div", {
+															}), /* @__PURE__ */ x("div", {
 																className: "space-y-2",
-																children: [/* @__PURE__ */ S(g, {
+																children: [/* @__PURE__ */ b(g, {
 																	htmlFor: "deliveryState",
 																	children: "State"
-																}), /* @__PURE__ */ S(h, {
+																}), /* @__PURE__ */ b(h, {
 																	id: "deliveryState",
-																	value: U.deliveryAddress.state,
+																	value: H.deliveryAddress.state,
 																	onChange: (e) => Q("deliveryAddress", "state", e.target.value),
 																	placeholder: "CA"
 																})]
 															})]
 														}),
-														/* @__PURE__ */ C("div", {
+														/* @__PURE__ */ x("div", {
 															className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
-															children: [/* @__PURE__ */ C("div", {
+															children: [/* @__PURE__ */ x("div", {
 																className: "space-y-2",
-																children: [/* @__PURE__ */ S(g, {
+																children: [/* @__PURE__ */ b(g, {
 																	htmlFor: "deliveryPostal",
 																	children: "Postal code"
-																}), /* @__PURE__ */ S(h, {
+																}), /* @__PURE__ */ b(h, {
 																	id: "deliveryPostal",
-																	value: U.deliveryAddress.postalCode,
+																	value: H.deliveryAddress.postalCode,
 																	onChange: (e) => Q("deliveryAddress", "postalCode", e.target.value),
 																	placeholder: "90210"
 																})]
-															}), /* @__PURE__ */ C("div", {
+															}), /* @__PURE__ */ x("div", {
 																className: "space-y-2",
-																children: [/* @__PURE__ */ S(g, {
+																children: [/* @__PURE__ */ b(g, {
 																	htmlFor: "deliveryCountry",
 																	children: "Country"
-																}), /* @__PURE__ */ S(h, {
+																}), /* @__PURE__ */ b(h, {
 																	id: "deliveryCountry",
-																	value: U.deliveryAddress.country,
+																	value: H.deliveryAddress.country,
 																	onChange: (e) => Q("deliveryAddress", "country", e.target.value),
 																	placeholder: "USA"
 																})]
@@ -636,122 +661,149 @@ function E() {
 							]
 						})
 					}),
-					/* @__PURE__ */ S("div", {
+					/* @__PURE__ */ b("div", {
 						id: "items-section",
-						children: /* @__PURE__ */ S(w, {
-							title: /* @__PURE__ */ C("span", {
+						children: /* @__PURE__ */ b(S, {
+							title: /* @__PURE__ */ x("span", {
 								className: "flex items-center gap-2",
 								children: [
-									/* @__PURE__ */ S(i, {
+									/* @__PURE__ */ b(i, {
 										size: 18,
 										"aria-hidden": "true"
 									}),
 									"Shipment contents ",
-									/* @__PURE__ */ S(c, {
+									/* @__PURE__ */ b(c, {
 										variant: "secondary",
-										children: U.items.length
+										children: H.items.length
 									})
 								]
 							}),
 							description: "Add each item being shipped. Use the catalog to prefill details or enter a one-off item manually.",
-							actions: /* @__PURE__ */ C(l, {
+							actions: /* @__PURE__ */ x(l, {
 								type: "button",
 								variant: "outline",
 								size: "sm",
 								onClick: $,
-								children: [/* @__PURE__ */ S(a, { size: 16 }), "Add item"]
+								children: [/* @__PURE__ */ b(a, { size: 16 }), "Add item"]
 							}),
-							children: U.items.length === 0 ? /* @__PURE__ */ S(ge, {
+							children: H.items.length === 0 ? /* @__PURE__ */ b(ge, {
 								illustration: "empty-files",
 								title: "No items added yet",
 								description: "Add the products this order will ship — each with a name, SKU, quantity and value.",
-								action: /* @__PURE__ */ C(l, {
+								action: /* @__PURE__ */ x(l, {
 									type: "button",
 									variant: "outline",
 									onClick: $,
-									children: [/* @__PURE__ */ S(a, {
+									children: [/* @__PURE__ */ b(a, {
 										size: 16,
 										className: "mr-1.5"
 									}), "Add your first item"]
 								})
-							}) : /* @__PURE__ */ C("div", {
+							}) : /* @__PURE__ */ x("div", {
 								className: "space-y-4",
-								children: [/* @__PURE__ */ C("div", {
+								children: [/* @__PURE__ */ x("div", {
 									className: "rounded-card border border-border-subtle bg-bg-sunken/40 p-4",
 									children: [
-										/* @__PURE__ */ S(g, {
+										/* @__PURE__ */ b(g, {
 											htmlFor: "item-product-search",
 											children: "Search product catalog"
 										}),
-										/* @__PURE__ */ S(h, {
+										/* @__PURE__ */ b(h, {
 											id: "item-product-search",
-											value: z,
-											onChange: (e) => Ie(e.target.value),
+											value: R,
+											onChange: (e) => We(e.target.value),
 											placeholder: "Search by name or SKU",
 											className: "mt-2"
 										}),
-										/* @__PURE__ */ S("p", {
+										/* @__PURE__ */ b("p", {
 											className: "mt-2 text-xs text-text-secondary",
 											children: "This filters the catalog picker for every item below. You can still edit any autofilled value or enter item details manually."
 										})
 									]
-								}), /* @__PURE__ */ S("ol", {
+								}), /* @__PURE__ */ b("ol", {
 									className: "space-y-4",
 									"aria-label": "Shipment items",
-									children: U.items.map((e, t) => /* @__PURE__ */ S("li", { children: /* @__PURE__ */ S(y, {
+									children: H.items.map((e, t) => /* @__PURE__ */ b("li", { children: /* @__PURE__ */ b(xe, {
 										item: e,
 										index: t,
-										products: Le,
-										productsLoading: Re,
-										onUpdate: Ge,
-										onRemove: We
+										products: Ge,
+										productsLoading: Ke,
+										productsLoadingMore: qe,
+										productsHasMore: Je,
+										productsTotalCount: Ye,
+										onLoadMoreProducts: Xe,
+										errors: q[e.id],
+										onUpdate: it,
+										onRemove: rt
 									}) }, e.id))
 								})]
 							})
 						})
 					}),
-					/* @__PURE__ */ S(w, {
-						title: /* @__PURE__ */ C("span", {
+					/* @__PURE__ */ b(S, {
+						title: /* @__PURE__ */ x("span", {
 							className: "flex items-center gap-2",
-							children: [/* @__PURE__ */ S(n, {
+							children: [/* @__PURE__ */ b(n, {
 								size: 18,
 								"aria-hidden": "true"
 							}), "Timing & handling"]
 						}),
 						description: "Optional delivery timing and instructions for the carrier.",
-						children: /* @__PURE__ */ C("div", {
+						children: /* @__PURE__ */ x("div", {
 							className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
-							children: [/* @__PURE__ */ C("div", {
-								className: "space-y-2",
-								children: [
-									/* @__PURE__ */ S(g, {
-										htmlFor: "scheduledDelivery",
-										children: "Scheduled delivery"
-									}),
-									/* @__PURE__ */ S(h, {
-										id: "scheduledDelivery",
-										type: "datetime-local",
-										value: U.scheduledDelivery,
-										onChange: (e) => Z("scheduledDelivery", e.target.value)
-									}),
-									/* @__PURE__ */ S("p", {
-										className: "text-xs text-text-secondary",
-										children: "Leave blank to dispatch as soon as a driver is available."
-									})
-								]
-							}), /* @__PURE__ */ C("div", {
-								className: "space-y-2 lg:col-span-2",
-								children: [/* @__PURE__ */ S(g, {
-									htmlFor: "specialInstructions",
-									children: "Special instructions"
-								}), /* @__PURE__ */ S(he, {
-									id: "specialInstructions",
-									value: U.specialInstructions,
-									onChange: (e) => Z("specialInstructions", e.target.value),
-									placeholder: "Any special handling or delivery instructions...",
-									rows: 4
-								})]
-							})]
+							children: [
+								/* @__PURE__ */ x("div", {
+									className: "space-y-2",
+									children: [
+										/* @__PURE__ */ b(g, {
+											htmlFor: "trackingNumber",
+											children: "Tracking / reference number"
+										}),
+										/* @__PURE__ */ b(h, {
+											id: "trackingNumber",
+											value: H.trackingNumber,
+											onChange: (e) => Z("trackingNumber", e.target.value),
+											placeholder: "Optional carrier reference"
+										}),
+										/* @__PURE__ */ b("p", {
+											className: "text-xs text-text-secondary",
+											children: "Use this when a carrier or customer already supplied a tracking reference."
+										})
+									]
+								}),
+								/* @__PURE__ */ x("div", {
+									className: "space-y-2",
+									children: [
+										/* @__PURE__ */ b(g, {
+											htmlFor: "scheduledDelivery",
+											children: "Scheduled delivery"
+										}),
+										/* @__PURE__ */ b(h, {
+											id: "scheduledDelivery",
+											type: "datetime-local",
+											value: H.scheduledDelivery,
+											onChange: (e) => Z("scheduledDelivery", e.target.value)
+										}),
+										/* @__PURE__ */ b("p", {
+											className: "text-xs text-text-secondary",
+											children: "Leave blank to dispatch as soon as a driver is available."
+										})
+									]
+								}),
+								/* @__PURE__ */ x("div", {
+									className: "space-y-2 lg:col-span-1",
+									children: [/* @__PURE__ */ b(g, {
+										htmlFor: "specialInstructions",
+										children: "Special instructions"
+									}), /* @__PURE__ */ b(he, {
+										id: "specialInstructions",
+										value: H.specialInstructions,
+										onChange: (e) => Z("specialInstructions", e.target.value),
+										placeholder: "Any special handling or delivery instructions...",
+										rows: 4
+									})]
+								})
+							]
 						})
 					})
 				]
@@ -760,4 +812,4 @@ function E() {
 	});
 }
 //#endregion
-export { E as default };
+export { w as default };