@burdenoff/microfe-movethewheels 2026.929.3 → 2026.929.4

package/dist/pages/ProductDetailsPage.js

@@ -7,384 +7,493 @@ import { Package as a } from "../node_modules/lucide-react/dist/esm/icons/packag
 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";
+import { Trash2 as l } from "../node_modules/lucide-react/dist/esm/icons/trash-2.js";
+import { Warehouse as u } from "../node_modules/lucide-react/dist/esm/icons/warehouse.js";
+import { joinPath as d } from "../utils/navigation.js";
+import { useMoveTheWheels as f } from "../providers/MoveTheWheelsProvider.js";
+import { useInventory as p, useProduct as m, useProductStockLevels as h } from "../hooks/useInventory.js";
+import { Badge as g, Button as _, Card as v, CardContent as y, CardHeader as b, CardTitle as x, Checkbox as S, Input as C, Label as w, Textarea as T } from "../components/ui.js";
+import { ErrorState as E, LoadingState as ee, PageLayout as D } from "../components/PageLayout.js";
+import { FormError as O } from "../components/FormError.js";
+import { formatCurrency as te } from "../utils/formatters.js";
+import { useEffect as k, useState as A } from "react";
+import { useLocation as j, useParams as ne } from "react-router";
+import { Fragment as re, jsx as M, jsxs as N } from "react/jsx-runtime";
+import { EmphasisPanel as P, NextSteps as ie, PagePurpose as F, ResponsiveDialog as I, ResponsiveDialogContent as ae, ResponsiveDialogDescription as oe, ResponsiveDialogFooter as se, ResponsiveDialogHeader as ce, ResponsiveDialogTitle as le } from "@burdenoff/fe-libs/ui";
 //#region src/movethewheels/pages/ProductDetailsPage.tsx
-function R({ editId: t }) {
-	let { basePath: n, navigate: r } = d(), { createProduct: i, updateProduct: s } = f(), { product: c } = p(t), l = !!t, [m, h] = k({
+function L({ editId: t }) {
+	let { basePath: n, navigate: r } = f(), { createProduct: i, updateProduct: s } = p(), { product: c } = m(t), l = !!t, [u, h] = A({
 		name: "",
 		sku: "",
+		description: "",
 		category: "",
 		brand: "",
-		weight: ""
-	}), [_, v] = k(!1), [y, b] = k(null);
-	O(() => {
+		length: "",
+		width: "",
+		height: "",
+		dimensionUnit: "",
+		weight: "",
+		value: "",
+		hazardous: !1,
+		fragile: !1,
+		temperatureControlled: !1
+	}), [g, v] = A(!1), [y, b] = A(null);
+	k(() => {
 		t && c && h({
 			name: c.name ?? "",
 			sku: c.sku ?? "",
+			description: c.description ?? "",
 			category: c.category ?? "",
 			brand: c.brand ?? "",
-			weight: c.weight == null ? "" : String(c.weight)
+			length: c.dimensions?.length === void 0 ? "" : String(c.dimensions.length),
+			width: c.dimensions?.width === void 0 ? "" : String(c.dimensions.width),
+			height: c.dimensions?.height === void 0 ? "" : String(c.dimensions.height),
+			dimensionUnit: c.dimensions?.unit ?? "",
+			weight: c.weight === void 0 ? "" : String(c.weight),
+			value: c.value === void 0 ? "" : String(c.value),
+			hazardous: c.hazardous,
+			fragile: c.fragile,
+			temperatureControlled: c.temperatureControlled
 		});
 	}, [t, c]);
-	let C = () => r?.(u(n, "inventory/products")), w = async (e) => {
-		if (e.preventDefault(), !m.name.trim() || !m.sku.trim()) {
+	let x = () => r?.(d(n, "inventory/products")), E = async (e) => {
+		if (e.preventDefault(), !u.name.trim() || !u.sku.trim()) {
 			b("Product name and SKU are required.");
 			return;
 		}
 		v(!0), b(null);
 		try {
-			let e = m.weight.trim() ? Number(m.weight) : void 0;
+			let e = (e) => {
+				if (!e.trim()) return;
+				let t = Number(e);
+				return Number.isFinite(t) ? t : void 0;
+			}, a = u.length.trim() || u.width.trim() || u.height.trim() || u.dimensionUnit.trim() ? {
+				...e(u.length) === void 0 ? {} : { length: e(u.length) },
+				...e(u.width) === void 0 ? {} : { width: e(u.width) },
+				...e(u.height) === void 0 ? {} : { height: e(u.height) },
+				...u.dimensionUnit.trim() ? { unit: u.dimensionUnit.trim() } : {}
+			} : void 0, o = {
+				name: u.name.trim(),
+				sku: u.sku.trim(),
+				description: u.description.trim() || (l ? null : void 0),
+				category: u.category.trim() || (l ? null : void 0),
+				brand: u.brand.trim() || (l ? null : void 0),
+				dimensions: a ?? (l ? null : void 0),
+				weight: e(u.weight) ?? (l ? null : void 0),
+				value: e(u.value) ?? (l ? null : void 0),
+				hazardous: u.hazardous,
+				fragile: u.fragile,
+				temperatureControlled: u.temperatureControlled
+			};
 			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
-				});
-				r?.(u(n, `inventory/products/${i.id}`));
+				let e = await s(t, o);
+				r?.(d(n, `inventory/products/${e.id}`));
 			} else {
-				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
-				});
-				r?.(u(n, `inventory/products/${t.id}`));
+				let e = await i(o);
+				r?.(d(n, `inventory/products/${e.id}`));
 			}
 		} catch (e) {
 			console.error("Failed to create product:", e), b(e instanceof Error ? e.message : "Failed to create product. Please try again."), v(!1);
 		}
 	};
-	return /* @__PURE__ */ P(T, {
+	return /* @__PURE__ */ N(D, {
 		title: l ? "Edit Product" : "Add Product",
 		subtitle: "Add an item to your catalog",
-		icon: /* @__PURE__ */ N(a, { size: 24 }),
-		headerActions: /* @__PURE__ */ P("div", {
+		icon: /* @__PURE__ */ M(a, { size: 24 }),
+		headerActions: /* @__PURE__ */ N("div", {
 			className: "flex gap-2",
-			children: [/* @__PURE__ */ P(g, {
+			children: [/* @__PURE__ */ N(_, {
 				variant: "outline",
-				onClick: C,
-				disabled: _,
-				children: [/* @__PURE__ */ N(e, { size: 16 }), " Cancel"]
-			}), /* @__PURE__ */ P(g, {
-				onClick: w,
-				disabled: _,
+				onClick: x,
+				disabled: g,
+				children: [/* @__PURE__ */ M(e, { size: 16 }), " Cancel"]
+			}), /* @__PURE__ */ N(_, {
+				onClick: E,
+				disabled: g,
 				children: [
-					/* @__PURE__ */ N(o, { size: 16 }),
+					/* @__PURE__ */ M(o, { size: 16 }),
 					" ",
-					l ? _ ? "Saving..." : "Save Changes" : _ ? "Saving..." : "Add Product"
+					l ? g ? "Saving..." : "Save Changes" : g ? "Saving..." : "Add Product"
 				]
 			})]
 		}),
-		children: [/* @__PURE__ */ N(L, {
-			icon: /* @__PURE__ */ N(a, { size: 18 }),
+		children: [/* @__PURE__ */ M(F, {
+			icon: /* @__PURE__ */ M(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__ */ P("form", {
-			onSubmit: w,
+		}), /* @__PURE__ */ N("form", {
+			onSubmit: E,
 			className: "max-w-2xl space-y-6",
-			children: [/* @__PURE__ */ N(E, { message: y }), /* @__PURE__ */ P(F, { children: [/* @__PURE__ */ N("h2", {
+			children: [/* @__PURE__ */ M(O, { message: y }), /* @__PURE__ */ N(P, { children: [/* @__PURE__ */ M("h2", {
 				className: "text-base font-semibold text-text-primary mb-4",
 				children: "Product Details"
-			}), /* @__PURE__ */ P("div", {
+			}), /* @__PURE__ */ N("div", {
 				className: "space-y-4",
-				children: [/* @__PURE__ */ P("div", {
-					className: "grid grid-cols-1 md:grid-cols-2 gap-4",
-					children: [/* @__PURE__ */ P("div", {
-						className: "space-y-2",
-						children: [/* @__PURE__ */ P(S, {
-							htmlFor: "name",
-							children: ["Name ", /* @__PURE__ */ N("span", {
-								className: "text-status-error-text",
-								children: "*"
+				children: [
+					/* @__PURE__ */ N("div", {
+						className: "grid grid-cols-1 md:grid-cols-2 gap-4",
+						children: [/* @__PURE__ */ N("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ N(w, {
+								htmlFor: "name",
+								children: ["Name ", /* @__PURE__ */ M("span", {
+									className: "text-status-error-text",
+									children: "*"
+								})]
+							}), /* @__PURE__ */ M(C, {
+								id: "name",
+								value: u.name,
+								onChange: (e) => h((t) => ({
+									...t,
+									name: e.target.value
+								})),
+								placeholder: "Wireless Headphones",
+								required: !0
 							})]
-						}), /* @__PURE__ */ N(x, {
-							id: "name",
-							value: m.name,
-							onChange: (e) => h((t) => ({
-								...t,
-								name: e.target.value
-							})),
-							placeholder: "Wireless Headphones",
-							required: !0
-						})]
-					}), /* @__PURE__ */ P("div", {
-						className: "space-y-2",
-						children: [/* @__PURE__ */ P(S, {
-							htmlFor: "sku",
-							children: ["SKU ", /* @__PURE__ */ N("span", {
-								className: "text-status-error-text",
-								children: "*"
+						}), /* @__PURE__ */ N("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ N(w, {
+								htmlFor: "sku",
+								children: ["SKU ", /* @__PURE__ */ M("span", {
+									className: "text-status-error-text",
+									children: "*"
+								})]
+							}), /* @__PURE__ */ M(C, {
+								id: "sku",
+								value: u.sku,
+								onChange: (e) => h((t) => ({
+									...t,
+									sku: e.target.value
+								})),
+								placeholder: "SKU-001",
+								required: !0
 							})]
-						}), /* @__PURE__ */ N(x, {
-							id: "sku",
-							value: m.sku,
-							onChange: (e) => h((t) => ({
-								...t,
-								sku: e.target.value
-							})),
-							placeholder: "SKU-001",
-							required: !0
 						})]
-					})]
-				}), /* @__PURE__ */ P("div", {
-					className: "grid grid-cols-1 md:grid-cols-3 gap-4",
-					children: [
-						/* @__PURE__ */ P("div", {
+					}),
+					/* @__PURE__ */ N("div", {
+						className: "grid grid-cols-1 md:grid-cols-3 gap-4",
+						children: [/* @__PURE__ */ N("div", {
 							className: "space-y-2",
-							children: [/* @__PURE__ */ N(S, {
+							children: [/* @__PURE__ */ M(w, {
 								htmlFor: "category",
 								children: "Category"
-							}), /* @__PURE__ */ N(x, {
+							}), /* @__PURE__ */ M(C, {
 								id: "category",
-								value: m.category,
+								value: u.category,
 								onChange: (e) => h((t) => ({
 									...t,
 									category: e.target.value
 								})),
 								placeholder: "Electronics"
 							})]
-						}),
-						/* @__PURE__ */ P("div", {
+						}), /* @__PURE__ */ N("div", {
 							className: "space-y-2",
-							children: [/* @__PURE__ */ N(S, {
+							children: [/* @__PURE__ */ M(w, {
 								htmlFor: "brand",
 								children: "Brand"
-							}), /* @__PURE__ */ N(x, {
+							}), /* @__PURE__ */ M(C, {
 								id: "brand",
-								value: m.brand,
+								value: u.brand,
 								onChange: (e) => h((t) => ({
 									...t,
 									brand: e.target.value
 								})),
 								placeholder: "Acme"
 							})]
-						}),
-						/* @__PURE__ */ P("div", {
+						})]
+					}),
+					/* @__PURE__ */ N("div", {
+						className: "space-y-2",
+						children: [/* @__PURE__ */ M(w, {
+							htmlFor: "description",
+							children: "Description"
+						}), /* @__PURE__ */ M(T, {
+							id: "description",
+							value: u.description,
+							onChange: (e) => h((t) => ({
+								...t,
+								description: e.target.value
+							})),
+							placeholder: "Describe the item",
+							rows: 3
+						})]
+					}),
+					/* @__PURE__ */ N("div", {
+						className: "grid grid-cols-2 md:grid-cols-4 gap-4",
+						children: [[
+							["length", "Length"],
+							["width", "Width"],
+							["height", "Height"]
+						].map(([e, t]) => /* @__PURE__ */ N("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ M(w, {
+								htmlFor: e,
+								children: t
+							}), /* @__PURE__ */ M(C, {
+								id: e,
+								type: "number",
+								min: "0",
+								step: "0.01",
+								value: u[e],
+								onChange: (t) => h((n) => ({
+									...n,
+									[e]: t.target.value
+								})),
+								placeholder: "Not provided"
+							})]
+						}, e)), /* @__PURE__ */ N("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ M(w, {
+								htmlFor: "dimensionUnit",
+								children: "Dimension unit"
+							}), /* @__PURE__ */ M(C, {
+								id: "dimensionUnit",
+								value: u.dimensionUnit,
+								onChange: (e) => h((t) => ({
+									...t,
+									dimensionUnit: e.target.value
+								})),
+								placeholder: "cm"
+							})]
+						})]
+					}),
+					/* @__PURE__ */ N("div", {
+						className: "grid grid-cols-1 md:grid-cols-2 gap-4",
+						children: [/* @__PURE__ */ N("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ M(w, {
+								htmlFor: "value",
+								children: "Unit value"
+							}), /* @__PURE__ */ M(C, {
+								id: "value",
+								type: "number",
+								min: "0",
+								step: "0.01",
+								value: u.value,
+								onChange: (e) => h((t) => ({
+									...t,
+									value: e.target.value
+								})),
+								placeholder: "Not provided"
+							})]
+						}), /* @__PURE__ */ N("div", {
 							className: "space-y-2",
-							children: [/* @__PURE__ */ N(S, {
+							children: [/* @__PURE__ */ M(w, {
 								htmlFor: "weight",
 								children: "Weight (kg)"
-							}), /* @__PURE__ */ N(x, {
+							}), /* @__PURE__ */ M(C, {
 								id: "weight",
 								type: "number",
 								min: "0",
 								step: "0.01",
-								value: m.weight,
+								value: u.weight,
 								onChange: (e) => h((t) => ({
 									...t,
 									weight: e.target.value
 								})),
-								placeholder: "0.5"
+								placeholder: "Not provided"
 							})]
-						})
-					]
-				})]
+						})]
+					}),
+					/* @__PURE__ */ M("div", {
+						className: "flex flex-wrap gap-4",
+						children: [
+							["fragile", "Fragile"],
+							["hazardous", "Hazardous"],
+							["temperatureControlled", "Temperature controlled"]
+						].map(([e, t]) => /* @__PURE__ */ N("label", {
+							className: "flex items-center gap-2 text-sm",
+							children: [/* @__PURE__ */ M(S, {
+								checked: u[e],
+								onCheckedChange: (t) => h((n) => ({
+									...n,
+									[e]: t === !0
+								}))
+							}), t]
+						}, e))
+					})
+				]
 			})] })]
 		})]
 	});
 }
-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, {
+function R() {
+	let { productId: o } = ne(), { basePath: S, navigate: C } = f(), { product: w, isLoading: T, error: R, refetch: ue } = m(o), { deleteProduct: de } = p(), z = j().pathname.endsWith("/edit"), [B, V] = A(!1), [H, U] = A(!1), [fe, W] = A(null), [G, K] = A(0), { levels: q, totalLevels: J, totalAvailable: pe, hasMore: Y, isLoading: X, error: Z } = h(z ? void 0 : o, {
 		limit: 20,
-		offset: H * 20
+		offset: G * 20
 	});
-	O(() => {
-		U(0);
+	k(() => {
+		K(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, {
+	let Q = () => C?.(d(S, "inventory/products")), $ = (e) => C?.(d(S, e));
+	return o ? z ? /* @__PURE__ */ M(L, { editId: o }) : T ? /* @__PURE__ */ M(ee, { message: "Loading product details..." }) : R || !w ? /* @__PURE__ */ M(E, {
 		title: "Product not found",
-		onRetry: B
-	}) : /* @__PURE__ */ P(T, {
-		title: S.name,
-		subtitle: `SKU: ${S.sku}`,
-		icon: /* @__PURE__ */ N(a, { size: 24 }),
-		headerActions: /* @__PURE__ */ P("div", {
+		onRetry: ue
+	}) : /* @__PURE__ */ N(D, {
+		title: w.name,
+		subtitle: `SKU: ${w.sku}`,
+		icon: /* @__PURE__ */ M(a, { size: 24 }),
+		headerActions: /* @__PURE__ */ N("div", {
 			className: "flex gap-2",
-			children: [/* @__PURE__ */ P(g, {
+			children: [/* @__PURE__ */ N(_, {
 				variant: "outline",
-				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"]
+				onClick: Q,
+				children: [/* @__PURE__ */ M(e, { size: 16 }), " Back"]
+			}), /* @__PURE__ */ N(_, {
+				onClick: () => C?.(d(S, `inventory/products/${o}/edit`)),
+				children: [/* @__PURE__ */ M(s, { size: 16 }), " Edit"]
 			})]
 		}),
-		headerContent: /* @__PURE__ */ P("div", {
+		headerContent: /* @__PURE__ */ N("div", {
 			className: "flex gap-2",
 			children: [
-				/* @__PURE__ */ N(h, {
+				/* @__PURE__ */ M(g, {
 					variant: "outline",
-					children: S.category
+					children: w.category ?? "Not provided"
 				}),
-				S.brand && /* @__PURE__ */ N(h, {
+				w.brand && /* @__PURE__ */ M(g, {
 					variant: "secondary",
-					children: S.brand
+					children: w.brand
 				}),
-				S.fragile && /* @__PURE__ */ N(h, {
+				w.fragile && /* @__PURE__ */ M(g, {
 					variant: "destructive",
 					children: "Fragile"
 				}),
-				S.hazardous && /* @__PURE__ */ N(h, {
+				w.hazardous && /* @__PURE__ */ M(g, {
 					variant: "destructive",
 					children: "Hazardous"
 				}),
-				S.temperatureControlled && /* @__PURE__ */ N(h, {
+				w.temperatureControlled && /* @__PURE__ */ M(g, {
 					variant: "secondary",
 					children: "Temp Controlled"
 				})
 			]
 		}),
 		children: [
-			/* @__PURE__ */ N(L, {
-				icon: /* @__PURE__ */ N(a, { size: 18 }),
+			/* @__PURE__ */ M(F, {
+				icon: /* @__PURE__ */ M(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__ */ N(I, {
+			/* @__PURE__ */ M(ie, {
 				storageKey: "movethewheels-product-details",
 				steps: [{
 					id: "order",
 					label: "Add this product to an order",
 					description: "Include it on a new delivery.",
-					icon: /* @__PURE__ */ N(a, { size: 16 }),
-					onClick: () => Z("orders/new")
+					icon: /* @__PURE__ */ M(a, { size: 16 }),
+					onClick: () => $("orders/new")
 				}, {
 					id: "edit",
 					label: "Edit product details",
 					description: "Update dimensions, value or handling flags.",
-					icon: /* @__PURE__ */ N(c, { size: 16 }),
-					onClick: () => Z(`inventory/products/${o}/edit`)
+					icon: /* @__PURE__ */ M(c, { size: 16 }),
+					onClick: () => $(`inventory/products/${o}/edit`)
 				}]
 			}),
-			/* @__PURE__ */ P("div", {
+			/* @__PURE__ */ N("div", {
 				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
-				children: [/* @__PURE__ */ P("div", {
+				children: [/* @__PURE__ */ N("div", {
 					className: "lg:col-span-2 space-y-6",
 					children: [
-						/* @__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, {
+						/* @__PURE__ */ N(v, { children: [/* @__PURE__ */ M(b, { children: /* @__PURE__ */ M(x, { children: "Description" }) }), /* @__PURE__ */ M(y, { children: /* @__PURE__ */ M("p", { children: w.description ?? "Not provided" }) })] }),
+						/* @__PURE__ */ N(v, { children: [/* @__PURE__ */ M(b, { children: /* @__PURE__ */ N(x, {
 							className: "flex items-center gap-2",
-							children: [/* @__PURE__ */ N(t, { size: 18 }), " Dimensions & Weight"]
-						}) }), /* @__PURE__ */ N(v, { children: /* @__PURE__ */ P("div", {
+							children: [/* @__PURE__ */ M(t, { size: 18 }), " Dimensions & Weight"]
+						}) }), /* @__PURE__ */ M(y, { children: /* @__PURE__ */ M("div", {
 							className: "grid grid-cols-2 md:grid-cols-4 gap-4",
 							children: [
-								/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
-									className: "text-sm text-text-secondary",
-									children: "Length"
-								}), /* @__PURE__ */ P("p", {
-									className: "text-2xl font-bold",
-									children: [S.dimensions.length, /* @__PURE__ */ P("span", {
-										className: "text-sm font-normal",
-										children: [" ", S.dimensions.unit]
-									})]
-								})] }),
-								/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
-									className: "text-sm text-text-secondary",
-									children: "Width"
-								}), /* @__PURE__ */ P("p", {
-									className: "text-2xl font-bold",
-									children: [S.dimensions.width, /* @__PURE__ */ P("span", {
-										className: "text-sm font-normal",
-										children: [" ", S.dimensions.unit]
-									})]
-								})] }),
-								/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
-									className: "text-sm text-text-secondary",
-									children: "Height"
-								}), /* @__PURE__ */ P("p", {
-									className: "text-2xl font-bold",
-									children: [S.dimensions.height, /* @__PURE__ */ P("span", {
-										className: "text-sm font-normal",
-										children: [" ", S.dimensions.unit]
-									})]
-								})] }),
-								/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
-									className: "text-sm text-text-secondary",
-									children: "Weight"
-								}), /* @__PURE__ */ P("p", {
-									className: "text-2xl font-bold",
-									children: [S.weight, /* @__PURE__ */ N("span", {
-										className: "text-sm font-normal",
-										children: " kg"
-									})]
-								})] })
-							]
+								[
+									"Length",
+									w.dimensions?.length,
+									w.dimensions?.unit
+								],
+								[
+									"Width",
+									w.dimensions?.width,
+									w.dimensions?.unit
+								],
+								[
+									"Height",
+									w.dimensions?.height,
+									w.dimensions?.unit
+								],
+								[
+									"Weight",
+									w.weight,
+									"kg"
+								]
+							].map(([e, t, n]) => /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("p", {
+								className: "text-sm text-text-secondary",
+								children: e
+							}), /* @__PURE__ */ N("p", {
+								className: "text-2xl font-bold",
+								children: [t === void 0 ? "Not provided" : t, t !== void 0 && n && /* @__PURE__ */ N("span", {
+									className: "text-sm font-normal",
+									children: [" ", n]
+								})]
+							})] }, e))
 						}) })] }),
-						S.attributes.length > 0 && /* @__PURE__ */ P(_, { children: [/* @__PURE__ */ N(y, { children: /* @__PURE__ */ P(b, {
+						w.attributes.length > 0 && /* @__PURE__ */ N(v, { children: [/* @__PURE__ */ M(b, { children: /* @__PURE__ */ N(x, {
 							className: "flex items-center gap-2",
-							children: [/* @__PURE__ */ N(c, { size: 18 }), " Attributes"]
-						}) }), /* @__PURE__ */ N(v, { children: /* @__PURE__ */ N("div", {
+							children: [/* @__PURE__ */ M(c, { size: 18 }), " Attributes"]
+						}) }), /* @__PURE__ */ M(y, { children: /* @__PURE__ */ M("div", {
 							className: "grid grid-cols-2 md:grid-cols-3 gap-4",
-							children: S.attributes.map((e, t) => /* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
+							children: w.attributes.map((e, t) => /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("p", {
 								className: "text-sm text-text-secondary",
 								children: e.name
-							}), /* @__PURE__ */ N("p", {
+							}), /* @__PURE__ */ M("p", {
 								className: "font-medium",
 								children: e.value
 							})] }, t))
 						}) })] })
 					]
-				}), /* @__PURE__ */ P("div", {
+				}), /* @__PURE__ */ N("div", {
 					className: "space-y-6",
 					children: [
-						/* @__PURE__ */ P(F, { children: [
-							/* @__PURE__ */ P("h2", {
+						/* @__PURE__ */ N(P, { children: [
+							/* @__PURE__ */ N("h2", {
 								className: "flex items-center gap-2 text-base font-semibold text-text-primary mb-3",
-								children: [/* @__PURE__ */ N(i, { size: 18 }), " Pricing"]
+								children: [/* @__PURE__ */ M(i, { size: 18 }), " Pricing"]
 							}),
-							/* @__PURE__ */ N("p", {
+							/* @__PURE__ */ M("p", {
 								className: "text-3xl font-bold",
-								children: D(S.value)
+								children: w.value === void 0 ? "Not provided" : te(w.value)
 							}),
-							/* @__PURE__ */ N("p", {
+							/* @__PURE__ */ M("p", {
 								className: "text-sm text-text-secondary",
 								children: "Unit price"
 							})
 						] }),
-						/* @__PURE__ */ P(_, { children: [/* @__PURE__ */ N(y, { children: /* @__PURE__ */ P(b, {
+						/* @__PURE__ */ N(v, { children: [/* @__PURE__ */ M(b, { children: /* @__PURE__ */ N(x, {
 							className: "flex items-center gap-2",
-							children: [/* @__PURE__ */ N(l, { size: 18 }), " Stock Levels"]
-						}) }), /* @__PURE__ */ N(v, {
+							children: [/* @__PURE__ */ M(u, { size: 18 }), " Stock Levels"]
+						}) }), /* @__PURE__ */ M(y, {
 							className: "space-y-3",
-							children: Y ? /* @__PURE__ */ N("p", {
+							children: Z ? /* @__PURE__ */ M("p", {
 								className: "text-sm text-status-error-text",
-								children: Y.message
-							}) : J ? /* @__PURE__ */ N("p", {
+								children: Z.message
+							}) : X ? /* @__PURE__ */ M("p", {
 								className: "text-sm text-text-secondary",
 								children: "Loading stock levels…"
-							}) : W.length === 0 ? /* @__PURE__ */ P("div", {
+							}) : q.length === 0 ? /* @__PURE__ */ N("div", {
 								className: "space-y-3",
-								children: [/* @__PURE__ */ N("p", {
+								children: [/* @__PURE__ */ M("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__ */ N(g, {
+								}), /* @__PURE__ */ M(_, {
 									variant: "outline",
 									size: "sm",
-									onClick: () => Z("inventory/warehouses"),
+									onClick: () => $("inventory/warehouses"),
 									children: "View warehouses"
 								})]
-							}) : /* @__PURE__ */ P(M, { children: [
-								W.map((e) => /* @__PURE__ */ P("div", {
+							}) : /* @__PURE__ */ N(re, { children: [
+								q.map((e) => /* @__PURE__ */ N("div", {
 									className: "flex items-baseline justify-between gap-3",
-									children: [/* @__PURE__ */ P("div", {
+									children: [/* @__PURE__ */ N("div", {
 										className: "min-w-0",
-										children: [/* @__PURE__ */ N("p", {
+										children: [/* @__PURE__ */ M("p", {
 											className: "truncate text-sm font-medium",
 											children: e.warehouseName
-										}), /* @__PURE__ */ P("p", {
+										}), /* @__PURE__ */ N("p", {
 											className: "text-xs text-text-secondary",
 											children: [
 												e.allocated.toLocaleString(),
@@ -392,73 +501,123 @@ function z() {
 												e.reorderPoint === void 0 ? "" : ` · reorder at ${e.reorderPoint.toLocaleString()}`
 											]
 										})]
-									}), /* @__PURE__ */ N("span", {
+									}), /* @__PURE__ */ M("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", {
+								G > 0 || Y ? /* @__PURE__ */ N("div", {
 									className: "flex items-center justify-between gap-2 border-t border-border-seam pt-3",
-									children: [/* @__PURE__ */ P("span", {
+									children: [/* @__PURE__ */ N("span", {
 										className: "text-xs text-text-secondary",
 										children: [
-											H * 20 + 1,
+											G * 20 + 1,
 											"–",
-											Math.min(H * 20 + W.length, G),
+											Math.min(G * 20 + q.length, J),
 											" ",
 											"of ",
-											G
+											J
 										]
-									}), /* @__PURE__ */ P("div", {
+									}), /* @__PURE__ */ N("div", {
 										className: "flex gap-2",
-										children: [/* @__PURE__ */ P(g, {
+										children: [/* @__PURE__ */ N(_, {
 											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, {
+											disabled: G === 0 || X,
+											onClick: () => K((e) => Math.max(0, e - 1)),
+											children: [/* @__PURE__ */ M(n, { size: 14 }), " Previous"]
+										}), /* @__PURE__ */ N(_, {
 											variant: "outline",
 											size: "sm",
-											disabled: !q || J,
-											onClick: () => U((e) => e + 1),
-											children: ["Next ", /* @__PURE__ */ N(r, { size: 14 })]
+											disabled: !Y || X,
+											onClick: () => K((e) => e + 1),
+											children: ["Next ", /* @__PURE__ */ M(r, { size: 14 })]
 										})]
 									})]
 								}) : null,
-								/* @__PURE__ */ P("div", {
+								/* @__PURE__ */ N("div", {
 									className: "flex items-baseline justify-between gap-3 border-t border-border-seam pt-3",
-									children: [/* @__PURE__ */ N("p", {
+									children: [/* @__PURE__ */ M("p", {
 										className: "text-sm text-text-secondary",
 										children: "Available across the network"
-									}), /* @__PURE__ */ N("span", {
+									}), /* @__PURE__ */ M("span", {
 										className: "font-bold",
-										children: K.toLocaleString()
+										children: pe.toLocaleString()
 									})]
 								})
 							] })
 						})] }),
-						/* @__PURE__ */ P(_, { children: [/* @__PURE__ */ N(y, { children: /* @__PURE__ */ N(b, { children: "Identifiers" }) }), /* @__PURE__ */ P(v, {
+						/* @__PURE__ */ N(v, { children: [/* @__PURE__ */ M(b, { children: /* @__PURE__ */ M(x, { children: "Identifiers" }) }), /* @__PURE__ */ N(y, {
 							className: "space-y-3",
-							children: [/* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
+							children: [/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("p", {
 								className: "text-sm text-text-secondary",
 								children: "SKU"
-							}), /* @__PURE__ */ N("p", {
+							}), /* @__PURE__ */ M("p", {
 								className: "font-mono",
-								children: S.sku
-							})] }), S.barcode && /* @__PURE__ */ P("div", { children: [/* @__PURE__ */ N("p", {
+								children: w.sku
+							})] }), w.barcode && /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("p", {
 								className: "text-sm text-text-secondary",
 								children: "Barcode"
-							}), /* @__PURE__ */ N("p", {
+							}), /* @__PURE__ */ M("p", {
 								className: "font-mono",
-								children: S.barcode
+								children: w.barcode
 							})] })]
-						})] })
+						})] }),
+						/* @__PURE__ */ N(v, {
+							className: "border-status-error-border",
+							children: [/* @__PURE__ */ M(b, { children: /* @__PURE__ */ N(x, {
+								className: "flex items-center gap-2 text-status-error-text",
+								children: [/* @__PURE__ */ M(l, { size: 18 }), " Delete Product"]
+							}) }), /* @__PURE__ */ N(y, { children: [/* @__PURE__ */ M("p", {
+								className: "mb-3 text-sm text-text-secondary",
+								children: "Removes this catalog item. Existing inventory records may prevent deletion."
+							}), /* @__PURE__ */ N(_, {
+								variant: "outline",
+								className: "border-status-error-border text-status-error-text hover:bg-status-error-bg-subtle",
+								onClick: () => V(!0),
+								children: [/* @__PURE__ */ M(l, { size: 16 }), " Delete this product"]
+							})] })]
+						})
 					]
 				})]
+			}),
+			/* @__PURE__ */ M(I, {
+				open: B,
+				onOpenChange: V,
+				children: /* @__PURE__ */ N(ae, { children: [
+					/* @__PURE__ */ N(ce, { children: [/* @__PURE__ */ M(le, { children: "Delete this product?" }), /* @__PURE__ */ N(oe, { children: [
+						"This removes ",
+						w.name,
+						" from the catalog and cannot be undone from here."
+					] })] }),
+					/* @__PURE__ */ M("div", {
+						className: "px-1",
+						children: /* @__PURE__ */ M(O, { message: fe })
+					}),
+					/* @__PURE__ */ N(se, { children: [/* @__PURE__ */ M(_, {
+						variant: "outline",
+						onClick: () => V(!1),
+						disabled: H,
+						children: "Cancel"
+					}), /* @__PURE__ */ M(_, {
+						className: "bg-status-error-text text-text-inverse hover:opacity-90",
+						onClick: async () => {
+							if (o) {
+								U(!0), W(null);
+								try {
+									await de(o), V(!1), Q();
+								} catch (e) {
+									W(e instanceof Error ? e.message : "Failed to delete product."), U(!1);
+								}
+							}
+						},
+						disabled: H,
+						children: H ? "Deleting..." : "Delete product"
+					})] })
+				] })
 			})
 		]
-	}) : /* @__PURE__ */ N(R, {});
+	}) : /* @__PURE__ */ M(L, {});
 }
 //#endregion
-export { z as default };
+export { R as default };