@burdenoff/microfe-comradecircle 2026.525.1 → 2026.704.2

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

@@ -0,0 +1 @@
+{"version":3,"file":"CircleCard.js","names":[],"sources":["../../../src/comradecircle/components/CircleCard.tsx"],"sourcesContent":["/**\n * CircleCard — a discovery/overview tile for a community circle.\n * @module comradecircle/components\n *\n * Writes `comJoinCircle` / `comLeaveCircle`. When the caller already belongs to\n * the circle the card shows their role and an Open action; otherwise a Join\n * action. Membership is supplied by the parent (which knows the caller's set).\n */\n\nimport { Users, Hash } from 'lucide-react';\nimport { GlassCard, Button } from '@burdenoff/fe-libs/ui';\nimport { Avatar } from './Avatar';\nimport { StatusBadge } from './StatusBadge';\nimport { useComJoinCircle, useComLeaveCircle } from '../hooks';\nimport { formatEnumLabel, formatNumber } from '../utils/formatters';\nimport { notify, describeError } from '../lib/toast';\nimport type { ComCircle, ComMembership } from '../types';\n\ninterface CircleCardProps {\n  circle: ComCircle;\n  membership?: ComMembership | null;\n  onOpen: () => void;\n}\n\nexport function CircleCard({ circle, membership, onOpen }: CircleCardProps) {\n  const join = useComJoinCircle();\n  const leave = useComLeaveCircle();\n  const isMember = membership?.status === 'ACTIVE';\n\n  const handleJoin = async () => {\n    try {\n      await join.mutateAsync(circle.id);\n      notify.success('Joined circle', `You are now a member of ${circle.name}.`);\n    } catch (err) {\n      notify.error('Could not join', describeError(err));\n    }\n  };\n\n  const handleLeave = async () => {\n    try {\n      await leave.mutateAsync(circle.id);\n      notify.success('Left circle', `You have left ${circle.name}.`);\n    } catch (err) {\n      notify.error('Could not leave', describeError(err));\n    }\n  };\n\n  return (\n    <GlassCard treatment=\"plain\" className=\"flex flex-col p-5\">\n      <div className=\"flex items-start gap-3\">\n        <Avatar name={circle.name} size=\"lg\" fileId={circle.avatar?.id} />\n        <div className=\"min-w-0 flex-1\">\n          <button\n            type=\"button\"\n            onClick={onOpen}\n            className=\"truncate text-left text-base font-semibold text-text-primary hover:underline\"\n          >\n            {circle.name}\n          </button>\n          {circle.topic && <p className=\"truncate text-sm text-text-secondary\">{circle.topic}</p>}\n          <div className=\"mt-1.5 flex flex-wrap items-center gap-1.5\">\n            <StatusBadge status={circle.visibility} />\n            {circle.status !== 'ACTIVE' && <StatusBadge status={circle.status} />}\n            {isMember && membership && <StatusBadge status={membership.role} />}\n          </div>\n        </div>\n      </div>\n\n      {circle.description && (\n        <p className=\"mt-3 line-clamp-2 text-sm text-text-secondary\">{circle.description}</p>\n      )}\n\n      {circle.tags.length > 0 && (\n        <div className=\"mt-3 flex flex-wrap gap-1.5\">\n          {circle.tags.slice(0, 4).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      <div className=\"mt-4 flex items-center justify-between gap-3 border-t border-border-seam pt-3\">\n        <div className=\"flex items-center gap-3 text-xs text-text-tertiary\">\n          <span className=\"inline-flex items-center gap-1\">\n            <Users className=\"h-3.5 w-3.5\" /> {formatNumber(circle.memberCount)}\n          </span>\n          <span className=\"inline-flex items-center gap-1\">\n            <Hash className=\"h-3.5 w-3.5\" /> {circle.channels?.length ?? 0}\n          </span>\n        </div>\n        <div className=\"flex items-center gap-2\">\n          {isMember ? (\n            <>\n              <Button size=\"sm\" variant=\"outline\" onClick={handleLeave} disabled={leave.isPending}>\n                Leave\n              </Button>\n              <Button size=\"sm\" onClick={onOpen}>\n                Open\n              </Button>\n            </>\n          ) : circle.status === 'ACTIVE' ? (\n            <Button size=\"sm\" onClick={handleJoin} disabled={join.isPending}>\n              Join\n            </Button>\n          ) : (\n            <span className=\"text-xs text-text-tertiary\">{formatEnumLabel(circle.status)}</span>\n          )}\n        </div>\n      </div>\n    </GlassCard>\n  );\n}\n"],"mappings":";;;;;;;;;;AAwBA,SAAgB,EAAW,EAAE,WAAQ,eAAY,aAA2B;CAC1E,IAAM,IAAO,GAAkB,EACzB,IAAQ,GAAmB,EAC3B,IAAW,GAAY,WAAW;AAoBxC,QACE,kBAAC,GAAD;EAAW,WAAU;EAAQ,WAAU;YAAvC;GACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD;KAAQ,MAAM,EAAO;KAAM,MAAK;KAAK,QAAQ,EAAO,QAAQ;KAAM,CAAA,EAClE,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,UAAD;OACE,MAAK;OACL,SAAS;OACT,WAAU;iBAET,EAAO;OACD,CAAA;MACR,EAAO,SAAS,kBAAC,KAAD;OAAG,WAAU;iBAAwC,EAAO;OAAU,CAAA;MACvF,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,GAAD,EAAa,QAAQ,EAAO,YAAc,CAAA;QACzC,EAAO,WAAW,YAAY,kBAAC,GAAD,EAAa,QAAQ,EAAO,QAAU,CAAA;QACpE,KAAY,KAAc,kBAAC,GAAD,EAAa,QAAQ,EAAW,MAAQ,CAAA;QAC/D;;MACF;OACF;;GAEL,EAAO,eACN,kBAAC,KAAD;IAAG,WAAU;cAAiD,EAAO;IAAgB,CAAA;GAGtF,EAAO,KAAK,SAAS,KACpB,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAO,KAAK,MAAM,GAAG,EAAE,CAAC,KAAK,MAC5B,kBAAC,QAAD;KAEE,WAAU;eAFZ,CAGC,KACG,EACG;OAJA,EAIA,CACP;IACE,CAAA;GAGR,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAO,WAAU,eAAgB,CAAA;;OAAE,EAAa,EAAO,YAAY;OAC9D;SACP,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACE,kBAAC,GAAD,EAAM,WAAU,eAAgB,CAAA;;OAAE,EAAO,UAAU,UAAU;OACxD;QACH;QACN,kBAAC,OAAD;KAAK,WAAU;eACZ,IACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;MAAQ,MAAK;MAAK,SAAQ;MAAU,SA3D5B,YAAY;AAC9B,WAAI;AAEF,QADA,MAAM,EAAM,YAAY,EAAO,GAAG,EAClC,EAAO,QAAQ,eAAe,iBAAiB,EAAO,KAAK,GAAG;gBACvD,GAAK;AACZ,UAAO,MAAM,mBAAmB,EAAc,EAAI,CAAC;;;MAsDe,UAAU,EAAM;gBAAW;MAE5E,CAAA,EACT,kBAAC,GAAD;MAAQ,MAAK;MAAK,SAAS;gBAAQ;MAE1B,CAAA,CACR,EAAA,CAAA,GACD,EAAO,WAAW,WACpB,kBAAC,GAAD;MAAQ,MAAK;MAAK,SA5ET,YAAY;AAC7B,WAAI;AAEF,QADA,MAAM,EAAK,YAAY,EAAO,GAAG,EACjC,EAAO,QAAQ,iBAAiB,2BAA2B,EAAO,KAAK,GAAG;gBACnE,GAAK;AACZ,UAAO,MAAM,kBAAkB,EAAc,EAAI,CAAC;;;MAuEL,UAAU,EAAK;gBAAW;MAExD,CAAA,GAET,kBAAC,QAAD;MAAM,WAAU;gBAA8B,EAAgB,EAAO,OAAO;MAAQ,CAAA;KAElF,CAAA,CACF;;GACI"}

package/dist/comradecircle/components/CommentThread.js

@@ -0,0 +1,105 @@
+import { cn as e } from "../utils/cn.js";
+import { useComAddComment as t, useComComments as n } from "../hooks/useComradeCircleApi.js";
+import "../hooks/index.js";
+import { MemberIdentity as r } from "./MemberIdentity.js";
+import { describeError as i, notify as a } from "../lib/toast.js";
+import { formatRelativeTime as o } from "../utils/formatters.js";
+import { useMemo as s, useState as c } from "react";
+import { CornerDownRight as l, Send as u } from "lucide-react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { Button as p, Spinner as m, Textarea as h } from "@burdenoff/fe-libs/ui";
+//#region src/comradecircle/components/CommentThread.tsx
+function g({ postId: g }) {
+	let { data: _, isLoading: v } = n(g), y = t(), [b, x] = c(""), [S, C] = c(null), { roots: w, repliesByParent: T } = s(() => {
+		let e = _ ?? [], t = /* @__PURE__ */ new Map(), n = [];
+		for (let r of e) if (r.parentId) {
+			let e = t.get(r.parentId) ?? [];
+			e.push(r), t.set(r.parentId, e);
+		} else n.push(r);
+		return {
+			roots: n,
+			repliesByParent: t
+		};
+	}, [_]), E = async () => {
+		let e = b.trim();
+		if (e) try {
+			await y.mutateAsync({
+				postId: g,
+				body: e,
+				parentId: S?.id ?? null
+			}), x(""), C(null);
+		} catch (e) {
+			a.error("Could not add comment", i(e));
+		}
+	}, D = (t, n = !1) => /* @__PURE__ */ f("div", {
+		className: e("flex flex-col gap-1", n && "ml-8"),
+		children: [/* @__PURE__ */ f("div", {
+			className: "rounded-xl bg-bg-sunken/60 px-3 py-2",
+			children: [/* @__PURE__ */ f("div", {
+				className: "flex items-center justify-between gap-2",
+				children: [/* @__PURE__ */ d(r, {
+					memberId: t.authorId,
+					size: "xs",
+					suffix: o(t.createdAt)
+				}), !n && /* @__PURE__ */ f("button", {
+					type: "button",
+					onClick: () => C(t),
+					className: "inline-flex items-center gap-1 text-xs text-text-tertiary transition-colors hover:text-text-primary",
+					children: [/* @__PURE__ */ d(l, { className: "h-3 w-3" }), " Reply"]
+				})]
+			}), /* @__PURE__ */ d("p", {
+				className: "mt-1 whitespace-pre-wrap break-words text-sm text-text-primary",
+				children: t.body
+			})]
+		}), (T.get(t.id) ?? []).map((e) => D(e, !0))]
+	}, t.id);
+	return /* @__PURE__ */ f("div", {
+		className: "mt-3 border-t border-border-seam pt-3",
+		children: [v ? /* @__PURE__ */ d("div", {
+			className: "flex justify-center py-4",
+			children: /* @__PURE__ */ d(m, { size: "sm" })
+		}) : w.length === 0 ? /* @__PURE__ */ d("p", {
+			className: "py-2 text-center text-sm text-text-tertiary",
+			children: "No comments yet. Start the conversation."
+		}) : /* @__PURE__ */ d("div", {
+			className: "flex flex-col gap-3",
+			children: w.map((e) => D(e))
+		}), /* @__PURE__ */ f("div", {
+			className: "mt-3 flex flex-col gap-2",
+			children: [S && /* @__PURE__ */ f("div", {
+				className: "flex items-center justify-between rounded-lg bg-bg-sunken px-3 py-1.5 text-xs text-text-secondary",
+				children: [/* @__PURE__ */ d("span", {
+					className: "truncate",
+					children: "Replying to a comment"
+				}), /* @__PURE__ */ d("button", {
+					type: "button",
+					onClick: () => C(null),
+					className: "text-text-tertiary hover:text-text-primary",
+					children: "Cancel"
+				})]
+			}), /* @__PURE__ */ f("div", {
+				className: "flex items-end gap-2",
+				children: [/* @__PURE__ */ d(h, {
+					value: b,
+					onChange: (e) => x(e.target.value),
+					placeholder: "Add a comment…",
+					rows: 1,
+					className: "min-h-[40px] resize-none",
+					onKeyDown: (e) => {
+						e.key === "Enter" && (e.metaKey || e.ctrlKey) && (e.preventDefault(), E());
+					}
+				}), /* @__PURE__ */ d(p, {
+					size: "sm",
+					onClick: E,
+					disabled: !b.trim() || y.isPending,
+					"aria-label": "Post comment",
+					children: /* @__PURE__ */ d(u, { className: "h-4 w-4" })
+				})]
+			})]
+		})]
+	});
+}
+//#endregion
+export { g as CommentThread };
+
+//# sourceMappingURL=CommentThread.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CommentThread.js","names":[],"sources":["../../../src/comradecircle/components/CommentThread.tsx"],"sourcesContent":["/**\n * CommentThread — threaded comments for a post.\n * @module comradecircle/components\n *\n * Reads `comListComments(postId)`; writes `comAddComment`. Top-level comments\n * (parentId == null) render replies one level deep. Author identity comes from\n * `ComProfile` via {@link MemberIdentity}.\n */\n\nimport { useMemo, useState } from 'react';\nimport { CornerDownRight, Send } from 'lucide-react';\nimport { Button, Textarea, Spinner } from '@burdenoff/fe-libs/ui';\nimport { cn } from '../utils/cn';\nimport { useComComments, useComAddComment } from '../hooks';\nimport { MemberIdentity } from './MemberIdentity';\nimport { formatRelativeTime } from '../utils/formatters';\nimport { notify, describeError } from '../lib/toast';\nimport type { ComComment } from '../types';\n\ninterface CommentThreadProps {\n  postId: string;\n}\n\nexport function CommentThread({ postId }: CommentThreadProps) {\n  const { data: comments, isLoading } = useComComments(postId);\n  const addComment = useComAddComment();\n  const [body, setBody] = useState('');\n  const [replyTo, setReplyTo] = useState<ComComment | null>(null);\n\n  const { roots, repliesByParent } = useMemo(() => {\n    const list = comments ?? [];\n    const repliesMap = new Map<string, ComComment[]>();\n    const top: ComComment[] = [];\n    for (const c of list) {\n      if (c.parentId) {\n        const arr = repliesMap.get(c.parentId) ?? [];\n        arr.push(c);\n        repliesMap.set(c.parentId, arr);\n      } else {\n        top.push(c);\n      }\n    }\n    return { roots: top, repliesByParent: repliesMap };\n  }, [comments]);\n\n  const submit = async () => {\n    const text = body.trim();\n    if (!text) return;\n    try {\n      await addComment.mutateAsync({ postId, body: text, parentId: replyTo?.id ?? null });\n      setBody('');\n      setReplyTo(null);\n    } catch (err) {\n      notify.error('Could not add comment', describeError(err));\n    }\n  };\n\n  const renderComment = (c: ComComment, isReply = false) => (\n    <div key={c.id} className={cn('flex flex-col gap-1', isReply && 'ml-8')}>\n      <div className=\"rounded-xl bg-bg-sunken/60 px-3 py-2\">\n        <div className=\"flex items-center justify-between gap-2\">\n          <MemberIdentity\n            memberId={c.authorId}\n            size=\"xs\"\n            suffix={formatRelativeTime(c.createdAt)}\n          />\n          {!isReply && (\n            <button\n              type=\"button\"\n              onClick={() => setReplyTo(c)}\n              className=\"inline-flex items-center gap-1 text-xs text-text-tertiary transition-colors hover:text-text-primary\"\n            >\n              <CornerDownRight className=\"h-3 w-3\" /> Reply\n            </button>\n          )}\n        </div>\n        <p className=\"mt-1 whitespace-pre-wrap break-words text-sm text-text-primary\">{c.body}</p>\n      </div>\n      {(repliesByParent.get(c.id) ?? []).map((r) => renderComment(r, true))}\n    </div>\n  );\n\n  return (\n    <div className=\"mt-3 border-t border-border-seam pt-3\">\n      {isLoading ? (\n        <div className=\"flex justify-center py-4\">\n          <Spinner size=\"sm\" />\n        </div>\n      ) : roots.length === 0 ? (\n        <p className=\"py-2 text-center text-sm text-text-tertiary\">\n          No comments yet. Start the conversation.\n        </p>\n      ) : (\n        <div className=\"flex flex-col gap-3\">{roots.map((c) => renderComment(c))}</div>\n      )}\n\n      <div className=\"mt-3 flex flex-col gap-2\">\n        {replyTo && (\n          <div className=\"flex items-center justify-between rounded-lg bg-bg-sunken px-3 py-1.5 text-xs text-text-secondary\">\n            <span className=\"truncate\">Replying to a comment</span>\n            <button\n              type=\"button\"\n              onClick={() => setReplyTo(null)}\n              className=\"text-text-tertiary hover:text-text-primary\"\n            >\n              Cancel\n            </button>\n          </div>\n        )}\n        <div className=\"flex items-end gap-2\">\n          <Textarea\n            value={body}\n            onChange={(e) => setBody(e.target.value)}\n            placeholder=\"Add a comment…\"\n            rows={1}\n            className=\"min-h-[40px] resize-none\"\n            onKeyDown={(e) => {\n              if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {\n                e.preventDefault();\n                void submit();\n              }\n            }}\n          />\n          <Button\n            size=\"sm\"\n            onClick={submit}\n            disabled={!body.trim() || addComment.isPending}\n            aria-label=\"Post comment\"\n          >\n            <Send className=\"h-4 w-4\" />\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAuBA,SAAgB,EAAc,EAAE,aAA8B;CAC5D,IAAM,EAAE,MAAM,GAAU,iBAAc,EAAe,EAAO,EACtD,IAAa,GAAkB,EAC/B,CAAC,GAAM,KAAW,EAAS,GAAG,EAC9B,CAAC,GAAS,KAAc,EAA4B,KAAK,EAEzD,EAAE,UAAO,uBAAoB,QAAc;EAC/C,IAAM,IAAO,KAAY,EAAE,EACrB,oBAAa,IAAI,KAA2B,EAC5C,IAAoB,EAAE;AAC5B,OAAK,IAAM,KAAK,EACd,KAAI,EAAE,UAAU;GACd,IAAM,IAAM,EAAW,IAAI,EAAE,SAAS,IAAI,EAAE;AAE5C,GADA,EAAI,KAAK,EAAE,EACX,EAAW,IAAI,EAAE,UAAU,EAAI;QAE/B,GAAI,KAAK,EAAE;AAGf,SAAO;GAAE,OAAO;GAAK,iBAAiB;GAAY;IACjD,CAAC,EAAS,CAAC,EAER,IAAS,YAAY;EACzB,IAAM,IAAO,EAAK,MAAM;AACnB,QACL,KAAI;AAGF,GAFA,MAAM,EAAW,YAAY;IAAE;IAAQ,MAAM;IAAM,UAAU,GAAS,MAAM;IAAM,CAAC,EACnF,EAAQ,GAAG,EACX,EAAW,KAAK;WACT,GAAK;AACZ,KAAO,MAAM,yBAAyB,EAAc,EAAI,CAAC;;IAIvD,KAAiB,GAAe,IAAU,OAC9C,kBAAC,OAAD;EAAgB,WAAW,EAAG,uBAAuB,KAAW,OAAO;YAAvE,CACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD;KACE,UAAU,EAAE;KACZ,MAAK;KACL,QAAQ,EAAmB,EAAE,UAAU;KACvC,CAAA,EACD,CAAC,KACA,kBAAC,UAAD;KACE,MAAK;KACL,eAAe,EAAW,EAAE;KAC5B,WAAU;eAHZ,CAKE,kBAAC,GAAD,EAAiB,WAAU,WAAY,CAAA,EAAA,SAChC;OAEP;OACN,kBAAC,KAAD;IAAG,WAAU;cAAkE,EAAE;IAAS,CAAA,CACtF;OACJ,EAAgB,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,KAAK,MAAM,EAAc,GAAG,GAAK,CAAC,CACjE;IArBI,EAAE,GAqBN;AAGR,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACG,IACC,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,GAAD,EAAS,MAAK,MAAO,CAAA;GACjB,CAAA,GACJ,EAAM,WAAW,IACnB,kBAAC,KAAD;GAAG,WAAU;aAA8C;GAEvD,CAAA,GAEJ,kBAAC,OAAD;GAAK,WAAU;aAAuB,EAAM,KAAK,MAAM,EAAc,EAAE,CAAC;GAAO,CAAA,EAGjF,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,KACC,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,QAAD;KAAM,WAAU;eAAW;KAA4B,CAAA,EACvD,kBAAC,UAAD;KACE,MAAK;KACL,eAAe,EAAW,KAAK;KAC/B,WAAU;eACX;KAEQ,CAAA,CACL;OAER,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD;KACE,OAAO;KACP,WAAW,MAAM,EAAQ,EAAE,OAAO,MAAM;KACxC,aAAY;KACZ,MAAM;KACN,WAAU;KACV,YAAY,MAAM;AAChB,MAAI,EAAE,QAAQ,YAAY,EAAE,WAAW,EAAE,aACvC,EAAE,gBAAgB,EACb,GAAQ;;KAGjB,CAAA,EACF,kBAAC,GAAD;KACE,MAAK;KACL,SAAS;KACT,UAAU,CAAC,EAAK,MAAM,IAAI,EAAW;KACrC,cAAW;eAEX,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA;KACrB,CAAA,CACL;MACF;KACF"}

package/dist/comradecircle/components/CreateCircleDialog.js

@@ -0,0 +1,159 @@
+import { useComCreateCircle as e } from "../hooks/useComradeCircleApi.js";
+import "../hooks/index.js";
+import { describeError as t, notify as n } from "../lib/toast.js";
+import { formatEnumLabel as r } from "../utils/formatters.js";
+import { slugify as i } from "../utils/slug.js";
+import { TagInput as a } from "./TagInput.js";
+import { AvatarUploadField as o } from "./AvatarUploadField.js";
+import { useState as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Button as u, Input as d, Label as f, ResponsiveDialog as p, ResponsiveDialogContent as m, ResponsiveDialogDescription as h, ResponsiveDialogFooter as g, ResponsiveDialogHeader as _, ResponsiveDialogTitle as v, Select as y, SelectContent as b, SelectItem as x, SelectTrigger as S, SelectValue as C, Textarea as w } from "@burdenoff/fe-libs/ui";
+//#region src/comradecircle/components/CreateCircleDialog.tsx
+var T = [
+	"PUBLIC",
+	"PRIVATE",
+	"SECRET"
+];
+function E({ open: E, onOpenChange: D, onCreated: O }) {
+	let k = e(), [A, j] = s(""), [M, N] = s(""), [P, F] = s(!1), [I, L] = s(""), [R, z] = s(""), [B, V] = s("PUBLIC"), [H, U] = s([]), [W, G] = s(null), [K, q] = s(null), J = P ? M : i(A), Y = () => {
+		j(""), N(""), F(!1), L(""), z(""), V("PUBLIC"), U([]), G(null), q(null);
+	};
+	return /* @__PURE__ */ c(p, {
+		open: E,
+		onOpenChange: D,
+		children: /* @__PURE__ */ l(m, {
+			className: "sm:max-w-lg",
+			children: [
+				/* @__PURE__ */ l(_, { children: [/* @__PURE__ */ c(v, { children: "Create a circle" }), /* @__PURE__ */ c(h, { children: "A circle is a community space with its own channels, members, events, and polls." })] }),
+				/* @__PURE__ */ l("div", {
+					className: "flex flex-col gap-4 py-2",
+					children: [
+						/* @__PURE__ */ l("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ c(f, { children: "Avatar" }), /* @__PURE__ */ c(o, {
+								fileId: W,
+								name: A || "Circle",
+								onUploaded: G,
+								label: "Upload circle avatar"
+							})]
+						}),
+						/* @__PURE__ */ l("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ c(f, {
+								htmlFor: "circle-name",
+								children: "Name"
+							}), /* @__PURE__ */ c(d, {
+								id: "circle-name",
+								value: A,
+								onChange: (e) => j(e.target.value),
+								placeholder: "e.g. Product Guild"
+							})]
+						}),
+						/* @__PURE__ */ l("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ c(f, {
+								htmlFor: "circle-slug",
+								children: "URL slug"
+							}), /* @__PURE__ */ c(d, {
+								id: "circle-slug",
+								value: J,
+								onChange: (e) => {
+									F(!0), N(i(e.target.value));
+								},
+								placeholder: "product-guild"
+							})]
+						}),
+						/* @__PURE__ */ l("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ c(f, {
+								htmlFor: "circle-topic",
+								children: "Topic"
+							}), /* @__PURE__ */ c(d, {
+								id: "circle-topic",
+								value: I,
+								onChange: (e) => L(e.target.value),
+								placeholder: "A short one-line topic"
+							})]
+						}),
+						/* @__PURE__ */ l("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ c(f, {
+								htmlFor: "circle-desc",
+								children: "Description"
+							}), /* @__PURE__ */ c(w, {
+								id: "circle-desc",
+								value: R,
+								onChange: (e) => z(e.target.value),
+								placeholder: "What is this circle about?",
+								rows: 3
+							})]
+						}),
+						/* @__PURE__ */ l("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ c(f, { children: "Visibility" }), /* @__PURE__ */ l(y, {
+								value: B,
+								onValueChange: (e) => V(e),
+								children: [/* @__PURE__ */ c(S, { children: /* @__PURE__ */ c(C, {}) }), /* @__PURE__ */ c(b, { children: T.map((e) => /* @__PURE__ */ c(x, {
+									value: e,
+									children: r(e)
+								}, e)) })]
+							})]
+						}),
+						/* @__PURE__ */ l("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ c(f, {
+								htmlFor: "circle-tags",
+								children: "Tags"
+							}), /* @__PURE__ */ c(a, {
+								id: "circle-tags",
+								value: H,
+								onChange: U,
+								placeholder: "Add tags…"
+							})]
+						}),
+						K && /* @__PURE__ */ c("p", {
+							className: "text-sm text-status-error-text",
+							children: K
+						})
+					]
+				}),
+				/* @__PURE__ */ l(g, { children: [/* @__PURE__ */ c(u, {
+					variant: "outline",
+					onClick: () => D(!1),
+					children: "Cancel"
+				}), /* @__PURE__ */ c(u, {
+					onClick: async () => {
+						if (!A.trim()) {
+							q("Circle name is required.");
+							return;
+						}
+						if (!J) {
+							q("A URL slug is required.");
+							return;
+						}
+						try {
+							let e = await k.mutateAsync({
+								name: A.trim(),
+								slug: J,
+								topic: I.trim() || null,
+								description: R.trim() || null,
+								visibility: B,
+								avatarFileId: W,
+								tags: H.length ? H : null
+							});
+							n.success("Circle created", `${e.name} is ready.`), D(!1), Y(), O?.(e);
+						} catch (e) {
+							q(t(e));
+						}
+					},
+					disabled: k.isPending,
+					children: "Create circle"
+				})] })
+			]
+		})
+	});
+}
+//#endregion
+export { E as CreateCircleDialog };
+
+//# sourceMappingURL=CreateCircleDialog.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CreateCircleDialog.js","names":[],"sources":["../../../src/comradecircle/components/CreateCircleDialog.tsx"],"sourcesContent":["/**\n * CreateCircleDialog — create a new community circle.\n * @module comradecircle/components\n *\n * Writes `comCreateCircle`. Slug auto-derives from the name (editable).\n */\n\nimport { useState } from 'react';\nimport {\n  Button,\n  Input,\n  Label,\n  Textarea,\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n  ResponsiveDialog,\n  ResponsiveDialogContent,\n  ResponsiveDialogHeader,\n  ResponsiveDialogTitle,\n  ResponsiveDialogDescription,\n  ResponsiveDialogFooter,\n} from '@burdenoff/fe-libs/ui';\nimport { TagInput } from './TagInput';\nimport { AvatarUploadField } from './AvatarUploadField';\nimport { useComCreateCircle } from '../hooks';\nimport { slugify } from '../utils/slug';\nimport { formatEnumLabel } from '../utils/formatters';\nimport { notify, describeError } from '../lib/toast';\nimport type { ComCircle, ComCircleVisibility } from '../types';\n\nconst VISIBILITIES: ComCircleVisibility[] = ['PUBLIC', 'PRIVATE', 'SECRET'];\n\ninterface CreateCircleDialogProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  onCreated?: (circle: ComCircle) => void;\n}\n\nexport function CreateCircleDialog({ open, onOpenChange, onCreated }: CreateCircleDialogProps) {\n  const createCircle = useComCreateCircle();\n  const [name, setName] = useState('');\n  const [slug, setSlug] = useState('');\n  const [slugTouched, setSlugTouched] = useState(false);\n  const [topic, setTopic] = useState('');\n  const [description, setDescription] = useState('');\n  const [visibility, setVisibility] = useState<ComCircleVisibility>('PUBLIC');\n  const [tags, setTags] = useState<string[]>([]);\n  const [avatarFileId, setAvatarFileId] = useState<string | null>(null);\n  const [error, setError] = useState<string | null>(null);\n\n  const effectiveSlug = slugTouched ? slug : slugify(name);\n\n  const reset = () => {\n    setName('');\n    setSlug('');\n    setSlugTouched(false);\n    setTopic('');\n    setDescription('');\n    setVisibility('PUBLIC');\n    setTags([]);\n    setAvatarFileId(null);\n    setError(null);\n  };\n\n  const submit = async () => {\n    if (!name.trim()) {\n      setError('Circle name is required.');\n      return;\n    }\n    if (!effectiveSlug) {\n      setError('A URL slug is required.');\n      return;\n    }\n    try {\n      const created = await createCircle.mutateAsync({\n        name: name.trim(),\n        slug: effectiveSlug,\n        topic: topic.trim() || null,\n        description: description.trim() || null,\n        visibility,\n        avatarFileId,\n        tags: tags.length ? tags : null,\n      });\n      notify.success('Circle created', `${created.name} is ready.`);\n      onOpenChange(false);\n      reset();\n      onCreated?.(created);\n    } catch (err) {\n      setError(describeError(err));\n    }\n  };\n\n  return (\n    <ResponsiveDialog open={open} onOpenChange={onOpenChange}>\n      <ResponsiveDialogContent className=\"sm:max-w-lg\">\n        <ResponsiveDialogHeader>\n          <ResponsiveDialogTitle>Create a circle</ResponsiveDialogTitle>\n          <ResponsiveDialogDescription>\n            A circle is a community space with its own channels, members, events, and polls.\n          </ResponsiveDialogDescription>\n        </ResponsiveDialogHeader>\n\n        <div className=\"flex flex-col gap-4 py-2\">\n          <div className=\"grid gap-1.5\">\n            <Label>Avatar</Label>\n            <AvatarUploadField\n              fileId={avatarFileId}\n              name={name || 'Circle'}\n              onUploaded={setAvatarFileId}\n              label=\"Upload circle avatar\"\n            />\n          </div>\n          <div className=\"grid gap-1.5\">\n            <Label htmlFor=\"circle-name\">Name</Label>\n            <Input\n              id=\"circle-name\"\n              value={name}\n              onChange={(e) => setName(e.target.value)}\n              placeholder=\"e.g. Product Guild\"\n            />\n          </div>\n          <div className=\"grid gap-1.5\">\n            <Label htmlFor=\"circle-slug\">URL slug</Label>\n            <Input\n              id=\"circle-slug\"\n              value={effectiveSlug}\n              onChange={(e) => {\n                setSlugTouched(true);\n                setSlug(slugify(e.target.value));\n              }}\n              placeholder=\"product-guild\"\n            />\n          </div>\n          <div className=\"grid gap-1.5\">\n            <Label htmlFor=\"circle-topic\">Topic</Label>\n            <Input\n              id=\"circle-topic\"\n              value={topic}\n              onChange={(e) => setTopic(e.target.value)}\n              placeholder=\"A short one-line topic\"\n            />\n          </div>\n          <div className=\"grid gap-1.5\">\n            <Label htmlFor=\"circle-desc\">Description</Label>\n            <Textarea\n              id=\"circle-desc\"\n              value={description}\n              onChange={(e) => setDescription(e.target.value)}\n              placeholder=\"What is this circle about?\"\n              rows={3}\n            />\n          </div>\n          <div className=\"grid gap-1.5\">\n            <Label>Visibility</Label>\n            <Select\n              value={visibility}\n              onValueChange={(v) => setVisibility(v as ComCircleVisibility)}\n            >\n              <SelectTrigger>\n                <SelectValue />\n              </SelectTrigger>\n              <SelectContent>\n                {VISIBILITIES.map((v) => (\n                  <SelectItem key={v} value={v}>\n                    {formatEnumLabel(v)}\n                  </SelectItem>\n                ))}\n              </SelectContent>\n            </Select>\n          </div>\n          <div className=\"grid gap-1.5\">\n            <Label htmlFor=\"circle-tags\">Tags</Label>\n            <TagInput id=\"circle-tags\" value={tags} onChange={setTags} placeholder=\"Add tags…\" />\n          </div>\n          {error && <p className=\"text-sm text-status-error-text\">{error}</p>}\n        </div>\n\n        <ResponsiveDialogFooter>\n          <Button variant=\"outline\" onClick={() => onOpenChange(false)}>\n            Cancel\n          </Button>\n          <Button onClick={submit} disabled={createCircle.isPending}>\n            Create circle\n          </Button>\n        </ResponsiveDialogFooter>\n      </ResponsiveDialogContent>\n    </ResponsiveDialog>\n  );\n}\n"],"mappings":"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"}

package/dist/comradecircle/components/CreateEventDialog.js

@@ -0,0 +1,210 @@
+import { useComCircles as e, useComCreateEvent as t } from "../hooks/useComradeCircleApi.js";
+import "../hooks/index.js";
+import { describeError as n, notify as r } from "../lib/toast.js";
+import { formatEnumLabel as i } from "../utils/formatters.js";
+import { TagInput as a } from "./TagInput.js";
+import { useState as o } from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { Button as l, Input as u, Label as d, ResponsiveDialog as f, ResponsiveDialogContent as p, ResponsiveDialogDescription as ee, ResponsiveDialogFooter as m, ResponsiveDialogHeader as h, ResponsiveDialogTitle as g, Select as _, SelectContent as v, SelectItem as y, SelectTrigger as b, SelectValue as x, Textarea as S } from "@burdenoff/fe-libs/ui";
+//#region src/comradecircle/components/CreateEventDialog.tsx
+var C = [
+	"ONLINE",
+	"IN_PERSON",
+	"HYBRID"
+], w = (e) => {
+	if (!e) return null;
+	let t = new Date(e);
+	return Number.isNaN(t.getTime()) ? null : t.toISOString();
+};
+function T({ open: T, onOpenChange: E, circleId: D, onCreated: O }) {
+	let k = t(), A = e({ status: "ACTIVE" }), [j, M] = o(""), [N, P] = o(""), [F, I] = o(""), [L, R] = o("ONLINE"), [z, B] = o(""), [V, H] = o(""), [U, W] = o(""), [G, K] = o(""), [q, J] = o(""), [Y, X] = o([]), [Z, Q] = o(null), $ = D ?? j, te = () => {
+		M(""), P(""), I(""), R("ONLINE"), B(""), H(""), W(""), K(""), J(""), X([]), Q(null);
+	};
+	return /* @__PURE__ */ s(f, {
+		open: T,
+		onOpenChange: E,
+		children: /* @__PURE__ */ c(p, {
+			className: "sm:max-w-lg",
+			children: [
+				/* @__PURE__ */ c(h, { children: [/* @__PURE__ */ s(g, { children: "Schedule an event" }), /* @__PURE__ */ s(ee, { children: "Host a gathering for your circle — online, in person, or hybrid." })] }),
+				/* @__PURE__ */ c("div", {
+					className: "flex max-h-[60vh] flex-col gap-4 overflow-y-auto py-2",
+					children: [
+						!D && /* @__PURE__ */ c("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ s(d, { children: "Circle" }), /* @__PURE__ */ c(_, {
+								value: j,
+								onValueChange: M,
+								children: [/* @__PURE__ */ s(b, { children: /* @__PURE__ */ s(x, { placeholder: "Choose a circle" }) }), /* @__PURE__ */ s(v, { children: (A.data?.items ?? []).map((e) => /* @__PURE__ */ s(y, {
+									value: e.id,
+									children: e.name
+								}, e.id)) })]
+							})]
+						}),
+						/* @__PURE__ */ c("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ s(d, {
+								htmlFor: "event-title",
+								children: "Title"
+							}), /* @__PURE__ */ s(u, {
+								id: "event-title",
+								value: N,
+								onChange: (e) => P(e.target.value),
+								placeholder: "e.g. Monthly community call"
+							})]
+						}),
+						/* @__PURE__ */ c("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ s(d, {
+								htmlFor: "event-desc",
+								children: "Description"
+							}), /* @__PURE__ */ s(S, {
+								id: "event-desc",
+								value: F,
+								onChange: (e) => I(e.target.value),
+								rows: 2
+							})]
+						}),
+						/* @__PURE__ */ c("div", {
+							className: "grid grid-cols-2 gap-3",
+							children: [/* @__PURE__ */ c("div", {
+								className: "grid gap-1.5",
+								children: [/* @__PURE__ */ s(d, { children: "Mode" }), /* @__PURE__ */ c(_, {
+									value: L,
+									onValueChange: (e) => R(e),
+									children: [/* @__PURE__ */ s(b, { children: /* @__PURE__ */ s(x, {}) }), /* @__PURE__ */ s(v, { children: C.map((e) => /* @__PURE__ */ s(y, {
+										value: e,
+										children: i(e)
+									}, e)) })]
+								})]
+							}), /* @__PURE__ */ c("div", {
+								className: "grid gap-1.5",
+								children: [/* @__PURE__ */ s(d, {
+									htmlFor: "event-capacity",
+									children: "Capacity"
+								}), /* @__PURE__ */ s(u, {
+									id: "event-capacity",
+									type: "number",
+									min: 0,
+									value: U,
+									onChange: (e) => W(e.target.value),
+									placeholder: "Optional"
+								})]
+							})]
+						}),
+						L !== "ONLINE" && /* @__PURE__ */ c("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ s(d, {
+								htmlFor: "event-location",
+								children: "Location"
+							}), /* @__PURE__ */ s(u, {
+								id: "event-location",
+								value: z,
+								onChange: (e) => B(e.target.value),
+								placeholder: "Venue / address"
+							})]
+						}),
+						L !== "IN_PERSON" && /* @__PURE__ */ c("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ s(d, {
+								htmlFor: "event-join",
+								children: "Join URL"
+							}), /* @__PURE__ */ s(u, {
+								id: "event-join",
+								value: V,
+								onChange: (e) => H(e.target.value),
+								placeholder: "https://…"
+							})]
+						}),
+						/* @__PURE__ */ c("div", {
+							className: "grid grid-cols-2 gap-3",
+							children: [/* @__PURE__ */ c("div", {
+								className: "grid gap-1.5",
+								children: [/* @__PURE__ */ s(d, {
+									htmlFor: "event-start",
+									children: "Starts"
+								}), /* @__PURE__ */ s(u, {
+									id: "event-start",
+									type: "datetime-local",
+									value: G,
+									onChange: (e) => K(e.target.value)
+								})]
+							}), /* @__PURE__ */ c("div", {
+								className: "grid gap-1.5",
+								children: [/* @__PURE__ */ s(d, {
+									htmlFor: "event-end",
+									children: "Ends"
+								}), /* @__PURE__ */ s(u, {
+									id: "event-end",
+									type: "datetime-local",
+									value: q,
+									onChange: (e) => J(e.target.value)
+								})]
+							})]
+						}),
+						/* @__PURE__ */ c("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ s(d, {
+								htmlFor: "event-tags",
+								children: "Tags"
+							}), /* @__PURE__ */ s(a, {
+								id: "event-tags",
+								value: Y,
+								onChange: X,
+								placeholder: "Add tags…"
+							})]
+						}),
+						Z && /* @__PURE__ */ s("p", {
+							className: "text-sm text-status-error-text",
+							children: Z
+						})
+					]
+				}),
+				/* @__PURE__ */ c(m, { children: [/* @__PURE__ */ s(l, {
+					variant: "outline",
+					onClick: () => E(!1),
+					children: "Cancel"
+				}), /* @__PURE__ */ s(l, {
+					onClick: async () => {
+						if (!$) {
+							Q("Please choose a circle for this event.");
+							return;
+						}
+						if (!N.trim()) {
+							Q("Event title is required.");
+							return;
+						}
+						let e = w(G);
+						if (!e) {
+							Q("A valid start date & time is required.");
+							return;
+						}
+						try {
+							let t = await k.mutateAsync({
+								circleId: $,
+								title: N.trim(),
+								description: F.trim() || null,
+								mode: L,
+								location: z.trim() || null,
+								joinUrl: V.trim() || null,
+								capacity: U ? Number(U) : null,
+								startsAt: e,
+								endsAt: w(q),
+								tags: Y.length ? Y : null
+							});
+							r.success("Event scheduled", t.title), E(!1), te(), O?.(t);
+						} catch (e) {
+							Q(n(e));
+						}
+					},
+					disabled: k.isPending,
+					children: "Schedule event"
+				})] })
+			]
+		})
+	});
+}
+//#endregion
+export { T as CreateEventDialog };
+
+//# sourceMappingURL=CreateEventDialog.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CreateEventDialog.js","names":[],"sources":["../../../src/comradecircle/components/CreateEventDialog.tsx"],"sourcesContent":["/**\n * CreateEventDialog — schedule a new event in a circle.\n * @module comradecircle/components\n *\n * Writes `comCreateEvent`. When no `circleId` is fixed by the caller, a circle\n * picker (active circles) is shown. Datetime-local inputs are converted to ISO\n * strings for the `DateTime` scalar.\n */\n\nimport { useState } from 'react';\nimport {\n  Button,\n  Input,\n  Label,\n  Textarea,\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n  ResponsiveDialog,\n  ResponsiveDialogContent,\n  ResponsiveDialogHeader,\n  ResponsiveDialogTitle,\n  ResponsiveDialogDescription,\n  ResponsiveDialogFooter,\n} from '@burdenoff/fe-libs/ui';\nimport { TagInput } from './TagInput';\nimport { useComCreateEvent, useComCircles } from '../hooks';\nimport { formatEnumLabel } from '../utils/formatters';\nimport { notify, describeError } from '../lib/toast';\nimport type { ComEvent, ComEventMode } from '../types';\n\nconst MODES: ComEventMode[] = ['ONLINE', 'IN_PERSON', 'HYBRID'];\n\nconst toIso = (local: string): string | null => {\n  if (!local) return null;\n  const d = new Date(local);\n  return Number.isNaN(d.getTime()) ? null : d.toISOString();\n};\n\ninterface CreateEventDialogProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  /** Fixed circle — when omitted the dialog shows an active-circle picker. */\n  circleId?: string;\n  onCreated?: (event: ComEvent) => void;\n}\n\nexport function CreateEventDialog({\n  open,\n  onOpenChange,\n  circleId,\n  onCreated,\n}: CreateEventDialogProps) {\n  const createEvent = useComCreateEvent();\n  const circlesQuery = useComCircles({ status: 'ACTIVE' });\n  const [pickedCircle, setPickedCircle] = useState('');\n  const [title, setTitle] = useState('');\n  const [description, setDescription] = useState('');\n  const [mode, setMode] = useState<ComEventMode>('ONLINE');\n  const [location, setLocation] = useState('');\n  const [joinUrl, setJoinUrl] = useState('');\n  const [capacity, setCapacity] = useState('');\n  const [startsAt, setStartsAt] = useState('');\n  const [endsAt, setEndsAt] = useState('');\n  const [tags, setTags] = useState<string[]>([]);\n  const [error, setError] = useState<string | null>(null);\n\n  const effectiveCircle = circleId ?? pickedCircle;\n\n  const reset = () => {\n    setPickedCircle('');\n    setTitle('');\n    setDescription('');\n    setMode('ONLINE');\n    setLocation('');\n    setJoinUrl('');\n    setCapacity('');\n    setStartsAt('');\n    setEndsAt('');\n    setTags([]);\n    setError(null);\n  };\n\n  const submit = async () => {\n    if (!effectiveCircle) {\n      setError('Please choose a circle for this event.');\n      return;\n    }\n    if (!title.trim()) {\n      setError('Event title is required.');\n      return;\n    }\n    const startIso = toIso(startsAt);\n    if (!startIso) {\n      setError('A valid start date & time is required.');\n      return;\n    }\n    try {\n      const created = await createEvent.mutateAsync({\n        circleId: effectiveCircle,\n        title: title.trim(),\n        description: description.trim() || null,\n        mode,\n        location: location.trim() || null,\n        joinUrl: joinUrl.trim() || null,\n        capacity: capacity ? Number(capacity) : null,\n        startsAt: startIso,\n        endsAt: toIso(endsAt),\n        tags: tags.length ? tags : null,\n      });\n      notify.success('Event scheduled', created.title);\n      onOpenChange(false);\n      reset();\n      onCreated?.(created);\n    } catch (err) {\n      setError(describeError(err));\n    }\n  };\n\n  return (\n    <ResponsiveDialog open={open} onOpenChange={onOpenChange}>\n      <ResponsiveDialogContent className=\"sm:max-w-lg\">\n        <ResponsiveDialogHeader>\n          <ResponsiveDialogTitle>Schedule an event</ResponsiveDialogTitle>\n          <ResponsiveDialogDescription>\n            Host a gathering for your circle — online, in person, or hybrid.\n          </ResponsiveDialogDescription>\n        </ResponsiveDialogHeader>\n\n        <div className=\"flex max-h-[60vh] flex-col gap-4 overflow-y-auto py-2\">\n          {!circleId && (\n            <div className=\"grid gap-1.5\">\n              <Label>Circle</Label>\n              <Select value={pickedCircle} onValueChange={setPickedCircle}>\n                <SelectTrigger>\n                  <SelectValue placeholder=\"Choose a circle\" />\n                </SelectTrigger>\n                <SelectContent>\n                  {(circlesQuery.data?.items ?? []).map((c) => (\n                    <SelectItem key={c.id} value={c.id}>\n                      {c.name}\n                    </SelectItem>\n                  ))}\n                </SelectContent>\n              </Select>\n            </div>\n          )}\n          <div className=\"grid gap-1.5\">\n            <Label htmlFor=\"event-title\">Title</Label>\n            <Input\n              id=\"event-title\"\n              value={title}\n              onChange={(e) => setTitle(e.target.value)}\n              placeholder=\"e.g. Monthly community call\"\n            />\n          </div>\n          <div className=\"grid gap-1.5\">\n            <Label htmlFor=\"event-desc\">Description</Label>\n            <Textarea\n              id=\"event-desc\"\n              value={description}\n              onChange={(e) => setDescription(e.target.value)}\n              rows={2}\n            />\n          </div>\n          <div className=\"grid grid-cols-2 gap-3\">\n            <div className=\"grid gap-1.5\">\n              <Label>Mode</Label>\n              <Select value={mode} onValueChange={(v) => setMode(v as ComEventMode)}>\n                <SelectTrigger>\n                  <SelectValue />\n                </SelectTrigger>\n                <SelectContent>\n                  {MODES.map((m) => (\n                    <SelectItem key={m} value={m}>\n                      {formatEnumLabel(m)}\n                    </SelectItem>\n                  ))}\n                </SelectContent>\n              </Select>\n            </div>\n            <div className=\"grid gap-1.5\">\n              <Label htmlFor=\"event-capacity\">Capacity</Label>\n              <Input\n                id=\"event-capacity\"\n                type=\"number\"\n                min={0}\n                value={capacity}\n                onChange={(e) => setCapacity(e.target.value)}\n                placeholder=\"Optional\"\n              />\n            </div>\n          </div>\n          {mode !== 'ONLINE' && (\n            <div className=\"grid gap-1.5\">\n              <Label htmlFor=\"event-location\">Location</Label>\n              <Input\n                id=\"event-location\"\n                value={location}\n                onChange={(e) => setLocation(e.target.value)}\n                placeholder=\"Venue / address\"\n              />\n            </div>\n          )}\n          {mode !== 'IN_PERSON' && (\n            <div className=\"grid gap-1.5\">\n              <Label htmlFor=\"event-join\">Join URL</Label>\n              <Input\n                id=\"event-join\"\n                value={joinUrl}\n                onChange={(e) => setJoinUrl(e.target.value)}\n                placeholder=\"https://…\"\n              />\n            </div>\n          )}\n          <div className=\"grid grid-cols-2 gap-3\">\n            <div className=\"grid gap-1.5\">\n              <Label htmlFor=\"event-start\">Starts</Label>\n              <Input\n                id=\"event-start\"\n                type=\"datetime-local\"\n                value={startsAt}\n                onChange={(e) => setStartsAt(e.target.value)}\n              />\n            </div>\n            <div className=\"grid gap-1.5\">\n              <Label htmlFor=\"event-end\">Ends</Label>\n              <Input\n                id=\"event-end\"\n                type=\"datetime-local\"\n                value={endsAt}\n                onChange={(e) => setEndsAt(e.target.value)}\n              />\n            </div>\n          </div>\n          <div className=\"grid gap-1.5\">\n            <Label htmlFor=\"event-tags\">Tags</Label>\n            <TagInput id=\"event-tags\" value={tags} onChange={setTags} placeholder=\"Add tags…\" />\n          </div>\n          {error && <p className=\"text-sm text-status-error-text\">{error}</p>}\n        </div>\n\n        <ResponsiveDialogFooter>\n          <Button variant=\"outline\" onClick={() => onOpenChange(false)}>\n            Cancel\n          </Button>\n          <Button onClick={submit} disabled={createEvent.isPending}>\n            Schedule event\n          </Button>\n        </ResponsiveDialogFooter>\n      </ResponsiveDialogContent>\n    </ResponsiveDialog>\n  );\n}\n"],"mappings":";;;;;;;;;AAiCA,IAAM,IAAwB;CAAC;CAAU;CAAa;CAAS,EAEzD,KAAS,MAAiC;AAC9C,KAAI,CAAC,EAAO,QAAO;CACnB,IAAM,IAAI,IAAI,KAAK,EAAM;AACzB,QAAO,OAAO,MAAM,EAAE,SAAS,CAAC,GAAG,OAAO,EAAE,aAAa;;AAW3D,SAAgB,EAAkB,EAChC,SACA,iBACA,aACA,gBACyB;CACzB,IAAM,IAAc,GAAmB,EACjC,IAAe,EAAc,EAAE,QAAQ,UAAU,CAAC,EAClD,CAAC,GAAc,KAAmB,EAAS,GAAG,EAC9C,CAAC,GAAO,KAAY,EAAS,GAAG,EAChC,CAAC,GAAa,KAAkB,EAAS,GAAG,EAC5C,CAAC,GAAM,KAAW,EAAuB,SAAS,EAClD,CAAC,GAAU,KAAe,EAAS,GAAG,EACtC,CAAC,GAAS,KAAc,EAAS,GAAG,EACpC,CAAC,GAAU,KAAe,EAAS,GAAG,EACtC,CAAC,GAAU,KAAe,EAAS,GAAG,EACtC,CAAC,GAAQ,KAAa,EAAS,GAAG,EAClC,CAAC,GAAM,KAAW,EAAmB,EAAE,CAAC,EACxC,CAAC,GAAO,KAAY,EAAwB,KAAK,EAEjD,IAAkB,KAAY,GAE9B,WAAc;AAWlB,EAVA,EAAgB,GAAG,EACnB,EAAS,GAAG,EACZ,EAAe,GAAG,EAClB,EAAQ,SAAS,EACjB,EAAY,GAAG,EACf,EAAW,GAAG,EACd,EAAY,GAAG,EACf,EAAY,GAAG,EACf,EAAU,GAAG,EACb,EAAQ,EAAE,CAAC,EACX,EAAS,KAAK;;AAuChB,QACE,kBAAC,GAAD;EAAwB;EAAoB;YAC1C,kBAAC,GAAD;GAAyB,WAAU;aAAnC;IACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD,EAAA,UAAuB,qBAAyC,CAAA,EAChE,kBAAC,IAAD,EAAA,UAA6B,oEAEC,CAAA,CACP,EAAA,CAAA;IAEzB,kBAAC,OAAD;KAAK,WAAU;eAAf;MACG,CAAC,KACA,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD,EAAA,UAAO,UAAc,CAAA,EACrB,kBAAC,GAAD;QAAQ,OAAO;QAAc,eAAe;kBAA5C,CACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,EAAa,aAAY,mBAAoB,CAAA,EAC/B,CAAA,EAChB,kBAAC,GAAD,EAAA,WACI,EAAa,MAAM,SAAS,EAAE,EAAE,KAAK,MACrC,kBAAC,GAAD;SAAuB,OAAO,EAAE;mBAC7B,EAAE;SACQ,EAFI,EAAE,GAEN,CACb,EACY,CAAA,CACT;UACL;;MAER,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD;QAAO,SAAQ;kBAAc;QAAa,CAAA,EAC1C,kBAAC,GAAD;QACE,IAAG;QACH,OAAO;QACP,WAAW,MAAM,EAAS,EAAE,OAAO,MAAM;QACzC,aAAY;QACZ,CAAA,CACE;;MACN,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD;QAAO,SAAQ;kBAAa;QAAmB,CAAA,EAC/C,kBAAC,GAAD;QACE,IAAG;QACH,OAAO;QACP,WAAW,MAAM,EAAe,EAAE,OAAO,MAAM;QAC/C,MAAM;QACN,CAAA,CACE;;MACN,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,GAAD,EAAA,UAAO,QAAY,CAAA,EACnB,kBAAC,GAAD;SAAQ,OAAO;SAAM,gBAAgB,MAAM,EAAQ,EAAkB;mBAArE,CACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,EAAe,CAAA,EACD,CAAA,EAChB,kBAAC,GAAD,EAAA,UACG,EAAM,KAAK,MACV,kBAAC,GAAD;UAAoB,OAAO;oBACxB,EAAgB,EAAE;UACR,EAFI,EAEJ,CACb,EACY,CAAA,CACT;WACL;WACN,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,GAAD;SAAO,SAAQ;mBAAiB;SAAgB,CAAA,EAChD,kBAAC,GAAD;SACE,IAAG;SACH,MAAK;SACL,KAAK;SACL,OAAO;SACP,WAAW,MAAM,EAAY,EAAE,OAAO,MAAM;SAC5C,aAAY;SACZ,CAAA,CACE;UACF;;MACL,MAAS,YACR,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD;QAAO,SAAQ;kBAAiB;QAAgB,CAAA,EAChD,kBAAC,GAAD;QACE,IAAG;QACH,OAAO;QACP,WAAW,MAAM,EAAY,EAAE,OAAO,MAAM;QAC5C,aAAY;QACZ,CAAA,CACE;;MAEP,MAAS,eACR,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD;QAAO,SAAQ;kBAAa;QAAgB,CAAA,EAC5C,kBAAC,GAAD;QACE,IAAG;QACH,OAAO;QACP,WAAW,MAAM,EAAW,EAAE,OAAO,MAAM;QAC3C,aAAY;QACZ,CAAA,CACE;;MAER,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,GAAD;SAAO,SAAQ;mBAAc;SAAc,CAAA,EAC3C,kBAAC,GAAD;SACE,IAAG;SACH,MAAK;SACL,OAAO;SACP,WAAW,MAAM,EAAY,EAAE,OAAO,MAAM;SAC5C,CAAA,CACE;WACN,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,GAAD;SAAO,SAAQ;mBAAY;SAAY,CAAA,EACvC,kBAAC,GAAD;SACE,IAAG;SACH,MAAK;SACL,OAAO;SACP,WAAW,MAAM,EAAU,EAAE,OAAO,MAAM;SAC1C,CAAA,CACE;UACF;;MACN,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,GAAD;QAAO,SAAQ;kBAAa;QAAY,CAAA,EACxC,kBAAC,GAAD;QAAU,IAAG;QAAa,OAAO;QAAM,UAAU;QAAS,aAAY;QAAc,CAAA,CAChF;;MACL,KAAS,kBAAC,KAAD;OAAG,WAAU;iBAAkC;OAAU,CAAA;MAC/D;;IAEN,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;KAAQ,SAAQ;KAAU,eAAe,EAAa,GAAM;eAAE;KAErD,CAAA,EACT,kBAAC,GAAD;KAAQ,SAnKD,YAAY;AACzB,UAAI,CAAC,GAAiB;AACpB,SAAS,yCAAyC;AAClD;;AAEF,UAAI,CAAC,EAAM,MAAM,EAAE;AACjB,SAAS,2BAA2B;AACpC;;MAEF,IAAM,IAAW,EAAM,EAAS;AAChC,UAAI,CAAC,GAAU;AACb,SAAS,yCAAyC;AAClD;;AAEF,UAAI;OACF,IAAM,IAAU,MAAM,EAAY,YAAY;QAC5C,UAAU;QACV,OAAO,EAAM,MAAM;QACnB,aAAa,EAAY,MAAM,IAAI;QACnC;QACA,UAAU,EAAS,MAAM,IAAI;QAC7B,SAAS,EAAQ,MAAM,IAAI;QAC3B,UAAU,IAAW,OAAO,EAAS,GAAG;QACxC,UAAU;QACV,QAAQ,EAAM,EAAO;QACrB,MAAM,EAAK,SAAS,IAAO;QAC5B,CAAC;AAIF,OAHA,EAAO,QAAQ,mBAAmB,EAAQ,MAAM,EAChD,EAAa,GAAM,EACnB,IAAO,EACP,IAAY,EAAQ;eACb,GAAK;AACZ,SAAS,EAAc,EAAI,CAAC;;;KAmIC,UAAU,EAAY;eAAW;KAEjD,CAAA,CACc,EAAA,CAAA;IACD;;EACT,CAAA"}

package/dist/comradecircle/components/EmptyState.js

@@ -0,0 +1,35 @@
+import { cn as e } from "../utils/cn.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { IllustratedEmptyState as r } from "@burdenoff/fe-libs/ui";
+//#region src/comradecircle/components/EmptyState.tsx
+var i = ({ icon: i, illustration: a, title: o, description: s, action: c, className: l }) => a ? /* @__PURE__ */ t(r, {
+	illustration: a,
+	title: o,
+	description: s,
+	action: c,
+	className: l
+}) : /* @__PURE__ */ n("div", {
+	className: e("flex flex-col items-center justify-center py-12 px-4 text-center", l),
+	children: [
+		i && /* @__PURE__ */ t("div", {
+			className: "mb-4 text-text-secondary opacity-50",
+			children: i
+		}),
+		/* @__PURE__ */ t("h3", {
+			className: "text-lg font-medium text-text-primary",
+			children: o
+		}),
+		s && /* @__PURE__ */ t("p", {
+			className: "mt-2 text-sm text-text-secondary max-w-sm",
+			children: s
+		}),
+		c && /* @__PURE__ */ t("div", {
+			className: "mt-6",
+			children: c
+		})
+	]
+});
+//#endregion
+export { i as EmptyState };
+
+//# sourceMappingURL=EmptyState.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.js","names":[],"sources":["../../../src/comradecircle/components/EmptyState.tsx"],"sourcesContent":["/**\n * Empty State Component\n * @module comradecircle/components\n *\n * Boff UI 2.0 zero-state. When an `illustration` name is provided it renders the\n * fe-libs {@link IllustratedEmptyState} (on-brand glass illustration); otherwise\n * it falls back to the icon-based layout.\n */\n\nimport type { FC, ReactNode } from 'react';\nimport { IllustratedEmptyState } from '@burdenoff/fe-libs/ui';\nimport { cn } from '../utils/cn';\n\ninterface EmptyStateProps {\n  icon?: ReactNode;\n  /**\n   * On-brand illustration name → `/illustrations/<name>.webp`. Standard names:\n   * empty-data, empty-search, empty-files, empty-people, empty-notifications,\n   * onboarding, empty-generic.\n   */\n  illustration?: string;\n  title: string;\n  description?: string;\n  action?: ReactNode;\n  className?: string;\n}\n\nexport const EmptyState: FC<EmptyStateProps> = ({\n  icon,\n  illustration,\n  title,\n  description,\n  action,\n  className,\n}) => {\n  if (illustration) {\n    return (\n      <IllustratedEmptyState\n        illustration={illustration}\n        title={title}\n        description={description}\n        action={action}\n        className={className}\n      />\n    );\n  }\n\n  return (\n    <div\n      className={cn('flex flex-col items-center justify-center py-12 px-4 text-center', className)}\n    >\n      {icon && <div className=\"mb-4 text-text-secondary opacity-50\">{icon}</div>}\n      <h3 className=\"text-lg font-medium text-text-primary\">{title}</h3>\n      {description && <p className=\"mt-2 text-sm text-text-secondary max-w-sm\">{description}</p>}\n      {action && <div className=\"mt-6\">{action}</div>}\n    </div>\n  );\n};\n"],"mappings":";;;;AA2BA,IAAa,KAAmC,EAC9C,SACA,iBACA,UACA,gBACA,WACA,mBAEI,IAEA,kBAAC,GAAD;CACgB;CACP;CACM;CACL;CACG;CACX,CAAA,GAKJ,kBAAC,OAAD;CACE,WAAW,EAAG,oEAAoE,EAAU;WAD9F;EAGG,KAAQ,kBAAC,OAAD;GAAK,WAAU;aAAuC;GAAW,CAAA;EAC1E,kBAAC,MAAD;GAAI,WAAU;aAAyC;GAAW,CAAA;EACjE,KAAe,kBAAC,KAAD;GAAG,WAAU;aAA6C;GAAgB,CAAA;EACzF,KAAU,kBAAC,OAAD;GAAK,WAAU;aAAQ;GAAa,CAAA;EAC3C"}