@burdenoff/microfe-movethewheels 2026.920.3 → 2026.923.1

package/dist/pages/ProductDetailsPage.js

@@ -1,135 +1,137 @@
 import { ArrowLeft as e } from "../node_modules/lucide-react/dist/esm/icons/arrow-left.js";
 import { Box as t } from "../node_modules/lucide-react/dist/esm/icons/box.js";
-import { DollarSign as n } from "../node_modules/lucide-react/dist/esm/icons/dollar-sign.js";
-import { Package as r } from "../node_modules/lucide-react/dist/esm/icons/package.js";
-import { Save as i } from "../node_modules/lucide-react/dist/esm/icons/save.js";
-import { SquarePen as a } from "../node_modules/lucide-react/dist/esm/icons/square-pen.js";
-import { Tag as o } from "../node_modules/lucide-react/dist/esm/icons/tag.js";
-import { Warehouse as s } from "../node_modules/lucide-react/dist/esm/icons/warehouse.js";
-import { joinPath as c } from "../utils/navigation.js";
-import { useMoveTheWheels as l } from "../providers/MoveTheWheelsProvider.js";
-import { useInventory as u, useProduct as d, useProductStockLevels as f } from "../hooks/useInventory.js";
-import { Badge as p, Button as m, Card as h, CardContent as g, CardHeader as _, CardTitle as v, Input as y, Label as b } from "../components/ui.js";
-import { ErrorState as x, LoadingState as S, PageLayout as C } from "../components/PageLayout.js";
-import { FormError as w } from "../components/FormError.js";
-import { formatCurrency as T } from "../utils/formatters.js";
-import { useEffect as E, useState as D } from "react";
-import { useLocation as O, useParams as k } from "react-router";
-import { Fragment as A, jsx as j, jsxs as M } from "react/jsx-runtime";
-import { EmphasisPanel as N, NextSteps as P, PagePurpose as F } from "@burdenoff/fe-libs/ui";
+import { ChevronLeft as n } from "../node_modules/lucide-react/dist/esm/icons/chevron-left.js";
+import { ChevronRight as r } from "../node_modules/lucide-react/dist/esm/icons/chevron-right.js";
+import { DollarSign as i } from "../node_modules/lucide-react/dist/esm/icons/dollar-sign.js";
+import { Package as a } from "../node_modules/lucide-react/dist/esm/icons/package.js";
+import { Save as o } from "../node_modules/lucide-react/dist/esm/icons/save.js";
+import { SquarePen as s } from "../node_modules/lucide-react/dist/esm/icons/square-pen.js";
+import { Tag as c } from "../node_modules/lucide-react/dist/esm/icons/tag.js";
+import { Warehouse as l } from "../node_modules/lucide-react/dist/esm/icons/warehouse.js";
+import { joinPath as u } from "../utils/navigation.js";
+import { useMoveTheWheels as d } from "../providers/MoveTheWheelsProvider.js";
+import { useInventory as f, useProduct as p, useProductStockLevels as m } from "../hooks/useInventory.js";
+import { Badge as h, Button as g, Card as _, CardContent as v, CardHeader as y, CardTitle as b, Input as x, Label as S } from "../components/ui.js";
+import { ErrorState as C, LoadingState as w, PageLayout as T } from "../components/PageLayout.js";
+import { FormError as E } from "../components/FormError.js";
+import { formatCurrency as D } from "../utils/formatters.js";
+import { useEffect as O, useState as k } from "react";
+import { useLocation as A, useParams as j } from "react-router";
+import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";
+import { EmphasisPanel as F, NextSteps as I, PagePurpose as L } from "@burdenoff/fe-libs/ui";
 //#region src/movethewheels/pages/ProductDetailsPage.tsx
-function I({ editId: t }) {
-	let { basePath: n, navigate: a } = l(), { createProduct: o, updateProduct: s } = u(), { product: f } = d(t), p = !!t, [h, g] = D({
+function R({ editId: t }) {
+	let { basePath: n, navigate: r } = d(), { createProduct: i, updateProduct: s } = f(), { product: c } = p(t), l = !!t, [m, h] = k({
 		name: "",
 		sku: "",
 		category: "",
 		brand: "",
 		weight: ""
-	}), [_, v] = D(!1), [x, S] = D(null);
-	E(() => {
-		t && f && g({
-			name: f.name ?? "",
-			sku: f.sku ?? "",
-			category: f.category ?? "",
-			brand: f.brand ?? "",
-			weight: f.weight == null ? "" : String(f.weight)
+	}), [_, v] = k(!1), [y, b] = k(null);
+	O(() => {
+		t && c && h({
+			name: c.name ?? "",
+			sku: c.sku ?? "",
+			category: c.category ?? "",
+			brand: c.brand ?? "",
+			weight: c.weight == null ? "" : String(c.weight)
 		});
-	}, [t, f]);
-	let T = () => a?.(c(n, "inventory/products")), O = async (e) => {
-		if (e.preventDefault(), !h.name.trim() || !h.sku.trim()) {
-			S("Product name and SKU are required.");
+	}, [t, c]);
+	let C = () => r?.(u(n, "inventory/products")), w = async (e) => {
+		if (e.preventDefault(), !m.name.trim() || !m.sku.trim()) {
+			b("Product name and SKU are required.");
 			return;
 		}
-		v(!0), S(null);
+		v(!0), b(null);
 		try {
-			let e = h.weight.trim() ? Number(h.weight) : void 0;
-			if (p && t) {
-				let r = await s(t, {
-					name: h.name.trim(),
-					sku: h.sku.trim(),
-					category: h.category.trim() || void 0,
-					brand: h.brand.trim() || void 0,
+			let e = m.weight.trim() ? Number(m.weight) : void 0;
+			if (l && t) {
+				let i = await s(t, {
+					name: m.name.trim(),
+					sku: m.sku.trim(),
+					category: m.category.trim() || void 0,
+					brand: m.brand.trim() || void 0,
 					weight: e !== void 0 && !Number.isNaN(e) ? e : void 0
 				});
-				a?.(c(n, `inventory/products/${r.id}`));
+				r?.(u(n, `inventory/products/${i.id}`));
 			} else {
-				let t = await o({
-					name: h.name.trim(),
-					sku: h.sku.trim(),
-					category: h.category.trim() || void 0,
-					brand: h.brand.trim() || void 0,
+				let t = await i({
+					name: m.name.trim(),
+					sku: m.sku.trim(),
+					category: m.category.trim() || void 0,
+					brand: m.brand.trim() || void 0,
 					weight: e !== void 0 && !Number.isNaN(e) ? e : void 0
 				});
-				a?.(c(n, `inventory/products/${t.id}`));
+				r?.(u(n, `inventory/products/${t.id}`));
 			}
 		} catch (e) {
-			console.error("Failed to create product:", e), S(e instanceof Error ? e.message : "Failed to create product. Please try again."), v(!1);
+			console.error("Failed to create product:", e), b(e instanceof Error ? e.message : "Failed to create product. Please try again."), v(!1);
 		}
 	};
-	return /* @__PURE__ */ M(C, {
-		title: p ? "Edit Product" : "Add Product",
+	return /* @__PURE__ */ P(T, {
+		title: l ? "Edit Product" : "Add Product",
 		subtitle: "Add an item to your catalog",
-		icon: /* @__PURE__ */ j(r, { size: 24 }),
-		headerActions: /* @__PURE__ */ M("div", {
+		icon: /* @__PURE__ */ N(a, { size: 24 }),
+		headerActions: /* @__PURE__ */ P("div", {
 			className: "flex gap-2",
-			children: [/* @__PURE__ */ M(m, {
+			children: [/* @__PURE__ */ P(g, {
 				variant: "outline",
-				onClick: T,
+				onClick: C,
 				disabled: _,
-				children: [/* @__PURE__ */ j(e, { size: 16 }), " Cancel"]
-			}), /* @__PURE__ */ M(m, {
-				onClick: O,
+				children: [/* @__PURE__ */ N(e, { size: 16 }), " Cancel"]
+			}), /* @__PURE__ */ P(g, {
+				onClick: w,
 				disabled: _,
 				children: [
-					/* @__PURE__ */ j(i, { size: 16 }),
+					/* @__PURE__ */ N(o, { size: 16 }),
 					" ",
-					p ? _ ? "Saving..." : "Save Changes" : _ ? "Saving..." : "Add Product"
+					l ? _ ? "Saving..." : "Save Changes" : _ ? "Saving..." : "Add Product"
 				]
 			})]
 		}),
-		children: [/* @__PURE__ */ j(F, {
-			icon: /* @__PURE__ */ j(r, { size: 18 }),
+		children: [/* @__PURE__ */ N(L, {
+			icon: /* @__PURE__ */ N(a, { size: 18 }),
 			children: "Add a product so it can be added to orders and stocked in warehouses. A name and SKU are all it takes to start — category, brand and weight help with picking, pricing and routing."
-		}), /* @__PURE__ */ M("form", {
-			onSubmit: O,
+		}), /* @__PURE__ */ P("form", {
+			onSubmit: w,
 			className: "max-w-2xl space-y-6",
-			children: [/* @__PURE__ */ j(w, { message: x }), /* @__PURE__ */ M(N, { children: [/* @__PURE__ */ j("h2", {
+			children: [/* @__PURE__ */ N(E, { message: y }), /* @__PURE__ */ P(F, { children: [/* @__PURE__ */ N("h2", {
 				className: "text-base font-semibold text-text-primary mb-4",
 				children: "Product Details"
-			}), /* @__PURE__ */ M("div", {
+			}), /* @__PURE__ */ P("div", {
 				className: "space-y-4",
-				children: [/* @__PURE__ */ M("div", {
+				children: [/* @__PURE__ */ P("div", {
 					className: "grid grid-cols-1 md:grid-cols-2 gap-4",
-					children: [/* @__PURE__ */ M("div", {
+					children: [/* @__PURE__ */ P("div", {
 						className: "space-y-2",
-						children: [/* @__PURE__ */ M(b, {
+						children: [/* @__PURE__ */ P(S, {
 							htmlFor: "name",
-							children: ["Name ", /* @__PURE__ */ j("span", {
+							children: ["Name ", /* @__PURE__ */ N("span", {
 								className: "text-status-error-text",
 								children: "*"
 							})]
-						}), /* @__PURE__ */ j(y, {
+						}), /* @__PURE__ */ N(x, {
 							id: "name",
-							value: h.name,
-							onChange: (e) => g((t) => ({
+							value: m.name,
+							onChange: (e) => h((t) => ({
 								...t,
 								name: e.target.value
 							})),
 							placeholder: "Wireless Headphones",
 							required: !0
 						})]
-					}), /* @__PURE__ */ M("div", {
+					}), /* @__PURE__ */ P("div", {
 						className: "space-y-2",
-						children: [/* @__PURE__ */ M(b, {
+						children: [/* @__PURE__ */ P(S, {
 							htmlFor: "sku",
-							children: ["SKU ", /* @__PURE__ */ j("span", {
+							children: ["SKU ", /* @__PURE__ */ N("span", {
 								className: "text-status-error-text",
 								children: "*"
 							})]
-						}), /* @__PURE__ */ j(y, {
+						}), /* @__PURE__ */ N(x, {
 							id: "sku",
-							value: h.sku,
-							onChange: (e) => g((t) => ({
+							value: m.sku,
+							onChange: (e) => h((t) => ({
 								...t,
 								sku: e.target.value
 							})),
@@ -137,51 +139,51 @@ function I({ editId: t }) {
 							required: !0
 						})]
 					})]
-				}), /* @__PURE__ */ M("div", {
+				}), /* @__PURE__ */ P("div", {
 					className: "grid grid-cols-1 md:grid-cols-3 gap-4",
 					children: [
-						/* @__PURE__ */ M("div", {
+						/* @__PURE__ */ P("div", {
 							className: "space-y-2",
-							children: [/* @__PURE__ */ j(b, {
+							children: [/* @__PURE__ */ N(S, {
 								htmlFor: "category",
 								children: "Category"
-							}), /* @__PURE__ */ j(y, {
+							}), /* @__PURE__ */ N(x, {
 								id: "category",
-								value: h.category,
-								onChange: (e) => g((t) => ({
+								value: m.category,
+								onChange: (e) => h((t) => ({
 									...t,
 									category: e.target.value
 								})),
 								placeholder: "Electronics"
 							})]
 						}),
-						/* @__PURE__ */ M("div", {
+						/* @__PURE__ */ P("div", {
 							className: "space-y-2",
-							children: [/* @__PURE__ */ j(b, {
+							children: [/* @__PURE__ */ N(S, {
 								htmlFor: "brand",
 								children: "Brand"
-							}), /* @__PURE__ */ j(y, {
+							}), /* @__PURE__ */ N(x, {
 								id: "brand",
-								value: h.brand,
-								onChange: (e) => g((t) => ({
+								value: m.brand,
+								onChange: (e) => h((t) => ({
 									...t,
 									brand: e.target.value
 								})),
 								placeholder: "Acme"
 							})]
 						}),
-						/* @__PURE__ */ M("div", {
+						/* @__PURE__ */ P("div", {
 							className: "space-y-2",
-							children: [/* @__PURE__ */ j(b, {
+							children: [/* @__PURE__ */ N(S, {
 								htmlFor: "weight",
 								children: "Weight (kg)"
-							}), /* @__PURE__ */ j(y, {
+							}), /* @__PURE__ */ N(x, {
 								id: "weight",
 								type: "number",
 								min: "0",
 								step: "0.01",
-								value: h.weight,
-								onChange: (e) => g((t) => ({
+								value: m.weight,
+								onChange: (e) => h((t) => ({
 									...t,
 									weight: e.target.value
 								})),
@@ -194,230 +196,269 @@ function I({ editId: t }) {
 		})]
 	});
 }
-function L() {
-	let { productId: i } = k(), { basePath: u, navigate: y } = l(), { product: b, isLoading: w, error: E, refetch: D } = d(i), L = O().pathname.endsWith("/edit"), { levels: R, isLoading: z, error: B } = f(L ? void 0 : i), V = R.reduce((e, t) => e + t.available, 0), H = () => y?.(c(u, "inventory/products")), U = (e) => y?.(c(u, e));
-	return i ? L ? /* @__PURE__ */ j(I, { editId: i }) : w ? /* @__PURE__ */ j(S, { message: "Loading product details..." }) : E || !b ? /* @__PURE__ */ j(x, {
+function z() {
+	let { productId: o } = j(), { basePath: f, navigate: x } = d(), { product: S, isLoading: E, error: z, refetch: B } = p(o), V = A().pathname.endsWith("/edit"), [H, U] = k(0), { levels: W, totalLevels: G, totalAvailable: K, hasMore: q, isLoading: J, error: Y } = m(V ? void 0 : o, {
+		limit: 20,
+		offset: H * 20
+	});
+	O(() => {
+		U(0);
+	}, [o]);
+	let X = () => x?.(u(f, "inventory/products")), Z = (e) => x?.(u(f, e));
+	return o ? V ? /* @__PURE__ */ N(R, { editId: o }) : E ? /* @__PURE__ */ N(w, { message: "Loading product details..." }) : z || !S ? /* @__PURE__ */ N(C, {
 		title: "Product not found",
-		onRetry: D
-	}) : /* @__PURE__ */ M(C, {
-		title: b.name,
-		subtitle: `SKU: ${b.sku}`,
-		icon: /* @__PURE__ */ j(r, { size: 24 }),
-		headerActions: /* @__PURE__ */ M("div", {
+		onRetry: B
+	}) : /* @__PURE__ */ P(T, {
+		title: S.name,
+		subtitle: `SKU: ${S.sku}`,
+		icon: /* @__PURE__ */ N(a, { size: 24 }),
+		headerActions: /* @__PURE__ */ P("div", {
 			className: "flex gap-2",
-			children: [/* @__PURE__ */ M(m, {
+			children: [/* @__PURE__ */ P(g, {
 				variant: "outline",
-				onClick: H,
-				children: [/* @__PURE__ */ j(e, { size: 16 }), " Back"]
-			}), /* @__PURE__ */ M(m, {
-				onClick: () => y?.(c(u, `inventory/products/${i}/edit`)),
-				children: [/* @__PURE__ */ j(a, { size: 16 }), " Edit"]
+				onClick: X,
+				children: [/* @__PURE__ */ N(e, { size: 16 }), " Back"]
+			}), /* @__PURE__ */ P(g, {
+				onClick: () => x?.(u(f, `inventory/products/${o}/edit`)),
+				children: [/* @__PURE__ */ N(s, { size: 16 }), " Edit"]
 			})]
 		}),
-		headerContent: /* @__PURE__ */ M("div", {
+		headerContent: /* @__PURE__ */ P("div", {
 			className: "flex gap-2",
 			children: [
-				/* @__PURE__ */ j(p, {
+				/* @__PURE__ */ N(h, {
 					variant: "outline",
-					children: b.category
+					children: S.category
 				}),
-				b.brand && /* @__PURE__ */ j(p, {
+				S.brand && /* @__PURE__ */ N(h, {
 					variant: "secondary",
-					children: b.brand
+					children: S.brand
 				}),
-				b.fragile && /* @__PURE__ */ j(p, {
+				S.fragile && /* @__PURE__ */ N(h, {
 					variant: "destructive",
 					children: "Fragile"
 				}),
-				b.hazardous && /* @__PURE__ */ j(p, {
+				S.hazardous && /* @__PURE__ */ N(h, {
 					variant: "destructive",
 					children: "Hazardous"
 				}),
-				b.temperatureControlled && /* @__PURE__ */ j(p, {
+				S.temperatureControlled && /* @__PURE__ */ N(h, {
 					variant: "secondary",
 					children: "Temp Controlled"
 				})
 			]
 		}),
 		children: [
-			/* @__PURE__ */ j(F, {
-				icon: /* @__PURE__ */ j(r, { size: 18 }),
+			/* @__PURE__ */ N(L, {
+				icon: /* @__PURE__ */ N(a, { size: 18 }),
 				children: "The catalog record for this item — its dimensions, weight, value and handling flags. These drive how it's packed, priced and routed, so keep them accurate before adding the product to an order or stocking it in a warehouse."
 			}),
-			/* @__PURE__ */ j(P, {
+			/* @__PURE__ */ N(I, {
 				storageKey: "movethewheels-product-details",
 				steps: [{
 					id: "order",
 					label: "Add this product to an order",
 					description: "Include it on a new delivery.",
-					icon: /* @__PURE__ */ j(r, { size: 16 }),
-					onClick: () => U("orders/new")
+					icon: /* @__PURE__ */ N(a, { size: 16 }),
+					onClick: () => Z("orders/new")
 				}, {
 					id: "edit",
 					label: "Edit product details",
 					description: "Update dimensions, value or handling flags.",
-					icon: /* @__PURE__ */ j(o, { size: 16 }),
-					onClick: () => U(`inventory/products/${i}/edit`)
+					icon: /* @__PURE__ */ N(c, { size: 16 }),
+					onClick: () => Z(`inventory/products/${o}/edit`)
 				}]
 			}),
-			/* @__PURE__ */ M("div", {
+			/* @__PURE__ */ P("div", {
 				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
-				children: [/* @__PURE__ */ M("div", {
+				children: [/* @__PURE__ */ P("div", {
 					className: "lg:col-span-2 space-y-6",
 					children: [
-						/* @__PURE__ */ M(h, { children: [/* @__PURE__ */ j(_, { children: /* @__PURE__ */ j(v, { children: "Description" }) }), /* @__PURE__ */ j(g, { children: /* @__PURE__ */ j("p", { children: b.description }) })] }),
-						/* @__PURE__ */ M(h, { children: [/* @__PURE__ */ j(_, { children: /* @__PURE__ */ M(v, {
+						/* @__PURE__ */ P(_, { children: [/* @__PURE__ */ N(y, { children: /* @__PURE__ */ N(b, { children: "Description" }) }), /* @__PURE__ */ N(v, { children: /* @__PURE__ */ N("p", { children: S.description }) })] }),
+						/* @__PURE__ */ P(_, { children: [/* @__PURE__ */ N(y, { children: /* @__PURE__ */ P(b, {
 							className: "flex items-center gap-2",
-							children: [/* @__PURE__ */ j(t, { size: 18 }), " Dimensions & Weight"]
-						}) }), /* @__PURE__ */ j(g, { children: /* @__PURE__ */ M("div", {
+							children: [/* @__PURE__ */ N(t, { size: 18 }), " Dimensions & Weight"]
+						}) }), /* @__PURE__ */ N(v, { children: /* @__PURE__ */ P("div", {
 							className: "grid grid-cols-2 md:grid-cols-4 gap-4",
 							children: [
-								/* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("p", {
+								/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
 									className: "text-sm text-text-secondary",
 									children: "Length"
-								}), /* @__PURE__ */ M("p", {
+								}), /* @__PURE__ */ P("p", {
 									className: "text-2xl font-bold",
-									children: [b.dimensions.length, /* @__PURE__ */ M("span", {
+									children: [S.dimensions.length, /* @__PURE__ */ P("span", {
 										className: "text-sm font-normal",
-										children: [" ", b.dimensions.unit]
+										children: [" ", S.dimensions.unit]
 									})]
 								})] }),
-								/* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("p", {
+								/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
 									className: "text-sm text-text-secondary",
 									children: "Width"
-								}), /* @__PURE__ */ M("p", {
+								}), /* @__PURE__ */ P("p", {
 									className: "text-2xl font-bold",
-									children: [b.dimensions.width, /* @__PURE__ */ M("span", {
+									children: [S.dimensions.width, /* @__PURE__ */ P("span", {
 										className: "text-sm font-normal",
-										children: [" ", b.dimensions.unit]
+										children: [" ", S.dimensions.unit]
 									})]
 								})] }),
-								/* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("p", {
+								/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
 									className: "text-sm text-text-secondary",
 									children: "Height"
-								}), /* @__PURE__ */ M("p", {
+								}), /* @__PURE__ */ P("p", {
 									className: "text-2xl font-bold",
-									children: [b.dimensions.height, /* @__PURE__ */ M("span", {
+									children: [S.dimensions.height, /* @__PURE__ */ P("span", {
 										className: "text-sm font-normal",
-										children: [" ", b.dimensions.unit]
+										children: [" ", S.dimensions.unit]
 									})]
 								})] }),
-								/* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("p", {
+								/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
 									className: "text-sm text-text-secondary",
 									children: "Weight"
-								}), /* @__PURE__ */ M("p", {
+								}), /* @__PURE__ */ P("p", {
 									className: "text-2xl font-bold",
-									children: [b.weight, /* @__PURE__ */ j("span", {
+									children: [S.weight, /* @__PURE__ */ N("span", {
 										className: "text-sm font-normal",
 										children: " kg"
 									})]
 								})] })
 							]
 						}) })] }),
-						b.attributes.length > 0 && /* @__PURE__ */ M(h, { children: [/* @__PURE__ */ j(_, { children: /* @__PURE__ */ M(v, {
+						S.attributes.length > 0 && /* @__PURE__ */ P(_, { children: [/* @__PURE__ */ N(y, { children: /* @__PURE__ */ P(b, {
 							className: "flex items-center gap-2",
-							children: [/* @__PURE__ */ j(o, { size: 18 }), " Attributes"]
-						}) }), /* @__PURE__ */ j(g, { children: /* @__PURE__ */ j("div", {
+							children: [/* @__PURE__ */ N(c, { size: 18 }), " Attributes"]
+						}) }), /* @__PURE__ */ N(v, { children: /* @__PURE__ */ N("div", {
 							className: "grid grid-cols-2 md:grid-cols-3 gap-4",
-							children: b.attributes.map((e, t) => /* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("p", {
+							children: S.attributes.map((e, t) => /* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
 								className: "text-sm text-text-secondary",
 								children: e.name
-							}), /* @__PURE__ */ j("p", {
+							}), /* @__PURE__ */ N("p", {
 								className: "font-medium",
 								children: e.value
 							})] }, t))
 						}) })] })
 					]
-				}), /* @__PURE__ */ M("div", {
+				}), /* @__PURE__ */ P("div", {
 					className: "space-y-6",
 					children: [
-						/* @__PURE__ */ M(N, { children: [
-							/* @__PURE__ */ M("h2", {
+						/* @__PURE__ */ P(F, { children: [
+							/* @__PURE__ */ P("h2", {
 								className: "flex items-center gap-2 text-base font-semibold text-text-primary mb-3",
-								children: [/* @__PURE__ */ j(n, { size: 18 }), " Pricing"]
+								children: [/* @__PURE__ */ N(i, { size: 18 }), " Pricing"]
 							}),
-							/* @__PURE__ */ j("p", {
+							/* @__PURE__ */ N("p", {
 								className: "text-3xl font-bold",
-								children: T(b.value)
+								children: D(S.value)
 							}),
-							/* @__PURE__ */ j("p", {
+							/* @__PURE__ */ N("p", {
 								className: "text-sm text-text-secondary",
 								children: "Unit price"
 							})
 						] }),
-						/* @__PURE__ */ M(h, { children: [/* @__PURE__ */ j(_, { children: /* @__PURE__ */ M(v, {
+						/* @__PURE__ */ P(_, { children: [/* @__PURE__ */ N(y, { children: /* @__PURE__ */ P(b, {
 							className: "flex items-center gap-2",
-							children: [/* @__PURE__ */ j(s, { size: 18 }), " Stock Levels"]
-						}) }), /* @__PURE__ */ j(g, {
+							children: [/* @__PURE__ */ N(l, { size: 18 }), " Stock Levels"]
+						}) }), /* @__PURE__ */ N(v, {
 							className: "space-y-3",
-							children: B ? /* @__PURE__ */ j("p", {
+							children: Y ? /* @__PURE__ */ N("p", {
 								className: "text-sm text-status-error-text",
-								children: B.message
-							}) : z ? /* @__PURE__ */ j("p", {
+								children: Y.message
+							}) : J ? /* @__PURE__ */ N("p", {
 								className: "text-sm text-text-secondary",
 								children: "Loading stock levels…"
-							}) : R.length === 0 ? /* @__PURE__ */ M("div", {
+							}) : W.length === 0 ? /* @__PURE__ */ P("div", {
 								className: "space-y-3",
-								children: [/* @__PURE__ */ j("p", {
+								children: [/* @__PURE__ */ N("p", {
 									className: "text-sm text-text-secondary",
 									children: "This item isn't stocked in any warehouse yet, so nothing can be promised on an order."
-								}), /* @__PURE__ */ j(m, {
+								}), /* @__PURE__ */ N(g, {
 									variant: "outline",
 									size: "sm",
-									onClick: () => U("inventory/warehouses"),
+									onClick: () => Z("inventory/warehouses"),
 									children: "View warehouses"
 								})]
-							}) : /* @__PURE__ */ M(A, { children: [R.map((e) => /* @__PURE__ */ M("div", {
-								className: "flex items-baseline justify-between gap-3",
-								children: [/* @__PURE__ */ M("div", {
-									className: "min-w-0",
-									children: [/* @__PURE__ */ j("p", {
-										className: "truncate text-sm font-medium",
-										children: e.warehouseName
-									}), /* @__PURE__ */ M("p", {
+							}) : /* @__PURE__ */ P(M, { children: [
+								W.map((e) => /* @__PURE__ */ P("div", {
+									className: "flex items-baseline justify-between gap-3",
+									children: [/* @__PURE__ */ P("div", {
+										className: "min-w-0",
+										children: [/* @__PURE__ */ N("p", {
+											className: "truncate text-sm font-medium",
+											children: e.warehouseName
+										}), /* @__PURE__ */ P("p", {
+											className: "text-xs text-text-secondary",
+											children: [
+												e.allocated.toLocaleString(),
+												" allocated",
+												e.reorderPoint === void 0 ? "" : ` · reorder at ${e.reorderPoint.toLocaleString()}`
+											]
+										})]
+									}), /* @__PURE__ */ N("span", {
+										className: e.reorderPoint !== void 0 && e.available <= e.reorderPoint ? "font-semibold text-status-warning-text" : "font-semibold",
+										children: e.available.toLocaleString()
+									})]
+								}, e.inventoryItemId)),
+								H > 0 || q ? /* @__PURE__ */ P("div", {
+									className: "flex items-center justify-between gap-2 border-t border-border-seam pt-3",
+									children: [/* @__PURE__ */ P("span", {
 										className: "text-xs text-text-secondary",
 										children: [
-											e.allocated.toLocaleString(),
-											" allocated",
-											e.reorderPoint === void 0 ? "" : ` · reorder at ${e.reorderPoint.toLocaleString()}`
+											H * 20 + 1,
+											"–",
+											Math.min(H * 20 + W.length, G),
+											" ",
+											"of ",
+											G
 										]
+									}), /* @__PURE__ */ P("div", {
+										className: "flex gap-2",
+										children: [/* @__PURE__ */ P(g, {
+											variant: "outline",
+											size: "sm",
+											disabled: H === 0 || J,
+											onClick: () => U((e) => Math.max(0, e - 1)),
+											children: [/* @__PURE__ */ N(n, { size: 14 }), " Previous"]
+										}), /* @__PURE__ */ P(g, {
+											variant: "outline",
+											size: "sm",
+											disabled: !q || J,
+											onClick: () => U((e) => e + 1),
+											children: ["Next ", /* @__PURE__ */ N(r, { size: 14 })]
+										})]
 									})]
-								}), /* @__PURE__ */ j("span", {
-									className: e.reorderPoint !== void 0 && e.available <= e.reorderPoint ? "font-semibold text-status-warning-text" : "font-semibold",
-									children: e.available.toLocaleString()
-								})]
-							}, e.inventoryItemId)), /* @__PURE__ */ M("div", {
-								className: "flex items-baseline justify-between gap-3 border-t border-border-seam pt-3",
-								children: [/* @__PURE__ */ j("p", {
-									className: "text-sm text-text-secondary",
-									children: "Available across the network"
-								}), /* @__PURE__ */ j("span", {
-									className: "font-bold",
-									children: V.toLocaleString()
-								})]
-							})] })
+								}) : null,
+								/* @__PURE__ */ P("div", {
+									className: "flex items-baseline justify-between gap-3 border-t border-border-seam pt-3",
+									children: [/* @__PURE__ */ N("p", {
+										className: "text-sm text-text-secondary",
+										children: "Available across the network"
+									}), /* @__PURE__ */ N("span", {
+										className: "font-bold",
+										children: K.toLocaleString()
+									})]
+								})
+							] })
 						})] }),
-						/* @__PURE__ */ M(h, { children: [/* @__PURE__ */ j(_, { children: /* @__PURE__ */ j(v, { children: "Identifiers" }) }), /* @__PURE__ */ M(g, {
+						/* @__PURE__ */ P(_, { children: [/* @__PURE__ */ N(y, { children: /* @__PURE__ */ N(b, { children: "Identifiers" }) }), /* @__PURE__ */ P(v, {
 							className: "space-y-3",
-							children: [/* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("p", {
+							children: [/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
 								className: "text-sm text-text-secondary",
 								children: "SKU"
-							}), /* @__PURE__ */ j("p", {
+							}), /* @__PURE__ */ N("p", {
 								className: "font-mono",
-								children: b.sku
-							})] }), b.barcode && /* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("p", {
+								children: S.sku
+							})] }), S.barcode && /* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
 								className: "text-sm text-text-secondary",
 								children: "Barcode"
-							}), /* @__PURE__ */ j("p", {
+							}), /* @__PURE__ */ N("p", {
 								className: "font-mono",
-								children: b.barcode
+								children: S.barcode
 							})] })]
 						})] })
 					]
 				})]
 			})
 		]
-	}) : /* @__PURE__ */ j(I, {});
+	}) : /* @__PURE__ */ N(R, {});
 }
 //#endregion
-export { L as default };
+export { z as default };