@burdenoff/microfe-coolandlovely 2026.1024.2 → 2026.1024.3

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

@@ -12,188 +12,196 @@ import { LookCard as m } from "../../components/LookCard.js";
 import { categoryIcon as h } from "../../utils/icons.js";
 import { TagList as g } from "../../components/TagList.js";
 import { ColourSwatchRow as _ } from "../../components/ColourSwatchRow.js";
-import { Archive as v, ArrowLeft as y, ChevronRight as b, Loader2 as x, Pencil as S, Shapes as C } from "lucide-react";
-import { useParams as w } from "react-router";
-import { jsx as T, jsxs as E } from "react/jsx-runtime";
-import { GlassCard as D } from "@burdenoff/fe-libs/ui";
+import { AddToCartPanel as v } from "../../components/AddToCartPanel.js";
+import { Archive as y, ArrowLeft as b, ChevronRight as x, Loader2 as S, Pencil as C, Shapes as w } from "lucide-react";
+import { useParams as T, useSearchParams as E } from "react-router";
+import { jsx as D, jsxs as O } from "react/jsx-runtime";
+import { GlassCard as k } from "@burdenoff/fe-libs/ui";
 //#region src/coolandlovely/pages/items/StyleItemDetailPage.tsx
-function O() {
-	let { itemId: O } = w(), { navigateTo: k } = e(), A = i(O), j = r({ pagination: {
+function A() {
+	let { itemId: A } = T(), [j] = E(), M = j.get("look"), { navigateTo: N } = e(), P = i(A), F = r({ pagination: {
 		limit: 100,
 		offset: 0
-	} }), M = n();
-	if (a(O, A.data?.name), A.isLoading) return /* @__PURE__ */ T(t, {
+	} }), I = n();
+	if (a(A, P.data?.name), P.isLoading) return /* @__PURE__ */ D(t, {
 		title: "Style item",
-		children: /* @__PURE__ */ T(c, { label: "Loading item…" })
+		children: /* @__PURE__ */ D(c, { label: "Loading item…" })
 	});
-	if (A.isError || !A.data) return /* @__PURE__ */ T(t, {
+	if (P.isError || !P.data) return /* @__PURE__ */ D(t, {
 		title: "Style item",
-		children: /* @__PURE__ */ T(s, {
+		children: /* @__PURE__ */ D(s, {
 			title: "Item not found",
-			onRetry: () => void A.refetch()
+			onRetry: () => void P.refetch()
 		})
 	});
-	let N = A.data, P = N.status === "RETIRED", F = (j.data?.items ?? []).filter((e) => e.items?.some((e) => e.styleItemId === N.id)).slice(0, 4);
-	return /* @__PURE__ */ E(t, {
-		title: N.name,
-		description: N.brand?.name ?? void 0,
-		actions: /* @__PURE__ */ E("div", {
+	let L = P.data, R = L.status === "RETIRED", z = (F.data?.items ?? []).filter((e) => e.items?.some((e) => e.styleItemId === L.id)).slice(0, 4);
+	return /* @__PURE__ */ O(t, {
+		title: L.name,
+		description: L.brand?.name ?? void 0,
+		actions: /* @__PURE__ */ O("div", {
 			className: "flex flex-wrap items-center gap-2",
 			children: [
-				/* @__PURE__ */ E("button", {
+				/* @__PURE__ */ O("button", {
 					type: "button",
-					onClick: () => k("/items"),
+					onClick: () => N("/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__ */ T(y, { className: "h-4 w-4" }), " Back"]
+					children: [/* @__PURE__ */ D(b, { className: "h-4 w-4" }), " Back"]
 				}),
-				/* @__PURE__ */ T(u, { styleItemId: N.id }),
-				/* @__PURE__ */ E("button", {
+				/* @__PURE__ */ D(u, { styleItemId: L.id }),
+				/* @__PURE__ */ O("button", {
 					type: "button",
-					onClick: () => k(`/items/${N.id}/edit`),
+					onClick: () => N(`/items/${L.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__ */ T(S, { className: "h-4 w-4" }), " Edit"]
+					children: [/* @__PURE__ */ D(C, { className: "h-4 w-4" }), " Edit"]
 				}),
-				!P && /* @__PURE__ */ E("button", {
+				!R && /* @__PURE__ */ O("button", {
 					type: "button",
-					disabled: M.isPending,
-					onClick: () => M.mutate(N.id, { onSuccess: () => k("/items") }),
+					disabled: I.isPending,
+					onClick: () => I.mutate(L.id, { onSuccess: () => N("/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: [M.isPending ? /* @__PURE__ */ T(x, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ T(v, { className: "h-4 w-4" }), "Archive"]
+					children: [I.isPending ? /* @__PURE__ */ D(S, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ D(y, { className: "h-4 w-4" }), "Archive"]
 				})
 			]
 		}),
-		children: [/* @__PURE__ */ E("div", {
+		children: [/* @__PURE__ */ O("div", {
 			className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
-			children: [/* @__PURE__ */ T("div", {
+			children: [/* @__PURE__ */ D("div", {
 				className: "lg:col-span-2",
-				children: /* @__PURE__ */ E(D, {
+				children: /* @__PURE__ */ O(k, {
 					treatment: "glass",
 					className: "group overflow-hidden p-0",
-					children: [/* @__PURE__ */ T(l, {
-						icon: h(N.category, 48),
-						seed: N.id,
-						fileId: N.image?.id,
-						alt: N.name,
+					children: [/* @__PURE__ */ D(l, {
+						icon: h(L.category, 48),
+						seed: L.id,
+						fileId: L.image?.id,
+						alt: L.name,
 						className: "aspect-[4/5] w-full"
-					}), N.description && /* @__PURE__ */ T("div", {
+					}), L.description && /* @__PURE__ */ D("div", {
 						className: "p-6",
-						children: /* @__PURE__ */ T("p", {
+						children: /* @__PURE__ */ D("p", {
 							className: "text-sm leading-relaxed text-text-secondary",
-							children: N.description
+							children: L.description
 						})
 					})]
 				})
-			}), /* @__PURE__ */ E("div", {
+			}), /* @__PURE__ */ O("div", {
 				className: "space-y-4",
 				children: [
-					/* @__PURE__ */ E(D, {
+					/* @__PURE__ */ O(k, {
 						treatment: "glass",
 						className: "space-y-5 p-6",
 						children: [
-							/* @__PURE__ */ E("div", { children: [
-								/* @__PURE__ */ T("h2", {
+							/* @__PURE__ */ O("div", { children: [
+								/* @__PURE__ */ D("h2", {
 									className: "text-2xl font-semibold leading-tight text-text-primary",
-									children: N.name
+									children: L.name
 								}),
-								N.brand && /* @__PURE__ */ E("button", {
+								L.brand && /* @__PURE__ */ O("button", {
 									type: "button",
-									onClick: () => k(`/brands/${N.brand?.id}`),
+									onClick: () => N(`/brands/${L.brand?.id}`),
 									className: "mt-1 inline-flex items-center gap-0.5 text-sm font-medium text-action-primary-bg hover:underline",
-									children: [N.brand.name, /* @__PURE__ */ T(b, { className: "h-3.5 w-3.5" })]
+									children: [L.brand.name, /* @__PURE__ */ D(x, { className: "h-3.5 w-3.5" })]
 								}),
-								/* @__PURE__ */ E("div", {
+								/* @__PURE__ */ O("div", {
 									className: "mt-3 flex flex-wrap items-center justify-between gap-2",
-									children: [/* @__PURE__ */ E("p", {
+									children: [/* @__PURE__ */ O("p", {
 										className: "text-3xl font-bold text-text-primary tabular-nums",
-										children: [f(N.price, N.currency), /* @__PURE__ */ T("span", {
+										children: [f(L.price, L.currency), /* @__PURE__ */ D("span", {
 											className: "ml-2 text-base font-medium text-text-secondary",
-											children: N.currency
+											children: L.currency
 										})]
-									}), /* @__PURE__ */ T(o, { status: N.status })]
+									}), /* @__PURE__ */ D(o, { status: L.status })]
 								})
 							] }),
-							/* @__PURE__ */ T("div", { className: "border-t border-border-seam" }),
-							N.colours.length > 0 && /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+							/* @__PURE__ */ D("div", { className: "border-t border-border-seam" }),
+							L.colours.length > 0 && /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("p", {
 								className: "mb-2 text-xs font-medium uppercase tracking-wide text-text-secondary",
 								children: "Colours"
-							}), /* @__PURE__ */ T(_, {
-								colours: N.colours,
+							}), /* @__PURE__ */ D(_, {
+								colours: L.colours,
 								max: 12
 							})] }),
-							N.sizes.length > 0 && /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+							L.sizes.length > 0 && /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("p", {
 								className: "mb-2 text-xs font-medium uppercase tracking-wide text-text-secondary",
 								children: "Size"
-							}), /* @__PURE__ */ T("div", {
+							}), /* @__PURE__ */ D("div", {
 								className: "flex flex-wrap gap-2",
-								children: N.sizes.map((e) => /* @__PURE__ */ T("span", {
+								children: L.sizes.map((e) => /* @__PURE__ */ D("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))
 							})] }),
-							N.materials.length > 0 && /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+							/* @__PURE__ */ D("div", {
+								className: "border-t border-border-seam pt-5",
+								children: /* @__PURE__ */ D(v, {
+									item: L,
+									lookId: M
+								})
+							}),
+							L.materials.length > 0 && /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("p", {
 								className: "mb-1 text-xs font-medium uppercase tracking-wide text-text-secondary",
 								children: "Materials"
-							}), /* @__PURE__ */ T("p", {
+							}), /* @__PURE__ */ D("p", {
 								className: "text-sm text-text-primary",
-								children: N.materials.join(", ")
+								children: L.materials.join(", ")
 							})] }),
-							N.tags.length > 0 && /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+							L.tags.length > 0 && /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("p", {
 								className: "mb-2 text-xs font-medium uppercase tracking-wide text-text-secondary",
 								children: "Tags"
-							}), /* @__PURE__ */ T(g, {
-								tags: N.tags,
+							}), /* @__PURE__ */ D(g, {
+								tags: L.tags,
 								max: 12,
 								tone: "accent"
 							})] })
 						]
 					}),
-					/* @__PURE__ */ E(D, {
+					/* @__PURE__ */ O(k, {
 						treatment: "plain",
 						className: "p-5",
-						children: [/* @__PURE__ */ T("h3", {
+						children: [/* @__PURE__ */ D("h3", {
 							className: "mb-3 text-sm font-semibold text-text-primary",
 							children: "Details"
-						}), /* @__PURE__ */ E("dl", {
+						}), /* @__PURE__ */ O("dl", {
 							className: "space-y-2 text-sm",
 							children: [
-								/* @__PURE__ */ E("div", {
+								/* @__PURE__ */ O("div", {
 									className: "flex justify-between gap-2",
-									children: [/* @__PURE__ */ T("dt", {
+									children: [/* @__PURE__ */ D("dt", {
 										className: "text-text-secondary",
 										children: "Category"
-									}), /* @__PURE__ */ T("dd", {
+									}), /* @__PURE__ */ D("dd", {
 										className: "text-text-primary",
-										children: p(N.category)
+										children: p(L.category)
 									})]
 								}),
-								/* @__PURE__ */ E("div", {
+								/* @__PURE__ */ O("div", {
 									className: "flex justify-between gap-2",
-									children: [/* @__PURE__ */ T("dt", {
+									children: [/* @__PURE__ */ D("dt", {
 										className: "text-text-secondary",
 										children: "SKU"
-									}), /* @__PURE__ */ T("dd", {
+									}), /* @__PURE__ */ D("dd", {
 										className: "text-text-primary",
-										children: N.sku ?? "—"
+										children: L.sku ?? "—"
 									})]
 								}),
-								/* @__PURE__ */ E("div", {
+								/* @__PURE__ */ O("div", {
 									className: "flex justify-between gap-2",
-									children: [/* @__PURE__ */ T("dt", {
+									children: [/* @__PURE__ */ D("dt", {
 										className: "text-text-secondary",
 										children: "Currency"
-									}), /* @__PURE__ */ T("dd", {
+									}), /* @__PURE__ */ D("dd", {
 										className: "text-text-primary",
-										children: N.currency
+										children: L.currency
 									})]
 								}),
-								/* @__PURE__ */ E("div", {
+								/* @__PURE__ */ O("div", {
 									className: "flex justify-between gap-2",
-									children: [/* @__PURE__ */ T("dt", {
+									children: [/* @__PURE__ */ D("dt", {
 										className: "text-text-secondary",
 										children: "Created"
-									}), /* @__PURE__ */ T("dd", {
+									}), /* @__PURE__ */ D("dd", {
 										className: "text-text-primary",
-										children: d(N.createdAt, {
+										children: d(L.createdAt, {
 											hour: void 0,
 											minute: void 0
 										})
@@ -202,20 +210,20 @@ function O() {
 							]
 						})]
 					}),
-					N.collection && /* @__PURE__ */ E("button", {
+					L.collection && /* @__PURE__ */ O("button", {
 						type: "button",
-						onClick: () => k(`/collections/${N.collection?.id}`),
+						onClick: () => N(`/collections/${L.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__ */ T(l, {
-							icon: /* @__PURE__ */ T(C, { className: "h-5 w-5" }),
-							seed: N.collection.id,
+						children: [/* @__PURE__ */ D(l, {
+							icon: /* @__PURE__ */ D(w, { className: "h-5 w-5" }),
+							seed: L.collection.id,
 							className: "h-10 w-10 shrink-0"
-						}), /* @__PURE__ */ E("div", {
+						}), /* @__PURE__ */ O("div", {
 							className: "min-w-0",
-							children: [/* @__PURE__ */ T("p", {
+							children: [/* @__PURE__ */ D("p", {
 								className: "truncate text-sm font-medium text-text-primary",
-								children: N.collection.name
-							}), /* @__PURE__ */ T("p", {
+								children: L.collection.name
+							}), /* @__PURE__ */ D("p", {
 								className: "truncate text-xs text-text-secondary",
 								children: "View collection"
 							})]
@@ -223,28 +231,28 @@ function O() {
 					})
 				]
 			})]
-		}), /* @__PURE__ */ E("section", {
+		}), /* @__PURE__ */ O("section", {
 			className: "mt-8",
-			children: [/* @__PURE__ */ E("div", {
+			children: [/* @__PURE__ */ O("div", {
 				className: "mb-3 flex items-center justify-between gap-3",
-				children: [/* @__PURE__ */ T("h3", {
+				children: [/* @__PURE__ */ D("h3", {
 					className: "text-lg font-semibold text-text-primary",
 					children: "Appears in looks"
-				}), F.length > 0 && /* @__PURE__ */ E("button", {
+				}), z.length > 0 && /* @__PURE__ */ O("button", {
 					type: "button",
-					onClick: () => k("/looks"),
+					onClick: () => N("/looks"),
 					className: "inline-flex items-center gap-1 text-sm font-medium text-action-primary-bg hover:underline",
-					children: ["View all ", /* @__PURE__ */ T(b, { className: "h-3.5 w-3.5" })]
+					children: ["View all ", /* @__PURE__ */ D(x, { className: "h-3.5 w-3.5" })]
 				})]
-			}), j.isLoading ? /* @__PURE__ */ E("div", {
+			}), F.isLoading ? /* @__PURE__ */ O("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__ */ T(x, { className: "h-4 w-4 animate-spin" }), " Loading referenced looks…"]
-			}) : F.length === 0 ? /* @__PURE__ */ T("p", {
+				children: [/* @__PURE__ */ D(S, { className: "h-4 w-4 animate-spin" }), " Loading referenced looks…"]
+			}) : z.length === 0 ? /* @__PURE__ */ D("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__ */ T("div", {
+			}) : /* @__PURE__ */ D("div", {
 				className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
-				children: F.map((e) => /* @__PURE__ */ T(m, {
+				children: z.map((e) => /* @__PURE__ */ D(m, {
 					id: e.id,
 					title: e.title,
 					occasion: e.occasion,
@@ -252,7 +260,7 @@ function O() {
 					likeCount: e.likeCount,
 					isLikedByMe: e.isLikedByMe,
 					isSavedByMe: e.isSavedByMe,
-					onOpen: () => k(`/looks/${e.id}`),
+					onOpen: () => N(`/looks/${e.id}`),
 					showActions: !0
 				}, e.id))
 			})]
@@ -260,6 +268,6 @@ function O() {
 	});
 }
 //#endregion
-export { O as StyleItemDetailPage };
+export { A 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';\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 {\n  useAssistantEntityName,\n  useStyleItem,\n  useArchiveStyleItem,\n  useLooksWithItems,\n} 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  // Name the piece for the assistant's screen context (see useAssistantEntity).\n  useAssistantEntityName(itemId, query.data?.name);\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                isLikedByMe={look.isLikedByMe}\n                isSavedByMe={look.isSavedByMe}\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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"}
+{"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, useSearchParams } from 'react-router';\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 { AddToCartPanel } from '../../components/AddToCartPanel';\nimport { useCoolAndLovely } from '../../context/CoolAndLovelyContext';\nimport {\n  useAssistantEntityName,\n  useStyleItem,\n  useArchiveStyleItem,\n  useLooksWithItems,\n} 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  // \"Shop the look\" links carry the look id so the look's creator earns the commission.\n  const [searchParams] = useSearchParams();\n  const fromLookId = searchParams.get('look');\n  const { navigateTo } = useCoolAndLovely();\n  const query = useStyleItem(itemId);\n  const looksQuery = useLooksWithItems({ pagination: { limit: 100, offset: 0 } });\n  const archive = useArchiveStyleItem();\n  // Name the piece for the assistant's screen context (see useAssistantEntity).\n  useAssistantEntityName(itemId, query.data?.name);\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            <div className=\"border-t border-border-seam pt-5\">\n              <AddToCartPanel item={item} lookId={fromLookId} />\n            </div>\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                isLikedByMe={look.isLikedByMe}\n                isSavedByMe={look.isSavedByMe}\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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"}

package/dist/coolandlovely/pages/items/StyleItemFormPage.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Style Item Create / Edit Page
+ * @module coolandlovely/pages/items
+ *
+ * Drives `cooCreateStyleItem` (new) and `cooUpdateStyleItem` (edit).
+ * Brand selection is required on create (and locked on edit). The collection
+ * select is scoped to the chosen brand.
+ */
+export declare function StyleItemFormPage(): import("react").JSX.Element;
+//# sourceMappingURL=StyleItemFormPage.d.ts.map

package/dist/coolandlovely/pages/items/StyleItemFormPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyleItemFormPage.d.ts","sourceRoot":"","sources":["../../../../src/coolandlovely/pages/items/StyleItemFormPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAuDH,wBAAgB,iBAAiB,gCAwThC"}

package/dist/coolandlovely/pages/items/StyleItemsListPage.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Style Items List Page
+ * @module coolandlovely/pages/items
+ *
+ * Cursor-paginated catalogue (`cooListStyleItems`) with category & status
+ * filters. Cards link to the item detail page.
+ */
+export declare function StyleItemsListPage(): import("react").JSX.Element;
+//# sourceMappingURL=StyleItemsListPage.d.ts.map

package/dist/coolandlovely/pages/items/StyleItemsListPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyleItemsListPage.d.ts","sourceRoot":"","sources":["../../../../src/coolandlovely/pages/items/StyleItemsListPage.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAwBH,wBAAgB,kBAAkB,gCAqMjC"}

package/dist/coolandlovely/pages/lookbooks/LookbookDetailPage.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Lookbook Detail Page
+ * @module coolandlovely/pages/lookbooks
+ *
+ * Single lookbook (`cooLookbook`) rendered as a Pinterest-style masonry board.
+ * Each entry's `lookId` / `styleItemId` is resolved client-side against the
+ * already-fetched looks/items lists to a real title + image, with an optional
+ * note badge and a hover X-remove (`cooRemoveLookbookEntry`). New entries are
+ * added inline (`cooAddLookbookEntry`).
+ */
+export declare function LookbookDetailPage(): import("react").JSX.Element;
+//# sourceMappingURL=LookbookDetailPage.d.ts.map

package/dist/coolandlovely/pages/lookbooks/LookbookDetailPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LookbookDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/coolandlovely/pages/lookbooks/LookbookDetailPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AA6BH,wBAAgB,kBAAkB,gCAsSjC"}

package/dist/coolandlovely/pages/lookbooks/LookbooksListPage.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Lookbooks List Page
+ * @module coolandlovely/pages/lookbooks
+ *
+ * Lists themed lookbook boards (`cooListLookbooks`) as mood-board cards — a
+ * cover, a visibility chip and (when the list selection carries entries) an
+ * item count — and supports creating one inline (`cooCreateLookbook`).
+ */
+export declare function LookbooksListPage(): import("react").JSX.Element;
+//# sourceMappingURL=LookbooksListPage.d.ts.map

package/dist/coolandlovely/pages/lookbooks/LookbooksListPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LookbooksListPage.d.ts","sourceRoot":"","sources":["../../../../src/coolandlovely/pages/lookbooks/LookbooksListPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAmBH,wBAAgB,iBAAiB,gCAwLhC"}

package/dist/coolandlovely/pages/looks/LookDetailPage.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Look Detail Page
+ * @module coolandlovely/pages/looks
+ *
+ * Single look (`cooLook`) with its look items, a true-toggle like
+ * (`cooLikeLook` / `cooUnlikeLook`), a true-toggle save (`cooSaveLook` /
+ * `cooUnsaveLook`), publish (`cooPublishLook`) and delete (`cooDeleteLook`)
+ * actions.
+ */
+export declare function LookDetailPage(): import("react").JSX.Element;
+//# sourceMappingURL=LookDetailPage.d.ts.map

package/dist/coolandlovely/pages/looks/LookDetailPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LookDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/coolandlovely/pages/looks/LookDetailPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAwFH,wBAAgB,cAAc,gCA6R7B"}

package/dist/coolandlovely/pages/looks/LookDetailPage.js

@@ -210,7 +210,7 @@ function B() {
 								price: e.styleItem.price,
 								currency: e.styleItem.currency,
 								imageFileId: e.styleItem.image?.id,
-								onOpen: () => w(`/items/${e.styleItem?.id}`)
+								onOpen: () => w(`/items/${e.styleItem?.id}?look=${q.id}`)
 							}, e.id) : /* @__PURE__ */ F("div", {
 								className: "flex flex-col justify-center rounded-xl border border-border-seam bg-bg-surface p-4",
 								children: [/* @__PURE__ */ P("p", {