@burdenoff/microfe-devportal 2026.914.3 → 2026.914.5

package/dist/devportal/pages/EditPhysicalItemPage.js

@@ -2,12 +2,13 @@ import { useDevportal as e } from "../providers/DevportalProvider.js";
 import { cn as t } from "../utils/cn.js";
 import { PageLayout as n, PageSection as r } from "../components/PageLayout.js";
 import { CheckboxField as i, InputField as a, SelectField as o, TextareaField as s } from "../components/FormField.js";
-import { useEffect as c, useState as l } from "react";
-import { AlertCircle as u, Info as d, Loader2 as f } from "lucide-react";
-import { useParams as p } from "react-router";
-import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+import { usePackageUpload as ee } from "../hooks/usePackageUpload.js";
+import { useCallback as c, useEffect as te, useRef as ne, useState as l } from "react";
+import { AlertCircle as u, AlertTriangle as d, Info as re, Loader2 as f, RotateCw as ie, Upload as ae, X as oe } from "lucide-react";
+import { useParams as se } from "react-router";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
 //#region src/devportal/pages/EditPhysicalItemPage.tsx
-var _ = [
+var g = [
 	{
 		value: "USD",
 		label: "USD — US Dollar"
@@ -32,21 +33,51 @@ var _ = [
 		value: "AED",
 		label: "AED — UAE Dirham"
 	}
+], _ = [
+	{
+		value: "GRAM",
+		label: "Grams (g)"
+	},
+	{
+		value: "KILOGRAM",
+		label: "Kilograms (kg)"
+	},
+	{
+		value: "OUNCE",
+		label: "Ounces (oz)"
+	},
+	{
+		value: "POUND",
+		label: "Pounds (lb)"
+	}
 ], v = [
+	{
+		value: "CENTIMETER",
+		label: "Centimeters (cm)"
+	},
+	{
+		value: "INCH",
+		label: "Inches (in)"
+	},
+	{
+		value: "METER",
+		label: "Meters (m)"
+	}
+], y = [
 	"name",
 	"shortDescription",
 	"price",
 	"currency",
 	"stockQuantity"
-], y = "\n  query GetPhysicalProduct($id: ID!) {\n    product(id: $id) {\n      id\n      name\n      slug\n      type\n      status\n      nature\n      description\n      longDescription\n      price\n      currency\n      tags\n      stockQuantity\n      sku\n      trackInventory\n      requiresShipping\n      weight\n      brand\n      countryOfOrigin\n      warrantyInfo\n      returnPolicy\n    }\n  }\n", b = "\n  mutation UpdatePhysicalProduct(\n    $id: ID!\n    $input: UpdatePhysicalProductInput!\n  ) {\n    updatePhysicalProduct(id: $id, input: $input) {\n      id\n      name\n      status\n    }\n  }\n", x = "\n  mutation SubmitProductForReview($id: ID!, $notes: String) {\n    submitProduct(id: $id, notes: $notes) {\n      id\n      status\n    }\n  }\n";
-function S(e) {
-	return v.every((t) => {
+], b = "\n  query GetPhysicalProduct($id: ID!) {\n    product(id: $id) {\n      id\n      name\n      slug\n      type\n      status\n      nature\n      description\n      longDescription\n      price\n      currency\n      tags\n      stockQuantity\n      sku\n      trackInventory\n      allowBackorder\n      lowStockThreshold\n      requiresShipping\n      weight\n      weightUnit\n      length\n      width\n      height\n      dimensionUnit\n      brand\n      manufacturer\n      countryOfOrigin\n      warrantyInfo\n      returnPolicy\n      icon\n      screenshots\n    }\n  }\n", x = "\n  mutation UpdatePhysicalProduct(\n    $id: ID!\n    $input: UpdatePhysicalProductInput!\n  ) {\n    updatePhysicalProduct(id: $id, input: $input) {\n      id\n      name\n      status\n    }\n  }\n", S = "\n  mutation SubmitProductForReview($id: ID!, $notes: String) {\n    submitProduct(id: $id, notes: $notes) {\n      id\n      status\n    }\n  }\n";
+function ce(e) {
+	return y.every((t) => {
 		let n = e[t];
 		return typeof n == "boolean" ? !0 : String(n).trim() !== "";
 	});
 }
 var C = () => {
-	let { navigate: v, basePath: C, apiGatewayUrl: w, authToken: T } = e(), { itemId: E } = p(), D = `${w || ""}/global/graphql`, [O, k] = l(!0), [A, j] = l(null), [M, N] = l(null), [P, F] = l({
+	let { navigate: y, basePath: C, apiGatewayUrl: le, authToken: w, workspacesGatewayUrl: ue, workspaceId: de, getWorkspaceToken: fe } = e(), { itemId: T } = se(), E = `${le || ""}/global/graphql`, [pe, D] = l(!0), [O, k] = l(null), [A, j] = l(null), [M, N] = l({
 		name: "",
 		shortDescription: "",
 		longDescription: "",
@@ -56,19 +87,27 @@ var C = () => {
 		stockQuantity: "0",
 		sku: "",
 		trackInventory: !0,
+		allowBackorder: !1,
+		lowStockThreshold: "",
 		requiresShipping: !0,
 		weightKg: "",
+		weightUnit: "KILOGRAM",
+		length: "",
+		width: "",
+		height: "",
+		dimensionUnit: "CENTIMETER",
 		brand: "",
+		manufacturer: "",
 		countryOfOrigin: "",
 		warrantyInfo: "",
 		returnPolicy: ""
-	}), [I, L] = l(!1), [R, z] = l(null), [B, V] = l(!1), H = S(P);
-	async function U(e, t) {
-		let n = await (await fetch(D, {
+	}), [P, F] = l([]), [I, L] = l(!1), R = ne(null), { upload: z } = ee(ue, w, de, fe, "/DevPortal/Assets"), [B, V] = l(!1), [H, U] = l(null), [me, W] = l(!1), he = P.some((e) => e.uploading), G = ce(M) && !he;
+	async function K(e, t) {
+		let n = await (await fetch(E, {
 			method: "POST",
 			headers: {
 				"Content-Type": "application/json",
-				...T ? { Authorization: `Bearer ${T}` } : {}
+				...w ? { Authorization: `Bearer ${w}` } : {}
 			},
 			credentials: "include",
 			body: JSON.stringify({
@@ -79,19 +118,19 @@ var C = () => {
 		if (n.errors?.length) throw Error(n.errors.map((e) => e.message).join("; "));
 		return n.data;
 	}
-	c(() => {
-		if (!E) return;
+	te(() => {
+		if (!T) return;
 		let e = !1;
-		return k(!0), j(null), (async () => {
+		return D(!0), k(null), (async () => {
 			try {
-				let t = await U(y, { id: E });
+				let t = await K(b, { id: T });
 				if (e) return;
 				let n = t.product;
 				if (!n) {
-					j("Product not found.");
+					k("Product not found.");
 					return;
 				}
-				N(n.status), F({
+				j(n.status), N({
 					name: n.name,
 					shortDescription: n.description ?? "",
 					longDescription: n.longDescription ?? "",
@@ -101,309 +140,529 @@ var C = () => {
 					stockQuantity: String(n.stockQuantity),
 					sku: n.sku ?? "",
 					trackInventory: n.trackInventory ?? !0,
+					allowBackorder: n.allowBackorder ?? !1,
+					lowStockThreshold: n.lowStockThreshold == null ? "" : String(n.lowStockThreshold),
 					requiresShipping: n.requiresShipping ?? !0,
 					weightKg: n.weight == null ? "" : String(n.weight),
+					weightUnit: n.weightUnit ?? "KILOGRAM",
+					length: n.length == null ? "" : String(n.length),
+					width: n.width == null ? "" : String(n.width),
+					height: n.height == null ? "" : String(n.height),
+					dimensionUnit: n.dimensionUnit ?? "CENTIMETER",
 					brand: n.brand ?? "",
+					manufacturer: n.manufacturer ?? "",
 					countryOfOrigin: n.countryOfOrigin ?? "",
 					warrantyInfo: n.warrantyInfo ?? "",
 					returnPolicy: n.returnPolicy ?? ""
-				});
+				}), F([n.icon, ...n.screenshots ?? []].filter((e) => !!e).map((e) => ({
+					id: crypto.randomUUID(),
+					url: e,
+					downloadUrl: e,
+					uploading: !1
+				})));
 			} catch (t) {
-				e || j(t instanceof Error ? t.message : "Failed to load product");
+				e || k(t instanceof Error ? t.message : "Failed to load product");
 			} finally {
-				e || k(!1);
+				e || D(!1);
 			}
 		})(), () => {
 			e = !0;
 		};
 	}, [
+		T,
 		E,
-		D,
-		T
+		w
 	]);
-	let W = (e, t) => {
-		F((n) => ({
+	let q = (e, t) => {
+		N((n) => ({
 			...n,
 			[e]: t
 		}));
-	}, G = (e) => (t) => {
-		W(e, t.target.checked);
-	}, K = async (e = !1) => {
-		if (!(!H || I || !E)) {
-			L(!0), z(null), V(!1);
+	}, J = (e) => (t) => {
+		q(e, t.target.checked);
+	}, Y = c((e, t) => {
+		z(t).then((t) => {
+			F((n) => n.map((n) => n.id === e ? {
+				...n,
+				uploading: !1,
+				downloadUrl: t.downloadUrl,
+				error: void 0
+			} : n));
+		}).catch((t) => {
+			F((n) => n.map((n) => n.id === e ? {
+				...n,
+				uploading: !1,
+				error: t instanceof Error ? t.message : "Upload failed"
+			} : n));
+		});
+	}, [z]), X = c((e) => {
+		let t = Array.from(e).filter((e) => e.type.startsWith("image/")).map((e) => ({
+			id: crypto.randomUUID(),
+			file: e,
+			url: URL.createObjectURL(e),
+			uploading: !0
+		}));
+		F((e) => [...e, ...t]), t.forEach((e) => Y(e.id, e.file));
+	}, [Y]), ge = (e) => {
+		e.target.files && X(e.target.files), e.target.value = "";
+	}, _e = (e) => {
+		e.preventDefault(), L(!1), e.dataTransfer.files && X(e.dataTransfer.files);
+	}, ve = (e) => {
+		e.preventDefault(), L(!0);
+	}, Z = () => L(!1), ye = (e) => {
+		F((t) => {
+			let n = t.find((t) => t.id === e);
+			return n?.file && URL.revokeObjectURL(n.url), t.filter((t) => t.id !== e);
+		});
+	}, be = (e) => {
+		let t = P.find((t) => t.id === e);
+		t?.file && (F((t) => t.map((t) => t.id === e ? {
+			...t,
+			uploading: !0,
+			error: void 0
+		} : t)), Y(e, t.file));
+	}, Q = async (e = !1) => {
+		if (!(!G || B || !T)) {
+			V(!0), U(null), W(!1);
 			try {
-				let t = P.tags.split(",").map((e) => e.trim()).filter(Boolean);
-				await U(b, {
-					id: E,
+				let t = M.tags.split(",").map((e) => e.trim()).filter(Boolean), n = P.map((e) => e.downloadUrl).filter((e) => !!e), r = M.length.trim() || M.width.trim() || M.height.trim();
+				await K(x, {
+					id: T,
 					input: {
-						name: P.name.trim(),
-						description: P.shortDescription.trim(),
-						longDescription: P.longDescription.trim() || null,
-						price: parseFloat(P.price),
-						currency: P.currency,
+						name: M.name.trim(),
+						description: M.shortDescription.trim(),
+						longDescription: M.longDescription.trim() || null,
+						price: parseFloat(M.price),
+						currency: M.currency,
 						tags: t.length > 0 ? t : null,
-						stockQuantity: parseInt(P.stockQuantity, 10),
-						sku: P.sku.trim() || null,
-						trackInventory: P.trackInventory,
-						requiresShipping: P.requiresShipping,
-						weight: P.requiresShipping && P.weightKg.trim() ? parseFloat(P.weightKg) : null,
-						brand: P.brand.trim() || null,
-						countryOfOrigin: P.countryOfOrigin.trim() || null,
-						warrantyInfo: P.warrantyInfo.trim() || null,
-						returnPolicy: P.returnPolicy.trim() || null
+						stockQuantity: parseInt(M.stockQuantity, 10),
+						sku: M.sku.trim() || null,
+						trackInventory: M.trackInventory,
+						allowBackorder: M.allowBackorder,
+						lowStockThreshold: M.lowStockThreshold.trim() ? parseInt(M.lowStockThreshold, 10) : null,
+						requiresShipping: M.requiresShipping,
+						weight: M.requiresShipping && M.weightKg.trim() ? parseFloat(M.weightKg) : null,
+						weightUnit: M.requiresShipping && M.weightKg.trim() ? M.weightUnit : null,
+						length: M.requiresShipping && M.length.trim() ? parseFloat(M.length) : null,
+						width: M.requiresShipping && M.width.trim() ? parseFloat(M.width) : null,
+						height: M.requiresShipping && M.height.trim() ? parseFloat(M.height) : null,
+						dimensionUnit: M.requiresShipping && r ? M.dimensionUnit : null,
+						brand: M.brand.trim() || null,
+						manufacturer: M.manufacturer.trim() || null,
+						countryOfOrigin: M.countryOfOrigin.trim() || null,
+						warrantyInfo: M.warrantyInfo.trim() || null,
+						returnPolicy: M.returnPolicy.trim() || null,
+						icon: n[0] ?? null,
+						screenshots: n.length > 1 ? n.slice(1) : null
 					}
-				}), e && await U(x, {
-					id: E,
+				}), e && await K(S, {
+					id: T,
 					notes: "Resubmitted after edits"
-				}), V(!0), setTimeout(() => {
-					v?.(`${C}/seller/items`);
+				}), W(!0), setTimeout(() => {
+					y?.(`${C}/seller/items`);
 				}, 1500);
 			} catch (e) {
-				z(e instanceof Error ? e.message : "Save failed. Please try again.");
+				U(e instanceof Error ? e.message : "Save failed. Please try again.");
 			} finally {
-				L(!1);
+				V(!1);
 			}
 		}
 	};
-	if (O) return /* @__PURE__ */ h(n, {
+	if (pe) return /* @__PURE__ */ m(n, {
 		title: "Edit Item",
 		backLink: "/seller/items",
 		backLabel: "Back to My Items",
-		children: /* @__PURE__ */ h("div", {
+		children: /* @__PURE__ */ m("div", {
 			className: "flex items-center justify-center py-20",
-			children: /* @__PURE__ */ h(f, { className: "h-8 w-8 animate-spin text-text-secondary" })
+			children: /* @__PURE__ */ m(f, { className: "h-8 w-8 animate-spin text-text-secondary" })
 		})
 	});
-	if (A) return /* @__PURE__ */ h(n, {
+	if (O) return /* @__PURE__ */ m(n, {
 		title: "Edit Item",
 		backLink: "/seller/items",
 		backLabel: "Back to My Items",
-		children: /* @__PURE__ */ g("div", {
+		children: /* @__PURE__ */ h("div", {
 			className: "flex items-center gap-3 rounded-lg border border-status-error-border/50 bg-status-error-bg/10 px-4 py-3 text-sm",
-			children: [/* @__PURE__ */ h(u, {
+			children: [/* @__PURE__ */ m(u, {
 				size: 16,
 				className: "shrink-0 text-status-error-text"
-			}), /* @__PURE__ */ h("span", {
+			}), /* @__PURE__ */ m("span", {
 				className: "text-status-error-text",
-				children: A
+				children: O
 			})]
 		})
 	});
-	let q = M === "DRAFT" || M === "REJECTED";
-	return /* @__PURE__ */ h(n, {
-		title: `Edit: ${P.name || "Item"}`,
+	let $ = A === "DRAFT" || A === "REJECTED";
+	return /* @__PURE__ */ m(n, {
+		title: `Edit: ${M.name || "Item"}`,
 		description: "Update your listing details. Changes take effect immediately for drafts; published items may require re-review.",
 		backLink: "/seller/items",
 		backLabel: "Back to My Items",
-		children: /* @__PURE__ */ g("div", {
+		children: /* @__PURE__ */ h("div", {
 			className: "space-y-8 max-w-3xl",
 			children: [
-				B && /* @__PURE__ */ h("div", {
+				me && /* @__PURE__ */ m("div", {
 					className: "rounded-card border border-status-success-text/30 bg-status-success-bg-subtle px-4 py-3 text-sm text-status-success-text",
 					children: "Saved successfully! Redirecting to your items..."
 				}),
-				R && /* @__PURE__ */ h("div", {
+				H && /* @__PURE__ */ m("div", {
 					className: "rounded-card border border-status-error-text/30 bg-status-error-bg-subtle px-4 py-3 text-sm text-status-error-text",
-					children: R
+					children: H
 				}),
-				M && /* @__PURE__ */ g("div", {
+				A && /* @__PURE__ */ h("div", {
 					className: "flex items-start gap-2 rounded-input border border-border-subtle bg-bg-sunken px-3 py-2 text-xs text-text-secondary",
 					children: [
-						/* @__PURE__ */ h(d, {
+						/* @__PURE__ */ m(re, {
 							size: 13,
 							className: "mt-0.5 shrink-0 text-text-muted"
 						}),
 						"Current status:",
 						" ",
-						/* @__PURE__ */ h("span", {
+						/* @__PURE__ */ m("span", {
 							className: "font-medium text-text-primary",
-							children: M.replace(/_/g, " ")
+							children: A.replace(/_/g, " ")
 						}),
-						q && /* @__PURE__ */ h("span", {
+						$ && /* @__PURE__ */ m("span", {
 							className: "ml-1",
 							children: "— use \"Save & Resubmit\" to send it for review again."
 						})
 					]
 				}),
-				/* @__PURE__ */ h(r, {
+				/* @__PURE__ */ m(r, {
 					title: "Basic Information",
 					description: "Core details shown in the store listing.",
-					children: /* @__PURE__ */ g("div", {
+					children: /* @__PURE__ */ h("div", {
 						className: "rounded-card border border-border-seam bg-bg-surface p-6 space-y-5",
 						children: [
-							/* @__PURE__ */ h(a, {
+							/* @__PURE__ */ m(a, {
 								label: "Name",
 								required: !0,
-								value: P.name,
-								onChange: (e) => W("name", e.target.value),
+								value: M.name,
+								onChange: (e) => q("name", e.target.value),
 								placeholder: "e.g. Wireless Ergonomic Keyboard",
 								maxLength: 120
 							}),
-							/* @__PURE__ */ h(a, {
+							/* @__PURE__ */ m(a, {
 								label: "Short Description",
 								required: !0,
-								value: P.shortDescription,
-								onChange: (e) => W("shortDescription", e.target.value),
+								value: M.shortDescription,
+								onChange: (e) => q("shortDescription", e.target.value),
 								placeholder: "One-line summary shown on the store card",
 								maxLength: 160,
-								hint: `${P.shortDescription.length}/160`
+								hint: `${M.shortDescription.length}/160`
 							}),
-							/* @__PURE__ */ h(s, {
+							/* @__PURE__ */ m(s, {
 								label: "Long Description",
-								value: P.longDescription,
-								onChange: (e) => W("longDescription", e.target.value),
+								value: M.longDescription,
+								onChange: (e) => q("longDescription", e.target.value),
 								rows: 5,
 								placeholder: "Detailed product description, features, specs…"
 							})
 						]
 					})
 				}),
-				/* @__PURE__ */ h(r, {
+				/* @__PURE__ */ m(r, {
+					title: "Product Images",
+					description: "The first image is used as the main icon.",
+					children: /* @__PURE__ */ h("div", {
+						className: "rounded-card border border-border-seam bg-bg-surface p-6 space-y-4",
+						children: [/* @__PURE__ */ h("div", {
+							onDrop: _e,
+							onDragOver: ve,
+							onDragLeave: Z,
+							onClick: () => R.current?.click(),
+							className: t("flex flex-col items-center justify-center gap-3 rounded-input border-2 border-dashed px-6 py-10 cursor-pointer transition-colors", I ? "border-action-primary-bg bg-action-primary-bg/5" : "border-border-subtle hover:border-border-strong"),
+							children: [
+								/* @__PURE__ */ m(ae, {
+									size: 28,
+									className: I ? "text-action-primary-bg" : "text-text-muted"
+								}),
+								/* @__PURE__ */ h("div", {
+									className: "text-center space-y-1",
+									children: [/* @__PURE__ */ m("p", {
+										className: "text-sm font-medium text-text-primary",
+										children: "Drag and drop images here"
+									}), /* @__PURE__ */ m("p", {
+										className: "text-xs text-text-muted",
+										children: "or click to browse — accepts any image format, multiple files"
+									})]
+								}),
+								/* @__PURE__ */ m("input", {
+									ref: R,
+									type: "file",
+									accept: "image/*",
+									multiple: !0,
+									className: "sr-only",
+									onChange: ge
+								})
+							]
+						}), P.length > 0 && /* @__PURE__ */ m("div", {
+							className: "flex flex-wrap gap-3",
+							children: (() => {
+								let e = P.find((e) => e.downloadUrl)?.id;
+								return P.map((n, r) => /* @__PURE__ */ h("div", {
+									className: "relative group",
+									children: [
+										/* @__PURE__ */ m("img", {
+											src: n.url,
+											alt: `Product image ${r + 1}`,
+											className: t("h-20 w-20 rounded-input object-cover border", n.error ? "border-status-error-text/50" : "border-border-subtle")
+										}),
+										n.uploading && /* @__PURE__ */ m("div", {
+											className: "absolute inset-0 flex items-center justify-center rounded-input bg-bg-overlay",
+											children: /* @__PURE__ */ m(f, {
+												size: 16,
+												className: "animate-spin text-white"
+											})
+										}),
+										n.error && /* @__PURE__ */ h("button", {
+											type: "button",
+											onClick: (e) => {
+												e.stopPropagation(), be(n.id);
+											},
+											title: `${n.error} — click to retry`,
+											className: "absolute inset-0 flex flex-col items-center justify-center gap-0.5 rounded-input bg-status-error-bg/80 text-status-error-text",
+											children: [/* @__PURE__ */ m(d, { size: 14 }), /* @__PURE__ */ m(ie, { size: 11 })]
+										}),
+										n.id === e && /* @__PURE__ */ m("span", {
+											className: "absolute bottom-0 left-0 right-0 rounded-b-input bg-bg-surface/80 text-center text-[10px] font-medium py-0.5 text-text-secondary",
+											children: "Main"
+										}),
+										/* @__PURE__ */ m("button", {
+											type: "button",
+											onClick: (e) => {
+												e.stopPropagation(), ye(n.id);
+											},
+											className: "absolute -top-1.5 -right-1.5 hidden group-hover:flex h-5 w-5 items-center justify-center rounded-full bg-bg-surface border border-border-subtle text-text-muted hover:text-status-error-text hover:border-status-error-text/40 transition-colors",
+											"aria-label": "Remove image",
+											children: /* @__PURE__ */ m(oe, { size: 11 })
+										})
+									]
+								}, n.id));
+							})()
+						})]
+					})
+				}),
+				/* @__PURE__ */ m(r, {
 					title: "Pricing",
-					children: /* @__PURE__ */ g("div", {
+					children: /* @__PURE__ */ h("div", {
 						className: "rounded-card border border-border-seam bg-bg-surface p-6 space-y-5",
-						children: [/* @__PURE__ */ g("div", {
+						children: [/* @__PURE__ */ h("div", {
 							className: "grid grid-cols-1 gap-5 sm:grid-cols-2",
-							children: [/* @__PURE__ */ h(a, {
+							children: [/* @__PURE__ */ m(a, {
 								label: "Price",
 								required: !0,
 								type: "number",
-								value: P.price,
-								onChange: (e) => W("price", e.target.value),
+								value: M.price,
+								onChange: (e) => q("price", e.target.value),
 								placeholder: "0.00",
 								min: .01,
 								step: "0.01"
-							}), /* @__PURE__ */ h(o, {
+							}), /* @__PURE__ */ m(o, {
 								label: "Currency",
 								required: !0,
-								value: P.currency,
-								onChange: (e) => W("currency", e.target.value),
-								options: _,
+								value: M.currency,
+								onChange: (e) => q("currency", e.target.value),
+								options: g,
 								placeholder: "Select currency"
 							})]
-						}), /* @__PURE__ */ h(a, {
+						}), /* @__PURE__ */ m(a, {
 							label: "Tags",
-							value: P.tags,
-							onChange: (e) => W("tags", e.target.value),
+							value: M.tags,
+							onChange: (e) => q("tags", e.target.value),
 							placeholder: "mechanical, wireless, ergonomic",
 							hint: "Comma-separated keywords."
 						})]
 					})
 				}),
-				/* @__PURE__ */ h(r, {
+				/* @__PURE__ */ m(r, {
 					title: "Inventory",
-					children: /* @__PURE__ */ g("div", {
+					children: /* @__PURE__ */ h("div", {
 						className: "rounded-card border border-border-seam bg-bg-surface p-6 space-y-5",
-						children: [/* @__PURE__ */ g("div", {
-							className: "grid grid-cols-1 gap-5 sm:grid-cols-2",
-							children: [/* @__PURE__ */ h(a, {
-								label: "Stock Quantity",
-								required: !0,
+						children: [
+							/* @__PURE__ */ h("div", {
+								className: "grid grid-cols-1 gap-5 sm:grid-cols-2",
+								children: [/* @__PURE__ */ m(a, {
+									label: "Stock Quantity",
+									required: !0,
+									type: "number",
+									value: M.stockQuantity,
+									onChange: (e) => q("stockQuantity", e.target.value),
+									min: 0,
+									step: 1
+								}), /* @__PURE__ */ m(a, {
+									label: "SKU",
+									value: M.sku,
+									onChange: (e) => q("sku", e.target.value),
+									placeholder: "e.g. KB-WL-001",
+									hint: "Your internal stock-keeping unit reference."
+								})]
+							}),
+							/* @__PURE__ */ m(a, {
+								label: "Low Stock Threshold",
 								type: "number",
-								value: P.stockQuantity,
-								onChange: (e) => W("stockQuantity", e.target.value),
+								value: M.lowStockThreshold,
+								onChange: (e) => q("lowStockThreshold", e.target.value),
+								placeholder: "e.g. 5",
 								min: 0,
-								step: 1
-							}), /* @__PURE__ */ h(a, {
-								label: "SKU",
-								value: P.sku,
-								onChange: (e) => W("sku", e.target.value),
-								placeholder: "e.g. KB-WL-001",
-								hint: "Your internal stock-keeping unit reference."
-							})]
-						}), /* @__PURE__ */ h(i, {
-							label: "Track Inventory",
-							description: "Automatically reduce stock when orders are placed.",
-							checked: P.trackInventory,
-							onChange: G("trackInventory")
-						})]
+								step: 1,
+								hint: "Get flagged when stock falls to or below this number."
+							}),
+							/* @__PURE__ */ m(i, {
+								label: "Track Inventory",
+								description: "Automatically reduce stock when orders are placed.",
+								checked: M.trackInventory,
+								onChange: J("trackInventory")
+							}),
+							/* @__PURE__ */ m(i, {
+								label: "Allow Backorder",
+								description: "Let buyers order even when stock quantity is zero.",
+								checked: M.allowBackorder,
+								onChange: J("allowBackorder")
+							})
+						]
 					})
 				}),
-				/* @__PURE__ */ h(r, {
+				/* @__PURE__ */ m(r, {
 					title: "Shipping",
-					children: /* @__PURE__ */ g("div", {
+					children: /* @__PURE__ */ h("div", {
 						className: "rounded-card border border-border-seam bg-bg-surface p-6 space-y-5",
-						children: [/* @__PURE__ */ h(i, {
+						children: [/* @__PURE__ */ m(i, {
 							label: "Requires Shipping",
 							description: "This item will be physically shipped to the buyer.",
-							checked: P.requiresShipping,
-							onChange: G("requiresShipping")
-						}), P.requiresShipping && /* @__PURE__ */ h(a, {
-							label: "Weight (kg)",
-							type: "number",
-							value: P.weightKg,
-							onChange: (e) => W("weightKg", e.target.value),
-							placeholder: "0.0",
-							min: 0,
-							step: "0.01",
-							hint: "Used to calculate shipping costs."
-						})]
+							checked: M.requiresShipping,
+							onChange: J("requiresShipping")
+						}), M.requiresShipping && /* @__PURE__ */ h(p, { children: [
+							/* @__PURE__ */ h("div", {
+								className: "grid grid-cols-1 gap-5 sm:grid-cols-2",
+								children: [/* @__PURE__ */ m(a, {
+									label: "Weight",
+									type: "number",
+									value: M.weightKg,
+									onChange: (e) => q("weightKg", e.target.value),
+									placeholder: "0.0",
+									min: 0,
+									step: "0.01",
+									hint: "Used to calculate shipping costs."
+								}), /* @__PURE__ */ m(o, {
+									label: "Weight Unit",
+									value: M.weightUnit,
+									onChange: (e) => q("weightUnit", e.target.value),
+									options: _
+								})]
+							}),
+							/* @__PURE__ */ h("div", {
+								className: "grid grid-cols-1 gap-5 sm:grid-cols-3",
+								children: [
+									/* @__PURE__ */ m(a, {
+										label: "Length",
+										type: "number",
+										value: M.length,
+										onChange: (e) => q("length", e.target.value),
+										placeholder: "0.0",
+										min: 0,
+										step: "0.01"
+									}),
+									/* @__PURE__ */ m(a, {
+										label: "Width",
+										type: "number",
+										value: M.width,
+										onChange: (e) => q("width", e.target.value),
+										placeholder: "0.0",
+										min: 0,
+										step: "0.01"
+									}),
+									/* @__PURE__ */ m(a, {
+										label: "Height",
+										type: "number",
+										value: M.height,
+										onChange: (e) => q("height", e.target.value),
+										placeholder: "0.0",
+										min: 0,
+										step: "0.01"
+									})
+								]
+							}),
+							/* @__PURE__ */ m(o, {
+								label: "Dimension Unit",
+								value: M.dimensionUnit,
+								onChange: (e) => q("dimensionUnit", e.target.value),
+								options: v,
+								hint: "Applies to length, width, and height above."
+							})
+						] })]
 					})
 				}),
-				/* @__PURE__ */ h(r, {
+				/* @__PURE__ */ m(r, {
 					title: "Product Details",
 					description: "Optional supplemental information for buyers.",
-					children: /* @__PURE__ */ g("div", {
+					children: /* @__PURE__ */ h("div", {
 						className: "rounded-card border border-border-seam bg-bg-surface p-6 space-y-5",
 						children: [
-							/* @__PURE__ */ g("div", {
+							/* @__PURE__ */ h("div", {
 								className: "grid grid-cols-1 gap-5 sm:grid-cols-2",
-								children: [/* @__PURE__ */ h(a, {
+								children: [/* @__PURE__ */ m(a, {
 									label: "Brand",
-									value: P.brand,
-									onChange: (e) => W("brand", e.target.value),
+									value: M.brand,
+									onChange: (e) => q("brand", e.target.value),
 									placeholder: "e.g. Logitech"
-								}), /* @__PURE__ */ h(a, {
-									label: "Country of Origin",
-									value: P.countryOfOrigin,
-									onChange: (e) => W("countryOfOrigin", e.target.value),
-									placeholder: "e.g. China"
+								}), /* @__PURE__ */ m(a, {
+									label: "Manufacturer",
+									value: M.manufacturer,
+									onChange: (e) => q("manufacturer", e.target.value),
+									placeholder: "e.g. Logitech Manufacturing Ltd."
 								})]
 							}),
-							/* @__PURE__ */ h(a, {
+							/* @__PURE__ */ m(a, {
+								label: "Country of Origin",
+								value: M.countryOfOrigin,
+								onChange: (e) => q("countryOfOrigin", e.target.value),
+								placeholder: "e.g. China"
+							}),
+							/* @__PURE__ */ m(a, {
 								label: "Warranty Info",
-								value: P.warrantyInfo,
-								onChange: (e) => W("warrantyInfo", e.target.value),
+								value: M.warrantyInfo,
+								onChange: (e) => q("warrantyInfo", e.target.value),
 								placeholder: "e.g. 1-year limited manufacturer warranty"
 							}),
-							/* @__PURE__ */ h(s, {
+							/* @__PURE__ */ m(s, {
 								label: "Return Policy",
-								value: P.returnPolicy,
-								onChange: (e) => W("returnPolicy", e.target.value),
+								value: M.returnPolicy,
+								onChange: (e) => q("returnPolicy", e.target.value),
 								rows: 3,
 								placeholder: "e.g. 30-day returns accepted"
 							})
 						]
 					})
 				}),
-				/* @__PURE__ */ g("div", {
+				/* @__PURE__ */ h("div", {
 					className: "flex flex-wrap items-center gap-3 pb-8",
 					children: [
-						/* @__PURE__ */ h("button", {
+						/* @__PURE__ */ m("button", {
 							type: "button",
-							onClick: () => v?.(`${C}/seller/items`),
+							onClick: () => y?.(`${C}/seller/items`),
 							className: "rounded-button border border-border-strong px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken transition-colors",
 							children: "Cancel"
 						}),
-						/* @__PURE__ */ h("button", {
+						/* @__PURE__ */ m("button", {
 							type: "button",
-							onClick: () => void K(!1),
-							disabled: !H || I,
-							"aria-disabled": !H || I,
-							title: H ? void 0 : "Fill in all required fields to continue",
+							onClick: () => void Q(!1),
+							disabled: !G || B,
+							"aria-disabled": !G || B,
+							title: G ? void 0 : "Fill in all required fields to continue",
 							className: t("inline-flex items-center gap-2 rounded-button px-5 py-2 text-sm font-medium transition-colors", "border border-border-strong bg-bg-surface text-text-primary", "hover:bg-bg-sunken", "disabled:opacity-50 disabled:cursor-not-allowed"),
-							children: I ? /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(f, {
+							children: B ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(f, {
 								size: 15,
 								className: "animate-spin"
 							}), "Saving..."] }) : "Save Changes"
 						}),
-						q && /* @__PURE__ */ h("button", {
+						$ && /* @__PURE__ */ m("button", {
 							type: "button",
-							onClick: () => void K(!0),
-							disabled: !H || I,
-							"aria-disabled": !H || I,
+							onClick: () => void Q(!0),
+							disabled: !G || B,
+							"aria-disabled": !G || B,
 							className: t("inline-flex items-center gap-2 rounded-button px-5 py-2 text-sm font-medium transition-colors", "bg-action-primary-bg text-action-primary-text", "hover:bg-action-primary-bg/90", "disabled:opacity-50 disabled:cursor-not-allowed"),
-							children: I ? /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(f, {
+							children: B ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(f, {
 								size: 15,
 								className: "animate-spin"
 							}), "Saving..."] }) : "Save & Resubmit for Review"