@burdenoff/microfe-comradecircle 2026.525.1 → 2026.704.2

package/dist/comradecircle/components/PostCard.js

@@ -0,0 +1,163 @@
+import { useComradeCircle as e } from "../context/ComradeCircleContext.js";
+import { cn as t } from "../utils/cn.js";
+import "../context/index.js";
+import { useComRemovePost as n, useComUpdatePost as r } from "../hooks/useComradeCircleApi.js";
+import "../hooks/index.js";
+import { MemberIdentity as i } from "./MemberIdentity.js";
+import { describeError as a, notify as o } from "../lib/toast.js";
+import { ReactionBar as s } from "./ReactionBar.js";
+import { formatRelativeTime as c } from "../utils/formatters.js";
+import { CommentThread as l } from "./CommentThread.js";
+import { AttachmentGrid as u } from "./ImageAttachments.js";
+import { useState as d } from "react";
+import { MessageSquare as f, MoreHorizontal as p, Pencil as m, Pin as h, Trash2 as g } from "lucide-react";
+import { jsx as _, jsxs as v } from "react/jsx-runtime";
+import { Button as y, DropdownMenu as b, DropdownMenuContent as x, DropdownMenuItem as S, DropdownMenuSeparator as C, DropdownMenuTrigger as w, GlassCard as T, Textarea as E } from "@burdenoff/fe-libs/ui";
+//#region src/comradecircle/components/PostCard.tsx
+function D({ post: D, defaultExpanded: O = !1 }) {
+	let { currentUser: k } = e(), A = r(), j = n(), [M, N] = d(O), [P, F] = d(!1), [I, L] = d(D.body), R = !!(k?.id && k.id === D.authorId);
+	return /* @__PURE__ */ v(T, {
+		treatment: "plain",
+		className: t("p-4", D.isPinned && "ring-1 ring-accent/40"),
+		children: [
+			/* @__PURE__ */ v("div", {
+				className: "flex items-start justify-between gap-3",
+				children: [/* @__PURE__ */ _(i, {
+					memberId: D.authorId,
+					variant: "row",
+					size: "md",
+					suffix: c(D.createdAt),
+					showPresence: !0
+				}), /* @__PURE__ */ v("div", {
+					className: "flex items-center gap-1",
+					children: [D.isPinned && /* @__PURE__ */ v("span", {
+						className: "inline-flex items-center gap-1 rounded-full bg-[var(--color-accent-soft)] px-2 py-0.5 text-xs font-medium text-text-primary",
+						children: [/* @__PURE__ */ _(h, { className: "h-3 w-3" }), " Pinned"]
+					}), R && /* @__PURE__ */ v(b, { children: [/* @__PURE__ */ _(w, {
+						asChild: !0,
+						children: /* @__PURE__ */ _("button", {
+							type: "button",
+							"aria-label": "Post actions",
+							className: "rounded-lg p-1.5 text-text-tertiary transition-colors hover:bg-bg-sunken hover:text-text-primary",
+							children: /* @__PURE__ */ _(p, { className: "h-4 w-4" })
+						})
+					}), /* @__PURE__ */ v(x, {
+						align: "end",
+						children: [
+							/* @__PURE__ */ v(S, {
+								onClick: () => F(!0),
+								children: [/* @__PURE__ */ _(m, { className: "mr-2 h-4 w-4" }), " Edit"]
+							}),
+							/* @__PURE__ */ v(S, {
+								onClick: async () => {
+									try {
+										await A.mutateAsync({
+											id: D.id,
+											input: { isPinned: !D.isPinned }
+										}), o.success(D.isPinned ? "Post unpinned" : "Post pinned");
+									} catch (e) {
+										o.error("Could not update post", a(e));
+									}
+								},
+								children: [
+									/* @__PURE__ */ _(h, { className: "mr-2 h-4 w-4" }),
+									" ",
+									D.isPinned ? "Unpin" : "Pin"
+								]
+							}),
+							/* @__PURE__ */ _(C, {}),
+							/* @__PURE__ */ v(S, {
+								onClick: async () => {
+									try {
+										await j.mutateAsync({
+											id: D.id,
+											channelId: D.channelId
+										}), o.success("Post removed");
+									} catch (e) {
+										o.error("Could not remove post", a(e));
+									}
+								},
+								className: "text-status-error-text focus:text-status-error-text",
+								children: [/* @__PURE__ */ _(g, { className: "mr-2 h-4 w-4" }), " Delete"]
+							})
+						]
+					})] })]
+				})]
+			}),
+			P ? /* @__PURE__ */ v("div", {
+				className: "mt-3",
+				children: [/* @__PURE__ */ _(E, {
+					value: I,
+					onChange: (e) => L(e.target.value),
+					rows: 3,
+					className: "resize-none"
+				}), /* @__PURE__ */ v("div", {
+					className: "mt-2 flex justify-end gap-2",
+					children: [/* @__PURE__ */ _(y, {
+						variant: "outline",
+						size: "sm",
+						onClick: () => {
+							L(D.body), F(!1);
+						},
+						children: "Cancel"
+					}), /* @__PURE__ */ _(y, {
+						size: "sm",
+						onClick: async () => {
+							let e = I.trim();
+							if (!e || e === D.body) {
+								F(!1);
+								return;
+							}
+							try {
+								await A.mutateAsync({
+									id: D.id,
+									input: { body: e }
+								}), F(!1), o.success("Post updated");
+							} catch (e) {
+								o.error("Could not update post", a(e));
+							}
+						},
+						disabled: A.isPending,
+						children: "Save"
+					})]
+				})]
+			}) : /* @__PURE__ */ _("p", {
+				className: "mt-3 whitespace-pre-wrap break-words text-sm text-text-primary",
+				children: D.body
+			}),
+			D.tags.length > 0 && /* @__PURE__ */ _("div", {
+				className: "mt-2 flex flex-wrap gap-1.5",
+				children: D.tags.map((e) => /* @__PURE__ */ v("span", {
+					className: "rounded-full bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary",
+					children: ["#", e]
+				}, e))
+			}),
+			D.attachmentFileIds.length > 0 && /* @__PURE__ */ _(u, { fileIds: D.attachmentFileIds }),
+			/* @__PURE__ */ v("div", {
+				className: "mt-3 flex items-center justify-between gap-3 border-t border-border-seam pt-3",
+				children: [/* @__PURE__ */ _(s, { post: D }), /* @__PURE__ */ v("button", {
+					type: "button",
+					onClick: () => N((e) => !e),
+					"aria-expanded": M,
+					className: t("inline-flex items-center gap-1.5 rounded-full px-2 py-0.5 text-xs font-medium transition-colors", M ? "bg-[var(--color-accent-soft)] text-text-primary" : "text-text-secondary hover:bg-bg-sunken hover:text-text-primary"),
+					children: [
+						/* @__PURE__ */ _(f, { className: "h-3.5 w-3.5" }),
+						/* @__PURE__ */ _("span", {
+							className: "tabular-nums",
+							children: D.commentCount
+						}),
+						/* @__PURE__ */ _("span", {
+							className: "hidden sm:inline",
+							children: D.commentCount === 1 ? "comment" : "comments"
+						})
+					]
+				})]
+			}),
+			M && /* @__PURE__ */ _(l, { postId: D.id })
+		]
+	});
+}
+//#endregion
+export { D as PostCard };
+
+//# sourceMappingURL=PostCard.js.map

package/dist/comradecircle/components/PostCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PostCard.js","names":[],"sources":["../../../src/comradecircle/components/PostCard.tsx"],"sourcesContent":["/**\n * PostCard — a single post with reactions and a collapsible comment thread.\n * @module comradecircle/components\n *\n * Reads its data from a `ComPost`; writes via `comUpdatePost` (edit / pin) and\n * `comRemovePost` (delete). Reactions + comments are delegated to\n * {@link ReactionBar} and {@link CommentThread}. Author-only actions (edit, pin,\n * delete) are gated on `authorId === currentUser.id`.\n */\n\nimport { useState } from 'react';\nimport { MessageSquare, MoreHorizontal, Pin, Pencil, Trash2 } from 'lucide-react';\nimport {\n  GlassCard,\n  Button,\n  Textarea,\n  DropdownMenu,\n  DropdownMenuTrigger,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuSeparator,\n} from '@burdenoff/fe-libs/ui';\nimport { cn } from '../utils/cn';\nimport { MemberIdentity } from './MemberIdentity';\nimport { ReactionBar } from './ReactionBar';\nimport { CommentThread } from './CommentThread';\nimport { AttachmentGrid } from './ImageAttachments';\nimport { useComUpdatePost, useComRemovePost } from '../hooks';\nimport { useComradeCircle } from '../context';\nimport { formatRelativeTime } from '../utils/formatters';\nimport { notify, describeError } from '../lib/toast';\nimport type { ComPost } from '../types';\n\ninterface PostCardProps {\n  post: ComPost;\n  /** Start with the comment thread open. */\n  defaultExpanded?: boolean;\n}\n\nexport function PostCard({ post, defaultExpanded = false }: PostCardProps) {\n  const { currentUser } = useComradeCircle();\n  const updatePost = useComUpdatePost();\n  const removePost = useComRemovePost();\n  const [expanded, setExpanded] = useState(defaultExpanded);\n  const [editing, setEditing] = useState(false);\n  const [draft, setDraft] = useState(post.body);\n\n  const isAuthor = Boolean(currentUser?.id && currentUser.id === post.authorId);\n\n  const saveEdit = async () => {\n    const text = draft.trim();\n    if (!text || text === post.body) {\n      setEditing(false);\n      return;\n    }\n    try {\n      await updatePost.mutateAsync({ id: post.id, input: { body: text } });\n      setEditing(false);\n      notify.success('Post updated');\n    } catch (err) {\n      notify.error('Could not update post', describeError(err));\n    }\n  };\n\n  const togglePin = async () => {\n    try {\n      await updatePost.mutateAsync({ id: post.id, input: { isPinned: !post.isPinned } });\n      notify.success(post.isPinned ? 'Post unpinned' : 'Post pinned');\n    } catch (err) {\n      notify.error('Could not update post', describeError(err));\n    }\n  };\n\n  const remove = async () => {\n    try {\n      await removePost.mutateAsync({ id: post.id, channelId: post.channelId });\n      notify.success('Post removed');\n    } catch (err) {\n      notify.error('Could not remove post', describeError(err));\n    }\n  };\n\n  return (\n    <GlassCard treatment=\"plain\" className={cn('p-4', post.isPinned && 'ring-1 ring-accent/40')}>\n      <div className=\"flex items-start justify-between gap-3\">\n        <MemberIdentity\n          memberId={post.authorId}\n          variant=\"row\"\n          size=\"md\"\n          suffix={formatRelativeTime(post.createdAt)}\n          showPresence\n        />\n        <div className=\"flex items-center gap-1\">\n          {post.isPinned && (\n            <span className=\"inline-flex items-center gap-1 rounded-full bg-[var(--color-accent-soft)] px-2 py-0.5 text-xs font-medium text-text-primary\">\n              <Pin className=\"h-3 w-3\" /> Pinned\n            </span>\n          )}\n          {isAuthor && (\n            <DropdownMenu>\n              <DropdownMenuTrigger asChild>\n                <button\n                  type=\"button\"\n                  aria-label=\"Post actions\"\n                  className=\"rounded-lg p-1.5 text-text-tertiary transition-colors hover:bg-bg-sunken hover:text-text-primary\"\n                >\n                  <MoreHorizontal className=\"h-4 w-4\" />\n                </button>\n              </DropdownMenuTrigger>\n              <DropdownMenuContent align=\"end\">\n                <DropdownMenuItem onClick={() => setEditing(true)}>\n                  <Pencil className=\"mr-2 h-4 w-4\" /> Edit\n                </DropdownMenuItem>\n                <DropdownMenuItem onClick={togglePin}>\n                  <Pin className=\"mr-2 h-4 w-4\" /> {post.isPinned ? 'Unpin' : 'Pin'}\n                </DropdownMenuItem>\n                <DropdownMenuSeparator />\n                <DropdownMenuItem\n                  onClick={remove}\n                  className=\"text-status-error-text focus:text-status-error-text\"\n                >\n                  <Trash2 className=\"mr-2 h-4 w-4\" /> Delete\n                </DropdownMenuItem>\n              </DropdownMenuContent>\n            </DropdownMenu>\n          )}\n        </div>\n      </div>\n\n      {editing ? (\n        <div className=\"mt-3\">\n          <Textarea\n            value={draft}\n            onChange={(e) => setDraft(e.target.value)}\n            rows={3}\n            className=\"resize-none\"\n          />\n          <div className=\"mt-2 flex justify-end gap-2\">\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => {\n                setDraft(post.body);\n                setEditing(false);\n              }}\n            >\n              Cancel\n            </Button>\n            <Button size=\"sm\" onClick={saveEdit} disabled={updatePost.isPending}>\n              Save\n            </Button>\n          </div>\n        </div>\n      ) : (\n        <p className=\"mt-3 whitespace-pre-wrap break-words text-sm text-text-primary\">\n          {post.body}\n        </p>\n      )}\n\n      {post.tags.length > 0 && (\n        <div className=\"mt-2 flex flex-wrap gap-1.5\">\n          {post.tags.map((tag) => (\n            <span\n              key={tag}\n              className=\"rounded-full bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary\"\n            >\n              #{tag}\n            </span>\n          ))}\n        </div>\n      )}\n\n      {post.attachmentFileIds.length > 0 && <AttachmentGrid fileIds={post.attachmentFileIds} />}\n\n      <div className=\"mt-3 flex items-center justify-between gap-3 border-t border-border-seam pt-3\">\n        <ReactionBar post={post} />\n        <button\n          type=\"button\"\n          onClick={() => setExpanded((s) => !s)}\n          aria-expanded={expanded}\n          className={cn(\n            'inline-flex items-center gap-1.5 rounded-full px-2 py-0.5 text-xs font-medium transition-colors',\n            expanded\n              ? 'bg-[var(--color-accent-soft)] text-text-primary'\n              : 'text-text-secondary hover:bg-bg-sunken hover:text-text-primary'\n          )}\n        >\n          <MessageSquare className=\"h-3.5 w-3.5\" />\n          <span className=\"tabular-nums\">{post.commentCount}</span>\n          <span className=\"hidden sm:inline\">\n            {post.commentCount === 1 ? 'comment' : 'comments'}\n          </span>\n        </button>\n      </div>\n\n      {expanded && <CommentThread postId={post.id} />}\n    </GlassCard>\n  );\n}\n"],"mappings":"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"}

package/dist/comradecircle/components/PostComposer.js

@@ -0,0 +1,87 @@
+import { useComradeCircle as e } from "../context/ComradeCircleContext.js";
+import "../context/index.js";
+import { useComCreatePost as t } from "../hooks/useComradeCircleApi.js";
+import "../hooks/index.js";
+import { Avatar as n } from "./Avatar.js";
+import { describeError as r, notify as i } from "../lib/toast.js";
+import { AttachmentPicker as a } from "./ImageAttachments.js";
+import { TagInput as o } from "./TagInput.js";
+import { useState as s } from "react";
+import { Send as c } from "lucide-react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { Button as d, GlassCard as f, Textarea as p } from "@burdenoff/fe-libs/ui";
+//#region src/comradecircle/components/PostComposer.tsx
+function m({ channelId: m, channelName: h, onPosted: g }) {
+	let { currentUser: _ } = e(), v = t(), [y, b] = s(""), [x, S] = s([]), [C, w] = s(!1), [T, E] = s([]), D = async () => {
+		let e = y.trim();
+		if (!(!e && T.length === 0)) try {
+			await v.mutateAsync({
+				channelId: m,
+				body: e,
+				tags: x.length ? x : null,
+				attachmentFileIds: T.length ? T : null
+			}), b(""), S([]), E([]), w(!1), i.success("Posted", h ? `Shared to #${h}` : void 0), g?.();
+		} catch (e) {
+			i.error("Could not publish post", r(e));
+		}
+	};
+	return /* @__PURE__ */ l(f, {
+		treatment: "plain",
+		className: "p-4",
+		children: /* @__PURE__ */ u("div", {
+			className: "flex gap-3",
+			children: [/* @__PURE__ */ l(n, {
+				name: _?.name ?? _?.email ?? "You",
+				size: "md"
+			}), /* @__PURE__ */ u("div", {
+				className: "flex-1",
+				children: [
+					/* @__PURE__ */ l(p, {
+						value: y,
+						onChange: (e) => b(e.target.value),
+						placeholder: h ? `Share something in #${h}…` : "Share something…",
+						rows: 2,
+						className: "resize-none border-0 bg-transparent px-0 shadow-none focus-visible:ring-0",
+						onKeyDown: (e) => {
+							e.key === "Enter" && (e.metaKey || e.ctrlKey) && (e.preventDefault(), D());
+						}
+					}),
+					C && /* @__PURE__ */ l("div", {
+						className: "mt-2",
+						children: /* @__PURE__ */ l(o, {
+							value: x,
+							onChange: S,
+							placeholder: "Add topics…"
+						})
+					}),
+					/* @__PURE__ */ l("div", {
+						className: "mt-2",
+						children: /* @__PURE__ */ l(a, {
+							fileIds: T,
+							onChange: E,
+							disabled: v.isPending
+						})
+					}),
+					/* @__PURE__ */ u("div", {
+						className: "mt-3 flex items-center justify-between",
+						children: [/* @__PURE__ */ l("button", {
+							type: "button",
+							onClick: () => w((e) => !e),
+							className: "text-xs font-medium text-text-secondary transition-colors hover:text-text-primary",
+							children: C ? "Hide topics" : "# Add topics"
+						}), /* @__PURE__ */ u(d, {
+							size: "sm",
+							onClick: D,
+							disabled: !y.trim() && T.length === 0 || v.isPending,
+							children: [/* @__PURE__ */ l(c, { className: "mr-1.5 h-4 w-4" }), " Post"]
+						})]
+					})
+				]
+			})]
+		})
+	});
+}
+//#endregion
+export { m as PostComposer };
+
+//# sourceMappingURL=PostComposer.js.map

package/dist/comradecircle/components/PostComposer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PostComposer.js","names":[],"sources":["../../../src/comradecircle/components/PostComposer.tsx"],"sourcesContent":["/**\n * PostComposer — compose and publish a post to a channel.\n * @module comradecircle/components\n *\n * Writes `comCreatePost({ channelId, body, tags })`. Text + tags only (file\n * attachments are a future enhancement — the svc accepts attachmentFileIds but\n * file upload/preview is out of scope for v1).\n */\n\nimport { useState } from 'react';\nimport { Send } from 'lucide-react';\nimport { Button, Textarea, GlassCard } from '@burdenoff/fe-libs/ui';\nimport { TagInput } from './TagInput';\nimport { Avatar } from './Avatar';\nimport { AttachmentPicker } from './ImageAttachments';\nimport { useComCreatePost } from '../hooks';\nimport { useComradeCircle } from '../context';\nimport { notify, describeError } from '../lib/toast';\n\ninterface PostComposerProps {\n  channelId: string;\n  channelName?: string;\n  onPosted?: () => void;\n}\n\nexport function PostComposer({ channelId, channelName, onPosted }: PostComposerProps) {\n  const { currentUser } = useComradeCircle();\n  const createPost = useComCreatePost();\n  const [body, setBody] = useState('');\n  const [tags, setTags] = useState<string[]>([]);\n  const [showTags, setShowTags] = useState(false);\n  const [attachmentFileIds, setAttachmentFileIds] = useState<string[]>([]);\n\n  const submit = async () => {\n    const text = body.trim();\n    if (!text && attachmentFileIds.length === 0) return;\n    try {\n      await createPost.mutateAsync({\n        channelId,\n        body: text,\n        tags: tags.length ? tags : null,\n        attachmentFileIds: attachmentFileIds.length ? attachmentFileIds : null,\n      });\n      setBody('');\n      setTags([]);\n      setAttachmentFileIds([]);\n      setShowTags(false);\n      notify.success('Posted', channelName ? `Shared to #${channelName}` : undefined);\n      onPosted?.();\n    } catch (err) {\n      notify.error('Could not publish post', describeError(err));\n    }\n  };\n\n  return (\n    <GlassCard treatment=\"plain\" className=\"p-4\">\n      <div className=\"flex gap-3\">\n        <Avatar name={currentUser?.name ?? currentUser?.email ?? 'You'} size=\"md\" />\n        <div className=\"flex-1\">\n          <Textarea\n            value={body}\n            onChange={(e) => setBody(e.target.value)}\n            placeholder={channelName ? `Share something in #${channelName}…` : 'Share something…'}\n            rows={2}\n            className=\"resize-none border-0 bg-transparent px-0 shadow-none focus-visible:ring-0\"\n            onKeyDown={(e) => {\n              if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {\n                e.preventDefault();\n                void submit();\n              }\n            }}\n          />\n          {showTags && (\n            <div className=\"mt-2\">\n              <TagInput value={tags} onChange={setTags} placeholder=\"Add topics…\" />\n            </div>\n          )}\n          <div className=\"mt-2\">\n            <AttachmentPicker\n              fileIds={attachmentFileIds}\n              onChange={setAttachmentFileIds}\n              disabled={createPost.isPending}\n            />\n          </div>\n          <div className=\"mt-3 flex items-center justify-between\">\n            <button\n              type=\"button\"\n              onClick={() => setShowTags((s) => !s)}\n              className=\"text-xs font-medium text-text-secondary transition-colors hover:text-text-primary\"\n            >\n              {showTags ? 'Hide topics' : '# Add topics'}\n            </button>\n            <Button\n              size=\"sm\"\n              onClick={submit}\n              disabled={(!body.trim() && attachmentFileIds.length === 0) || createPost.isPending}\n            >\n              <Send className=\"mr-1.5 h-4 w-4\" /> Post\n            </Button>\n          </div>\n        </div>\n      </div>\n    </GlassCard>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAyBA,SAAgB,EAAa,EAAE,cAAW,gBAAa,eAA+B;CACpF,IAAM,EAAE,mBAAgB,GAAkB,EACpC,IAAa,GAAkB,EAC/B,CAAC,GAAM,KAAW,EAAS,GAAG,EAC9B,CAAC,GAAM,KAAW,EAAmB,EAAE,CAAC,EACxC,CAAC,GAAU,KAAe,EAAS,GAAM,EACzC,CAAC,GAAmB,KAAwB,EAAmB,EAAE,CAAC,EAElE,IAAS,YAAY;EACzB,IAAM,IAAO,EAAK,MAAM;AACpB,SAAC,KAAQ,EAAkB,WAAW,GAC1C,KAAI;AAYF,GAXA,MAAM,EAAW,YAAY;IAC3B;IACA,MAAM;IACN,MAAM,EAAK,SAAS,IAAO;IAC3B,mBAAmB,EAAkB,SAAS,IAAoB;IACnE,CAAC,EACF,EAAQ,GAAG,EACX,EAAQ,EAAE,CAAC,EACX,EAAqB,EAAE,CAAC,EACxB,EAAY,GAAM,EAClB,EAAO,QAAQ,UAAU,IAAc,cAAc,MAAgB,KAAA,EAAU,EAC/E,KAAY;WACL,GAAK;AACZ,KAAO,MAAM,0BAA0B,EAAc,EAAI,CAAC;;;AAI9D,QACE,kBAAC,GAAD;EAAW,WAAU;EAAQ,WAAU;YACrC,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,GAAD;IAAQ,MAAM,GAAa,QAAQ,GAAa,SAAS;IAAO,MAAK;IAAO,CAAA,EAC5E,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,GAAD;MACE,OAAO;MACP,WAAW,MAAM,EAAQ,EAAE,OAAO,MAAM;MACxC,aAAa,IAAc,uBAAuB,EAAY,KAAK;MACnE,MAAM;MACN,WAAU;MACV,YAAY,MAAM;AAChB,OAAI,EAAE,QAAQ,YAAY,EAAE,WAAW,EAAE,aACvC,EAAE,gBAAgB,EACb,GAAQ;;MAGjB,CAAA;KACD,KACC,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD;OAAU,OAAO;OAAM,UAAU;OAAS,aAAY;OAAgB,CAAA;MAClE,CAAA;KAER,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD;OACE,SAAS;OACT,UAAU;OACV,UAAU,EAAW;OACrB,CAAA;MACE,CAAA;KACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,UAAD;OACE,MAAK;OACL,eAAe,GAAa,MAAM,CAAC,EAAE;OACrC,WAAU;iBAET,IAAW,gBAAgB;OACrB,CAAA,EACT,kBAAC,GAAD;OACE,MAAK;OACL,SAAS;OACT,UAAW,CAAC,EAAK,MAAM,IAAI,EAAkB,WAAW,KAAM,EAAW;iBAH3E,CAKE,kBAAC,GAAD,EAAM,WAAU,kBAAmB,CAAA,EAAA,QAC5B;SACL;;KACF;MACF;;EACI,CAAA"}

package/dist/comradecircle/components/ReactionBar.js

@@ -0,0 +1,122 @@
+import { useComradeCircle as e } from "../context/ComradeCircleContext.js";
+import { cn as t } from "../utils/cn.js";
+import "../context/index.js";
+import { useComReactToPost as n } from "../hooks/useComradeCircleApi.js";
+import "../hooks/index.js";
+import { describeError as r, notify as i } from "../lib/toast.js";
+import { useState as a } from "react";
+import { SmilePlus as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { Popover as l, PopoverContent as u, PopoverTrigger as d } from "@burdenoff/fe-libs/ui";
+//#region src/comradecircle/components/ReactionBar.tsx
+var f = [
+	{
+		type: "LIKE",
+		emoji: "👍",
+		label: "Like"
+	},
+	{
+		type: "LOVE",
+		emoji: "❤️",
+		label: "Love"
+	},
+	{
+		type: "CELEBRATE",
+		emoji: "🎉",
+		label: "Celebrate"
+	},
+	{
+		type: "INSIGHTFUL",
+		emoji: "💡",
+		label: "Insightful"
+	},
+	{
+		type: "LAUGH",
+		emoji: "😄",
+		label: "Funny"
+	},
+	{
+		type: "SUPPORT",
+		emoji: "🤝",
+		label: "Support"
+	}
+];
+function p({ post: p }) {
+	let { currentUser: m } = e(), h = n(), [g, _] = a(!1), v = m?.id, y = /* @__PURE__ */ new Map();
+	for (let e of p.reactions ?? []) {
+		let t = y.get(e.type) ?? {
+			count: 0,
+			mine: !1
+		};
+		t.count += 1, v && e.memberId === v && (t.mine = !0), y.set(e.type, t);
+	}
+	let b = async (e) => {
+		_(!1);
+		try {
+			await h.mutateAsync({
+				postId: p.id,
+				type: e
+			});
+		} catch (e) {
+			i.error("Could not react", r(e));
+		}
+	};
+	return /* @__PURE__ */ c("div", {
+		className: "flex flex-wrap items-center gap-1.5",
+		children: [f.filter((e) => (y.get(e.type)?.count ?? 0) > 0).map((e) => {
+			let n = y.get(e.type);
+			return /* @__PURE__ */ c("button", {
+				type: "button",
+				onClick: () => b(e.type),
+				disabled: h.isPending,
+				"aria-pressed": n.mine,
+				"aria-label": `${e.label} (${n.count})`,
+				className: t("inline-flex items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium transition-colors", n.mine ? "border-accent bg-[var(--color-accent-soft)] text-text-primary" : "border-border-seam bg-bg-surface text-text-secondary hover:bg-bg-sunken"),
+				children: [/* @__PURE__ */ s("span", {
+					"aria-hidden": "true",
+					children: e.emoji
+				}), /* @__PURE__ */ s("span", {
+					className: "tabular-nums",
+					children: n.count
+				})]
+			}, e.type);
+		}), /* @__PURE__ */ c(l, {
+			open: g,
+			onOpenChange: _,
+			children: [/* @__PURE__ */ s(d, {
+				asChild: !0,
+				children: /* @__PURE__ */ s("button", {
+					type: "button",
+					"aria-label": "Add reaction",
+					className: "inline-flex items-center gap-1 rounded-full border border-border-seam bg-bg-surface px-2 py-0.5 text-xs text-text-secondary transition-colors hover:bg-bg-sunken hover:text-text-primary",
+					children: /* @__PURE__ */ s(o, { className: "h-3.5 w-3.5" })
+				})
+			}), /* @__PURE__ */ s(u, {
+				className: "w-auto p-1.5",
+				align: "start",
+				children: /* @__PURE__ */ s("div", {
+					className: "flex items-center gap-0.5",
+					children: f.map((e) => {
+						let n = y.get(e.type)?.mine ?? !1;
+						return /* @__PURE__ */ s("button", {
+							type: "button",
+							onClick: () => b(e.type),
+							disabled: h.isPending,
+							title: e.label,
+							"aria-label": e.label,
+							className: t("flex h-9 w-9 items-center justify-center rounded-lg text-lg transition-transform hover:scale-110 hover:bg-bg-sunken", n && "bg-[var(--color-accent-soft)]"),
+							children: /* @__PURE__ */ s("span", {
+								"aria-hidden": "true",
+								children: e.emoji
+							})
+						}, e.type);
+					})
+				})
+			})]
+		})]
+	});
+}
+//#endregion
+export { p as ReactionBar };
+
+//# sourceMappingURL=ReactionBar.js.map

package/dist/comradecircle/components/ReactionBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReactionBar.js","names":[],"sources":["../../../src/comradecircle/components/ReactionBar.tsx"],"sourcesContent":["/**\n * ReactionBar — Slack-style multi-reaction control for a post.\n * @module comradecircle/components\n *\n * `comReactToPost(postId, type)` is an idempotent toggle for one typed reaction,\n * so a member may hold several distinct reactions on a post. We render a chip\n * per reaction type that has a count (highlighted when the caller reacted) plus\n * a popover to add any of the six types.\n */\n\nimport { useState } from 'react';\nimport { SmilePlus } from 'lucide-react';\nimport { Popover, PopoverContent, PopoverTrigger } from '@burdenoff/fe-libs/ui';\nimport { cn } from '../utils/cn';\nimport { useComReactToPost } from '../hooks';\nimport { useComradeCircle } from '../context';\nimport { notify, describeError } from '../lib/toast';\nimport type { ComPost, ComReactionType } from '../types';\n\nconst REACTIONS: { type: ComReactionType; emoji: string; label: string }[] = [\n  { type: 'LIKE', emoji: '👍', label: 'Like' },\n  { type: 'LOVE', emoji: '❤️', label: 'Love' },\n  { type: 'CELEBRATE', emoji: '🎉', label: 'Celebrate' },\n  { type: 'INSIGHTFUL', emoji: '💡', label: 'Insightful' },\n  { type: 'LAUGH', emoji: '😄', label: 'Funny' },\n  { type: 'SUPPORT', emoji: '🤝', label: 'Support' },\n];\n\ninterface ReactionBarProps {\n  post: ComPost;\n}\n\nexport function ReactionBar({ post }: ReactionBarProps) {\n  const { currentUser } = useComradeCircle();\n  const react = useComReactToPost();\n  const [open, setOpen] = useState(false);\n\n  const meId = currentUser?.id;\n  const counts = new Map<ComReactionType, { count: number; mine: boolean }>();\n  for (const r of post.reactions ?? []) {\n    const cur = counts.get(r.type) ?? { count: 0, mine: false };\n    cur.count += 1;\n    if (meId && r.memberId === meId) cur.mine = true;\n    counts.set(r.type, cur);\n  }\n\n  const toggle = async (type: ComReactionType) => {\n    setOpen(false);\n    try {\n      await react.mutateAsync({ postId: post.id, type });\n    } catch (err) {\n      notify.error('Could not react', describeError(err));\n    }\n  };\n\n  const active = REACTIONS.filter((r) => (counts.get(r.type)?.count ?? 0) > 0);\n\n  return (\n    <div className=\"flex flex-wrap items-center gap-1.5\">\n      {active.map((r) => {\n        const info = counts.get(r.type)!;\n        return (\n          <button\n            key={r.type}\n            type=\"button\"\n            onClick={() => toggle(r.type)}\n            disabled={react.isPending}\n            aria-pressed={info.mine}\n            aria-label={`${r.label} (${info.count})`}\n            className={cn(\n              'inline-flex items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium transition-colors',\n              info.mine\n                ? 'border-accent bg-[var(--color-accent-soft)] text-text-primary'\n                : 'border-border-seam bg-bg-surface text-text-secondary hover:bg-bg-sunken'\n            )}\n          >\n            <span aria-hidden=\"true\">{r.emoji}</span>\n            <span className=\"tabular-nums\">{info.count}</span>\n          </button>\n        );\n      })}\n\n      <Popover open={open} onOpenChange={setOpen}>\n        <PopoverTrigger asChild>\n          <button\n            type=\"button\"\n            aria-label=\"Add reaction\"\n            className=\"inline-flex items-center gap-1 rounded-full border border-border-seam bg-bg-surface px-2 py-0.5 text-xs text-text-secondary transition-colors hover:bg-bg-sunken hover:text-text-primary\"\n          >\n            <SmilePlus className=\"h-3.5 w-3.5\" />\n          </button>\n        </PopoverTrigger>\n        <PopoverContent className=\"w-auto p-1.5\" align=\"start\">\n          <div className=\"flex items-center gap-0.5\">\n            {REACTIONS.map((r) => {\n              const mine = counts.get(r.type)?.mine ?? false;\n              return (\n                <button\n                  key={r.type}\n                  type=\"button\"\n                  onClick={() => toggle(r.type)}\n                  disabled={react.isPending}\n                  title={r.label}\n                  aria-label={r.label}\n                  className={cn(\n                    'flex h-9 w-9 items-center justify-center rounded-lg text-lg transition-transform hover:scale-110 hover:bg-bg-sunken',\n                    mine && 'bg-[var(--color-accent-soft)]'\n                  )}\n                >\n                  <span aria-hidden=\"true\">{r.emoji}</span>\n                </button>\n              );\n            })}\n          </div>\n        </PopoverContent>\n      </Popover>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAmBA,IAAM,IAAuE;CAC3E;EAAE,MAAM;EAAQ,OAAO;EAAM,OAAO;EAAQ;CAC5C;EAAE,MAAM;EAAQ,OAAO;EAAM,OAAO;EAAQ;CAC5C;EAAE,MAAM;EAAa,OAAO;EAAM,OAAO;EAAa;CACtD;EAAE,MAAM;EAAc,OAAO;EAAM,OAAO;EAAc;CACxD;EAAE,MAAM;EAAS,OAAO;EAAM,OAAO;EAAS;CAC9C;EAAE,MAAM;EAAW,OAAO;EAAM,OAAO;EAAW;CACnD;AAMD,SAAgB,EAAY,EAAE,WAA0B;CACtD,IAAM,EAAE,mBAAgB,GAAkB,EACpC,IAAQ,GAAmB,EAC3B,CAAC,GAAM,KAAW,EAAS,GAAM,EAEjC,IAAO,GAAa,IACpB,oBAAS,IAAI,KAAwD;AAC3E,MAAK,IAAM,KAAK,EAAK,aAAa,EAAE,EAAE;EACpC,IAAM,IAAM,EAAO,IAAI,EAAE,KAAK,IAAI;GAAE,OAAO;GAAG,MAAM;GAAO;AAG3D,EAFA,EAAI,SAAS,GACT,KAAQ,EAAE,aAAa,MAAM,EAAI,OAAO,KAC5C,EAAO,IAAI,EAAE,MAAM,EAAI;;CAGzB,IAAM,IAAS,OAAO,MAA0B;AAC9C,IAAQ,GAAM;AACd,MAAI;AACF,SAAM,EAAM,YAAY;IAAE,QAAQ,EAAK;IAAI;IAAM,CAAC;WAC3C,GAAK;AACZ,KAAO,MAAM,mBAAmB,EAAc,EAAI,CAAC;;;AAMvD,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CAHa,EAAU,QAAQ,OAAO,EAAO,IAAI,EAAE,KAAK,EAAE,SAAS,KAAK,EAAE,CAIhE,KAAK,MAAM;GACjB,IAAM,IAAO,EAAO,IAAI,EAAE,KAAK;AAC/B,UACE,kBAAC,UAAD;IAEE,MAAK;IACL,eAAe,EAAO,EAAE,KAAK;IAC7B,UAAU,EAAM;IAChB,gBAAc,EAAK;IACnB,cAAY,GAAG,EAAE,MAAM,IAAI,EAAK,MAAM;IACtC,WAAW,EACT,wGACA,EAAK,OACD,kEACA,0EACL;cAZH,CAcE,kBAAC,QAAD;KAAM,eAAY;eAAQ,EAAE;KAAa,CAAA,EACzC,kBAAC,QAAD;KAAM,WAAU;eAAgB,EAAK;KAAa,CAAA,CAC3C;MAfF,EAAE,KAeA;IAEX,EAEF,kBAAC,GAAD;GAAe;GAAM,cAAc;aAAnC,CACE,kBAAC,GAAD;IAAgB,SAAA;cACd,kBAAC,UAAD;KACE,MAAK;KACL,cAAW;KACX,WAAU;eAEV,kBAAC,GAAD,EAAW,WAAU,eAAgB,CAAA;KAC9B,CAAA;IACM,CAAA,EACjB,kBAAC,GAAD;IAAgB,WAAU;IAAe,OAAM;cAC7C,kBAAC,OAAD;KAAK,WAAU;eACZ,EAAU,KAAK,MAAM;MACpB,IAAM,IAAO,EAAO,IAAI,EAAE,KAAK,EAAE,QAAQ;AACzC,aACE,kBAAC,UAAD;OAEE,MAAK;OACL,eAAe,EAAO,EAAE,KAAK;OAC7B,UAAU,EAAM;OAChB,OAAO,EAAE;OACT,cAAY,EAAE;OACd,WAAW,EACT,uHACA,KAAQ,gCACT;iBAED,kBAAC,QAAD;QAAM,eAAY;kBAAQ,EAAE;QAAa,CAAA;OAClC,EAZF,EAAE,KAYA;OAEX;KACE,CAAA;IACS,CAAA,CACT;KACN"}

package/dist/comradecircle/components/StateViews.js

@@ -0,0 +1,49 @@
+import { cn as e } from "../utils/cn.js";
+import { AlertCircle as t } from "lucide-react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Spinner as i } from "@burdenoff/fe-libs/ui";
+//#region src/comradecircle/components/StateViews.tsx
+var a = ({ label: t = "Loading…", className: a }) => /* @__PURE__ */ r("div", {
+	className: e("flex min-h-[40vh] flex-col items-center justify-center gap-3", a),
+	children: [/* @__PURE__ */ n(i, { size: "lg" }), /* @__PURE__ */ n("p", {
+		className: "text-sm text-text-secondary",
+		children: t
+	})]
+}), o = ({ title: i = "Something went wrong", message: a, onRetry: o, className: s }) => /* @__PURE__ */ r("div", {
+	className: e("flex min-h-[40vh] flex-col items-center justify-center gap-4 text-center", s),
+	children: [
+		/* @__PURE__ */ n(t, { className: "h-10 w-10 text-status-error-text" }),
+		/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("h2", {
+			className: "text-lg font-semibold text-text-primary",
+			children: i
+		}), a && /* @__PURE__ */ n("p", {
+			className: "mt-1 max-w-md text-sm text-text-secondary",
+			children: a
+		})] }),
+		o && /* @__PURE__ */ n("button", {
+			type: "button",
+			onClick: o,
+			className: "rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:opacity-90",
+			children: "Retry"
+		})
+	]
+}), s = ({ title: t, description: i, action: a, children: o, className: s }) => /* @__PURE__ */ r("section", {
+	className: e("mt-8 first:mt-0", s),
+	children: [/* @__PURE__ */ r("div", {
+		className: "mb-3 flex items-end justify-between gap-3",
+		children: [/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("h2", {
+			className: "text-base font-semibold text-text-primary",
+			children: t
+		}), i && /* @__PURE__ */ n("p", {
+			className: "mt-0.5 text-sm text-text-secondary",
+			children: i
+		})] }), a && /* @__PURE__ */ n("div", {
+			className: "shrink-0",
+			children: a
+		})]
+	}), o]
+});
+//#endregion
+export { o as ErrorView, a as LoadingView, s as Section };
+
+//# sourceMappingURL=StateViews.js.map

package/dist/comradecircle/components/StateViews.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StateViews.js","names":[],"sources":["../../../src/comradecircle/components/StateViews.tsx"],"sourcesContent":["/**\n * Shared loading / error / section state views\n * @module comradecircle/components\n */\n\nimport type { FC, ReactNode } from 'react';\nimport { AlertCircle } from 'lucide-react';\nimport { Spinner } from '@burdenoff/fe-libs/ui';\nimport { cn } from '../utils/cn';\n\ninterface LoadingViewProps {\n  label?: string;\n  className?: string;\n}\n\nexport const LoadingView: FC<LoadingViewProps> = ({ label = 'Loading…', className }) => (\n  <div className={cn('flex min-h-[40vh] flex-col items-center justify-center gap-3', className)}>\n    <Spinner size=\"lg\" />\n    <p className=\"text-sm text-text-secondary\">{label}</p>\n  </div>\n);\n\ninterface ErrorViewProps {\n  title?: string;\n  message?: string;\n  onRetry?: () => void;\n  className?: string;\n}\n\nexport const ErrorView: FC<ErrorViewProps> = ({\n  title = 'Something went wrong',\n  message,\n  onRetry,\n  className,\n}) => (\n  <div\n    className={cn(\n      'flex min-h-[40vh] flex-col items-center justify-center gap-4 text-center',\n      className\n    )}\n  >\n    <AlertCircle className=\"h-10 w-10 text-status-error-text\" />\n    <div>\n      <h2 className=\"text-lg font-semibold text-text-primary\">{title}</h2>\n      {message && <p className=\"mt-1 max-w-md text-sm text-text-secondary\">{message}</p>}\n    </div>\n    {onRetry && (\n      <button\n        type=\"button\"\n        onClick={onRetry}\n        className=\"rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:opacity-90\"\n      >\n        Retry\n      </button>\n    )}\n  </div>\n);\n\ninterface SectionProps {\n  title: string;\n  description?: string;\n  action?: ReactNode;\n  children: ReactNode;\n  className?: string;\n}\n\nexport const Section: FC<SectionProps> = ({ title, description, action, children, className }) => (\n  <section className={cn('mt-8 first:mt-0', className)}>\n    <div className=\"mb-3 flex items-end justify-between gap-3\">\n      <div>\n        <h2 className=\"text-base font-semibold text-text-primary\">{title}</h2>\n        {description && <p className=\"mt-0.5 text-sm text-text-secondary\">{description}</p>}\n      </div>\n      {action && <div className=\"shrink-0\">{action}</div>}\n    </div>\n    {children}\n  </section>\n);\n"],"mappings":";;;;;AAeA,IAAa,KAAqC,EAAE,WAAQ,YAAY,mBACtE,kBAAC,OAAD;CAAK,WAAW,EAAG,gEAAgE,EAAU;WAA7F,CACE,kBAAC,GAAD,EAAS,MAAK,MAAO,CAAA,EACrB,kBAAC,KAAD;EAAG,WAAU;YAA+B;EAAU,CAAA,CAClD;IAUK,KAAiC,EAC5C,WAAQ,wBACR,YACA,YACA,mBAEA,kBAAC,OAAD;CACE,WAAW,EACT,4EACA,EACD;WAJH;EAME,kBAAC,GAAD,EAAa,WAAU,oCAAqC,CAAA;EAC5D,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD;GAAI,WAAU;aAA2C;GAAW,CAAA,EACnE,KAAW,kBAAC,KAAD;GAAG,WAAU;aAA6C;GAAY,CAAA,CAC9E,EAAA,CAAA;EACL,KACC,kBAAC,UAAD;GACE,MAAK;GACL,SAAS;GACT,WAAU;aACX;GAEQ,CAAA;EAEP;IAWK,KAA6B,EAAE,UAAO,gBAAa,WAAQ,aAAU,mBAChF,kBAAC,WAAD;CAAS,WAAW,EAAG,mBAAmB,EAAU;WAApD,CACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD;GAAI,WAAU;aAA6C;GAAW,CAAA,EACrE,KAAe,kBAAC,KAAD;GAAG,WAAU;aAAsC;GAAgB,CAAA,CAC/E,EAAA,CAAA,EACL,KAAU,kBAAC,OAAD;GAAK,WAAU;aAAY;GAAa,CAAA,CAC/C;KACL,EACO"}

package/dist/comradecircle/components/StatusBadge.js

@@ -0,0 +1,68 @@
+import { cn as e } from "../utils/cn.js";
+import { formatEnumLabel as t } from "../utils/formatters.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/comradecircle/components/StatusBadge.tsx
+var i = {
+	success: "bg-status-success-bg-subtle text-status-success-text",
+	warning: "bg-status-warning-bg-subtle text-status-warning-text",
+	destructive: "bg-status-error-bg-subtle text-status-error-text",
+	secondary: "bg-bg-sunken text-text-secondary",
+	info: "bg-[var(--color-accent-soft)] text-text-primary",
+	outline: "border border-border-seam text-text-primary"
+}, a = new Set([
+	"LIVE",
+	"ONLINE",
+	"ACTIVE"
+]), o = {
+	ACTIVE: "success",
+	ARCHIVED: "outline",
+	SUSPENDED: "destructive",
+	PUBLIC: "success",
+	PRIVATE: "secondary",
+	SECRET: "warning",
+	CIRCLE: "info",
+	ANNOUNCEMENT: "warning",
+	FORUM: "info",
+	TEXT: "secondary",
+	VOICE: "info",
+	SCHEDULED: "info",
+	LIVE: "success",
+	COMPLETED: "secondary",
+	CANCELLED: "destructive",
+	ONLINE: "info",
+	IN_PERSON: "success",
+	HYBRID: "warning",
+	PENDING: "warning",
+	BANNED: "destructive",
+	LEFT: "outline",
+	OWNER: "info",
+	ADMIN: "warning",
+	MODERATOR: "info",
+	MEMBER: "secondary",
+	OPEN: "success",
+	CLOSED: "outline",
+	PUBLISHED: "success",
+	DRAFT: "secondary",
+	HIDDEN: "warning",
+	REMOVED: "destructive",
+	AWAY: "warning",
+	BUSY: "destructive",
+	OFFLINE: "secondary",
+	GOING: "success",
+	INTERESTED: "info",
+	WAITLISTED: "warning",
+	NOT_GOING: "outline"
+}, s = ({ status: s, className: c }) => {
+	let l = s.toUpperCase(), u = o[l] ?? "secondary", d = a.has(l);
+	return /* @__PURE__ */ r("span", {
+		className: e("inline-flex items-center gap-1.5 rounded-full px-2.5 py-0.5 text-xs font-medium", i[u], c),
+		children: [d && /* @__PURE__ */ n("span", {
+			"aria-hidden": "true",
+			className: "size-1.5 rounded-full bg-current motion-safe:animate-vc-glow-pulse"
+		}), t(s)]
+	});
+};
+//#endregion
+export { s as StatusBadge };
+
+//# sourceMappingURL=StatusBadge.js.map

package/dist/comradecircle/components/StatusBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBadge.js","names":[],"sources":["../../../src/comradecircle/components/StatusBadge.tsx"],"sourcesContent":["/**\n * Status Badge Component\n * @module comradecircle/components\n *\n * A colored badge for ComradeCircle domain statuses (circle status/visibility,\n * event status/mode, membership status, member role, poll status, post status,\n * presence, RSVP status) with semantic color mapping. Accepts the raw server\n * enum value.\n */\n\nimport type { FC } from 'react';\nimport { cn } from '../utils/cn';\nimport { formatEnumLabel } from '../utils/formatters';\n\ninterface StatusBadgeProps {\n  status: string;\n  className?: string;\n}\n\ntype BadgeVariant = 'success' | 'warning' | 'destructive' | 'secondary' | 'info' | 'outline';\n\nconst variantStyles: Record<BadgeVariant, string> = {\n  success: 'bg-status-success-bg-subtle text-status-success-text',\n  warning: 'bg-status-warning-bg-subtle text-status-warning-text',\n  destructive: 'bg-status-error-bg-subtle text-status-error-text',\n  secondary: 'bg-bg-sunken text-text-secondary',\n  info: 'bg-[var(--color-accent-soft)] text-text-primary',\n  outline: 'border border-border-seam text-text-primary',\n};\n\n// Statuses that represent a \"live\" / active condition get a subtle opacity-only\n// glow pulse (reduced-motion safe via motion-safe:).\nconst liveStatuses = new Set(['LIVE', 'ONLINE', 'ACTIVE']);\n\nconst statusVariantMap: Record<string, BadgeVariant> = {\n  // Circle status\n  ACTIVE: 'success',\n  ARCHIVED: 'outline',\n  SUSPENDED: 'destructive',\n\n  // Circle visibility\n  PUBLIC: 'success',\n  PRIVATE: 'secondary',\n  SECRET: 'warning',\n\n  // Channel visibility\n  CIRCLE: 'info',\n\n  // Channel type\n  ANNOUNCEMENT: 'warning',\n  FORUM: 'info',\n  TEXT: 'secondary',\n  VOICE: 'info',\n\n  // Event status\n  SCHEDULED: 'info',\n  LIVE: 'success',\n  COMPLETED: 'secondary',\n  CANCELLED: 'destructive',\n\n  // Event mode\n  ONLINE: 'info',\n  IN_PERSON: 'success',\n  HYBRID: 'warning',\n\n  // Membership status\n  PENDING: 'warning',\n  BANNED: 'destructive',\n  LEFT: 'outline',\n\n  // Member role\n  OWNER: 'info',\n  ADMIN: 'warning',\n  MODERATOR: 'info',\n  MEMBER: 'secondary',\n\n  // Poll status\n  OPEN: 'success',\n  CLOSED: 'outline',\n\n  // Post status\n  PUBLISHED: 'success',\n  DRAFT: 'secondary',\n  HIDDEN: 'warning',\n  REMOVED: 'destructive',\n\n  // Presence\n  AWAY: 'warning',\n  BUSY: 'destructive',\n  OFFLINE: 'secondary',\n\n  // RSVP status\n  GOING: 'success',\n  INTERESTED: 'info',\n  WAITLISTED: 'warning',\n  NOT_GOING: 'outline',\n};\n\nexport const StatusBadge: FC<StatusBadgeProps> = ({ status, className }) => {\n  const key = status.toUpperCase();\n  const variant = statusVariantMap[key] ?? 'secondary';\n  const isLive = liveStatuses.has(key);\n\n  return (\n    <span\n      className={cn(\n        'inline-flex items-center gap-1.5 rounded-full px-2.5 py-0.5 text-xs font-medium',\n        variantStyles[variant],\n        className\n      )}\n    >\n      {isLive && (\n        <span\n          aria-hidden=\"true\"\n          className=\"size-1.5 rounded-full bg-current motion-safe:animate-vc-glow-pulse\"\n        />\n      )}\n      {formatEnumLabel(status)}\n    </span>\n  );\n};\n"],"mappings":";;;;AAqBA,IAAM,IAA8C;CAClD,SAAS;CACT,SAAS;CACT,aAAa;CACb,WAAW;CACX,MAAM;CACN,SAAS;CACV,EAIK,IAAe,IAAI,IAAI;CAAC;CAAQ;CAAU;CAAS,CAAC,EAEpD,IAAiD;CAErD,QAAQ;CACR,UAAU;CACV,WAAW;CAGX,QAAQ;CACR,SAAS;CACT,QAAQ;CAGR,QAAQ;CAGR,cAAc;CACd,OAAO;CACP,MAAM;CACN,OAAO;CAGP,WAAW;CACX,MAAM;CACN,WAAW;CACX,WAAW;CAGX,QAAQ;CACR,WAAW;CACX,QAAQ;CAGR,SAAS;CACT,QAAQ;CACR,MAAM;CAGN,OAAO;CACP,OAAO;CACP,WAAW;CACX,QAAQ;CAGR,MAAM;CACN,QAAQ;CAGR,WAAW;CACX,OAAO;CACP,QAAQ;CACR,SAAS;CAGT,MAAM;CACN,MAAM;CACN,SAAS;CAGT,OAAO;CACP,YAAY;CACZ,YAAY;CACZ,WAAW;CACZ,EAEY,KAAqC,EAAE,WAAQ,mBAAgB;CAC1E,IAAM,IAAM,EAAO,aAAa,EAC1B,IAAU,EAAiB,MAAQ,aACnC,IAAS,EAAa,IAAI,EAAI;AAEpC,QACE,kBAAC,QAAD;EACE,WAAW,EACT,mFACA,EAAc,IACd,EACD;YALH,CAOG,KACC,kBAAC,QAAD;GACE,eAAY;GACZ,WAAU;GACV,CAAA,EAEH,EAAgB,EAAO,CACnB"}

package/dist/comradecircle/components/Tabs.js

@@ -0,0 +1,31 @@
+import { cn as e } from "../utils/cn.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/comradecircle/components/Tabs.tsx
+function r({ items: r, value: i, onChange: a, className: o }) {
+	return /* @__PURE__ */ t("div", {
+		role: "tablist",
+		className: e("flex flex-wrap items-center gap-1 border-b border-border-seam", o),
+		children: r.map((r) => {
+			let o = r.value === i;
+			return /* @__PURE__ */ n("button", {
+				type: "button",
+				role: "tab",
+				"aria-selected": o,
+				onClick: () => a(r.value),
+				className: e("relative -mb-px inline-flex items-center gap-2 border-b-2 px-4 py-2.5 text-sm font-medium transition-colors", o ? "border-accent text-text-primary" : "border-transparent text-text-secondary hover:text-text-primary"),
+				children: [
+					r.icon,
+					r.label,
+					typeof r.count == "number" && /* @__PURE__ */ t("span", {
+						className: e("rounded-full px-1.5 py-0.5 text-xs tabular-nums", o ? "bg-[var(--color-accent-soft)] text-text-primary" : "bg-bg-sunken text-text-secondary"),
+						children: r.count
+					})
+				]
+			}, r.value);
+		})
+	});
+}
+//#endregion
+export { r as Tabs };
+
+//# sourceMappingURL=Tabs.js.map

package/dist/comradecircle/components/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","names":[],"sources":["../../../src/comradecircle/components/Tabs.tsx"],"sourcesContent":["/**\n * Tabs — a top-level segmented navigation control for multi-section pages\n * (Monitoring: Sensors/Measurements/Thresholds; Carbon: Ledger/Factors/Targets).\n * @module comradecircle/components\n *\n * Visually heavier than {@link FilterTabs} (underline-style page tabs vs a pill\n * filter). Purely presentational — the parent owns the active-tab state.\n */\n\nimport type { ReactNode } from 'react';\nimport { cn } from '../utils/cn';\n\nexport interface TabItem<V extends string> {\n  value: V;\n  label: string;\n  icon?: ReactNode;\n  count?: number;\n}\n\ninterface TabsProps<V extends string> {\n  items: TabItem<V>[];\n  value: V;\n  onChange: (value: V) => void;\n  className?: string;\n}\n\nexport function Tabs<V extends string>({ items, value, onChange, className }: TabsProps<V>) {\n  return (\n    <div\n      role=\"tablist\"\n      className={cn('flex flex-wrap items-center gap-1 border-b border-border-seam', className)}\n    >\n      {items.map((item) => {\n        const active = item.value === value;\n        return (\n          <button\n            key={item.value}\n            type=\"button\"\n            role=\"tab\"\n            aria-selected={active}\n            onClick={() => onChange(item.value)}\n            className={cn(\n              'relative -mb-px inline-flex items-center gap-2 border-b-2 px-4 py-2.5 text-sm font-medium transition-colors',\n              active\n                ? 'border-accent text-text-primary'\n                : 'border-transparent text-text-secondary hover:text-text-primary'\n            )}\n          >\n            {item.icon}\n            {item.label}\n            {typeof item.count === 'number' && (\n              <span\n                className={cn(\n                  'rounded-full px-1.5 py-0.5 text-xs tabular-nums',\n                  active\n                    ? 'bg-[var(--color-accent-soft)] text-text-primary'\n                    : 'bg-bg-sunken text-text-secondary'\n                )}\n              >\n                {item.count}\n              </span>\n            )}\n          </button>\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":";;;AA0BA,SAAgB,EAAuB,EAAE,UAAO,UAAO,aAAU,gBAA2B;AAC1F,QACE,kBAAC,OAAD;EACE,MAAK;EACL,WAAW,EAAG,iEAAiE,EAAU;YAExF,EAAM,KAAK,MAAS;GACnB,IAAM,IAAS,EAAK,UAAU;AAC9B,UACE,kBAAC,UAAD;IAEE,MAAK;IACL,MAAK;IACL,iBAAe;IACf,eAAe,EAAS,EAAK,MAAM;IACnC,WAAW,EACT,+GACA,IACI,oCACA,iEACL;cAXH;KAaG,EAAK;KACL,EAAK;KACL,OAAO,EAAK,SAAU,YACrB,kBAAC,QAAD;MACE,WAAW,EACT,mDACA,IACI,oDACA,mCACL;gBAEA,EAAK;MACD,CAAA;KAEF;MA1BF,EAAK,MA0BH;IAEX;EACE,CAAA"}