@burdenoff/microfe-coolandlovely 2026.625.2 → 2026.628.1

package/dist/coolandlovely/pages/collaborations/CollaborationDetailPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollaborationDetailPage.js","names":[],"sources":["../../../../src/coolandlovely/pages/collaborations/CollaborationDetailPage.tsx"],"sourcesContent":["/**\n * Collaboration Detail Page\n * @module coolandlovely/pages/collaborations\n *\n * Single collaboration (`cooCollaboration`) with validated lifecycle\n * transitions (`cooTransitionCollaboration`), its brand and attributed looks.\n */\n\nimport { useParams } from 'react-router-dom';\nimport { ArrowLeft, Loader2, Handshake, Store, Sparkles } 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 { useCollaboration, useTransitionCollaboration } from '../../hooks';\nimport { formatPrice, formatDate, titleCase } from '../../utils/formatters';\nimport type { CooCollaborationStatus } from '../../types';\n\n/** Allowed next states per the svc collaboration state machine (UX guidance;\n *  the service is authoritative and rejects illegal jumps). */\nconst NEXT_STATES: Record<CooCollaborationStatus, CooCollaborationStatus[]> = {\n  PROPOSED: ['ACCEPTED', 'DECLINED', 'CANCELLED'],\n  ACCEPTED: ['IN_PROGRESS', 'CANCELLED'],\n  IN_PROGRESS: ['PUBLISHED', 'CANCELLED'],\n  PUBLISHED: [],\n  DECLINED: [],\n  CANCELLED: [],\n};\n\nexport function CollaborationDetailPage() {\n  const { collaborationId } = useParams<{ collaborationId: string }>();\n  const { navigateTo } = useCoolAndLovely();\n  const query = useCollaboration(collaborationId);\n  const transition = useTransitionCollaboration();\n\n  if (query.isLoading) {\n    return (\n      <PageLayout title=\"Collaboration\">\n        <LoadingView label=\"Loading collaboration…\" />\n      </PageLayout>\n    );\n  }\n\n  if (query.isError || !query.data) {\n    return (\n      <PageLayout title=\"Collaboration\">\n        <ErrorView title=\"Collaboration not found\" onRetry={() => void query.refetch()} />\n      </PageLayout>\n    );\n  }\n\n  const collab = query.data;\n  const looks = collab.looks ?? [];\n  const nextStates = NEXT_STATES[collab.status];\n\n  return (\n    <PageLayout\n      title={collab.title}\n      description={collab.brand?.name ?? undefined}\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => navigateTo('/collaborations')}\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      }\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=\"p-6\">\n            <div className=\"flex items-center gap-3\">\n              <Thumbnail icon={<Handshake className=\"h-6 w-6\" />} seed={collab.id} className=\"h-12 w-12 shrink-0\" />\n              <div className=\"min-w-0 flex-1\">\n                <h2 className=\"truncate text-xl font-semibold text-text-primary\">{collab.title}</h2>\n                <p className=\"text-xs text-text-secondary\">{titleCase(collab.role)} collaboration</p>\n              </div>\n              <StatusBadge status={collab.status} />\n            </div>\n            {collab.brief && <p className=\"mt-4 text-sm text-text-secondary\">{collab.brief}</p>}\n            {collab.tags.length > 0 && <TagList tags={collab.tags} className=\"mt-4\" tone=\"accent\" />}\n          </GlassCard>\n\n          {/* Attributed looks */}\n          <section className=\"mt-6\">\n            <h3 className=\"mb-3 text-lg font-semibold text-text-primary\">\n              Attributed looks ({looks.length})\n            </h3>\n            {looks.length === 0 ? (\n              <p className=\"rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary\">\n                No looks attributed to this collaboration yet.\n              </p>\n            ) : (\n              <div className=\"grid grid-cols-2 gap-3 sm:grid-cols-3\">\n                {looks.map((look) => (\n                  <button\n                    key={look.id}\n                    type=\"button\"\n                    onClick={() => navigateTo(`/looks/${look.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 icon={<Sparkles className=\"h-6 w-6\" />} seed={look.id} className=\"h-24 w-full\" />\n                    <div className=\"p-3\">\n                      <p className=\"truncate text-sm font-medium text-text-primary\">{look.title}</p>\n                      <p className=\"mt-0.5 text-xs text-text-secondary\">{titleCase(look.occasion)}</p>\n                    </div>\n                  </button>\n                ))}\n              </div>\n            )}\n          </section>\n        </div>\n\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={collab.status} />\n            </div>\n            {nextStates.length === 0 ? (\n              <p className=\"text-xs text-text-secondary\">This collaboration is in a terminal state.</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: collab.id, status: next })}\n                    className=\"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                    {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\">Terms</h3>\n            <dl className=\"space-y-2 text-sm\">\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Role</dt>\n                <dd className=\"text-text-primary\">{titleCase(collab.role)}</dd>\n              </div>\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Compensation</dt>\n                <dd className=\"text-text-primary\">{formatPrice(collab.compensation, collab.currency)}</dd>\n              </div>\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Starts</dt>\n                <dd className=\"text-text-primary\">\n                  {collab.startDate\n                    ? formatDate(collab.startDate, { hour: undefined, minute: undefined })\n                    : '—'}\n                </dd>\n              </div>\n              <div className=\"flex justify-between gap-2\">\n                <dt className=\"text-text-secondary\">Ends</dt>\n                <dd className=\"text-text-primary\">\n                  {collab.endDate\n                    ? formatDate(collab.endDate, { hour: undefined, minute: undefined })\n                    : '—'}\n                </dd>\n              </div>\n            </dl>\n          </GlassCard>\n\n          {collab.brand && (\n            <button\n              type=\"button\"\n              onClick={() => navigateTo(`/brands/${collab.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 icon={<Store className=\"h-5 w-5\" />} seed={collab.brand.id} className=\"h-10 w-10 shrink-0\" />\n              <div className=\"min-w-0\">\n                <p className=\"truncate text-sm font-medium text-text-primary\">{collab.brand.name}</p>\n                <p className=\"truncate text-xs text-text-secondary\">View brand</p>\n              </div>\n            </button>\n          )}\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/coolandlovely/pages/collaborations/CollaborationFormPage.js

@@ -0,0 +1,206 @@
+import { useCoolAndLovely as e } from "../../context/CoolAndLovelyContext.js";
+import { PageLayout as t } from "../../components/PageLayout.js";
+import { useBrands as n, useCreateCollaboration as r } from "../../hooks/useCoolAndLovelyApi.js";
+import "../../hooks/index.js";
+import { parseCsv as i, titleCase as a } from "../../utils/formatters.js";
+import { SelectField as o, TextAreaField as s, TextField as c } from "../../components/Field.js";
+import { useMemo as l, useState as u } from "react";
+import { ArrowLeft as d, Handshake as f, Loader2 as p, Save as m } from "lucide-react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { GlassCard as _ } from "@burdenoff/fe-libs/ui";
+//#region src/coolandlovely/pages/collaborations/CollaborationFormPage.tsx
+var v = [
+	"CREATOR",
+	"BRAND",
+	"STYLIST",
+	"PHOTOGRAPHER"
+];
+function y(e) {
+	if (!e) return;
+	let t = new Date(e);
+	return Number.isNaN(t.getTime()) ? void 0 : t.toISOString();
+}
+function b() {
+	let { navigateTo: b, currentUser: x } = e(), S = r(), C = n({ pagination: {
+		limit: 100,
+		offset: 0
+	} }), [w, T] = u({
+		brandId: "",
+		creatorId: x?.id ?? "",
+		title: "",
+		brief: "",
+		role: "CREATOR",
+		compensation: "",
+		currency: "USD",
+		tags: "",
+		startDate: "",
+		endDate: ""
+	}), [E, D] = u({}), O = (e, t) => T((n) => ({
+		...n,
+		[e]: t
+	})), k = l(() => (C.data?.items ?? []).map((e) => ({
+		value: e.id,
+		label: e.name
+	})), [C.data]), A = v.map((e) => ({
+		value: e,
+		label: a(e)
+	})), j = () => {
+		let e = {};
+		return w.title.trim() || (e.title = "Title is required"), w.brandId || (e.brandId = "Brand is required"), w.creatorId.trim() || (e.creatorId = "Creator is required"), w.compensation && Number.isNaN(Number(w.compensation)) && (e.compensation = "Must be a number"), D(e), Object.keys(e).length === 0;
+	};
+	return /* @__PURE__ */ h(t, {
+		title: "New collaboration",
+		description: "Propose a brand × creator partnership",
+		actions: /* @__PURE__ */ g("button", {
+			type: "button",
+			onClick: () => b("/collaborations"),
+			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__ */ h(d, { className: "h-4 w-4" }), " Cancel"]
+		}),
+		children: /* @__PURE__ */ h("form", {
+			onSubmit: (e) => {
+				e.preventDefault(), j() && S.mutate({
+					brandId: w.brandId,
+					creatorId: w.creatorId.trim(),
+					title: w.title.trim(),
+					brief: w.brief.trim() || void 0,
+					role: w.role,
+					compensation: w.compensation ? Number(w.compensation) : void 0,
+					currency: w.currency.trim() || void 0,
+					tags: i(w.tags),
+					startDate: y(w.startDate),
+					endDate: y(w.endDate)
+				}, { onSuccess: (e) => b(`/collaborations/${e.id}`) });
+			},
+			className: "mx-auto max-w-2xl",
+			children: /* @__PURE__ */ g(_, {
+				treatment: "plain",
+				className: "p-6",
+				children: [
+					/* @__PURE__ */ g("div", {
+						className: "mb-6 flex items-center gap-3",
+						children: [/* @__PURE__ */ h("div", {
+							className: "flex h-11 w-11 items-center justify-center rounded-lg bg-status-warning-bg-subtle text-status-warning-text",
+							children: /* @__PURE__ */ h(f, { className: "h-5 w-5" })
+						}), /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("h2", {
+							className: "text-base font-semibold text-text-primary",
+							children: "Collaboration details"
+						}), /* @__PURE__ */ h("p", {
+							className: "text-xs text-text-secondary",
+							children: "Created in the Proposed state."
+						})] })]
+					}),
+					/* @__PURE__ */ g("div", {
+						className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
+						children: [/* @__PURE__ */ h(o, {
+							id: "brandId",
+							label: "Brand",
+							value: w.brandId,
+							onChange: (e) => O("brandId", e),
+							options: k,
+							required: !0,
+							placeholder: C.isLoading ? "Loading brands…" : "Select a brand",
+							error: E.brandId
+						}), /* @__PURE__ */ h(o, {
+							id: "role",
+							label: "Role",
+							value: w.role,
+							onChange: (e) => O("role", e),
+							options: A
+						})]
+					}),
+					/* @__PURE__ */ h(c, {
+						id: "title",
+						label: "Title",
+						value: w.title,
+						onChange: (e) => O("title", e),
+						placeholder: "Summer capsule edit",
+						required: !0,
+						error: E.title,
+						className: "mt-4"
+					}),
+					/* @__PURE__ */ h(c, {
+						id: "creatorId",
+						label: "Creator ID",
+						value: w.creatorId,
+						onChange: (e) => O("creatorId", e),
+						placeholder: "creator user id",
+						required: !0,
+						hint: "Defaults to you. Paste another user's id to credit a different creator.",
+						error: E.creatorId,
+						className: "mt-4"
+					}),
+					/* @__PURE__ */ h(s, {
+						id: "brief",
+						label: "Brief",
+						value: w.brief,
+						onChange: (e) => O("brief", e),
+						placeholder: "What is this collaboration about…",
+						rows: 4,
+						className: "mt-4"
+					}),
+					/* @__PURE__ */ g("div", {
+						className: "mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2",
+						children: [/* @__PURE__ */ h(c, {
+							id: "compensation",
+							label: "Compensation",
+							type: "number",
+							value: w.compensation,
+							onChange: (e) => O("compensation", e),
+							placeholder: "0.00",
+							error: E.compensation
+						}), /* @__PURE__ */ h(c, {
+							id: "currency",
+							label: "Currency",
+							value: w.currency,
+							onChange: (e) => O("currency", e),
+							placeholder: "USD"
+						})]
+					}),
+					/* @__PURE__ */ g("div", {
+						className: "mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2",
+						children: [/* @__PURE__ */ h(c, {
+							id: "startDate",
+							label: "Start date",
+							type: "date",
+							value: w.startDate,
+							onChange: (e) => O("startDate", e)
+						}), /* @__PURE__ */ h(c, {
+							id: "endDate",
+							label: "End date",
+							type: "date",
+							value: w.endDate,
+							onChange: (e) => O("endDate", e)
+						})]
+					}),
+					/* @__PURE__ */ h(c, {
+						id: "tags",
+						label: "Tags",
+						value: w.tags,
+						onChange: (e) => O("tags", e),
+						placeholder: "capsule, sustainable",
+						hint: "Comma-separated",
+						className: "mt-4"
+					}),
+					S.isError && /* @__PURE__ */ h("p", {
+						className: "mt-4 rounded-lg bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text",
+						children: S.error instanceof Error ? S.error.message : "Something went wrong"
+					}),
+					/* @__PURE__ */ h("div", {
+						className: "mt-6 flex justify-end gap-2",
+						children: /* @__PURE__ */ g("button", {
+							type: "submit",
+							disabled: S.isPending,
+							className: "inline-flex items-center gap-1.5 rounded-lg bg-action-primary-bg px-5 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90 disabled:opacity-50",
+							children: [S.isPending ? /* @__PURE__ */ h(p, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ h(m, { className: "h-4 w-4" }), "Create collaboration"]
+						})
+					})
+				]
+			})
+		})
+	});
+}
+//#endregion
+export { b as CollaborationFormPage };
+
+//# sourceMappingURL=CollaborationFormPage.js.map

package/dist/coolandlovely/pages/collaborations/CollaborationFormPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollaborationFormPage.js","names":[],"sources":["../../../../src/coolandlovely/pages/collaborations/CollaborationFormPage.tsx"],"sourcesContent":["/**\n * Collaboration Create Page\n * @module coolandlovely/pages/collaborations\n *\n * Drives `cooCreateCollaboration`. Brand and creator are required by the svc\n * input; the creator defaults to the current user (you propose as a creator)\n * but can be overridden.\n */\n\nimport { useMemo, useState } from 'react';\nimport { ArrowLeft, Loader2, Save, Handshake } from 'lucide-react';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../../components/PageLayout';\nimport { TextField, TextAreaField, SelectField } from '../../components/Field';\nimport { useCoolAndLovely } from '../../context/CoolAndLovelyContext';\nimport { useCreateCollaboration, useBrands } from '../../hooks';\nimport { parseCsv, titleCase } from '../../utils/formatters';\nimport type { CooCollaboratorRole } from '../../types';\n\nconst ROLES: CooCollaboratorRole[] = ['CREATOR', 'BRAND', 'STYLIST', 'PHOTOGRAPHER'];\n\ninterface FormState {\n  brandId: string;\n  creatorId: string;\n  title: string;\n  brief: string;\n  role: CooCollaboratorRole;\n  compensation: string;\n  currency: string;\n  tags: string;\n  startDate: string;\n  endDate: string;\n}\n\nfunction toIso(date: string): string | undefined {\n  if (!date) return undefined;\n  const d = new Date(date);\n  return Number.isNaN(d.getTime()) ? undefined : d.toISOString();\n}\n\nexport function CollaborationFormPage() {\n  const { navigateTo, currentUser } = useCoolAndLovely();\n  const createCollaboration = useCreateCollaboration();\n  const brands = useBrands({ pagination: { limit: 100, offset: 0 } });\n\n  const [form, setForm] = useState<FormState>({\n    brandId: '',\n    creatorId: currentUser?.id ?? '',\n    title: '',\n    brief: '',\n    role: 'CREATOR',\n    compensation: '',\n    currency: 'USD',\n    tags: '',\n    startDate: '',\n    endDate: '',\n  });\n  const [errors, setErrors] = useState<Partial<Record<keyof FormState, string>>>({});\n\n  const setField = <K extends keyof FormState>(key: K, value: FormState[K]) =>\n    setForm((f) => ({ ...f, [key]: value }));\n\n  const brandOptions = useMemo(\n    () => (brands.data?.items ?? []).map((b) => ({ value: b.id, label: b.name })),\n    [brands.data]\n  );\n  const roleOptions = ROLES.map((r) => ({ value: r, label: titleCase(r) }));\n\n  const validate = (): boolean => {\n    const next: Partial<Record<keyof FormState, string>> = {};\n    if (!form.title.trim()) next.title = 'Title is required';\n    if (!form.brandId) next.brandId = 'Brand is required';\n    if (!form.creatorId.trim()) next.creatorId = 'Creator is required';\n    if (form.compensation && Number.isNaN(Number(form.compensation)))\n      next.compensation = 'Must be a number';\n    setErrors(next);\n    return Object.keys(next).length === 0;\n  };\n\n  const handleSubmit = (e: React.FormEvent) => {\n    e.preventDefault();\n    if (!validate()) return;\n\n    createCollaboration.mutate(\n      {\n        brandId: form.brandId,\n        creatorId: form.creatorId.trim(),\n        title: form.title.trim(),\n        brief: form.brief.trim() || undefined,\n        role: form.role,\n        compensation: form.compensation ? Number(form.compensation) : undefined,\n        currency: form.currency.trim() || undefined,\n        tags: parseCsv(form.tags),\n        startDate: toIso(form.startDate),\n        endDate: toIso(form.endDate),\n      },\n      { onSuccess: (c) => navigateTo(`/collaborations/${c.id}`) }\n    );\n  };\n\n  return (\n    <PageLayout\n      title=\"New collaboration\"\n      description=\"Propose a brand × creator partnership\"\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => navigateTo('/collaborations')}\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\" /> Cancel\n        </button>\n      }\n    >\n      <form onSubmit={handleSubmit} className=\"mx-auto max-w-2xl\">\n        <GlassCard treatment=\"plain\" className=\"p-6\">\n          <div className=\"mb-6 flex items-center gap-3\">\n            <div className=\"flex h-11 w-11 items-center justify-center rounded-lg bg-status-warning-bg-subtle text-status-warning-text\">\n              <Handshake className=\"h-5 w-5\" />\n            </div>\n            <div>\n              <h2 className=\"text-base font-semibold text-text-primary\">Collaboration details</h2>\n              <p className=\"text-xs text-text-secondary\">Created in the Proposed state.</p>\n            </div>\n          </div>\n\n          <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n            <SelectField\n              id=\"brandId\"\n              label=\"Brand\"\n              value={form.brandId}\n              onChange={(v) => setField('brandId', v)}\n              options={brandOptions}\n              required\n              placeholder={brands.isLoading ? 'Loading brands…' : 'Select a brand'}\n              error={errors.brandId}\n            />\n            <SelectField\n              id=\"role\"\n              label=\"Role\"\n              value={form.role}\n              onChange={(v) => setField('role', v as CooCollaboratorRole)}\n              options={roleOptions}\n            />\n          </div>\n\n          <TextField\n            id=\"title\"\n            label=\"Title\"\n            value={form.title}\n            onChange={(v) => setField('title', v)}\n            placeholder=\"Summer capsule edit\"\n            required\n            error={errors.title}\n            className=\"mt-4\"\n          />\n\n          <TextField\n            id=\"creatorId\"\n            label=\"Creator ID\"\n            value={form.creatorId}\n            onChange={(v) => setField('creatorId', v)}\n            placeholder=\"creator user id\"\n            required\n            hint=\"Defaults to you. Paste another user's id to credit a different creator.\"\n            error={errors.creatorId}\n            className=\"mt-4\"\n          />\n\n          <TextAreaField\n            id=\"brief\"\n            label=\"Brief\"\n            value={form.brief}\n            onChange={(v) => setField('brief', v)}\n            placeholder=\"What is this collaboration about…\"\n            rows={4}\n            className=\"mt-4\"\n          />\n\n          <div className=\"mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2\">\n            <TextField\n              id=\"compensation\"\n              label=\"Compensation\"\n              type=\"number\"\n              value={form.compensation}\n              onChange={(v) => setField('compensation', v)}\n              placeholder=\"0.00\"\n              error={errors.compensation}\n            />\n            <TextField\n              id=\"currency\"\n              label=\"Currency\"\n              value={form.currency}\n              onChange={(v) => setField('currency', v)}\n              placeholder=\"USD\"\n            />\n          </div>\n\n          <div className=\"mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2\">\n            <TextField\n              id=\"startDate\"\n              label=\"Start date\"\n              type=\"date\"\n              value={form.startDate}\n              onChange={(v) => setField('startDate', v)}\n            />\n            <TextField\n              id=\"endDate\"\n              label=\"End date\"\n              type=\"date\"\n              value={form.endDate}\n              onChange={(v) => setField('endDate', v)}\n            />\n          </div>\n\n          <TextField\n            id=\"tags\"\n            label=\"Tags\"\n            value={form.tags}\n            onChange={(v) => setField('tags', v)}\n            placeholder=\"capsule, sustainable\"\n            hint=\"Comma-separated\"\n            className=\"mt-4\"\n          />\n\n          {createCollaboration.isError && (\n            <p className=\"mt-4 rounded-lg bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text\">\n              {createCollaboration.error instanceof Error\n                ? createCollaboration.error.message\n                : 'Something went wrong'}\n            </p>\n          )}\n\n          <div className=\"mt-6 flex justify-end gap-2\">\n            <button\n              type=\"submit\"\n              disabled={createCollaboration.isPending}\n              className=\"inline-flex items-center gap-1.5 rounded-lg bg-action-primary-bg px-5 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90 disabled:opacity-50\"\n            >\n              {createCollaboration.isPending ? (\n                <Loader2 className=\"h-4 w-4 animate-spin\" />\n              ) : (\n                <Save className=\"h-4 w-4\" />\n              )}\n              Create collaboration\n            </button>\n          </div>\n        </GlassCard>\n      </form>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/coolandlovely/pages/collaborations/CollaborationsListPage.js

@@ -0,0 +1,129 @@
+import { useCoolAndLovely as e } from "../../context/CoolAndLovelyContext.js";
+import { cn as t } from "../../utils/cn.js";
+import { PageLayout as n } from "../../components/PageLayout.js";
+import { StatusBadge as r } from "../../components/StatusBadge.js";
+import { ErrorView as i, LoadingView as a } from "../../components/StateViews.js";
+import { Thumbnail as o } from "../../components/Thumbnail.js";
+import { useCollaborations as s } from "../../hooks/useCoolAndLovelyApi.js";
+import "../../hooks/index.js";
+import { formatDate as c, formatPrice as l, titleCase as u } from "../../utils/formatters.js";
+import { EmptyState as d } from "../../components/EmptyState.js";
+import { useState as f } from "react";
+import { Handshake as p, Plus as m } from "lucide-react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+//#region src/coolandlovely/pages/collaborations/CollaborationsListPage.tsx
+var _ = [
+	{
+		value: "ALL",
+		label: "All"
+	},
+	{
+		value: "PROPOSED",
+		label: "Proposed"
+	},
+	{
+		value: "ACCEPTED",
+		label: "Accepted"
+	},
+	{
+		value: "IN_PROGRESS",
+		label: "In progress"
+	},
+	{
+		value: "PUBLISHED",
+		label: "Published"
+	},
+	{
+		value: "DECLINED",
+		label: "Declined"
+	},
+	{
+		value: "CANCELLED",
+		label: "Cancelled"
+	}
+];
+function v() {
+	let { navigateTo: v } = e(), [y, b] = f("ALL"), x = s({ status: y === "ALL" ? void 0 : y }), S = x.data ?? [];
+	return /* @__PURE__ */ g(n, {
+		title: "Collaborations",
+		description: "Brand × creator partnerships with a real lifecycle",
+		actions: /* @__PURE__ */ g("button", {
+			type: "button",
+			onClick: () => v("/collaborations/new"),
+			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__ */ h(m, { className: "h-4 w-4" }), " New collaboration"]
+		}),
+		children: [/* @__PURE__ */ h("div", {
+			className: "mb-6 flex flex-wrap items-center gap-2",
+			children: _.map((e) => /* @__PURE__ */ h("button", {
+				type: "button",
+				onClick: () => b(e.value),
+				className: t("rounded-full px-3 py-1.5 text-sm font-medium transition-colors", y === e.value ? "bg-action-primary-bg text-action-primary-text" : "bg-bg-sunken text-text-secondary hover:text-text-primary"),
+				children: e.label
+			}, e.value))
+		}), x.isLoading ? /* @__PURE__ */ h(a, { label: "Loading collaborations…" }) : x.isError ? /* @__PURE__ */ h(i, { onRetry: () => void x.refetch() }) : S.length === 0 ? /* @__PURE__ */ h(d, {
+			illustration: "empty-data",
+			icon: /* @__PURE__ */ h(p, { className: "h-10 w-10" }),
+			title: "No collaborations yet",
+			description: "Propose a brand × creator partnership to get started.",
+			action: /* @__PURE__ */ g("button", {
+				type: "button",
+				onClick: () => v("/collaborations/new"),
+				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",
+				children: [/* @__PURE__ */ h(m, { className: "h-4 w-4" }), " New collaboration"]
+			})
+		}) : /* @__PURE__ */ h("div", {
+			className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3",
+			children: S.map((e) => /* @__PURE__ */ g("button", {
+				type: "button",
+				onClick: () => v(`/collaborations/${e.id}`),
+				className: "flex flex-col rounded-lg border border-border-seam bg-bg-surface p-4 text-left shadow-sm transition-all hover:border-accent-foreground/20 hover:shadow-md",
+				children: [
+					/* @__PURE__ */ g("div", {
+						className: "flex items-start gap-3",
+						children: [
+							/* @__PURE__ */ h(o, {
+								icon: /* @__PURE__ */ h(p, { className: "h-5 w-5" }),
+								seed: e.id,
+								className: "h-11 w-11 shrink-0"
+							}),
+							/* @__PURE__ */ g("div", {
+								className: "min-w-0 flex-1",
+								children: [/* @__PURE__ */ h("h3", {
+									className: "truncate text-base font-semibold text-text-primary",
+									children: e.title
+								}), e.brand?.name && /* @__PURE__ */ h("p", {
+									className: "truncate text-xs text-text-secondary",
+									children: e.brand.name
+								})]
+							}),
+							/* @__PURE__ */ h(r, { status: e.status })
+						]
+					}),
+					e.brief && /* @__PURE__ */ h("p", {
+						className: "mt-3 line-clamp-2 text-sm text-text-secondary",
+						children: e.brief
+					}),
+					/* @__PURE__ */ g("div", {
+						className: "mt-3 flex items-center justify-between text-xs text-text-secondary",
+						children: [/* @__PURE__ */ h("span", {
+							className: "rounded-full bg-bg-sunken px-2 py-0.5",
+							children: u(e.role)
+						}), /* @__PURE__ */ h("span", { children: l(e.compensation, e.currency) })]
+					}),
+					e.startDate && /* @__PURE__ */ g("p", {
+						className: "mt-2 text-xs text-text-secondary",
+						children: ["Starts ", c(e.startDate, {
+							hour: void 0,
+							minute: void 0
+						})]
+					})
+				]
+			}, e.id))
+		})]
+	});
+}
+//#endregion
+export { v as CollaborationsListPage };
+
+//# sourceMappingURL=CollaborationsListPage.js.map

package/dist/coolandlovely/pages/collaborations/CollaborationsListPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollaborationsListPage.js","names":[],"sources":["../../../../src/coolandlovely/pages/collaborations/CollaborationsListPage.tsx"],"sourcesContent":["/**\n * Collaborations List Page\n * @module coolandlovely/pages/collaborations\n *\n * Lists brand × creator partnerships (`cooListCollaborations`) with status\n * filter.\n */\n\nimport { useState } from 'react';\nimport { Plus, Handshake } from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { EmptyState } from '../../components/EmptyState';\nimport { LoadingView, ErrorView } from '../../components/StateViews';\nimport { Thumbnail } from '../../components/Thumbnail';\nimport { useCoolAndLovely } from '../../context/CoolAndLovelyContext';\nimport { useCollaborations } from '../../hooks';\nimport { formatPrice, formatDate, titleCase } from '../../utils/formatters';\nimport { cn } from '../../utils/cn';\nimport type { CooCollaborationStatus } from '../../types';\n\nconst STATUS_OPTIONS: Array<{ value: CooCollaborationStatus | 'ALL'; label: string }> = [\n  { value: 'ALL', label: 'All' },\n  { value: 'PROPOSED', label: 'Proposed' },\n  { value: 'ACCEPTED', label: 'Accepted' },\n  { value: 'IN_PROGRESS', label: 'In progress' },\n  { value: 'PUBLISHED', label: 'Published' },\n  { value: 'DECLINED', label: 'Declined' },\n  { value: 'CANCELLED', label: 'Cancelled' },\n];\n\nexport function CollaborationsListPage() {\n  const { navigateTo } = useCoolAndLovely();\n  const [status, setStatus] = useState<CooCollaborationStatus | 'ALL'>('ALL');\n\n  const query = useCollaborations({ status: status === 'ALL' ? undefined : status });\n  const collaborations = query.data ?? [];\n\n  return (\n    <PageLayout\n      title=\"Collaborations\"\n      description=\"Brand × creator partnerships with a real lifecycle\"\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => navigateTo('/collaborations/new')}\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          <Plus className=\"h-4 w-4\" /> New collaboration\n        </button>\n      }\n    >\n      <div className=\"mb-6 flex flex-wrap items-center gap-2\">\n        {STATUS_OPTIONS.map((opt) => (\n          <button\n            key={opt.value}\n            type=\"button\"\n            onClick={() => setStatus(opt.value)}\n            className={cn(\n              'rounded-full px-3 py-1.5 text-sm font-medium transition-colors',\n              status === opt.value\n                ? 'bg-action-primary-bg text-action-primary-text'\n                : 'bg-bg-sunken text-text-secondary hover:text-text-primary'\n            )}\n          >\n            {opt.label}\n          </button>\n        ))}\n      </div>\n\n      {query.isLoading ? (\n        <LoadingView label=\"Loading collaborations…\" />\n      ) : query.isError ? (\n        <ErrorView onRetry={() => void query.refetch()} />\n      ) : collaborations.length === 0 ? (\n        <EmptyState\n          illustration=\"empty-data\"\n          icon={<Handshake className=\"h-10 w-10\" />}\n          title=\"No collaborations yet\"\n          description=\"Propose a brand × creator partnership to get started.\"\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigateTo('/collaborations/new')}\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\"\n            >\n              <Plus className=\"h-4 w-4\" /> New collaboration\n            </button>\n          }\n        />\n      ) : (\n        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n          {collaborations.map((c) => (\n            <button\n              key={c.id}\n              type=\"button\"\n              onClick={() => navigateTo(`/collaborations/${c.id}`)}\n              className=\"flex flex-col rounded-lg border border-border-seam bg-bg-surface p-4 text-left shadow-sm transition-all hover:border-accent-foreground/20 hover:shadow-md\"\n            >\n              <div className=\"flex items-start gap-3\">\n                <Thumbnail icon={<Handshake className=\"h-5 w-5\" />} seed={c.id} className=\"h-11 w-11 shrink-0\" />\n                <div className=\"min-w-0 flex-1\">\n                  <h3 className=\"truncate text-base font-semibold text-text-primary\">{c.title}</h3>\n                  {c.brand?.name && (\n                    <p className=\"truncate text-xs text-text-secondary\">{c.brand.name}</p>\n                  )}\n                </div>\n                <StatusBadge status={c.status} />\n              </div>\n              {c.brief && <p className=\"mt-3 line-clamp-2 text-sm text-text-secondary\">{c.brief}</p>}\n              <div className=\"mt-3 flex items-center justify-between text-xs text-text-secondary\">\n                <span className=\"rounded-full bg-bg-sunken px-2 py-0.5\">{titleCase(c.role)}</span>\n                <span>{formatPrice(c.compensation, c.currency)}</span>\n              </div>\n              {c.startDate && (\n                <p className=\"mt-2 text-xs text-text-secondary\">\n                  Starts {formatDate(c.startDate, { hour: undefined, minute: undefined })}\n                </p>\n              )}\n            </button>\n          ))}\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAqBA,IAAM,IAAkF;CACtF;EAAE,OAAO;EAAO,OAAO;EAAO;CAC9B;EAAE,OAAO;EAAY,OAAO;EAAY;CACxC;EAAE,OAAO;EAAY,OAAO;EAAY;CACxC;EAAE,OAAO;EAAe,OAAO;EAAe;CAC9C;EAAE,OAAO;EAAa,OAAO;EAAa;CAC1C;EAAE,OAAO;EAAY,OAAO;EAAY;CACxC;EAAE,OAAO;EAAa,OAAO;EAAa;CAC3C;AAED,SAAgB,IAAyB;CACvC,IAAM,EAAE,kBAAe,GAAkB,EACnC,CAAC,GAAQ,KAAa,EAAyC,MAAM,EAErE,IAAQ,EAAkB,EAAE,QAAQ,MAAW,QAAQ,KAAA,IAAY,GAAQ,CAAC,EAC5E,IAAiB,EAAM,QAAQ,EAAE;AAEvC,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SACE,kBAAC,UAAD;GACE,MAAK;GACL,eAAe,EAAW,sBAAsB;GAChD,WAAU;aAHZ,CAKE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAAA,qBACrB;;YAVb,CAaE,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAe,KAAK,MACnB,kBAAC,UAAD;IAEE,MAAK;IACL,eAAe,EAAU,EAAI,MAAM;IACnC,WAAW,EACT,kEACA,MAAW,EAAI,QACX,kDACA,2DACL;cAEA,EAAI;IACE,EAXF,EAAI,MAWF,CACT;GACE,CAAA,EAEL,EAAM,YACL,kBAAC,GAAD,EAAa,OAAM,2BAA4B,CAAA,GAC7C,EAAM,UACR,kBAAC,GAAD,EAAW,eAAe,KAAK,EAAM,SAAS,EAAI,CAAA,GAChD,EAAe,WAAW,IAC5B,kBAAC,GAAD;GACE,cAAa;GACb,MAAM,kBAAC,GAAD,EAAW,WAAU,aAAc,CAAA;GACzC,OAAM;GACN,aAAY;GACZ,QACE,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,EAAW,sBAAsB;IAChD,WAAU;cAHZ,CAKE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAAA,qBACrB;;GAEX,CAAA,GAEF,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAe,KAAK,MACnB,kBAAC,UAAD;IAEE,MAAK;IACL,eAAe,EAAW,mBAAmB,EAAE,KAAK;IACpD,WAAU;cAJZ;KAME,kBAAC,OAAD;MAAK,WAAU;gBAAf;OACE,kBAAC,GAAD;QAAW,MAAM,kBAAC,GAAD,EAAW,WAAU,WAAY,CAAA;QAAE,MAAM,EAAE;QAAI,WAAU;QAAuB,CAAA;OACjG,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,MAAD;SAAI,WAAU;mBAAsD,EAAE;SAAW,CAAA,EAChF,EAAE,OAAO,QACR,kBAAC,KAAD;SAAG,WAAU;mBAAwC,EAAE,MAAM;SAAS,CAAA,CAEpE;;OACN,kBAAC,GAAD,EAAa,QAAQ,EAAE,QAAU,CAAA;OAC7B;;KACL,EAAE,SAAS,kBAAC,KAAD;MAAG,WAAU;gBAAiD,EAAE;MAAU,CAAA;KACtF,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,QAAD;OAAM,WAAU;iBAAyC,EAAU,EAAE,KAAK;OAAQ,CAAA,EAClF,kBAAC,QAAD,EAAA,UAAO,EAAY,EAAE,cAAc,EAAE,SAAS,EAAQ,CAAA,CAClD;;KACL,EAAE,aACD,kBAAC,KAAD;MAAG,WAAU;gBAAb,CAAgD,WACtC,EAAW,EAAE,WAAW;OAAE,MAAM,KAAA;OAAW,QAAQ,KAAA;OAAW,CAAC,CACrE;;KAEC;MAzBF,EAAE,GAyBA,CACT;GACE,CAAA,CAEG"}

package/dist/coolandlovely/pages/collections/CollectionDetailPage.js

@@ -0,0 +1,217 @@
+import { useCoolAndLovely as e } from "../../context/CoolAndLovelyContext.js";
+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 { useCollection as o, usePublishCollection as s } from "../../hooks/useCoolAndLovelyApi.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 { ArrowLeft as p, Loader2 as m, Pencil as h, Plus as g, Rocket as _, Shapes as v, Store as y } from "lucide-react";
+import { useParams as b } from "react-router-dom";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
+import { GlassCard as C } from "@burdenoff/fe-libs/ui";
+//#region src/coolandlovely/pages/collections/CollectionDetailPage.tsx
+function w() {
+	let { collectionId: w } = b(), { navigateTo: T } = e(), E = o(w), D = s();
+	if (E.isLoading) return /* @__PURE__ */ x(t, {
+		title: "Collection",
+		children: /* @__PURE__ */ x(i, { label: "Loading collection…" })
+	});
+	if (E.isError || !E.data) return /* @__PURE__ */ x(t, {
+		title: "Collection",
+		children: /* @__PURE__ */ x(r, {
+			title: "Collection not found",
+			onRetry: () => void E.refetch()
+		})
+	});
+	let O = E.data, k = O.items ?? [], A = O.status === "DRAFT" || O.status === "SCHEDULED";
+	return /* @__PURE__ */ x(t, {
+		title: O.name,
+		description: O.brand?.name ?? void 0,
+		actions: /* @__PURE__ */ S("div", {
+			className: "flex items-center gap-2",
+			children: [
+				/* @__PURE__ */ S("button", {
+					type: "button",
+					onClick: () => T("/collections"),
+					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__ */ x(p, { className: "h-4 w-4" }), " Back"]
+				}),
+				/* @__PURE__ */ S("button", {
+					type: "button",
+					onClick: () => T(`/collections/${O.id}/edit`),
+					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__ */ x(h, { className: "h-4 w-4" }), " Edit"]
+				}),
+				A && /* @__PURE__ */ S("button", {
+					type: "button",
+					disabled: D.isPending,
+					onClick: () => D.mutate(O.id),
+					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 disabled:opacity-50",
+					children: [D.isPending ? /* @__PURE__ */ x(m, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ x(_, { className: "h-4 w-4" }), "Publish"]
+				})
+			]
+		}),
+		children: /* @__PURE__ */ S("div", {
+			className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
+			children: [/* @__PURE__ */ S("div", {
+				className: "lg:col-span-2",
+				children: [/* @__PURE__ */ S(C, {
+					treatment: "glass",
+					className: "overflow-hidden p-0",
+					children: [/* @__PURE__ */ x(a, {
+						icon: /* @__PURE__ */ x(v, { className: "h-12 w-12" }),
+						seed: O.id,
+						className: "h-40 w-full"
+					}), /* @__PURE__ */ S("div", {
+						className: "p-6",
+						children: [
+							/* @__PURE__ */ S("div", {
+								className: "flex items-center gap-2",
+								children: [/* @__PURE__ */ x("h2", {
+									className: "text-xl font-semibold text-text-primary",
+									children: O.name
+								}), /* @__PURE__ */ x(n, {
+									status: O.status,
+									className: "ml-auto"
+								})]
+							}),
+							O.description && /* @__PURE__ */ x("p", {
+								className: "mt-3 text-sm text-text-secondary",
+								children: O.description
+							}),
+							O.tags.length > 0 && /* @__PURE__ */ x(d, {
+								tags: O.tags,
+								className: "mt-4"
+							})
+						]
+					})]
+				}), /* @__PURE__ */ S("section", {
+					className: "mt-6",
+					children: [
+						/* @__PURE__ */ S("h3", {
+							className: "mb-3 text-lg font-semibold text-text-primary",
+							children: [
+								"Items (",
+								k.length,
+								")"
+							]
+						}),
+						k.length === 0 ? /* @__PURE__ */ x("p", {
+							className: "rounded-lg border border-border-seam bg-bg-surface p-4 text-sm text-text-secondary",
+							children: "No items in this collection yet."
+						}) : /* @__PURE__ */ x("div", {
+							className: "grid grid-cols-2 gap-3 sm:grid-cols-3",
+							children: k.map((e) => /* @__PURE__ */ S("button", {
+								type: "button",
+								onClick: () => T(`/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__ */ x(a, {
+									icon: f(e.category, 24),
+									seed: e.id,
+									className: "h-24 w-full"
+								}), /* @__PURE__ */ S("div", {
+									className: "p-3",
+									children: [/* @__PURE__ */ x("p", {
+										className: "truncate text-sm font-medium text-text-primary",
+										children: e.name
+									}), /* @__PURE__ */ x("p", {
+										className: "mt-0.5 text-xs text-text-secondary",
+										children: l(e.price, e.currency)
+									})]
+								})]
+							}, e.id))
+						}),
+						/* @__PURE__ */ S("button", {
+							type: "button",
+							onClick: () => T(`/items/new?brandId=${O.brandId}&collectionId=${O.id}`),
+							className: "mt-3 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__ */ x(g, { className: "h-4 w-4" }), " Add item to this collection"]
+						})
+					]
+				})]
+			}), /* @__PURE__ */ S("div", {
+				className: "space-y-4",
+				children: [
+					/* @__PURE__ */ S(C, {
+						treatment: "plain",
+						className: "p-5",
+						children: [/* @__PURE__ */ x("h3", {
+							className: "mb-3 text-sm font-semibold text-text-primary",
+							children: "Details"
+						}), /* @__PURE__ */ S("dl", {
+							className: "space-y-2 text-sm",
+							children: [
+								/* @__PURE__ */ S("div", {
+									className: "flex justify-between gap-2",
+									children: [/* @__PURE__ */ x("dt", {
+										className: "text-text-secondary",
+										children: "Season"
+									}), /* @__PURE__ */ x("dd", {
+										className: "text-text-primary",
+										children: u(O.season)
+									})]
+								}),
+								/* @__PURE__ */ S("div", {
+									className: "flex justify-between gap-2",
+									children: [/* @__PURE__ */ x("dt", {
+										className: "text-text-secondary",
+										children: "Publish at"
+									}), /* @__PURE__ */ x("dd", {
+										className: "text-text-primary",
+										children: O.publishAt ? c(O.publishAt, {
+											hour: void 0,
+											minute: void 0
+										}) : "—"
+									})]
+								}),
+								/* @__PURE__ */ S("div", {
+									className: "flex justify-between gap-2",
+									children: [/* @__PURE__ */ x("dt", {
+										className: "text-text-secondary",
+										children: "Ends at"
+									}), /* @__PURE__ */ x("dd", {
+										className: "text-text-primary",
+										children: O.endAt ? c(O.endAt, {
+											hour: void 0,
+											minute: void 0
+										}) : "—"
+									})]
+								})
+							]
+						})]
+					}),
+					O.brand && /* @__PURE__ */ S("button", {
+						type: "button",
+						onClick: () => T(`/brands/${O.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__ */ x(a, {
+							icon: /* @__PURE__ */ x(y, { className: "h-5 w-5" }),
+							seed: O.brand.id,
+							className: "h-10 w-10 shrink-0"
+						}), /* @__PURE__ */ S("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ x("p", {
+								className: "truncate text-sm font-medium text-text-primary",
+								children: O.brand.name
+							}), /* @__PURE__ */ x("p", {
+								className: "truncate text-xs text-text-secondary",
+								children: "View brand"
+							})]
+						})]
+					}),
+					D.isError && /* @__PURE__ */ x("p", {
+						className: "rounded-lg bg-status-error-bg-subtle px-3 py-2 text-xs text-status-error-text",
+						children: D.error instanceof Error ? D.error.message : "Publish failed"
+					})
+				]
+			})]
+		})
+	});
+}
+//#endregion
+export { w as CollectionDetailPage };
+
+//# sourceMappingURL=CollectionDetailPage.js.map