@burdenoff/microfe-coolandlovely 2026.629.1 → 2026.706.2

package/dist/coolandlovely/components/Thumbnail.js

@@ -1,29 +1,36 @@
 import { cn as e } from "../utils/cn.js";
-import { jsx as t } from "react/jsx-runtime";
+import { FileImage as t } from "./FileImage.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/coolandlovely/components/Thumbnail.tsx
-var n = [
+var i = [
 	"from-accent-purple-subtle to-bg-sunken",
 	"from-accent-blue-subtle to-bg-sunken",
 	"from-status-success-bg-subtle to-bg-sunken",
 	"from-status-warning-bg-subtle to-bg-sunken",
 	"from-[var(--color-accent-soft)] to-bg-sunken"
 ];
-function r(e) {
-	if (!e) return n[0];
+function a(e) {
+	if (!e) return i[0];
 	let t = 0;
 	for (let n = 0; n < e.length; n += 1) t = (t * 31 + e.charCodeAt(n)) % 997;
-	return n[t % n.length];
+	return i[t % i.length];
 }
-var i = ({ icon: n, seed: i, className: a, label: o }) => /* @__PURE__ */ t("div", {
-	className: e("relative flex items-center justify-center overflow-hidden rounded-lg bg-gradient-to-br", r(i), a),
-	"aria-hidden": o ? void 0 : !0,
-	"aria-label": o,
-	children: /* @__PURE__ */ t("span", {
+var o = ({ icon: i, seed: o, className: s, label: c, fileId: l, alt: u }) => /* @__PURE__ */ r("div", {
+	className: e("relative flex items-center justify-center overflow-hidden rounded-lg bg-gradient-to-br", a(o), s),
+	"aria-hidden": c ? void 0 : !0,
+	"aria-label": c,
+	children: [/* @__PURE__ */ n("span", {
 		className: "text-text-secondary opacity-80",
-		children: n
-	})
+		children: i
+	}), l ? /* @__PURE__ */ n("span", {
+		className: "absolute inset-0",
+		children: /* @__PURE__ */ n(t, {
+			fileId: l,
+			alt: u ?? c ?? ""
+		})
+	}) : null]
 });
 //#endregion
-export { i as Thumbnail };
+export { o as Thumbnail };
 
 //# sourceMappingURL=Thumbnail.js.map

package/dist/coolandlovely/components/Thumbnail.js.map

@@ -1 +1 @@
-{"version":3,"file":"Thumbnail.js","names":[],"sources":["../../../src/coolandlovely/components/Thumbnail.tsx"],"sourcesContent":["/**\n * Thumbnail Component\n * @module coolandlovely/components\n *\n * Renders a calm, on-token visual placeholder for a fashion entity. Imagery in\n * CoolAndLovely is referenced from wspace-files-svc via federation (we only\n * have the File id here, not a resolvable URL), so the catalogue/wardrobe/look\n * surfaces render a branded glyph tile keyed by an icon rather than a broken\n * <img>. The seed (entity id) gives each tile a stable accent tint.\n */\n\nimport type { FC, ReactNode } from 'react';\nimport { cn } from '../utils/cn';\n\ninterface ThumbnailProps {\n  icon: ReactNode;\n  /** Stable seed (e.g. entity id) used to pick a deterministic accent tint. */\n  seed?: string;\n  className?: string;\n  /** Whether a File reference exists (shows a subtle \"image attached\" hint). */\n  hasImage?: boolean;\n  label?: string;\n}\n\nconst tints = [\n  'from-accent-purple-subtle to-bg-sunken',\n  'from-accent-blue-subtle to-bg-sunken',\n  'from-status-success-bg-subtle to-bg-sunken',\n  'from-status-warning-bg-subtle to-bg-sunken',\n  'from-[var(--color-accent-soft)] to-bg-sunken',\n];\n\nfunction tintFor(seed: string | undefined): string {\n  if (!seed) return tints[0];\n  let hash = 0;\n  for (let i = 0; i < seed.length; i += 1) {\n    hash = (hash * 31 + seed.charCodeAt(i)) % 997;\n  }\n  return tints[hash % tints.length];\n}\n\nexport const Thumbnail: FC<ThumbnailProps> = ({ icon, seed, className, label }) => {\n  return (\n    <div\n      className={cn(\n        'relative flex items-center justify-center overflow-hidden rounded-lg bg-gradient-to-br',\n        tintFor(seed),\n        className\n      )}\n      aria-hidden={label ? undefined : true}\n      aria-label={label}\n    >\n      <span className=\"text-text-secondary opacity-80\">{icon}</span>\n    </div>\n  );\n};\n"],"mappings":";;;AAwBA,IAAM,IAAQ;CACZ;CACA;CACA;CACA;CACA;CACD;AAED,SAAS,EAAQ,GAAkC;AACjD,KAAI,CAAC,EAAM,QAAO,EAAM;CACxB,IAAI,IAAO;AACX,MAAK,IAAI,IAAI,GAAG,IAAI,EAAK,QAAQ,KAAK,EACpC,MAAQ,IAAO,KAAK,EAAK,WAAW,EAAE,IAAI;AAE5C,QAAO,EAAM,IAAO,EAAM;;AAG5B,IAAa,KAAiC,EAAE,SAAM,SAAM,cAAW,eAEnE,kBAAC,OAAD;CACE,WAAW,EACT,0FACA,EAAQ,EAAK,EACb,EACD;CACD,eAAa,IAAQ,KAAA,IAAY;CACjC,cAAY;WAEZ,kBAAC,QAAD;EAAM,WAAU;YAAkC;EAAY,CAAA;CAC1D,CAAA"}
+{"version":3,"file":"Thumbnail.js","names":[],"sources":["../../../src/coolandlovely/components/Thumbnail.tsx"],"sourcesContent":["/**\n * Thumbnail Component\n * @module coolandlovely/components\n *\n * Renders a calm, on-token visual placeholder for a fashion entity. Imagery in\n * CoolAndLovely is referenced from wspace-files-svc via federation (we only\n * have the File id here, not a resolvable URL), so the catalogue/wardrobe/look\n * surfaces render a branded glyph tile keyed by an icon rather than a broken\n * <img>. The seed (entity id) gives each tile a stable accent tint.\n */\n\nimport type { FC, ReactNode } from 'react';\nimport { cn } from '../utils/cn';\nimport { FileImage } from './FileImage';\n\ninterface ThumbnailProps {\n  icon: ReactNode;\n  /** Stable seed (e.g. entity id) used to pick a deterministic accent tint. */\n  seed?: string;\n  className?: string;\n  /** Whether a File reference exists (shows a subtle \"image attached\" hint). */\n  hasImage?: boolean;\n  label?: string;\n  /** wspace-files File id — when it resolves, its image overlays the glyph. */\n  fileId?: string | null;\n  /** Alt text when a real image is shown. */\n  alt?: string;\n}\n\nconst tints = [\n  'from-accent-purple-subtle to-bg-sunken',\n  'from-accent-blue-subtle to-bg-sunken',\n  'from-status-success-bg-subtle to-bg-sunken',\n  'from-status-warning-bg-subtle to-bg-sunken',\n  'from-[var(--color-accent-soft)] to-bg-sunken',\n];\n\nfunction tintFor(seed: string | undefined): string {\n  if (!seed) return tints[0];\n  let hash = 0;\n  for (let i = 0; i < seed.length; i += 1) {\n    hash = (hash * 31 + seed.charCodeAt(i)) % 997;\n  }\n  return tints[hash % tints.length];\n}\n\nexport const Thumbnail: FC<ThumbnailProps> = ({ icon, seed, className, label, fileId, alt }) => {\n  return (\n    <div\n      className={cn(\n        'relative flex items-center justify-center overflow-hidden rounded-lg bg-gradient-to-br',\n        tintFor(seed),\n        className\n      )}\n      aria-hidden={label ? undefined : true}\n      aria-label={label}\n    >\n      <span className=\"text-text-secondary opacity-80\">{icon}</span>\n      {fileId ? (\n        <span className=\"absolute inset-0\">\n          <FileImage fileId={fileId} alt={alt ?? label ?? ''} />\n        </span>\n      ) : null}\n    </div>\n  );\n};\n"],"mappings":";;;;AA6BA,IAAM,IAAQ;CACZ;CACA;CACA;CACA;CACA;CACD;AAED,SAAS,EAAQ,GAAkC;AACjD,KAAI,CAAC,EAAM,QAAO,EAAM;CACxB,IAAI,IAAO;AACX,MAAK,IAAI,IAAI,GAAG,IAAI,EAAK,QAAQ,KAAK,EACpC,MAAQ,IAAO,KAAK,EAAK,WAAW,EAAE,IAAI;AAE5C,QAAO,EAAM,IAAO,EAAM;;AAG5B,IAAa,KAAiC,EAAE,SAAM,SAAM,cAAW,UAAO,WAAQ,aAElF,kBAAC,OAAD;CACE,WAAW,EACT,0FACA,EAAQ,EAAK,EACb,EACD;CACD,eAAa,IAAQ,KAAA,IAAY;CACjC,cAAY;WAPd,CASE,kBAAC,QAAD;EAAM,WAAU;YAAkC;EAAY,CAAA,EAC7D,IACC,kBAAC,QAAD;EAAM,WAAU;YACd,kBAAC,GAAD;GAAmB;GAAQ,KAAK,KAAO,KAAS;GAAM,CAAA;EACjD,CAAA,GACL,KACA"}

package/dist/coolandlovely/hooks/index.js

@@ -1 +1,3 @@
+import "./useFiles.js";
 import "./useCoolAndLovelyApi.js";
+import "./useComments.js";

package/dist/coolandlovely/hooks/useComments.js

@@ -0,0 +1,68 @@
+import { useCoolAndLovely as e } from "../context/CoolAndLovelyContext.js";
+import "../context/index.js";
+import { useMutation as t, useQuery as n, useQueryClient as r } from "@tanstack/react-query";
+import { graphqlFetch as i } from "@burdenoff/fe-libs/shared/graphql";
+import { clearGraphqlFetchResponseCache as a } from "@burdenoff/fe-libs/shared/graphql/fetch";
+//#region src/coolandlovely/hooks/useComments.ts
+var o = "coolandlovely-comments", s = async (e, t, n) => {
+	let r = await i({
+		gateway: "workspace",
+		baseUrl: n,
+		query: e,
+		variables: t,
+		workspaceToken: !0
+	});
+	if (r.errors?.length) throw Error(r.errors[0]?.message ?? "Comments request failed");
+	if (!r.data) throw Error("Comments response did not include data");
+	return /^\s*mutation\b/.test(e) && a(), r.data;
+}, c = "\n  query CooGetEntityComments($input: GetCommentsInput!) {\n    getEntityComments(input: $input) {\n      total\n      items {\n        id\n        authorId\n        authorType\n        edited\n        createdAt\n        content { text }\n      }\n    }\n  }\n", l = "\n  mutation CooCreateEntityComment($input: CreateEntityCommentInput!) {\n    createEntityComment(input: $input) {\n      id\n    }\n  }\n", u = (t, r) => {
+	let { apiGatewayUrl: i } = e();
+	return n({
+		queryKey: [
+			o,
+			t,
+			r
+		],
+		enabled: !!r,
+		queryFn: async () => {
+			let e = (await s(c, { input: {
+				entityType: t,
+				entityId: r,
+				take: 100,
+				sortBy: "createdAt",
+				sortOrder: "desc"
+			} }, i)).getEntityComments;
+			return {
+				total: e.total,
+				comments: e.items.map((e) => ({
+					id: e.id,
+					authorId: e.authorId,
+					authorType: (e.authorType ?? "user").toLowerCase(),
+					text: e.content?.text ?? "",
+					createdAt: e.createdAt,
+					edited: e.edited
+				}))
+			};
+		}
+	});
+}, d = () => {
+	let n = r(), { apiGatewayUrl: i } = e();
+	return t({
+		mutationFn: async ({ entityType: e, entityId: t, text: n }) => (await s(l, { input: {
+			entityType: e,
+			entityId: t,
+			content: { text: n }
+		} }, i)).createEntityComment,
+		onSuccess: (e, t) => {
+			n.invalidateQueries({ queryKey: [
+				o,
+				t.entityType,
+				t.entityId
+			] });
+		}
+	});
+};
+//#endregion
+export { d as useAddComment, u as useEntityComments };
+
+//# sourceMappingURL=useComments.js.map

package/dist/coolandlovely/hooks/useComments.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useComments.js","names":[],"sources":["../../../src/coolandlovely/hooks/useComments.ts"],"sourcesContent":["/**\n * Comments hooks — reviews / feedback via wspace-conversations-svc (NO new table).\n * @module coolandlovely/hooks\n *\n * CoolAndLovely does NOT own a comment/review table. Reviews & feedback on a\n * look or brand are polymorphic `EntityComment` records owned by\n * wspace-conversations-svc, keyed by (entityType, entityId). Same graphqlFetch\n * transport (workspace gateway + workspace token) as every other coo* call.\n *\n * Commenter display names must be resolved via fe-libs useActorProfiles\n * (GLOBAL gateway) — the federated wspace `User` here exposes only ids, so\n * NEVER select firstName/name on the comment author.\n */\n\nimport { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';\nimport { graphqlFetch } from '@burdenoff/fe-libs/shared/graphql';\nimport { clearGraphqlFetchResponseCache } from '@burdenoff/fe-libs/shared/graphql/fetch';\n\nimport { useCoolAndLovely } from '../context';\n\nconst QK = 'coolandlovely-comments';\n\n/** A single review/comment as surfaced in the MFE (scalar-only projection). */\nexport interface EntityCommentView {\n  id: string;\n  authorId: string;\n  authorType: string;\n  text: string;\n  createdAt: string;\n  edited: boolean;\n}\n\ninterface RawEntityComment {\n  id: string;\n  authorId: string;\n  authorType: string;\n  edited: boolean;\n  createdAt: string;\n  content: { text?: string | null } | null;\n}\n\nconst commentFetch = async <TData>(\n  query: string,\n  variables: Record<string, unknown>,\n  baseUrl?: string\n): Promise<TData> => {\n  const response = await graphqlFetch<TData>({\n    gateway: 'workspace',\n    baseUrl,\n    query,\n    variables,\n    workspaceToken: true,\n  });\n  if (response.errors?.length) {\n    throw new Error(response.errors[0]?.message ?? 'Comments request failed');\n  }\n  if (!response.data) {\n    throw new Error('Comments response did not include data');\n  }\n  if (/^\\s*mutation\\b/.test(query)) {\n    clearGraphqlFetchResponseCache();\n  }\n  return response.data;\n};\n\nconst GET_COMMENTS = `\n  query CooGetEntityComments($input: GetCommentsInput!) {\n    getEntityComments(input: $input) {\n      total\n      items {\n        id\n        authorId\n        authorType\n        edited\n        createdAt\n        content { text }\n      }\n    }\n  }\n`;\n\nconst CREATE_COMMENT = `\n  mutation CooCreateEntityComment($input: CreateEntityCommentInput!) {\n    createEntityComment(input: $input) {\n      id\n    }\n  }\n`;\n\nexport interface EntityCommentsResult {\n  total: number;\n  comments: EntityCommentView[];\n}\n\n/** List reviews/comments for a (entityType, entityId), newest first. */\nexport const useEntityComments = (entityType: string, entityId: string | undefined) => {\n  const { apiGatewayUrl } = useCoolAndLovely();\n  return useQuery({\n    queryKey: [QK, entityType, entityId],\n    enabled: Boolean(entityId),\n    queryFn: async (): Promise<EntityCommentsResult> => {\n      const data = await commentFetch<{\n        getEntityComments: { total: number; items: RawEntityComment[] };\n      }>(\n        GET_COMMENTS,\n        {\n          input: {\n            entityType,\n            entityId,\n            take: 100,\n            sortBy: 'createdAt',\n            sortOrder: 'desc',\n          },\n        },\n        apiGatewayUrl\n      );\n      const conn = data.getEntityComments;\n      return {\n        total: conn.total,\n        comments: conn.items.map((c) => ({\n          id: c.id,\n          authorId: c.authorId,\n          authorType: (c.authorType ?? 'user').toLowerCase(),\n          text: c.content?.text ?? '',\n          createdAt: c.createdAt,\n          edited: c.edited,\n        })),\n      };\n    },\n  });\n};\n\n/** Post a review/comment on a (entityType, entityId). */\nexport const useAddComment = () => {\n  const queryClient = useQueryClient();\n  const { apiGatewayUrl } = useCoolAndLovely();\n  return useMutation({\n    mutationFn: async ({\n      entityType,\n      entityId,\n      text,\n    }: {\n      entityType: string;\n      entityId: string;\n      text: string;\n    }) => {\n      const data = await commentFetch<{ createEntityComment: { id: string } }>(\n        CREATE_COMMENT,\n        {\n          input: {\n            entityType,\n            entityId,\n            content: { text },\n          },\n        },\n        apiGatewayUrl\n      );\n      return data.createEntityComment;\n    },\n    onSuccess: (_result, variables) => {\n      void queryClient.invalidateQueries({\n        queryKey: [QK, variables.entityType, variables.entityId],\n      });\n    },\n  });\n};\n"],"mappings":";;;;;;AAoBA,IAAM,IAAK,0BAqBL,IAAe,OACnB,GACA,GACA,MACmB;CACnB,IAAM,IAAW,MAAM,EAAoB;EACzC,SAAS;EACT;EACA;EACA;EACA,gBAAgB;EACjB,CAAC;AACF,KAAI,EAAS,QAAQ,OACnB,OAAU,MAAM,EAAS,OAAO,IAAI,WAAW,0BAA0B;AAE3E,KAAI,CAAC,EAAS,KACZ,OAAU,MAAM,yCAAyC;AAK3D,QAHI,iBAAiB,KAAK,EAAM,IAC9B,GAAgC,EAE3B,EAAS;GAGZ,IAAe,yQAgBf,IAAiB,8IAcV,KAAqB,GAAoB,MAAiC;CACrF,IAAM,EAAE,qBAAkB,GAAkB;AAC5C,QAAO,EAAS;EACd,UAAU;GAAC;GAAI;GAAY;GAAS;EACpC,SAAS,EAAQ;EACjB,SAAS,YAA2C;GAgBlD,IAAM,KAfO,MAAM,EAGjB,GACA,EACE,OAAO;IACL;IACA;IACA,MAAM;IACN,QAAQ;IACR,WAAW;IACZ,EACF,EACD,EACD,EACiB;AAClB,UAAO;IACL,OAAO,EAAK;IACZ,UAAU,EAAK,MAAM,KAAK,OAAO;KAC/B,IAAI,EAAE;KACN,UAAU,EAAE;KACZ,aAAa,EAAE,cAAc,QAAQ,aAAa;KAClD,MAAM,EAAE,SAAS,QAAQ;KACzB,WAAW,EAAE;KACb,QAAQ,EAAE;KACX,EAAE;IACJ;;EAEJ,CAAC;GAIS,UAAsB;CACjC,IAAM,IAAc,GAAgB,EAC9B,EAAE,qBAAkB,GAAkB;AAC5C,QAAO,EAAY;EACjB,YAAY,OAAO,EACjB,eACA,aACA,eAMa,MAAM,EACjB,GACA,EACE,OAAO;GACL;GACA;GACA,SAAS,EAAE,SAAM;GAClB,EACF,EACD,EACD,EACW;EAEd,YAAY,GAAS,MAAc;AAC5B,KAAY,kBAAkB,EACjC,UAAU;IAAC;IAAI,EAAU;IAAY,EAAU;IAAS,EACzD,CAAC;;EAEL,CAAC"}