npm - @burdenoff/microfe-coolandlovely - Versions diffs - 2026.706.1 → 2026.706.2 - Mend

@burdenoff/microfe-coolandlovely 2026.706.1 → 2026.706.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (66) hide show

package/dist/coolandlovely/pages/brands/BrandDetailPage.js CHANGED Viewed

@@ -8,13 +8,14 @@ import { useBrand as s, useTransitionBrand as c } from "../../hooks/useCoolAndLo
 import "../../hooks/index.js";
 import { formatDate as l, formatPrice as u, titleCase as d } from "../../utils/formatters.js";
 import { TagList as f } from "../../components/TagList.js";
-import { categoryIcon as p } from "../../utils/icons.js";
-import { ArrowLeft as m, ExternalLink as h, Loader2 as g, Pencil as _, Shapes as v, Shirt as y, Star as b, Store as x } from "lucide-react";
-import { useParams as S } from "react-router-dom";
-import { jsx as C, jsxs as w } from "react/jsx-runtime";
-import { GlassCard as T } from "@burdenoff/fe-libs/ui";
+import { Comments as p } from "../../components/Comments.js";
+import { categoryIcon as m } from "../../utils/icons.js";
+import { ArrowLeft as h, ExternalLink as g, Loader2 as _, Pencil as v, Plus as y, Shapes as b, Shirt as x, Star as S, Store as C } from "lucide-react";
+import { useParams as w } from "react-router-dom";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
+import { GlassCard as D } from "@burdenoff/fe-libs/ui";
 //#region src/coolandlovely/pages/brands/BrandDetailPage.tsx
-var E = {
+var O = {
 	DRAFT: ["PENDING_REVIEW", "ARCHIVED"],
 	PENDING_REVIEW: [
 		"PUBLISHED",
@@ -25,282 +26,303 @@ var E = {
 	SUSPENDED: ["PUBLISHED", "ARCHIVED"],
 	ARCHIVED: []
 };
-function D() {
-	let { brandId: D } = S(), { navigateTo: O } = e(), k = s(D), A = c();
-	if (k.isLoading) return /* @__PURE__ */ C(n, {
+function k() {
+	let { brandId: k } = w(), { navigateTo: A } = e(), j = s(k), M = c();
+	if (j.isLoading) return /* @__PURE__ */ T(n, {
 		title: "Brand",
-		children: /* @__PURE__ */ C(a, { label: "Loading brand…" })
+		children: /* @__PURE__ */ T(a, { label: "Loading brand…" })
 	});
-	if (k.isError || !k.data) return /* @__PURE__ */ C(n, {
+	if (j.isError || !j.data) return /* @__PURE__ */ T(n, {
 		title: "Brand",
-		children: /* @__PURE__ */ C(i, {
+		children: /* @__PURE__ */ T(i, {
 			title: "Brand not found",
 			message: "This storefront could not be loaded or does not exist.",
-			onRetry: () => void k.refetch()
+			onRetry: () => void j.refetch()
 		})
 	});
-	let j = k.data, M = j.collections ?? [], N = j.items ?? [], P = E[j.status];
-	return /* @__PURE__ */ C(n, {
-		title: j.name,
-		description: `@${j.handle}`,
-		actions: /* @__PURE__ */ w("div", {
-			className: "flex items-center gap-2",
-			children: [/* @__PURE__ */ w("button", {
+	let N = j.data, P = N.collections ?? [], F = N.items ?? [], I = O[N.status], L = N.websiteUrl && /^https?:\/\//i.test(N.websiteUrl) ? N.websiteUrl : void 0;
+	return /* @__PURE__ */ T(n, {
+		title: N.name,
+		description: `@${N.handle}`,
+		actions: /* @__PURE__ */ E("div", {
+			className: "flex flex-wrap items-center gap-2",
+			children: [/* @__PURE__ */ E("button", {
 				type: "button",
-				onClick: () => O("/brands"),
+				onClick: () => A("/brands"),
 				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__ */ C(m, { className: "h-4 w-4" }), " Back"]
-			}), /* @__PURE__ */ w("button", {
+				children: [/* @__PURE__ */ T(h, { className: "h-4 w-4" }), " Back"]
+			}), /* @__PURE__ */ E("button", {
 				type: "button",
-				onClick: () => O(`/brands/${j.id}/edit`),
+				onClick: () => A(`/brands/${N.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__ */ C(_, { className: "h-4 w-4" }), " Edit"]
+				children: [/* @__PURE__ */ T(v, { className: "h-4 w-4" }), " Edit"]
 			})]
 		}),
-		children: /* @__PURE__ */ w("div", {
+		children: /* @__PURE__ */ E("div", {
 			className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
-			children: [/* @__PURE__ */ w("div", {
+			children: [/* @__PURE__ */ E("div", {
 				className: "lg:col-span-2",
 				children: [
-					/* @__PURE__ */ w(T, {
+					/* @__PURE__ */ E(D, {
 						treatment: "glass",
 						className: "overflow-hidden p-0",
-						children: [/* @__PURE__ */ C(o, {
-							icon: /* @__PURE__ */ C(x, { className: "h-12 w-12" }),
-							seed: j.id,
+						children: [/* @__PURE__ */ T(o, {
+							icon: /* @__PURE__ */ T(C, { className: "h-12 w-12" }),
+							seed: N.id,
+							fileId: N.cover?.id ?? N.logo?.id,
+							alt: N.name,
 							className: "h-44 w-full"
-						}), /* @__PURE__ */ w("div", {
+						}), /* @__PURE__ */ E("div", {
 							className: "p-6",
 							children: [
-								/* @__PURE__ */ w("div", {
+								/* @__PURE__ */ E("div", {
 									className: "flex items-center gap-2",
 									children: [
-										/* @__PURE__ */ C("h2", {
+										/* @__PURE__ */ T("h2", {
 											className: "text-xl font-semibold text-text-primary",
-											children: j.name
+											children: N.name
 										}),
-										j.isFeatured && /* @__PURE__ */ C(b, { className: "h-4 w-4 fill-status-warning-text text-status-warning-text" }),
-										/* @__PURE__ */ C(r, {
-											status: j.status,
+										N.isFeatured && /* @__PURE__ */ T(S, { className: "h-4 w-4 fill-status-warning-text text-status-warning-text" }),
+										/* @__PURE__ */ T(r, {
+											status: N.status,
 											className: "ml-auto"
 										})
 									]
 								}),
-								j.tagline && /* @__PURE__ */ C("p", {
+								N.tagline && /* @__PURE__ */ T("p", {
 									className: "mt-2 text-sm text-text-primary",
-									children: j.tagline
+									children: N.tagline
 								}),
-								j.bio && /* @__PURE__ */ C("p", {
+								N.bio && /* @__PURE__ */ T("p", {
 									className: "mt-3 text-sm text-text-secondary",
-									children: j.bio
+									children: N.bio
 								}),
-								j.aesthetics.length > 0 && /* @__PURE__ */ w("div", {
+								N.aesthetics.length > 0 && /* @__PURE__ */ E("div", {
 									className: "mt-4",
-									children: [/* @__PURE__ */ C("p", {
+									children: [/* @__PURE__ */ T("p", {
 										className: "mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary",
 										children: "Aesthetics"
-									}), /* @__PURE__ */ C(f, {
-										tags: j.aesthetics.map(d),
+									}), /* @__PURE__ */ T(f, {
+										tags: N.aesthetics.map(d),
 										tone: "accent",
 										max: 12
 									})]
 								}),
-								j.tags.length > 0 && /* @__PURE__ */ w("div", {
+								N.tags.length > 0 && /* @__PURE__ */ E("div", {
 									className: "mt-3",
-									children: [/* @__PURE__ */ C("p", {
+									children: [/* @__PURE__ */ T("p", {
 										className: "mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary",
 										children: "Tags"
-									}), /* @__PURE__ */ C(f, {
-										tags: j.tags,
+									}), /* @__PURE__ */ T(f, {
+										tags: N.tags,
 										max: 12
 									})]
 								}),
-								j.websiteUrl && /* @__PURE__ */ w("a", {
-									href: j.websiteUrl,
+								L ? /* @__PURE__ */ E("a", {
+									href: L,
 									target: "_blank",
-									rel: "noreferrer",
-									className: "mt-4 inline-flex items-center gap-1.5 text-sm font-medium text-primary hover:underline",
+									rel: "noopener noreferrer",
+									className: "mt-4 inline-flex max-w-full items-center gap-1.5 text-sm font-medium text-action-primary-bg hover:underline",
 									children: [
-										/* @__PURE__ */ C(h, { className: "h-4 w-4" }),
+										/* @__PURE__ */ T(g, { className: "h-4 w-4 shrink-0" }),
 										" ",
-										j.websiteUrl
+										/* @__PURE__ */ T("span", {
+											className: "break-all",
+											children: L
+										})
 									]
-								})
+								}) : N.websiteUrl ? /* @__PURE__ */ T("p", {
+									className: "mt-4 break-all text-sm text-text-secondary",
+									children: N.websiteUrl
+								}) : null
 							]
 						})]
 					}),
-					/* @__PURE__ */ w("section", {
+					/* @__PURE__ */ E("section", {
 						className: "mt-6",
-						children: [/* @__PURE__ */ C("div", {
-							className: "mb-3 flex items-center justify-between",
-							children: /* @__PURE__ */ w("h3", {
+						children: [/* @__PURE__ */ E("div", {
+							className: "mb-3 flex items-center justify-between gap-2",
+							children: [/* @__PURE__ */ E("h3", {
 								className: "flex items-center gap-2 text-lg font-semibold text-text-primary",
 								children: [
-									/* @__PURE__ */ C(v, { className: "h-5 w-5" }),
+									/* @__PURE__ */ T(b, { className: "h-5 w-5" }),
 									" Collections (",
-									M.length,
+									P.length,
 									")"
 								]
-							})
-						}), M.length === 0 ? /* @__PURE__ */ C("p", {
+							}), /* @__PURE__ */ E("button", {
+								type: "button",
+								onClick: () => A(`/collections/new?brandId=${N.id}`),
+								className: "inline-flex shrink-0 items-center gap-1.5 rounded-lg border border-border-seam px-3 py-1.5 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken",
+								children: [/* @__PURE__ */ T(y, { className: "h-4 w-4" }), " Add collection"]
+							})]
+						}), P.length === 0 ? /* @__PURE__ */ T("p", {
 							className: "rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary",
 							children: "No collections yet."
-						}) : /* @__PURE__ */ C("div", {
+						}) : /* @__PURE__ */ T("div", {
 							className: "grid grid-cols-1 gap-3 sm:grid-cols-2",
-							children: M.map((e) => /* @__PURE__ */ w("button", {
+							children: P.map((e) => /* @__PURE__ */ E("button", {
 								type: "button",
-								onClick: () => O(`/collections/${e.id}`),
+								onClick: () => A(`/collections/${e.id}`),
 								className: "flex items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-3 text-left transition-colors hover:bg-bg-sunken/50",
 								children: [
-									/* @__PURE__ */ C(o, {
-										icon: /* @__PURE__ */ C(v, { className: "h-5 w-5" }),
+									/* @__PURE__ */ T(o, {
+										icon: /* @__PURE__ */ T(b, { className: "h-5 w-5" }),
 										seed: e.id,
+										fileId: e.cover?.id,
+										alt: e.name,
 										className: "h-11 w-11 shrink-0"
 									}),
-									/* @__PURE__ */ w("div", {
+									/* @__PURE__ */ E("div", {
 										className: "min-w-0 flex-1",
-										children: [/* @__PURE__ */ C("p", {
+										children: [/* @__PURE__ */ T("p", {
 											className: "truncate text-sm font-medium text-text-primary",
 											children: e.name
-										}), /* @__PURE__ */ C("p", {
+										}), /* @__PURE__ */ T("p", {
 											className: "text-xs text-text-secondary",
 											children: d(e.season)
 										})]
 									}),
-									/* @__PURE__ */ C(r, { status: e.status })
+									/* @__PURE__ */ T(r, { status: e.status })
 								]
 							}, e.id))
 						})]
 					}),
-					/* @__PURE__ */ w("section", {
+					/* @__PURE__ */ E("section", {
 						className: "mt-6",
-						children: [/* @__PURE__ */ w("h3", {
+						children: [/* @__PURE__ */ E("h3", {
 							className: "mb-3 flex items-center gap-2 text-lg font-semibold text-text-primary",
 							children: [
-								/* @__PURE__ */ C(y, { className: "h-5 w-5" }),
+								/* @__PURE__ */ T(x, { className: "h-5 w-5" }),
 								" Style items (",
-								N.length,
+								F.length,
 								")"
 							]
-						}), N.length === 0 ? /* @__PURE__ */ C("p", {
+						}), F.length === 0 ? /* @__PURE__ */ T("p", {
 							className: "rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary",
 							children: "No items yet."
-						}) : /* @__PURE__ */ C("div", {
+						}) : /* @__PURE__ */ T("div", {
 							className: "grid grid-cols-2 gap-3 sm:grid-cols-3",
-							children: N.map((e) => /* @__PURE__ */ w("button", {
+							children: F.map((e) => /* @__PURE__ */ E("button", {
 								type: "button",
-								onClick: () => O(`/items/${e.id}`),
+								onClick: () => A(`/items/${e.id}`),
 								className: "overflow-hidden rounded-lg border border-border-seam bg-bg-surface text-left transition-all hover:border-accent-foreground/20 hover:shadow-md",
-								children: [/* @__PURE__ */ C(o, {
-									icon: p(e.category, 24),
+								children: [/* @__PURE__ */ T(o, {
+									icon: m(e.category, 24),
 									seed: e.id,
+									fileId: e.image?.id,
+									alt: e.name,
 									className: "h-24 w-full"
-								}), /* @__PURE__ */ w("div", {
+								}), /* @__PURE__ */ E("div", {
 									className: "p-3",
-									children: [/* @__PURE__ */ C("p", {
+									children: [/* @__PURE__ */ T("p", {
 										className: "truncate text-sm font-medium text-text-primary",
 										children: e.name
-									}), /* @__PURE__ */ C("p", {
+									}), /* @__PURE__ */ T("p", {
 										className: "mt-0.5 text-xs text-text-secondary",
 										children: u(e.price, e.currency)
 									})]
 								})]
 							}, e.id))
 						})]
+					}),
+					/* @__PURE__ */ T(p, {
+						entityType: "CooBrand",
+						entityId: N.id
 					})
 				]
-			}), /* @__PURE__ */ w("div", {
+			}), /* @__PURE__ */ E("div", {
 				className: "space-y-4",
-				children: [/* @__PURE__ */ w(T, {
+				children: [/* @__PURE__ */ E(D, {
 					treatment: "insight",
 					className: "p-5",
 					children: [
-						/* @__PURE__ */ C("h3", {
+						/* @__PURE__ */ T("h3", {
 							className: "mb-3 text-sm font-semibold text-text-primary",
 							children: "Lifecycle"
 						}),
-						/* @__PURE__ */ w("div", {
+						/* @__PURE__ */ E("div", {
 							className: "mb-3 flex items-center gap-2",
-							children: [/* @__PURE__ */ C("span", {
+							children: [/* @__PURE__ */ T("span", {
 								className: "text-sm text-text-secondary",
 								children: "Current:"
-							}), /* @__PURE__ */ C(r, { status: j.status })]
+							}), /* @__PURE__ */ T(r, { status: N.status })]
 						}),
-						P.length === 0 ? /* @__PURE__ */ C("p", {
+						I.length === 0 ? /* @__PURE__ */ T("p", {
 							className: "text-xs text-text-secondary",
 							children: "This brand is archived (terminal state)."
-						}) : /* @__PURE__ */ C("div", {
+						}) : /* @__PURE__ */ T("div", {
 							className: "flex flex-col gap-2",
-							children: P.map((e) => /* @__PURE__ */ w("button", {
+							children: I.map((e) => /* @__PURE__ */ E("button", {
 								type: "button",
-								disabled: A.isPending,
-								onClick: () => A.mutate({
-									id: j.id,
+								disabled: M.isPending,
+								onClick: () => M.mutate({
+									id: N.id,
 									status: e
 								}),
 								className: t("inline-flex items-center justify-center gap-2 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken disabled:opacity-50"),
 								children: [
-									A.isPending && /* @__PURE__ */ C(g, { className: "h-3.5 w-3.5 animate-spin" }),
+									M.isPending && /* @__PURE__ */ T(_, { className: "h-3.5 w-3.5 animate-spin" }),
 									"Move to ",
 									d(e)
 								]
 							}, e))
 						}),
-						A.isError && /* @__PURE__ */ C("p", {
+						M.isError && /* @__PURE__ */ T("p", {
 							className: "mt-2 text-xs text-status-error-text",
-							children: A.error instanceof Error ? A.error.message : "Transition failed"
+							children: M.error instanceof Error ? M.error.message : "Transition failed"
 						})
 					]
-				}), /* @__PURE__ */ w(T, {
+				}), /* @__PURE__ */ E(D, {
 					treatment: "plain",
 					className: "p-5",
-					children: [/* @__PURE__ */ C("h3", {
+					children: [/* @__PURE__ */ T("h3", {
 						className: "mb-3 text-sm font-semibold text-text-primary",
 						children: "Details"
-					}), /* @__PURE__ */ w("dl", {
+					}), /* @__PURE__ */ E("dl", {
 						className: "space-y-2 text-sm",
 						children: [
-							/* @__PURE__ */ w("div", {
+							/* @__PURE__ */ E("div", {
 								className: "flex justify-between gap-2",
-								children: [/* @__PURE__ */ C("dt", {
+								children: [/* @__PURE__ */ T("dt", {
 									className: "text-text-secondary",
 									children: "Handle"
-								}), /* @__PURE__ */ w("dd", {
+								}), /* @__PURE__ */ E("dd", {
 									className: "text-text-primary",
-									children: ["@", j.handle]
+									children: ["@", N.handle]
 								})]
 							}),
-							/* @__PURE__ */ w("div", {
+							/* @__PURE__ */ E("div", {
 								className: "flex justify-between gap-2",
-								children: [/* @__PURE__ */ C("dt", {
+								children: [/* @__PURE__ */ T("dt", {
 									className: "text-text-secondary",
 									children: "Featured"
-								}), /* @__PURE__ */ C("dd", {
+								}), /* @__PURE__ */ T("dd", {
 									className: "text-text-primary",
-									children: j.isFeatured ? "Yes" : "No"
+									children: N.isFeatured ? "Yes" : "No"
 								})]
 							}),
-							/* @__PURE__ */ w("div", {
+							/* @__PURE__ */ E("div", {
 								className: "flex justify-between gap-2",
-								children: [/* @__PURE__ */ C("dt", {
+								children: [/* @__PURE__ */ T("dt", {
 									className: "text-text-secondary",
 									children: "Created"
-								}), /* @__PURE__ */ C("dd", {
+								}), /* @__PURE__ */ T("dd", {
 									className: "text-text-primary",
-									children: l(j.createdAt, {
+									children: l(N.createdAt, {
 										hour: void 0,
 										minute: void 0
 									})
 								})]
 							}),
-							/* @__PURE__ */ w("div", {
+							/* @__PURE__ */ E("div", {
 								className: "flex justify-between gap-2",
-								children: [/* @__PURE__ */ C("dt", {
+								children: [/* @__PURE__ */ T("dt", {
 									className: "text-text-secondary",
 									children: "Updated"
-								}), /* @__PURE__ */ C("dd", {
+								}), /* @__PURE__ */ T("dd", {
 									className: "text-text-primary",
-									children: l(j.updatedAt, {
+									children: l(N.updatedAt, {
 										hour: void 0,
 										minute: void 0
 									})
@@ -314,6 +336,6 @@ function D() {
 	});
 }
 //#endregion
-export { D as BrandDetailPage };
+export { k as BrandDetailPage };
 //# sourceMappingURL=BrandDetailPage.js.map

package/dist/coolandlovely/pages/brands/BrandDetailPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BrandDetailPage.js","names":[],"sources":["../../../../src/coolandlovely/pages/brands/BrandDetailPage.tsx"],"sourcesContent":["/*\n Brand Detail Page\n * @module coolandlovely/pages/brands\n \n Renders a single brand storefront (`cooBrand`) with its publish-lifecycle\n * transitions (`cooTransitionBrand`), collections and style items.\n /\n\nimport { useParams } from 'react-router-dom';\nimport { Store, Star, ExternalLink, Pencil, ArrowLeft, Shapes, Shirt, Loader2 } 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 { useBrand, useTransitionBrand } from '../../hooks';\nimport { categoryIcon } from '../../utils/icons';\nimport { formatPrice, formatDate, titleCase } from '../../utils/formatters';\nimport { cn } from '../../utils/cn';\nimport type { CooBrandStatus } from '../../types';\n\n/* Allowed next states per the svc brand state machine (UX guidance only;\n * the service is the authority and rejects illegal jumps). /\nconst NEXT_STATES: Record<CooBrandStatus, CooBrandStatus[]> = {\n DRAFT: ['PENDING_REVIEW', 'ARCHIVED'],\n PENDING_REVIEW: ['PUBLISHED', 'DRAFT', 'ARCHIVED'],\n PUBLISHED: ['SUSPENDED', 'ARCHIVED'],\n SUSPENDED: ['PUBLISHED', 'ARCHIVED'],\n ARCHIVED: [],\n};\n\nexport function BrandDetailPage() {\n const { brandId } = useParams<{ brandId: string }>();\n const { navigateTo } = useCoolAndLovely();\n const query = useBrand(brandId);\n const transition = useTransitionBrand();\n\n if (query.isLoading) {\n return (\n <PageLayout title=\"Brand\">\n <LoadingView label=\"Loading brand…\" />\n </PageLayout>\n );\n }\n\n if (query.isError \|\| !query.data) {\n return (\n <PageLayout title=\"Brand\">\n <ErrorView\n title=\"Brand not found\"\n message=\"This storefront could not be loaded or does not exist.\"\n onRetry={() => void query.refetch()}\n />\n </PageLayout>\n );\n }\n\n const brand = query.data;\n const collections = brand.collections ?? [];\n const items = brand.items ?? [];\n const nextStates = NEXT_STATES[brand.status];\n\n return (\n <PageLayout\n title={brand.name}\n description={`@${brand.handle}`}\n actions={\n <div className=\"flex items-center gap-2\">\n <button\n type=\"button\"\n onClick={() => navigateTo('/brands')}\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(`/brands/${brand.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 </div>\n }\n >\n <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n {/ Main column /}\n <div className=\"lg:col-span-2\">\n <GlassCard treatment=\"glass\" className=\"overflow-hidden p-0\">\n <Thumbnail\n icon={<Store className=\"h-12 w-12\" />}\n seed={brand.id}\n className=\"h-44 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\">{brand.name}</h2>\n {brand.isFeatured && (\n <Star className=\"h-4 w-4 fill-status-warning-text text-status-warning-text\" />\n )}\n <StatusBadge status={brand.status} className=\"ml-auto\" />\n </div>\n {brand.tagline && <p className=\"mt-2 text-sm text-text-primary\">{brand.tagline}</p>}\n {brand.bio && <p className=\"mt-3 text-sm text-text-secondary\">{brand.bio}</p>}\n\n {brand.aesthetics.length > 0 && (\n <div className=\"mt-4\">\n <p className=\"mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n Aesthetics\n </p>\n <TagList tags={brand.aesthetics.map(titleCase)} tone=\"accent\" max={12} />\n </div>\n )}\n {brand.tags.length > 0 && (\n <div className=\"mt-3\">\n <p className=\"mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n Tags\n </p>\n <TagList tags={brand.tags} max={12} />\n </div>\n )}\n {brand.websiteUrl && (\n <a\n href={brand.websiteUrl}\n target=\"_blank\"\n rel=\"noreferrer\"\n className=\"mt-4 inline-flex items-center gap-1.5 text-sm font-medium text-primary hover:underline\"\n >\n <ExternalLink className=\"h-4 w-4\" /> {brand.websiteUrl}\n </a>\n )}\n </div>\n </GlassCard>\n\n {/ Collections /}\n <section className=\"mt-6\">\n <div className=\"mb-3 flex items-center justify-between\">\n <h3 className=\"flex items-center gap-2 text-lg font-semibold text-text-primary\">\n <Shapes className=\"h-5 w-5\" /> Collections ({collections.length})\n </h3>\n </div>\n {collections.length === 0 ? (\n <p className=\"rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary\">\n No collections yet.\n </p>\n ) : (\n <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n {collections.map((c) => (\n <button\n key={c.id}\n type=\"button\"\n onClick={() => navigateTo(`/collections/${c.id}`)}\n className=\"flex items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-3 text-left transition-colors hover:bg-bg-sunken/50\"\n >\n <Thumbnail\n icon={<Shapes className=\"h-5 w-5\" />}\n seed={c.id}\n className=\"h-11 w-11 shrink-0\"\n />\n <div className=\"min-w-0 flex-1\">\n <p className=\"truncate text-sm font-medium text-text-primary\">{c.name}</p>\n <p className=\"text-xs text-text-secondary\">{titleCase(c.season)}</p>\n </div>\n <StatusBadge status={c.status} />\n </button>\n ))}\n </div>\n )}\n </section>\n\n {/ Items /}\n <section className=\"mt-6\">\n <h3 className=\"mb-3 flex items-center gap-2 text-lg font-semibold text-text-primary\">\n <Shirt className=\"h-5 w-5\" /> Style items ({items.length})\n </h3>\n {items.length === 0 ? (\n <p className=\"rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary\">\n No items yet.\n </p>\n ) : (\n <div className=\"grid grid-cols-2 gap-3 sm:grid-cols-3\">\n {items.map((item) => (\n <button\n key={item.id}\n type=\"button\"\n onClick={() => navigateTo(`/items/${item.id}`)}\n className=\"overflow-hidden rounded-lg border border-border-seam bg-bg-surface text-left transition-all hover:border-accent-foreground/20 hover:shadow-md\"\n >\n <Thumbnail\n icon={categoryIcon(item.category, 24)}\n seed={item.id}\n className=\"h-24 w-full\"\n />\n <div className=\"p-3\">\n <p className=\"truncate text-sm font-medium text-text-primary\">{item.name}</p>\n <p className=\"mt-0.5 text-xs text-text-secondary\">\n {formatPrice(item.price, item.currency)}\n </p>\n </div>\n </button>\n ))}\n </div>\n )}\n </section>\n </div>\n\n {/ Sidebar */}\n <div className=\"space-y-4\">\n <GlassCard treatment=\"insight\" className=\"p-5\">\n <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">Lifecycle</h3>\n <div className=\"mb-3 flex items-center gap-2\">\n <span className=\"text-sm text-text-secondary\">Current:</span>\n <StatusBadge status={brand.status} />\n </div>\n {nextStates.length === 0 ? (\n <p className=\"text-xs text-text-secondary\">\n This brand is archived (terminal state).\n </p>\n ) : (\n <div className=\"flex flex-col gap-2\">\n {nextStates.map((next) => (\n <button\n key={next}\n type=\"button\"\n disabled={transition.isPending}\n onClick={() => transition.mutate({ id: brand.id, status: next })}\n className={cn(\n 'inline-flex items-center justify-center gap-2 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken disabled:opacity-50'\n )}\n >\n {transition.isPending && <Loader2 className=\"h-3.5 w-3.5 animate-spin\" />}\n Move to {titleCase(next)}\n </button>\n ))}\n </div>\n )}\n {transition.isError && (\n <p className=\"mt-2 text-xs text-status-error-text\">\n {transition.error instanceof Error ? transition.error.message : 'Transition failed'}\n </p>\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\">Handle</dt>\n <dd className=\"text-text-primary\">@{brand.handle}</dd>\n </div>\n <div className=\"flex justify-between gap-2\">\n <dt className=\"text-text-secondary\">Featured</dt>\n <dd className=\"text-text-primary\">{brand.isFeatured ? 'Yes' : 'No'}</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(brand.createdAt, { hour: undefined, minute: undefined })}\n </dd>\n </div>\n <div className=\"flex justify-between gap-2\">\n <dt className=\"text-text-secondary\">Updated</dt>\n <dd className=\"text-text-primary\">\n {formatDate(brand.updatedAt, { hour: undefined, minute: undefined })}\n </dd>\n </div>\n </dl>\n </GlassCard>\n </div>\n </div>\n </PageLayout>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"BrandDetailPage.js","names":[],"sources":["../../../../src/coolandlovely/pages/brands/BrandDetailPage.tsx"],"sourcesContent":["/*\n Brand Detail Page\n * @module coolandlovely/pages/brands\n \n Renders a single brand storefront (`cooBrand`) with its publish-lifecycle\n * transitions (`cooTransitionBrand`), collections and style items.\n /\n\nimport { useParams } from 'react-router-dom';\nimport {\n Store,\n Star,\n ExternalLink,\n Pencil,\n ArrowLeft,\n Shapes,\n Shirt,\n Loader2,\n Plus,\n} 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 { Comments } from '../../components/Comments';\nimport { useCoolAndLovely } from '../../context/CoolAndLovelyContext';\nimport { useBrand, useTransitionBrand } from '../../hooks';\nimport { categoryIcon } from '../../utils/icons';\nimport { formatPrice, formatDate, titleCase } from '../../utils/formatters';\nimport { cn } from '../../utils/cn';\nimport type { CooBrandStatus } from '../../types';\n\n/* Allowed next states per the svc brand state machine (UX guidance only;\n * the service is the authority and rejects illegal jumps). /\nconst NEXT_STATES: Record<CooBrandStatus, CooBrandStatus[]> = {\n DRAFT: ['PENDING_REVIEW', 'ARCHIVED'],\n PENDING_REVIEW: ['PUBLISHED', 'DRAFT', 'ARCHIVED'],\n PUBLISHED: ['SUSPENDED', 'ARCHIVED'],\n SUSPENDED: ['PUBLISHED', 'ARCHIVED'],\n ARCHIVED: [],\n};\n\nexport function BrandDetailPage() {\n const { brandId } = useParams<{ brandId: string }>();\n const { navigateTo } = useCoolAndLovely();\n const query = useBrand(brandId);\n const transition = useTransitionBrand();\n\n if (query.isLoading) {\n return (\n <PageLayout title=\"Brand\">\n <LoadingView label=\"Loading brand…\" />\n </PageLayout>\n );\n }\n\n if (query.isError \|\| !query.data) {\n return (\n <PageLayout title=\"Brand\">\n <ErrorView\n title=\"Brand not found\"\n message=\"This storefront could not be loaded or does not exist.\"\n onRetry={() => void query.refetch()}\n />\n </PageLayout>\n );\n }\n\n const brand = query.data;\n const collections = brand.collections ?? [];\n const items = brand.items ?? [];\n const nextStates = NEXT_STATES[brand.status];\n // Only render a website link for safe http(s) URLs (block javascript:/data: sinks).\n const safeWebsiteUrl =\n brand.websiteUrl && /^https?:\\/\\//i.test(brand.websiteUrl) ? brand.websiteUrl : undefined;\n\n return (\n <PageLayout\n title={brand.name}\n description={`@${brand.handle}`}\n actions={\n <div className=\"flex flex-wrap items-center gap-2\">\n <button\n type=\"button\"\n onClick={() => navigateTo('/brands')}\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(`/brands/${brand.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 </div>\n }\n >\n <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n {/ Main column /}\n <div className=\"lg:col-span-2\">\n <GlassCard treatment=\"glass\" className=\"overflow-hidden p-0\">\n <Thumbnail\n icon={<Store className=\"h-12 w-12\" />}\n seed={brand.id}\n fileId={brand.cover?.id ?? brand.logo?.id}\n alt={brand.name}\n className=\"h-44 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\">{brand.name}</h2>\n {brand.isFeatured && (\n <Star className=\"h-4 w-4 fill-status-warning-text text-status-warning-text\" />\n )}\n <StatusBadge status={brand.status} className=\"ml-auto\" />\n </div>\n {brand.tagline && <p className=\"mt-2 text-sm text-text-primary\">{brand.tagline}</p>}\n {brand.bio && <p className=\"mt-3 text-sm text-text-secondary\">{brand.bio}</p>}\n\n {brand.aesthetics.length > 0 && (\n <div className=\"mt-4\">\n <p className=\"mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n Aesthetics\n </p>\n <TagList tags={brand.aesthetics.map(titleCase)} tone=\"accent\" max={12} />\n </div>\n )}\n {brand.tags.length > 0 && (\n <div className=\"mt-3\">\n <p className=\"mb-1.5 text-xs font-medium uppercase tracking-wide text-text-secondary\">\n Tags\n </p>\n <TagList tags={brand.tags} max={12} />\n </div>\n )}\n {safeWebsiteUrl ? (\n <a\n href={safeWebsiteUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"mt-4 inline-flex max-w-full items-center gap-1.5 text-sm font-medium text-action-primary-bg hover:underline\"\n >\n <ExternalLink className=\"h-4 w-4 shrink-0\" />{' '}\n <span className=\"break-all\">{safeWebsiteUrl}</span>\n </a>\n ) : brand.websiteUrl ? (\n <p className=\"mt-4 break-all text-sm text-text-secondary\">{brand.websiteUrl}</p>\n ) : null}\n </div>\n </GlassCard>\n\n {/ Collections /}\n <section className=\"mt-6\">\n <div className=\"mb-3 flex items-center justify-between gap-2\">\n <h3 className=\"flex items-center gap-2 text-lg font-semibold text-text-primary\">\n <Shapes className=\"h-5 w-5\" /> Collections ({collections.length})\n </h3>\n <button\n type=\"button\"\n onClick={() => navigateTo(`/collections/new?brandId=${brand.id}`)}\n className=\"inline-flex shrink-0 items-center gap-1.5 rounded-lg border border-border-seam px-3 py-1.5 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken\"\n >\n <Plus className=\"h-4 w-4\" /> Add collection\n </button>\n </div>\n {collections.length === 0 ? (\n <p className=\"rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary\">\n No collections yet.\n </p>\n ) : (\n <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2\">\n {collections.map((c) => (\n <button\n key={c.id}\n type=\"button\"\n onClick={() => navigateTo(`/collections/${c.id}`)}\n className=\"flex items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-3 text-left transition-colors hover:bg-bg-sunken/50\"\n >\n <Thumbnail\n icon={<Shapes className=\"h-5 w-5\" />}\n seed={c.id}\n fileId={c.cover?.id}\n alt={c.name}\n className=\"h-11 w-11 shrink-0\"\n />\n <div className=\"min-w-0 flex-1\">\n <p className=\"truncate text-sm font-medium text-text-primary\">{c.name}</p>\n <p className=\"text-xs text-text-secondary\">{titleCase(c.season)}</p>\n </div>\n <StatusBadge status={c.status} />\n </button>\n ))}\n </div>\n )}\n </section>\n\n {/ Items /}\n <section className=\"mt-6\">\n <h3 className=\"mb-3 flex items-center gap-2 text-lg font-semibold text-text-primary\">\n <Shirt className=\"h-5 w-5\" /> Style items ({items.length})\n </h3>\n {items.length === 0 ? (\n <p className=\"rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary\">\n No items yet.\n </p>\n ) : (\n <div className=\"grid grid-cols-2 gap-3 sm:grid-cols-3\">\n {items.map((item) => (\n <button\n key={item.id}\n type=\"button\"\n onClick={() => navigateTo(`/items/${item.id}`)}\n className=\"overflow-hidden rounded-lg border border-border-seam bg-bg-surface text-left transition-all hover:border-accent-foreground/20 hover:shadow-md\"\n >\n <Thumbnail\n icon={categoryIcon(item.category, 24)}\n seed={item.id}\n fileId={item.image?.id}\n alt={item.name}\n className=\"h-24 w-full\"\n />\n <div className=\"p-3\">\n <p className=\"truncate text-sm font-medium text-text-primary\">{item.name}</p>\n <p className=\"mt-0.5 text-xs text-text-secondary\">\n {formatPrice(item.price, item.currency)}\n </p>\n </div>\n </button>\n ))}\n </div>\n )}\n </section>\n\n <Comments entityType=\"CooBrand\" entityId={brand.id} />\n </div>\n\n {/ Sidebar */}\n <div className=\"space-y-4\">\n <GlassCard treatment=\"insight\" className=\"p-5\">\n <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">Lifecycle</h3>\n <div className=\"mb-3 flex items-center gap-2\">\n <span className=\"text-sm text-text-secondary\">Current:</span>\n <StatusBadge status={brand.status} />\n </div>\n {nextStates.length === 0 ? (\n <p className=\"text-xs text-text-secondary\">\n This brand is archived (terminal state).\n </p>\n ) : (\n <div className=\"flex flex-col gap-2\">\n {nextStates.map((next) => (\n <button\n key={next}\n type=\"button\"\n disabled={transition.isPending}\n onClick={() => transition.mutate({ id: brand.id, status: next })}\n className={cn(\n 'inline-flex items-center justify-center gap-2 rounded-lg border border-border-seam px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-bg-sunken disabled:opacity-50'\n )}\n >\n {transition.isPending && <Loader2 className=\"h-3.5 w-3.5 animate-spin\" />}\n Move to {titleCase(next)}\n </button>\n ))}\n </div>\n )}\n {transition.isError && (\n <p className=\"mt-2 text-xs text-status-error-text\">\n {transition.error instanceof Error ? transition.error.message : 'Transition failed'}\n </p>\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\">Handle</dt>\n <dd className=\"text-text-primary\">@{brand.handle}</dd>\n </div>\n <div className=\"flex justify-between gap-2\">\n <dt className=\"text-text-secondary\">Featured</dt>\n <dd className=\"text-text-primary\">{brand.isFeatured ? 'Yes' : 'No'}</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(brand.createdAt, { hour: undefined, minute: undefined })}\n </dd>\n </div>\n <div className=\"flex justify-between gap-2\">\n <dt className=\"text-text-secondary\">Updated</dt>\n <dd className=\"text-text-primary\">\n {formatDate(brand.updatedAt, { hour: undefined, minute: undefined })}\n </dd>\n </div>\n </dl>\n </GlassCard>\n </div>\n </div>\n </PageLayout>\n );\n}\n"],"mappings":"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"}