@burdenoff/microfe-coolandlovely 2026.706.1 → 2026.706.3

package/dist/coolandlovely/pages/items/StyleItemDetailPage.js

@@ -3,176 +3,196 @@ import { PageLayout as t } from "../../components/PageLayout.js";
 import { StatusBadge as n } from "../../components/StatusBadge.js";
 import { ErrorView as r, LoadingView as i } from "../../components/StateViews.js";
 import { Thumbnail as a } from "../../components/Thumbnail.js";
-import { useArchiveStyleItem as o, useStyleItem as s } from "../../hooks/useCoolAndLovelyApi.js";
+import { useArchiveStyleItem as o, useLooksWithItems as s, useStyleItem as c } from "../../hooks/useCoolAndLovelyApi.js";
+import { AddToLookbookButton as l } from "../../components/AddToLookbookButton.js";
+import { formatDate as u, formatPrice as d, titleCase as f } from "../../utils/formatters.js";
+import { LookCard as p } from "../../components/LookCard.js";
 import "../../hooks/index.js";
-import { formatDate as c, formatPrice as l, titleCase as u } from "../../utils/formatters.js";
-import { TagList as d } from "../../components/TagList.js";
-import { categoryIcon as f } from "../../utils/icons.js";
-import { Archive as p, ArrowLeft as m, Loader2 as h, Pencil as g, Shapes as _, Store as v } from "lucide-react";
-import { useParams as y } from "react-router-dom";
-import { jsx as b, jsxs as x } from "react/jsx-runtime";
-import { GlassCard as S } from "@burdenoff/fe-libs/ui";
+import { TagList as m } from "../../components/TagList.js";
+import { categoryIcon as h } from "../../utils/icons.js";
+import { ColourSwatchRow as g } from "../../components/ColourSwatchRow.js";
+import { Archive as _, ArrowLeft as v, ChevronRight as y, Loader2 as b, Pencil as x, Shapes as S } from "lucide-react";
+import { useParams as C } from "react-router-dom";
+import { jsx as w, jsxs as T } from "react/jsx-runtime";
+import { GlassCard as E } from "@burdenoff/fe-libs/ui";
 //#region src/coolandlovely/pages/items/StyleItemDetailPage.tsx
-function C() {
-	let { itemId: C } = y(), { navigateTo: w } = e(), T = s(C), E = o();
-	if (T.isLoading) return /* @__PURE__ */ b(t, {
+function D() {
+	let { itemId: D } = C(), { navigateTo: O } = e(), k = c(D), A = s({ pagination: {
+		limit: 100,
+		offset: 0
+	} }), j = o();
+	if (k.isLoading) return /* @__PURE__ */ w(t, {
 		title: "Style item",
-		children: /* @__PURE__ */ b(i, { label: "Loading item…" })
+		children: /* @__PURE__ */ w(i, { label: "Loading item…" })
 	});
-	if (T.isError || !T.data) return /* @__PURE__ */ b(t, {
+	if (k.isError || !k.data) return /* @__PURE__ */ w(t, {
 		title: "Style item",
-		children: /* @__PURE__ */ b(r, {
+		children: /* @__PURE__ */ w(r, {
 			title: "Item not found",
-			onRetry: () => void T.refetch()
+			onRetry: () => void k.refetch()
 		})
 	});
-	let D = T.data, O = D.status === "RETIRED";
-	return /* @__PURE__ */ b(t, {
-		title: D.name,
-		description: D.brand?.name ?? void 0,
-		actions: /* @__PURE__ */ x("div", {
-			className: "flex items-center gap-2",
+	let M = k.data, N = M.status === "RETIRED", P = (A.data?.items ?? []).filter((e) => e.items?.some((e) => e.styleItemId === M.id)).slice(0, 4);
+	return /* @__PURE__ */ T(t, {
+		title: M.name,
+		description: M.brand?.name ?? void 0,
+		actions: /* @__PURE__ */ T("div", {
+			className: "flex flex-wrap items-center gap-2",
 			children: [
-				/* @__PURE__ */ x("button", {
+				/* @__PURE__ */ T("button", {
 					type: "button",
-					onClick: () => w("/items"),
+					onClick: () => O("/items"),
 					className: "inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken",
-					children: [/* @__PURE__ */ b(m, { className: "h-4 w-4" }), " Back"]
+					children: [/* @__PURE__ */ w(v, { className: "h-4 w-4" }), " Back"]
 				}),
-				/* @__PURE__ */ x("button", {
+				/* @__PURE__ */ w(l, { styleItemId: M.id }),
+				/* @__PURE__ */ T("button", {
 					type: "button",
-					onClick: () => w(`/items/${D.id}/edit`),
+					onClick: () => O(`/items/${M.id}/edit`),
 					className: "inline-flex items-center gap-1.5 rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90",
-					children: [/* @__PURE__ */ b(g, { className: "h-4 w-4" }), " Edit"]
+					children: [/* @__PURE__ */ w(x, { className: "h-4 w-4" }), " Edit"]
 				}),
-				!O && /* @__PURE__ */ x("button", {
+				!N && /* @__PURE__ */ T("button", {
 					type: "button",
-					disabled: E.isPending,
-					onClick: () => E.mutate(D.id, { onSuccess: () => w("/items") }),
+					disabled: j.isPending,
+					onClick: () => j.mutate(M.id, { onSuccess: () => O("/items") }),
 					className: "inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-status-error-text transition-colors hover:bg-status-error-bg-subtle disabled:opacity-50",
-					children: [E.isPending ? /* @__PURE__ */ b(h, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ b(p, { className: "h-4 w-4" }), "Archive"]
+					children: [j.isPending ? /* @__PURE__ */ w(b, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ w(_, { className: "h-4 w-4" }), "Archive"]
 				})
 			]
 		}),
-		children: /* @__PURE__ */ x("div", {
+		children: [/* @__PURE__ */ T("div", {
 			className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
-			children: [/* @__PURE__ */ b("div", {
+			children: [/* @__PURE__ */ w("div", {
 				className: "lg:col-span-2",
-				children: /* @__PURE__ */ x(S, {
+				children: /* @__PURE__ */ T(E, {
 					treatment: "glass",
-					className: "overflow-hidden p-0",
-					children: [/* @__PURE__ */ b(a, {
-						icon: f(D.category, 40),
-						seed: D.id,
-						className: "h-52 w-full"
-					}), /* @__PURE__ */ x("div", {
+					className: "group overflow-hidden p-0",
+					children: [/* @__PURE__ */ w(a, {
+						icon: h(M.category, 48),
+						seed: M.id,
+						fileId: M.image?.id,
+						alt: M.name,
+						className: "aspect-[4/5] w-full"
+					}), M.description && /* @__PURE__ */ w("div", {
 						className: "p-6",
-						children: [
-							/* @__PURE__ */ x("div", {
-								className: "flex items-center gap-2",
-								children: [/* @__PURE__ */ b("h2", {
-									className: "text-xl font-semibold text-text-primary",
-									children: D.name
-								}), /* @__PURE__ */ b(n, {
-									status: D.status,
-									className: "ml-auto"
-								})]
-							}),
-							/* @__PURE__ */ b("p", {
-								className: "mt-1 text-2xl font-bold text-text-primary tabular-nums",
-								children: l(D.price, D.currency)
-							}),
-							D.description && /* @__PURE__ */ b("p", {
-								className: "mt-3 text-sm text-text-secondary",
-								children: D.description
-							}),
-							/* @__PURE__ */ x("div", {
-								className: "mt-5 grid grid-cols-1 gap-4 sm:grid-cols-2",
-								children: [
-									D.colours.length > 0 && /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-										className: "mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary",
-										children: "Colours"
-									}), /* @__PURE__ */ b(d, {
-										tags: D.colours,
-										max: 10
-									})] }),
-									D.sizes.length > 0 && /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-										className: "mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary",
-										children: "Sizes"
-									}), /* @__PURE__ */ b(d, {
-										tags: D.sizes,
-										max: 10
-									})] }),
-									D.materials.length > 0 && /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-										className: "mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary",
-										children: "Materials"
-									}), /* @__PURE__ */ b(d, {
-										tags: D.materials,
-										max: 10
-									})] }),
-									D.tags.length > 0 && /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("p", {
-										className: "mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary",
-										children: "Tags"
-									}), /* @__PURE__ */ b(d, {
-										tags: D.tags,
-										max: 10,
-										tone: "accent"
-									})] })
-								]
-							})
-						]
+						children: /* @__PURE__ */ w("p", {
+							className: "text-sm leading-relaxed text-text-secondary",
+							children: M.description
+						})
 					})]
 				})
-			}), /* @__PURE__ */ x("div", {
+			}), /* @__PURE__ */ T("div", {
 				className: "space-y-4",
 				children: [
-					/* @__PURE__ */ x(S, {
+					/* @__PURE__ */ T(E, {
+						treatment: "glass",
+						className: "space-y-5 p-6",
+						children: [
+							/* @__PURE__ */ T("div", { children: [
+								/* @__PURE__ */ w("h2", {
+									className: "text-2xl font-semibold leading-tight text-text-primary",
+									children: M.name
+								}),
+								M.brand && /* @__PURE__ */ T("button", {
+									type: "button",
+									onClick: () => O(`/brands/${M.brand?.id}`),
+									className: "mt-1 inline-flex items-center gap-0.5 text-sm font-medium text-action-primary-bg hover:underline",
+									children: [M.brand.name, /* @__PURE__ */ w(y, { className: "h-3.5 w-3.5" })]
+								}),
+								/* @__PURE__ */ T("div", {
+									className: "mt-3 flex flex-wrap items-center justify-between gap-2",
+									children: [/* @__PURE__ */ T("p", {
+										className: "text-3xl font-bold text-text-primary tabular-nums",
+										children: [d(M.price, M.currency), /* @__PURE__ */ w("span", {
+											className: "ml-2 text-base font-medium text-text-secondary",
+											children: M.currency
+										})]
+									}), /* @__PURE__ */ w(n, { status: M.status })]
+								})
+							] }),
+							/* @__PURE__ */ w("div", { className: "border-t border-border-seam" }),
+							M.colours.length > 0 && /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
+								className: "mb-2 text-xs font-medium uppercase tracking-wide text-text-secondary",
+								children: "Colours"
+							}), /* @__PURE__ */ w(g, {
+								colours: M.colours,
+								max: 12
+							})] }),
+							M.sizes.length > 0 && /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
+								className: "mb-2 text-xs font-medium uppercase tracking-wide text-text-secondary",
+								children: "Size"
+							}), /* @__PURE__ */ w("div", {
+								className: "flex flex-wrap gap-2",
+								children: M.sizes.map((e) => /* @__PURE__ */ w("span", {
+									className: "inline-flex min-w-9 items-center justify-center rounded-full border border-border-seam px-3 py-1 text-sm font-medium text-text-primary",
+									children: e
+								}, e))
+							})] }),
+							M.materials.length > 0 && /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
+								className: "mb-1 text-xs font-medium uppercase tracking-wide text-text-secondary",
+								children: "Materials"
+							}), /* @__PURE__ */ w("p", {
+								className: "text-sm text-text-primary",
+								children: M.materials.join(", ")
+							})] }),
+							M.tags.length > 0 && /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
+								className: "mb-2 text-xs font-medium uppercase tracking-wide text-text-secondary",
+								children: "Tags"
+							}), /* @__PURE__ */ w(m, {
+								tags: M.tags,
+								max: 12,
+								tone: "accent"
+							})] })
+						]
+					}),
+					/* @__PURE__ */ T(E, {
 						treatment: "plain",
 						className: "p-5",
-						children: [/* @__PURE__ */ b("h3", {
+						children: [/* @__PURE__ */ w("h3", {
 							className: "mb-3 text-sm font-semibold text-text-primary",
 							children: "Details"
-						}), /* @__PURE__ */ x("dl", {
+						}), /* @__PURE__ */ T("dl", {
 							className: "space-y-2 text-sm",
 							children: [
-								/* @__PURE__ */ x("div", {
+								/* @__PURE__ */ T("div", {
 									className: "flex justify-between gap-2",
-									children: [/* @__PURE__ */ b("dt", {
+									children: [/* @__PURE__ */ w("dt", {
 										className: "text-text-secondary",
 										children: "Category"
-									}), /* @__PURE__ */ b("dd", {
+									}), /* @__PURE__ */ w("dd", {
 										className: "text-text-primary",
-										children: u(D.category)
+										children: f(M.category)
 									})]
 								}),
-								/* @__PURE__ */ x("div", {
+								/* @__PURE__ */ T("div", {
 									className: "flex justify-between gap-2",
-									children: [/* @__PURE__ */ b("dt", {
+									children: [/* @__PURE__ */ w("dt", {
 										className: "text-text-secondary",
 										children: "SKU"
-									}), /* @__PURE__ */ b("dd", {
+									}), /* @__PURE__ */ w("dd", {
 										className: "text-text-primary",
-										children: D.sku ?? "—"
+										children: M.sku ?? "—"
 									})]
 								}),
-								/* @__PURE__ */ x("div", {
+								/* @__PURE__ */ T("div", {
 									className: "flex justify-between gap-2",
-									children: [/* @__PURE__ */ b("dt", {
+									children: [/* @__PURE__ */ w("dt", {
 										className: "text-text-secondary",
 										children: "Currency"
-									}), /* @__PURE__ */ b("dd", {
+									}), /* @__PURE__ */ w("dd", {
 										className: "text-text-primary",
-										children: D.currency
+										children: M.currency
 									})]
 								}),
-								/* @__PURE__ */ x("div", {
+								/* @__PURE__ */ T("div", {
 									className: "flex justify-between gap-2",
-									children: [/* @__PURE__ */ b("dt", {
+									children: [/* @__PURE__ */ w("dt", {
 										className: "text-text-secondary",
 										children: "Created"
-									}), /* @__PURE__ */ b("dd", {
+									}), /* @__PURE__ */ w("dd", {
 										className: "text-text-primary",
-										children: c(D.createdAt, {
+										children: u(M.createdAt, {
 											hour: void 0,
 											minute: void 0
 										})
@@ -181,39 +201,20 @@ function C() {
 							]
 						})]
 					}),
-					D.brand && /* @__PURE__ */ x("button", {
-						type: "button",
-						onClick: () => w(`/brands/${D.brand?.id}`),
-						className: "flex w-full items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-4 text-left transition-colors hover:bg-bg-sunken/50",
-						children: [/* @__PURE__ */ b(a, {
-							icon: /* @__PURE__ */ b(v, { className: "h-5 w-5" }),
-							seed: D.brand.id,
-							className: "h-10 w-10 shrink-0"
-						}), /* @__PURE__ */ x("div", {
-							className: "min-w-0",
-							children: [/* @__PURE__ */ b("p", {
-								className: "truncate text-sm font-medium text-text-primary",
-								children: D.brand.name
-							}), /* @__PURE__ */ b("p", {
-								className: "truncate text-xs text-text-secondary",
-								children: "View brand"
-							})]
-						})]
-					}),
-					D.collection && /* @__PURE__ */ x("button", {
+					M.collection && /* @__PURE__ */ T("button", {
 						type: "button",
-						onClick: () => w(`/collections/${D.collection?.id}`),
+						onClick: () => O(`/collections/${M.collection?.id}`),
 						className: "flex w-full items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-4 text-left transition-colors hover:bg-bg-sunken/50",
-						children: [/* @__PURE__ */ b(a, {
-							icon: /* @__PURE__ */ b(_, { className: "h-5 w-5" }),
-							seed: D.collection.id,
+						children: [/* @__PURE__ */ w(a, {
+							icon: /* @__PURE__ */ w(S, { className: "h-5 w-5" }),
+							seed: M.collection.id,
 							className: "h-10 w-10 shrink-0"
-						}), /* @__PURE__ */ x("div", {
+						}), /* @__PURE__ */ T("div", {
 							className: "min-w-0",
-							children: [/* @__PURE__ */ b("p", {
+							children: [/* @__PURE__ */ w("p", {
 								className: "truncate text-sm font-medium text-text-primary",
-								children: D.collection.name
-							}), /* @__PURE__ */ b("p", {
+								children: M.collection.name
+							}), /* @__PURE__ */ w("p", {
 								className: "truncate text-xs text-text-secondary",
 								children: "View collection"
 							})]
@@ -221,10 +222,41 @@ function C() {
 					})
 				]
 			})]
-		})
+		}), /* @__PURE__ */ T("section", {
+			className: "mt-8",
+			children: [/* @__PURE__ */ T("div", {
+				className: "mb-3 flex items-center justify-between gap-3",
+				children: [/* @__PURE__ */ w("h3", {
+					className: "text-lg font-semibold text-text-primary",
+					children: "Appears in looks"
+				}), P.length > 0 && /* @__PURE__ */ T("button", {
+					type: "button",
+					onClick: () => O("/looks"),
+					className: "inline-flex items-center gap-1 text-sm font-medium text-action-primary-bg hover:underline",
+					children: ["View all ", /* @__PURE__ */ w(y, { className: "h-3.5 w-3.5" })]
+				})]
+			}), A.isLoading ? /* @__PURE__ */ T("div", {
+				className: "flex items-center gap-2 rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary",
+				children: [/* @__PURE__ */ w(b, { className: "h-4 w-4 animate-spin" }), " Loading referenced looks…"]
+			}) : P.length === 0 ? /* @__PURE__ */ w("p", {
+				className: "rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary",
+				children: "This piece has not been tagged in any looks yet."
+			}) : /* @__PURE__ */ w("div", {
+				className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
+				children: P.map((e) => /* @__PURE__ */ w(p, {
+					id: e.id,
+					title: e.title,
+					occasion: e.occasion,
+					imageFileId: e.image?.id,
+					likeCount: e.likeCount,
+					onOpen: () => O(`/looks/${e.id}`),
+					showActions: !0
+				}, e.id))
+			})]
+		})]
 	});
 }
 //#endregion
-export { C as StyleItemDetailPage };
+export { D as StyleItemDetailPage };
 
 //# sourceMappingURL=StyleItemDetailPage.js.map

package/dist/coolandlovely/pages/items/StyleItemDetailPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"StyleItemDetailPage.js","names":[],"sources":["../../../../src/coolandlovely/pages/items/StyleItemDetailPage.tsx"],"sourcesContent":["/**\n * Style Item Detail Page\n * @module coolandlovely/pages/items\n *\n * Renders a single catalogue piece (`cooStyleItem`) with edit + archive\n * (`cooArchiveStyleItem`) actions.\n */\n\nimport { useParams } from 'react-router-dom';\nimport { ArrowLeft, Pencil, Archive, Loader2, Store, Shapes } from 'lucide-react';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { LoadingView, ErrorView } from '../../components/StateViews';\nimport { Thumbnail } from '../../components/Thumbnail';\nimport { TagList } from '../../components/TagList';\nimport { useCoolAndLovely } from '../../context/CoolAndLovelyContext';\nimport { useStyleItem, useArchiveStyleItem } from '../../hooks';\nimport { categoryIcon } from '../../utils/icons';\nimport { formatPrice, formatDate, titleCase } from '../../utils/formatters';\n\nexport function StyleItemDetailPage() {\n  const { itemId } = useParams<{ itemId: string }>();\n  const { navigateTo } = useCoolAndLovely();\n  const query = useStyleItem(itemId);\n  const archive = useArchiveStyleItem();\n\n  if (query.isLoading) {\n    return (\n      <PageLayout title=\"Style item\">\n        <LoadingView label=\"Loading item…\" />\n      </PageLayout>\n    );\n  }\n\n  if (query.isError || !query.data) {\n    return (\n      <PageLayout title=\"Style item\">\n        <ErrorView title=\"Item not found\" onRetry={() => void query.refetch()} />\n      </PageLayout>\n    );\n  }\n\n  const item = query.data;\n  const isArchived = item.status === 'RETIRED';\n\n  return (\n    <PageLayout\n      title={item.name}\n      description={item.brand?.name ?? undefined}\n      actions={\n        <div className=\"flex items-center gap-2\">\n          <button\n            type=\"button\"\n            onClick={() => navigateTo('/items')}\n            className=\"inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken\"\n          >\n            <ArrowLeft className=\"h-4 w-4\" /> Back\n          </button>\n          <button\n            type=\"button\"\n            onClick={() => navigateTo(`/items/${item.id}/edit`)}\n            className=\"inline-flex items-center gap-1.5 rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90\"\n          >\n            <Pencil className=\"h-4 w-4\" /> Edit\n          </button>\n          {!isArchived && (\n            <button\n              type=\"button\"\n              disabled={archive.isPending}\n              onClick={() => archive.mutate(item.id, { onSuccess: () => navigateTo('/items') })}\n              className=\"inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-status-error-text transition-colors hover:bg-status-error-bg-subtle disabled:opacity-50\"\n            >\n              {archive.isPending ? (\n                <Loader2 className=\"h-4 w-4 animate-spin\" />\n              ) : (\n                <Archive className=\"h-4 w-4\" />\n              )}\n              Archive\n            </button>\n          )}\n        </div>\n      }\n    >\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n        <div className=\"lg:col-span-2\">\n          <GlassCard treatment=\"glass\" className=\"overflow-hidden p-0\">\n            <Thumbnail\n              icon={categoryIcon(item.category, 40)}\n              seed={item.id}\n              className=\"h-52 w-full\"\n            />\n            <div className=\"p-6\">\n              <div className=\"flex items-center gap-2\">\n                <h2 className=\"text-xl font-semibold text-text-primary\">{item.name}</h2>\n                <StatusBadge status={item.status} className=\"ml-auto\" />\n              </div>\n              <p className=\"mt-1 text-2xl font-bold text-text-primary tabular-nums\">\n                {formatPrice(item.price, item.currency)}\n              </p>\n              {item.description && (\n                <p className=\"mt-3 text-sm text-text-secondary\">{item.description}</p>\n              )}\n\n              <div className=\"mt-5 grid grid-cols-1 gap-4 sm:grid-cols-2\">\n                {item.colours.length > 0 && (\n                  <div>\n                    <p className=\"mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n                      Colours\n                    </p>\n                    <TagList tags={item.colours} max={10} />\n                  </div>\n                )}\n                {item.sizes.length > 0 && (\n                  <div>\n                    <p className=\"mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n                      Sizes\n                    </p>\n                    <TagList tags={item.sizes} max={10} />\n                  </div>\n                )}\n                {item.materials.length > 0 && (\n                  <div>\n                    <p className=\"mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n                      Materials\n                    </p>\n                    <TagList tags={item.materials} max={10} />\n                  </div>\n                )}\n                {item.tags.length > 0 && (\n                  <div>\n                    <p className=\"mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n                      Tags\n                    </p>\n                    <TagList tags={item.tags} max={10} tone=\"accent\" />\n                  </div>\n                )}\n              </div>\n            </div>\n          </GlassCard>\n        </div>\n\n        <div className=\"space-y-4\">\n          <GlassCard treatment=\"plain\" className=\"p-5\">\n            <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">Details</h3>\n            <dl className=\"space-y-2 text-sm\">\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Category</dt>\n                <dd className=\"text-text-primary\">{titleCase(item.category)}</dd>\n              </div>\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">SKU</dt>\n                <dd className=\"text-text-primary\">{item.sku ?? '—'}</dd>\n              </div>\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Currency</dt>\n                <dd className=\"text-text-primary\">{item.currency}</dd>\n              </div>\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Created</dt>\n                <dd className=\"text-text-primary\">\n                  {formatDate(item.createdAt, { hour: undefined, minute: undefined })}\n                </dd>\n              </div>\n            </dl>\n          </GlassCard>\n\n          {item.brand && (\n            <button\n              type=\"button\"\n              onClick={() => navigateTo(`/brands/${item.brand?.id}`)}\n              className=\"flex w-full items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-4 text-left transition-colors hover:bg-bg-sunken/50\"\n            >\n              <Thumbnail\n                icon={<Store className=\"h-5 w-5\" />}\n                seed={item.brand.id}\n                className=\"h-10 w-10 shrink-0\"\n              />\n              <div className=\"min-w-0\">\n                <p className=\"truncate text-sm font-medium text-text-primary\">{item.brand.name}</p>\n                <p className=\"truncate text-xs text-text-secondary\">View brand</p>\n              </div>\n            </button>\n          )}\n\n          {item.collection && (\n            <button\n              type=\"button\"\n              onClick={() => navigateTo(`/collections/${item.collection?.id}`)}\n              className=\"flex w-full items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-4 text-left transition-colors hover:bg-bg-sunken/50\"\n            >\n              <Thumbnail\n                icon={<Shapes className=\"h-5 w-5\" />}\n                seed={item.collection.id}\n                className=\"h-10 w-10 shrink-0\"\n              />\n              <div className=\"min-w-0\">\n                <p className=\"truncate text-sm font-medium text-text-primary\">\n                  {item.collection.name}\n                </p>\n                <p className=\"truncate text-xs text-text-secondary\">View collection</p>\n              </div>\n            </button>\n          )}\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"StyleItemDetailPage.js","names":[],"sources":["../../../../src/coolandlovely/pages/items/StyleItemDetailPage.tsx"],"sourcesContent":["/**\n * Style Item Detail Page\n * @module coolandlovely/pages/items\n *\n * Renders a single catalogue piece (`cooStyleItem`) with edit + archive\n * (`cooArchiveStyleItem`) actions.\n */\n\nimport { useParams } from 'react-router-dom';\nimport { ArrowLeft, Pencil, Archive, Loader2, ChevronRight, Shapes } from 'lucide-react';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { LoadingView, ErrorView } from '../../components/StateViews';\nimport { Thumbnail } from '../../components/Thumbnail';\nimport { LookCard } from '../../components/LookCard';\nimport { TagList } from '../../components/TagList';\nimport { ColourSwatchRow } from '../../components/ColourSwatchRow';\nimport { AddToLookbookButton } from '../../components/AddToLookbookButton';\nimport { useCoolAndLovely } from '../../context/CoolAndLovelyContext';\nimport { useStyleItem, useArchiveStyleItem, useLooksWithItems } from '../../hooks';\nimport { categoryIcon } from '../../utils/icons';\nimport { formatPrice, formatDate, titleCase } from '../../utils/formatters';\n\nexport function StyleItemDetailPage() {\n  const { itemId } = useParams<{ itemId: string }>();\n  const { navigateTo } = useCoolAndLovely();\n  const query = useStyleItem(itemId);\n  const looksQuery = useLooksWithItems({ pagination: { limit: 100, offset: 0 } });\n  const archive = useArchiveStyleItem();\n\n  if (query.isLoading) {\n    return (\n      <PageLayout title=\"Style item\">\n        <LoadingView label=\"Loading item…\" />\n      </PageLayout>\n    );\n  }\n\n  if (query.isError || !query.data) {\n    return (\n      <PageLayout title=\"Style item\">\n        <ErrorView title=\"Item not found\" onRetry={() => void query.refetch()} />\n      </PageLayout>\n    );\n  }\n\n  const item = query.data;\n  const isArchived = item.status === 'RETIRED';\n  const appearsInLooks = (looksQuery.data?.items ?? [])\n    .filter((look) => look.items?.some((lookItem) => lookItem.styleItemId === item.id))\n    .slice(0, 4);\n\n  return (\n    <PageLayout\n      title={item.name}\n      description={item.brand?.name ?? undefined}\n      actions={\n        <div className=\"flex flex-wrap items-center gap-2\">\n          <button\n            type=\"button\"\n            onClick={() => navigateTo('/items')}\n            className=\"inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken\"\n          >\n            <ArrowLeft className=\"h-4 w-4\" /> Back\n          </button>\n          <AddToLookbookButton styleItemId={item.id} />\n          <button\n            type=\"button\"\n            onClick={() => navigateTo(`/items/${item.id}/edit`)}\n            className=\"inline-flex items-center gap-1.5 rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90\"\n          >\n            <Pencil className=\"h-4 w-4\" /> Edit\n          </button>\n          {!isArchived && (\n            <button\n              type=\"button\"\n              disabled={archive.isPending}\n              onClick={() => archive.mutate(item.id, { onSuccess: () => navigateTo('/items') })}\n              className=\"inline-flex items-center gap-1.5 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-status-error-text transition-colors hover:bg-status-error-bg-subtle disabled:opacity-50\"\n            >\n              {archive.isPending ? (\n                <Loader2 className=\"h-4 w-4 animate-spin\" />\n              ) : (\n                <Archive className=\"h-4 w-4\" />\n              )}\n              Archive\n            </button>\n          )}\n        </div>\n      }\n    >\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n        {/* Product image */}\n        <div className=\"lg:col-span-2\">\n          <GlassCard treatment=\"glass\" className=\"group overflow-hidden p-0\">\n            <Thumbnail\n              icon={categoryIcon(item.category, 48)}\n              seed={item.id}\n              fileId={item.image?.id}\n              alt={item.name}\n              className=\"aspect-[4/5] w-full\"\n            />\n            {item.description && (\n              <div className=\"p-6\">\n                <p className=\"text-sm leading-relaxed text-text-secondary\">{item.description}</p>\n              </div>\n            )}\n          </GlassCard>\n        </div>\n\n        {/* Product panel */}\n        <div className=\"space-y-4\">\n          <GlassCard treatment=\"glass\" className=\"space-y-5 p-6\">\n            <div>\n              <h2 className=\"text-2xl font-semibold leading-tight text-text-primary\">\n                {item.name}\n              </h2>\n              {item.brand && (\n                <button\n                  type=\"button\"\n                  onClick={() => navigateTo(`/brands/${item.brand?.id}`)}\n                  className=\"mt-1 inline-flex items-center gap-0.5 text-sm font-medium text-action-primary-bg hover:underline\"\n                >\n                  {item.brand.name}\n                  <ChevronRight className=\"h-3.5 w-3.5\" />\n                </button>\n              )}\n              <div className=\"mt-3 flex flex-wrap items-center justify-between gap-2\">\n                <p className=\"text-3xl font-bold text-text-primary tabular-nums\">\n                  {formatPrice(item.price, item.currency)}\n                  <span className=\"ml-2 text-base font-medium text-text-secondary\">\n                    {item.currency}\n                  </span>\n                </p>\n                <StatusBadge status={item.status} />\n              </div>\n            </div>\n\n            <div className=\"border-t border-border-seam\" />\n\n            {item.colours.length > 0 && (\n              <div>\n                <p className=\"mb-2 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n                  Colours\n                </p>\n                <ColourSwatchRow colours={item.colours} max={12} />\n              </div>\n            )}\n\n            {item.sizes.length > 0 && (\n              <div>\n                <p className=\"mb-2 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n                  Size\n                </p>\n                <div className=\"flex flex-wrap gap-2\">\n                  {item.sizes.map((size) => (\n                    <span\n                      key={size}\n                      className=\"inline-flex min-w-9 items-center justify-center rounded-full border border-border-seam px-3 py-1 text-sm font-medium text-text-primary\"\n                    >\n                      {size}\n                    </span>\n                  ))}\n                </div>\n              </div>\n            )}\n\n            {item.materials.length > 0 && (\n              <div>\n                <p className=\"mb-1 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n                  Materials\n                </p>\n                <p className=\"text-sm text-text-primary\">{item.materials.join(', ')}</p>\n              </div>\n            )}\n\n            {item.tags.length > 0 && (\n              <div>\n                <p className=\"mb-2 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n                  Tags\n                </p>\n                <TagList tags={item.tags} max={12} tone=\"accent\" />\n              </div>\n            )}\n          </GlassCard>\n\n          <GlassCard treatment=\"plain\" className=\"p-5\">\n            <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">Details</h3>\n            <dl className=\"space-y-2 text-sm\">\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Category</dt>\n                <dd className=\"text-text-primary\">{titleCase(item.category)}</dd>\n              </div>\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">SKU</dt>\n                <dd className=\"text-text-primary\">{item.sku ?? '—'}</dd>\n              </div>\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Currency</dt>\n                <dd className=\"text-text-primary\">{item.currency}</dd>\n              </div>\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Created</dt>\n                <dd className=\"text-text-primary\">\n                  {formatDate(item.createdAt, { hour: undefined, minute: undefined })}\n                </dd>\n              </div>\n            </dl>\n          </GlassCard>\n\n          {item.collection && (\n            <button\n              type=\"button\"\n              onClick={() => navigateTo(`/collections/${item.collection?.id}`)}\n              className=\"flex w-full items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-4 text-left transition-colors hover:bg-bg-sunken/50\"\n            >\n              <Thumbnail\n                icon={<Shapes className=\"h-5 w-5\" />}\n                seed={item.collection.id}\n                className=\"h-10 w-10 shrink-0\"\n              />\n              <div className=\"min-w-0\">\n                <p className=\"truncate text-sm font-medium text-text-primary\">\n                  {item.collection.name}\n                </p>\n                <p className=\"truncate text-xs text-text-secondary\">View collection</p>\n              </div>\n            </button>\n          )}\n        </div>\n      </div>\n\n      <section className=\"mt-8\">\n        <div className=\"mb-3 flex items-center justify-between gap-3\">\n          <h3 className=\"text-lg font-semibold text-text-primary\">Appears in looks</h3>\n          {appearsInLooks.length > 0 && (\n            <button\n              type=\"button\"\n              onClick={() => navigateTo('/looks')}\n              className=\"inline-flex items-center gap-1 text-sm font-medium text-action-primary-bg hover:underline\"\n            >\n              View all <ChevronRight className=\"h-3.5 w-3.5\" />\n            </button>\n          )}\n        </div>\n        {looksQuery.isLoading ? (\n          <div className=\"flex items-center gap-2 rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary\">\n            <Loader2 className=\"h-4 w-4 animate-spin\" /> Loading referenced looks…\n          </div>\n        ) : appearsInLooks.length === 0 ? (\n          <p className=\"rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary\">\n            This piece has not been tagged in any looks yet.\n          </p>\n        ) : (\n          <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n            {appearsInLooks.map((look) => (\n              <LookCard\n                key={look.id}\n                id={look.id}\n                title={look.title}\n                occasion={look.occasion}\n                imageFileId={look.image?.id}\n                likeCount={look.likeCount}\n                onOpen={() => navigateTo(`/looks/${look.id}`)}\n                showActions\n              />\n            ))}\n          </div>\n        )}\n      </section>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}