@flanksource/clicky-ui 0.3.27 → 0.3.29

package/dist/comments/CommentSidePanel.cjs

@@ -83,12 +83,14 @@ function orderComments(comments, anchorOrder) {
 }
 function AllComments({
   ctx,
-  label
+  comments,
+  label,
+  emptyLabel
 }) {
   const ordered = react.useMemo(() => {
     const anchorOrder = new Map(orderedAnchors(ctx).map((a, i) => [a, i]));
-    return orderComments(ctx.comments, anchorOrder);
-  }, [ctx]);
+    return orderComments(comments, anchorOrder);
+  }, [ctx, comments]);
   const handlers = commentUtils.buildThreadListHandlers(ordered, ctx.config, ctx.callbacks);
   function activateThread(event, anchor) {
     const target = event.target;
@@ -110,7 +112,7 @@ function AllComments({
     ctx.focusAnchor(anchor);
   }
   if (ordered.length === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsx("p", { className: "rounded-lg bg-muted/40 px-3 py-2 text-xs text-muted-foreground", children: "No comments yet." });
+    return /* @__PURE__ */ jsxRuntime.jsx("p", { className: "rounded-lg bg-muted/40 px-3 py-2 text-xs text-muted-foreground", children: emptyLabel });
   }
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -147,13 +149,12 @@ function AllComments({
 }
 function FocusedComments({
   ctx,
+  comments: visible,
   anchor,
   label,
   compact
 }) {
-  const comments = ctx.comments.filter(
-    (c) => (c.anchor ?? commentTypes.DOCUMENT_ANCHOR) === anchor
-  );
+  const comments = commentUtils.selectAnchorThreads(visible, anchor);
   const hasComments = comments.length > 0;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", "data-comment-anchor": anchor, children: [
     /* @__PURE__ */ jsxRuntime.jsx(
@@ -170,7 +171,7 @@ function FocusedComments({
         anchor,
         compact: compact ?? false,
         autoFocusComposer: !hasComments,
-        defaultExpandedRoots: hasComments,
+        defaultExpanded: hasComments,
         composerPlaceholder: hasComments ? "Add another top-level comment…" : "Add a comment…",
         ...ctx.callbacks
       }
@@ -183,6 +184,7 @@ function CommentSidePanel(props) {
   const railRef = react.useRef(null);
   const focusedRef = react.useRef(null);
   const [focusedOffset, setFocusedOffset] = react.useState(null);
+  const [showResolved, setShowResolved] = react.useState(false);
   const focusedAnchor = (ctx == null ? void 0 : ctx.railMode) === "focused" ? ctx.focusedAnchor : null;
   react.useEffect(() => {
     if (!ctx || props.focusedAlignment !== "anchor" || !focusedAnchor) {
@@ -217,79 +219,90 @@ function CommentSidePanel(props) {
     };
   }, [ctx, focusedAnchor, props.focusedAlignment]);
   if (!ctx) return null;
-  const total = Object.values(ctx.commentCounts).reduce((a, b) => a + b, 0);
-  if (ctx.railMode === "closed" && total === 0) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  const unresolved = commentUtils.selectUnresolvedThreads(ctx.comments, ctx.config);
+  const visible = showResolved ? ctx.comments : unresolved;
+  const total = commentUtils.getRoots(visible).length;
+  const resolvedCount = commentUtils.getRoots(ctx.comments).length - commentUtils.getRoots(unresolved).length;
+  if (ctx.railMode === "closed" && total === 0 && resolvedCount === 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
     "aside",
     {
       ref: railRef,
       "data-testid": "comment-side-panel",
       className: utils.cn("relative w-[320px] space-y-3", props.className),
-      children: ctx.railMode === "all" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(RailToggle, { active: true, onClick: ctx.openCommentList, children: [
-            "All comments (",
-            total,
-            ")"
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "button",
-            {
-              type: "button",
-              onClick: ctx.closeRail,
-              className: "ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground",
-              children: "Close"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(AllComments, { ctx, label })
-      ] }) : ctx.railMode === "focused" && ctx.focusedAnchor ? /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          ref: focusedRef,
-          "data-testid": "comment-focused-rail",
-          className: "relative space-y-3",
-          style: focusedOffset == null ? void 0 : { top: focusedOffset },
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-              total > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            "data-testid": "comment-rail-header",
+            className: "sticky top-0 z-20 flex items-center gap-2 bg-background py-2",
+            children: [
+              (total > 0 || ctx.railMode === "all") && /* @__PURE__ */ jsxRuntime.jsx(
                 RailToggle,
                 {
+                  active: ctx.railMode === "all",
                   onClick: ctx.openCommentList,
                   testId: "comment-open-all",
+                  children: ctx.railMode === "closed" ? `Open comments (${total})` : `All comments (${total})`
+                }
+              ),
+              resolvedCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
+                "button",
+                {
+                  type: "button",
+                  "aria-pressed": showResolved,
+                  onClick: () => setShowResolved((shown) => !shown),
+                  className: utils.cn(
+                    "rounded-full border px-2 py-1 text-xs font-medium transition-colors",
+                    showResolved ? "border-primary bg-primary text-primary-foreground" : "border-border bg-background text-muted-foreground hover:text-foreground"
+                  ),
                   children: [
-                    "All comments (",
-                    total,
+                    "Resolved (",
+                    resolvedCount,
                     ")"
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsx(
+              ctx.railMode !== "closed" && /* @__PURE__ */ jsxRuntime.jsx(
                 "button",
                 {
                   type: "button",
                   onClick: ctx.closeRail,
                   className: "ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground",
-                  children: "Hide"
+                  children: ctx.railMode === "all" ? "Close" : "Hide"
                 }
               )
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(
+            ]
+          }
+        ),
+        ctx.railMode === "all" ? /* @__PURE__ */ jsxRuntime.jsx(
+          AllComments,
+          {
+            ctx,
+            comments: visible,
+            label,
+            emptyLabel: resolvedCount > 0 ? "No open comments." : "No comments yet."
+          }
+        ) : ctx.railMode === "focused" && ctx.focusedAnchor ? /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            ref: focusedRef,
+            "data-testid": "comment-focused-rail",
+            className: "relative space-y-3",
+            style: focusedOffset == null ? void 0 : { top: focusedOffset },
+            children: /* @__PURE__ */ jsxRuntime.jsx(
               FocusedComments,
               {
                 ctx,
+                comments: visible,
                 anchor: ctx.focusedAnchor,
                 label: label(ctx.focusedAnchor),
                 ...props.compact !== void 0 ? { compact: props.compact } : {}
               }
             )
-          ]
-        }
-      ) : /* @__PURE__ */ jsxRuntime.jsxs(RailToggle, { onClick: ctx.openCommentList, testId: "comment-open-all", children: [
-        "Open comments (",
-        total,
-        ")"
-      ] })
+          }
+        ) : null
+      ]
     }
   );
 }

package/dist/comments/CommentSidePanel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CommentSidePanel.cjs","sources":["../../src/comments/CommentSidePanel.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, type MouseEvent } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiComment } from \"../icons\";\nimport { CommentThread } from \"./CommentThread\";\nimport { CommentThreadList } from \"./CommentThreadList\";\nimport {\n  useCommentContextOptional,\n  type CommentContextValue,\n} from \"./comment-context\";\nimport {\n  buildThreadListHandlers,\n  getRoots,\n  sortReplies,\n  buildReplyMap,\n} from \"./comment-utils\";\nimport {\n  DOCUMENT_ANCHOR,\n  type Comment,\n  type CommentAnchor,\n} from \"./comment-types\";\n\nexport type CommentSidePanelProps = {\n  /** Explicit label per anchor key. */\n  anchorLabels?: Record<CommentAnchor, string>;\n  /** Fallback label formatter for anchors without an explicit label. */\n  formatAnchorLabel?: (anchor: CommentAnchor) => string;\n  compact?: boolean;\n  /** Position the focused thread beside its registered content anchor. */\n  focusedAlignment?: \"flow\" | \"anchor\";\n  className?: string;\n};\n\nfunction defaultAnchorLabel(anchor: CommentAnchor): string {\n  if (anchor === DOCUMENT_ANCHOR) return \"General\";\n  return anchor\n    .replace(/\\[\\d+\\]/g, \"\")\n    .replaceAll(\".\", \" › \")\n    .replaceAll(\"_\", \" \")\n    .trim();\n}\n\nfunction useAnchorLabel(props: CommentSidePanelProps) {\n  return (anchor: CommentAnchor): string =>\n    props.anchorLabels?.[anchor] ??\n    props.formatAnchorLabel?.(anchor) ??\n    defaultAnchorLabel(anchor);\n}\n\nfunction LocationMeta({ label }: { label: string }) {\n  return (\n    <span\n      data-testid=\"comment-location-meta\"\n      className=\"inline-flex items-center rounded-full bg-muted px-2 py-1 text-[10px] font-medium text-muted-foreground\"\n    >\n      {label}\n    </span>\n  );\n}\n\nfunction RailToggle({\n  active,\n  onClick,\n  children,\n  testId,\n}: {\n  active?: boolean;\n  onClick: () => void;\n  children: React.ReactNode;\n  testId?: string;\n}) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      data-testid={testId}\n      className={cn(\n        \"inline-flex items-center gap-1.5 rounded-full border px-3 py-1.5 text-xs font-medium shadow-sm transition-colors\",\n        active\n          ? \"border-primary bg-primary text-primary-foreground\"\n          : \"border-border bg-background text-muted-foreground hover:text-foreground\",\n      )}\n    >\n      <Icon icon={UiComment} className=\"text-xs\" />\n      {children}\n    </button>\n  );\n}\n\nfunction orderedAnchors(ctx: CommentContextValue): string[] {\n  return Object.keys(ctx.commentMeta).sort((a, b) => {\n    if (a === DOCUMENT_ANCHOR) return -1;\n    if (b === DOCUMENT_ANCHOR) return 1;\n    const at = ctx.getAnchorTop(a);\n    const bt = ctx.getAnchorTop(b);\n    if (at == null && bt == null) return a.localeCompare(b);\n    if (at == null) return 1;\n    if (bt == null) return -1;\n    if (at !== bt) return at - bt;\n    return a.localeCompare(b);\n  });\n}\n\nfunction orderComments(\n  comments: Comment[],\n  anchorOrder: Map<string, number>,\n): Comment[] {\n  const replyMap = buildReplyMap(comments);\n  const roots = getRoots(comments).sort((a, b) => {\n    const ai =\n      anchorOrder.get(a.anchor ?? DOCUMENT_ANCHOR) ?? Number.MAX_SAFE_INTEGER;\n    const bi =\n      anchorOrder.get(b.anchor ?? DOCUMENT_ANCHOR) ?? Number.MAX_SAFE_INTEGER;\n    if (ai !== bi) return ai - bi;\n    if (a.createdAt !== b.createdAt)\n      return a.createdAt.localeCompare(b.createdAt);\n    return String(a.id).localeCompare(String(b.id));\n  });\n  return roots.flatMap((root) => [\n    root,\n    ...sortReplies(replyMap.get(root.id) ?? []),\n  ]);\n}\n\nfunction AllComments({\n  ctx,\n  label,\n}: {\n  ctx: CommentContextValue;\n  label: (a: CommentAnchor) => string;\n}) {\n  const ordered = useMemo(() => {\n    const anchorOrder = new Map(orderedAnchors(ctx).map((a, i) => [a, i]));\n    return orderComments(ctx.comments, anchorOrder);\n  }, [ctx]);\n  const handlers = buildThreadListHandlers(ordered, ctx.config, ctx.callbacks);\n\n  function activateThread(\n    event: MouseEvent<HTMLDivElement>,\n    anchor: CommentAnchor,\n  ) {\n    const target = event.target as Element;\n    if (\n      target.closest(\n        'button, a, input, textarea, select, [contenteditable=\"true\"]',\n      )\n    )\n      return;\n    const roleButton = target.closest('[role=\"button\"]');\n    if (roleButton && roleButton !== target.closest(\"[data-comment-kind]\"))\n      return;\n    if (anchor !== DOCUMENT_ANCHOR) {\n      const found = ctx.scrollToAnchor(anchor, {\n        behavior: \"smooth\",\n        block: \"start\",\n        offset: 12,\n      });\n      if (!found) return;\n    }\n    ctx.focusAnchor(anchor);\n  }\n\n  if (ordered.length === 0) {\n    return (\n      <p className=\"rounded-lg bg-muted/40 px-3 py-2 text-xs text-muted-foreground\">\n        No comments yet.\n      </p>\n    );\n  }\n\n  return (\n    <div\n      data-testid=\"comment-all-rail\"\n      className=\"space-y-3 overflow-y-auto pr-1\"\n    >\n      <CommentThreadList\n        comments={ordered}\n        config={ctx.config}\n        compact\n        renderRootMeta={(c) => {\n          const anchor = c.anchor ?? DOCUMENT_ANCHOR;\n          const available =\n            anchor === DOCUMENT_ANCHOR || ctx.getAnchorTop(anchor) != null;\n          return (\n            <LocationMeta\n              label={`${label(anchor)}${available ? \"\" : \" · Unavailable\"}`}\n            />\n          );\n        }}\n        getThreadProps={(c) => ({\n          \"data-testid\": \"comment-feed-item\",\n          onMouseEnter: () =>\n            ctx.setHighlightAnchor(c.anchor ?? DOCUMENT_ANCHOR),\n          onMouseLeave: () => ctx.setHighlightAnchor(null),\n          onClick: (event) =>\n            activateThread(event, c.anchor ?? DOCUMENT_ANCHOR),\n        })}\n        {...handlers}\n      />\n    </div>\n  );\n}\n\nfunction FocusedComments({\n  ctx,\n  anchor,\n  label,\n  compact,\n}: {\n  ctx: CommentContextValue;\n  anchor: CommentAnchor;\n  label: string;\n  compact?: boolean;\n}) {\n  const comments = ctx.comments.filter(\n    (c) => (c.anchor ?? DOCUMENT_ANCHOR) === anchor,\n  );\n  const hasComments = comments.length > 0;\n  return (\n    <div className=\"space-y-3\" data-comment-anchor={anchor}>\n      <LocationMeta\n        label={\n          anchor === DOCUMENT_ANCHOR\n            ? \"Whole-page comment\"\n            : `Attached to ${label}`\n        }\n      />\n      <CommentThread\n        comments={comments}\n        config={ctx.config}\n        anchor={anchor}\n        compact={compact ?? false}\n        autoFocusComposer={!hasComments}\n        defaultExpandedRoots={hasComments}\n        composerPlaceholder={\n          hasComments ? \"Add another top-level comment…\" : \"Add a comment…\"\n        }\n        {...ctx.callbacks}\n      />\n    </div>\n  );\n}\n\n/**\n * A controlled comment rail driven by {@link CommentProvider}. Shows a focused\n * thread for the active anchor, the full document feed in anchor order, or a\n * toggle when collapsed. Renders nothing outside a provider or when empty.\n */\nexport function CommentSidePanel(props: CommentSidePanelProps) {\n  const ctx = useCommentContextOptional();\n  const label = useAnchorLabel(props);\n  const railRef = useRef<HTMLElement>(null);\n  const focusedRef = useRef<HTMLDivElement>(null);\n  const [focusedOffset, setFocusedOffset] = useState<number | null>(null);\n  const focusedAnchor = ctx?.railMode === \"focused\" ? ctx.focusedAnchor : null;\n\n  useEffect(() => {\n    if (!ctx || props.focusedAlignment !== \"anchor\" || !focusedAnchor) {\n      setFocusedOffset(null);\n      return;\n    }\n    const content = ctx.contentRef.current;\n    const rail = railRef.current;\n    const focused = focusedRef.current;\n    if (!content || !rail || !focused) return;\n\n    const update = () => {\n      const anchorTop = ctx.getAnchorTop(focusedAnchor);\n      if (anchorTop == null) {\n        setFocusedOffset(null);\n        return;\n      }\n      const desiredTop = anchorTop + content.getBoundingClientRect().top;\n      const currentOffset = Number.parseFloat(focused.style.top) || 0;\n      const nextOffset =\n        currentOffset + desiredTop - focused.getBoundingClientRect().top;\n      setFocusedOffset(Math.max(0, nextOffset));\n    };\n    update();\n    content.addEventListener(\"scroll\", update, { passive: true });\n    window.addEventListener(\"resize\", update);\n    const observer =\n      typeof ResizeObserver === \"undefined\" ? null : new ResizeObserver(update);\n    observer?.observe(content);\n    observer?.observe(rail);\n    return () => {\n      content.removeEventListener(\"scroll\", update);\n      window.removeEventListener(\"resize\", update);\n      observer?.disconnect();\n    };\n  }, [ctx, focusedAnchor, props.focusedAlignment]);\n\n  if (!ctx) return null;\n\n  const total = Object.values(ctx.commentCounts).reduce((a, b) => a + b, 0);\n  if (ctx.railMode === \"closed\" && total === 0) return null;\n\n  return (\n    <aside\n      ref={railRef}\n      data-testid=\"comment-side-panel\"\n      className={cn(\"relative w-[320px] space-y-3\", props.className)}\n    >\n      {ctx.railMode === \"all\" ? (\n        <>\n          <div className=\"flex items-center gap-2\">\n            <RailToggle active onClick={ctx.openCommentList}>\n              All comments ({total})\n            </RailToggle>\n            <button\n              type=\"button\"\n              onClick={ctx.closeRail}\n              className=\"ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground\"\n            >\n              Close\n            </button>\n          </div>\n          <AllComments ctx={ctx} label={label} />\n        </>\n      ) : ctx.railMode === \"focused\" && ctx.focusedAnchor ? (\n        <div\n          ref={focusedRef}\n          data-testid=\"comment-focused-rail\"\n          className=\"relative space-y-3\"\n          style={focusedOffset == null ? undefined : { top: focusedOffset }}\n        >\n          <div className=\"flex items-center gap-2\">\n            {total > 0 && (\n              <RailToggle\n                onClick={ctx.openCommentList}\n                testId=\"comment-open-all\"\n              >\n                All comments ({total})\n              </RailToggle>\n            )}\n            <button\n              type=\"button\"\n              onClick={ctx.closeRail}\n              className=\"ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground\"\n            >\n              Hide\n            </button>\n          </div>\n          <FocusedComments\n            ctx={ctx}\n            anchor={ctx.focusedAnchor}\n            label={label(ctx.focusedAnchor)}\n            {...(props.compact !== undefined ? { compact: props.compact } : {})}\n          />\n        </div>\n      ) : (\n        <RailToggle onClick={ctx.openCommentList} testId=\"comment-open-all\">\n          Open comments ({total})\n        </RailToggle>\n      )}\n    </aside>\n  );\n}\n"],"names":["DOCUMENT_ANCHOR","jsx","jsxs","cn","Icon","UiComment","buildReplyMap","getRoots","sortReplies","useMemo","buildThreadListHandlers","CommentThreadList","CommentThread","useCommentContextOptional","useRef","useState","useEffect","Fragment"],"mappings":"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"}
+{"version":3,"file":"CommentSidePanel.cjs","sources":["../../src/comments/CommentSidePanel.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, type MouseEvent } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiComment } from \"../icons\";\nimport { CommentThread } from \"./CommentThread\";\nimport { CommentThreadList } from \"./CommentThreadList\";\nimport {\n  useCommentContextOptional,\n  type CommentContextValue,\n} from \"./comment-context\";\nimport {\n  buildThreadListHandlers,\n  getRoots,\n  selectAnchorThreads,\n  selectUnresolvedThreads,\n  sortReplies,\n  buildReplyMap,\n} from \"./comment-utils\";\nimport {\n  DOCUMENT_ANCHOR,\n  type Comment,\n  type CommentAnchor,\n} from \"./comment-types\";\n\nexport type CommentSidePanelProps = {\n  /** Explicit label per anchor key. */\n  anchorLabels?: Record<CommentAnchor, string>;\n  /** Fallback label formatter for anchors without an explicit label. */\n  formatAnchorLabel?: (anchor: CommentAnchor) => string;\n  compact?: boolean;\n  /** Position the focused thread beside its registered content anchor. */\n  focusedAlignment?: \"flow\" | \"anchor\";\n  className?: string;\n};\n\nfunction defaultAnchorLabel(anchor: CommentAnchor): string {\n  if (anchor === DOCUMENT_ANCHOR) return \"General\";\n  return anchor\n    .replace(/\\[\\d+\\]/g, \"\")\n    .replaceAll(\".\", \" › \")\n    .replaceAll(\"_\", \" \")\n    .trim();\n}\n\nfunction useAnchorLabel(props: CommentSidePanelProps) {\n  return (anchor: CommentAnchor): string =>\n    props.anchorLabels?.[anchor] ??\n    props.formatAnchorLabel?.(anchor) ??\n    defaultAnchorLabel(anchor);\n}\n\nfunction LocationMeta({ label }: { label: string }) {\n  return (\n    <span\n      data-testid=\"comment-location-meta\"\n      className=\"inline-flex items-center rounded-full bg-muted px-2 py-1 text-[10px] font-medium text-muted-foreground\"\n    >\n      {label}\n    </span>\n  );\n}\n\nfunction RailToggle({\n  active,\n  onClick,\n  children,\n  testId,\n}: {\n  active?: boolean;\n  onClick: () => void;\n  children: React.ReactNode;\n  testId?: string;\n}) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      data-testid={testId}\n      className={cn(\n        \"inline-flex items-center gap-1.5 rounded-full border px-3 py-1.5 text-xs font-medium shadow-sm transition-colors\",\n        active\n          ? \"border-primary bg-primary text-primary-foreground\"\n          : \"border-border bg-background text-muted-foreground hover:text-foreground\",\n      )}\n    >\n      <Icon icon={UiComment} className=\"text-xs\" />\n      {children}\n    </button>\n  );\n}\n\nfunction orderedAnchors(ctx: CommentContextValue): string[] {\n  return Object.keys(ctx.commentMeta).sort((a, b) => {\n    if (a === DOCUMENT_ANCHOR) return -1;\n    if (b === DOCUMENT_ANCHOR) return 1;\n    const at = ctx.getAnchorTop(a);\n    const bt = ctx.getAnchorTop(b);\n    if (at == null && bt == null) return a.localeCompare(b);\n    if (at == null) return 1;\n    if (bt == null) return -1;\n    if (at !== bt) return at - bt;\n    return a.localeCompare(b);\n  });\n}\n\nfunction orderComments(\n  comments: Comment[],\n  anchorOrder: Map<string, number>,\n): Comment[] {\n  const replyMap = buildReplyMap(comments);\n  const roots = getRoots(comments).sort((a, b) => {\n    const ai =\n      anchorOrder.get(a.anchor ?? DOCUMENT_ANCHOR) ?? Number.MAX_SAFE_INTEGER;\n    const bi =\n      anchorOrder.get(b.anchor ?? DOCUMENT_ANCHOR) ?? Number.MAX_SAFE_INTEGER;\n    if (ai !== bi) return ai - bi;\n    if (a.createdAt !== b.createdAt)\n      return a.createdAt.localeCompare(b.createdAt);\n    return String(a.id).localeCompare(String(b.id));\n  });\n  return roots.flatMap((root) => [\n    root,\n    ...sortReplies(replyMap.get(root.id) ?? []),\n  ]);\n}\n\nfunction AllComments({\n  ctx,\n  comments,\n  label,\n  emptyLabel,\n}: {\n  ctx: CommentContextValue;\n  comments: Comment[];\n  label: (a: CommentAnchor) => string;\n  emptyLabel: string;\n}) {\n  const ordered = useMemo(() => {\n    const anchorOrder = new Map(orderedAnchors(ctx).map((a, i) => [a, i]));\n    return orderComments(comments, anchorOrder);\n  }, [ctx, comments]);\n  const handlers = buildThreadListHandlers(ordered, ctx.config, ctx.callbacks);\n\n  function activateThread(\n    event: MouseEvent<HTMLDivElement>,\n    anchor: CommentAnchor,\n  ) {\n    const target = event.target as Element;\n    if (\n      target.closest(\n        'button, a, input, textarea, select, [contenteditable=\"true\"]',\n      )\n    )\n      return;\n    const roleButton = target.closest('[role=\"button\"]');\n    if (roleButton && roleButton !== target.closest(\"[data-comment-kind]\"))\n      return;\n    if (anchor !== DOCUMENT_ANCHOR) {\n      const found = ctx.scrollToAnchor(anchor, {\n        behavior: \"smooth\",\n        block: \"start\",\n        offset: 12,\n      });\n      if (!found) return;\n    }\n    ctx.focusAnchor(anchor);\n  }\n\n  if (ordered.length === 0) {\n    return (\n      <p className=\"rounded-lg bg-muted/40 px-3 py-2 text-xs text-muted-foreground\">\n        {emptyLabel}\n      </p>\n    );\n  }\n\n  return (\n    <div\n      data-testid=\"comment-all-rail\"\n      className=\"space-y-3 overflow-y-auto pr-1\"\n    >\n      <CommentThreadList\n        comments={ordered}\n        config={ctx.config}\n        compact\n        renderRootMeta={(c) => {\n          const anchor = c.anchor ?? DOCUMENT_ANCHOR;\n          const available =\n            anchor === DOCUMENT_ANCHOR || ctx.getAnchorTop(anchor) != null;\n          return (\n            <LocationMeta\n              label={`${label(anchor)}${available ? \"\" : \" · Unavailable\"}`}\n            />\n          );\n        }}\n        getThreadProps={(c) => ({\n          \"data-testid\": \"comment-feed-item\",\n          onMouseEnter: () =>\n            ctx.setHighlightAnchor(c.anchor ?? DOCUMENT_ANCHOR),\n          onMouseLeave: () => ctx.setHighlightAnchor(null),\n          onClick: (event) =>\n            activateThread(event, c.anchor ?? DOCUMENT_ANCHOR),\n        })}\n        {...handlers}\n      />\n    </div>\n  );\n}\n\nfunction FocusedComments({\n  ctx,\n  comments: visible,\n  anchor,\n  label,\n  compact,\n}: {\n  ctx: CommentContextValue;\n  comments: Comment[];\n  anchor: CommentAnchor;\n  label: string;\n  compact?: boolean;\n}) {\n  const comments = selectAnchorThreads(visible, anchor);\n  const hasComments = comments.length > 0;\n  return (\n    <div className=\"space-y-3\" data-comment-anchor={anchor}>\n      <LocationMeta\n        label={\n          anchor === DOCUMENT_ANCHOR\n            ? \"Whole-page comment\"\n            : `Attached to ${label}`\n        }\n      />\n      <CommentThread\n        comments={comments}\n        config={ctx.config}\n        anchor={anchor}\n        compact={compact ?? false}\n        autoFocusComposer={!hasComments}\n        defaultExpanded={hasComments}\n        composerPlaceholder={\n          hasComments ? \"Add another top-level comment…\" : \"Add a comment…\"\n        }\n        {...ctx.callbacks}\n      />\n    </div>\n  );\n}\n\n/**\n * A controlled comment rail driven by {@link CommentProvider}. Shows a focused\n * thread for the active anchor, the full document feed in anchor order, or a\n * toggle when collapsed. Renders nothing outside a provider or when empty.\n */\nexport function CommentSidePanel(props: CommentSidePanelProps) {\n  const ctx = useCommentContextOptional();\n  const label = useAnchorLabel(props);\n  const railRef = useRef<HTMLElement>(null);\n  const focusedRef = useRef<HTMLDivElement>(null);\n  const [focusedOffset, setFocusedOffset] = useState<number | null>(null);\n  const [showResolved, setShowResolved] = useState(false);\n  const focusedAnchor = ctx?.railMode === \"focused\" ? ctx.focusedAnchor : null;\n\n  useEffect(() => {\n    if (!ctx || props.focusedAlignment !== \"anchor\" || !focusedAnchor) {\n      setFocusedOffset(null);\n      return;\n    }\n    const content = ctx.contentRef.current;\n    const rail = railRef.current;\n    const focused = focusedRef.current;\n    if (!content || !rail || !focused) return;\n\n    const update = () => {\n      const anchorTop = ctx.getAnchorTop(focusedAnchor);\n      if (anchorTop == null) {\n        setFocusedOffset(null);\n        return;\n      }\n      const desiredTop = anchorTop + content.getBoundingClientRect().top;\n      const currentOffset = Number.parseFloat(focused.style.top) || 0;\n      const nextOffset =\n        currentOffset + desiredTop - focused.getBoundingClientRect().top;\n      setFocusedOffset(Math.max(0, nextOffset));\n    };\n    update();\n    content.addEventListener(\"scroll\", update, { passive: true });\n    window.addEventListener(\"resize\", update);\n    const observer =\n      typeof ResizeObserver === \"undefined\" ? null : new ResizeObserver(update);\n    observer?.observe(content);\n    observer?.observe(rail);\n    return () => {\n      content.removeEventListener(\"scroll\", update);\n      window.removeEventListener(\"resize\", update);\n      observer?.disconnect();\n    };\n  }, [ctx, focusedAnchor, props.focusedAlignment]);\n\n  if (!ctx) return null;\n\n  // Threads, not cards: a reply is part of its root, never a separate entry.\n  const unresolved = selectUnresolvedThreads(ctx.comments, ctx.config);\n  const visible = showResolved ? ctx.comments : unresolved;\n  const total = getRoots(visible).length;\n  const resolvedCount = getRoots(ctx.comments).length - getRoots(unresolved).length;\n  if (ctx.railMode === \"closed\" && total === 0 && resolvedCount === 0) return null;\n\n  return (\n    <aside\n      ref={railRef}\n      data-testid=\"comment-side-panel\"\n      className={cn(\"relative w-[320px] space-y-3\", props.className)}\n    >\n      <div\n        data-testid=\"comment-rail-header\"\n        className=\"sticky top-0 z-20 flex items-center gap-2 bg-background py-2\"\n      >\n        {(total > 0 || ctx.railMode === \"all\") && (\n          <RailToggle\n            active={ctx.railMode === \"all\"}\n            onClick={ctx.openCommentList}\n            testId=\"comment-open-all\"\n          >\n            {ctx.railMode === \"closed\"\n              ? `Open comments (${total})`\n              : `All comments (${total})`}\n          </RailToggle>\n        )}\n        {resolvedCount > 0 && (\n          <button\n            type=\"button\"\n            aria-pressed={showResolved}\n            onClick={() => setShowResolved((shown) => !shown)}\n            className={cn(\n              \"rounded-full border px-2 py-1 text-xs font-medium transition-colors\",\n              showResolved\n                ? \"border-primary bg-primary text-primary-foreground\"\n                : \"border-border bg-background text-muted-foreground hover:text-foreground\",\n            )}\n          >\n            Resolved ({resolvedCount})\n          </button>\n        )}\n        {ctx.railMode !== \"closed\" && (\n          <button\n            type=\"button\"\n            onClick={ctx.closeRail}\n            className=\"ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground\"\n          >\n            {ctx.railMode === \"all\" ? \"Close\" : \"Hide\"}\n          </button>\n        )}\n      </div>\n      {ctx.railMode === \"all\" ? (\n        <AllComments\n          ctx={ctx}\n          comments={visible}\n          label={label}\n          emptyLabel={resolvedCount > 0 ? \"No open comments.\" : \"No comments yet.\"}\n        />\n      ) : ctx.railMode === \"focused\" && ctx.focusedAnchor ? (\n        <div\n          ref={focusedRef}\n          data-testid=\"comment-focused-rail\"\n          className=\"relative space-y-3\"\n          style={focusedOffset == null ? undefined : { top: focusedOffset }}\n        >\n          <FocusedComments\n            ctx={ctx}\n            comments={visible}\n            anchor={ctx.focusedAnchor}\n            label={label(ctx.focusedAnchor)}\n            {...(props.compact !== undefined ? { compact: props.compact } : {})}\n          />\n        </div>\n      ) : null}\n    </aside>\n  );\n}\n"],"names":["DOCUMENT_ANCHOR","jsx","jsxs","cn","Icon","UiComment","buildReplyMap","getRoots","sortReplies","useMemo","buildThreadListHandlers","CommentThreadList","selectAnchorThreads","CommentThread","useCommentContextOptional","useRef","useState","useEffect","selectUnresolvedThreads"],"mappings":"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"}

package/dist/comments/CommentSidePanel.d.ts

@@ -14,5 +14,5 @@ export type CommentSidePanelProps = {
  * thread for the active anchor, the full document feed in anchor order, or a
  * toggle when collapsed. Renders nothing outside a provider or when empty.
  */
-export declare function CommentSidePanel(props: CommentSidePanelProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function CommentSidePanel(props: CommentSidePanelProps): import("react").JSX.Element | null;
 //# sourceMappingURL=CommentSidePanel.d.ts.map

package/dist/comments/CommentSidePanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommentSidePanel.d.ts","sourceRoot":"","sources":["../../src/comments/CommentSidePanel.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAGL,KAAK,aAAa,EACnB,MAAM,iBAAiB,CAAC;AAEzB,MAAM,MAAM,qBAAqB,GAAG;IAClC,qCAAqC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC7C,sEAAsE;IACtE,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,KAAK,MAAM,CAAC;IACtD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,wEAAwE;IACxE,gBAAgB,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAoNF;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,kDA6G5D"}
+{"version":3,"file":"CommentSidePanel.d.ts","sourceRoot":"","sources":["../../src/comments/CommentSidePanel.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAGL,KAAK,aAAa,EACnB,MAAM,iBAAiB,CAAC;AAEzB,MAAM,MAAM,qBAAqB,GAAG;IAClC,qCAAqC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC7C,sEAAsE;IACtE,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,KAAK,MAAM,CAAC;IACtD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,wEAAwE;IACxE,gBAAgB,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAwNF;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,sCA6H5D"}

package/dist/comments/CommentSidePanel.js

@@ -1,11 +1,11 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { useRef, useState, useEffect, useMemo } from "react";
 import { cn } from "../lib/utils.js";
 import { Icon } from "../data/Icon.js";
 import { CommentThread } from "./CommentThread.js";
 import { CommentThreadList } from "./CommentThreadList.js";
 import { useCommentContextOptional } from "./comment-context.js";
-import { buildThreadListHandlers, buildReplyMap, getRoots, sortReplies } from "./comment-utils.js";
+import { selectUnresolvedThreads, getRoots, buildThreadListHandlers, selectAnchorThreads, buildReplyMap, sortReplies } from "./comment-utils.js";
 import { DOCUMENT_ANCHOR } from "./comment-types.js";
 import { UiComment } from "../icons/components/UiComment.js";
 function defaultAnchorLabel(anchor) {
@@ -81,12 +81,14 @@ function orderComments(comments, anchorOrder) {
 }
 function AllComments({
   ctx,
-  label
+  comments,
+  label,
+  emptyLabel
 }) {
   const ordered = useMemo(() => {
     const anchorOrder = new Map(orderedAnchors(ctx).map((a, i) => [a, i]));
-    return orderComments(ctx.comments, anchorOrder);
-  }, [ctx]);
+    return orderComments(comments, anchorOrder);
+  }, [ctx, comments]);
   const handlers = buildThreadListHandlers(ordered, ctx.config, ctx.callbacks);
   function activateThread(event, anchor) {
     const target = event.target;
@@ -108,7 +110,7 @@ function AllComments({
     ctx.focusAnchor(anchor);
   }
   if (ordered.length === 0) {
-    return /* @__PURE__ */ jsx("p", { className: "rounded-lg bg-muted/40 px-3 py-2 text-xs text-muted-foreground", children: "No comments yet." });
+    return /* @__PURE__ */ jsx("p", { className: "rounded-lg bg-muted/40 px-3 py-2 text-xs text-muted-foreground", children: emptyLabel });
   }
   return /* @__PURE__ */ jsx(
     "div",
@@ -145,13 +147,12 @@ function AllComments({
 }
 function FocusedComments({
   ctx,
+  comments: visible,
   anchor,
   label,
   compact
 }) {
-  const comments = ctx.comments.filter(
-    (c) => (c.anchor ?? DOCUMENT_ANCHOR) === anchor
-  );
+  const comments = selectAnchorThreads(visible, anchor);
   const hasComments = comments.length > 0;
   return /* @__PURE__ */ jsxs("div", { className: "space-y-3", "data-comment-anchor": anchor, children: [
     /* @__PURE__ */ jsx(
@@ -168,7 +169,7 @@ function FocusedComments({
         anchor,
         compact: compact ?? false,
         autoFocusComposer: !hasComments,
-        defaultExpandedRoots: hasComments,
+        defaultExpanded: hasComments,
         composerPlaceholder: hasComments ? "Add another top-level comment…" : "Add a comment…",
         ...ctx.callbacks
       }
@@ -181,6 +182,7 @@ function CommentSidePanel(props) {
   const railRef = useRef(null);
   const focusedRef = useRef(null);
   const [focusedOffset, setFocusedOffset] = useState(null);
+  const [showResolved, setShowResolved] = useState(false);
   const focusedAnchor = (ctx == null ? void 0 : ctx.railMode) === "focused" ? ctx.focusedAnchor : null;
   useEffect(() => {
     if (!ctx || props.focusedAlignment !== "anchor" || !focusedAnchor) {
@@ -215,79 +217,90 @@ function CommentSidePanel(props) {
     };
   }, [ctx, focusedAnchor, props.focusedAlignment]);
   if (!ctx) return null;
-  const total = Object.values(ctx.commentCounts).reduce((a, b) => a + b, 0);
-  if (ctx.railMode === "closed" && total === 0) return null;
-  return /* @__PURE__ */ jsx(
+  const unresolved = selectUnresolvedThreads(ctx.comments, ctx.config);
+  const visible = showResolved ? ctx.comments : unresolved;
+  const total = getRoots(visible).length;
+  const resolvedCount = getRoots(ctx.comments).length - getRoots(unresolved).length;
+  if (ctx.railMode === "closed" && total === 0 && resolvedCount === 0) return null;
+  return /* @__PURE__ */ jsxs(
     "aside",
     {
       ref: railRef,
       "data-testid": "comment-side-panel",
       className: cn("relative w-[320px] space-y-3", props.className),
-      children: ctx.railMode === "all" ? /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsxs(RailToggle, { active: true, onClick: ctx.openCommentList, children: [
-            "All comments (",
-            total,
-            ")"
-          ] }),
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: ctx.closeRail,
-              className: "ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground",
-              children: "Close"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx(AllComments, { ctx, label })
-      ] }) : ctx.railMode === "focused" && ctx.focusedAnchor ? /* @__PURE__ */ jsxs(
-        "div",
-        {
-          ref: focusedRef,
-          "data-testid": "comment-focused-rail",
-          className: "relative space-y-3",
-          style: focusedOffset == null ? void 0 : { top: focusedOffset },
-          children: [
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-              total > 0 && /* @__PURE__ */ jsxs(
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-testid": "comment-rail-header",
+            className: "sticky top-0 z-20 flex items-center gap-2 bg-background py-2",
+            children: [
+              (total > 0 || ctx.railMode === "all") && /* @__PURE__ */ jsx(
                 RailToggle,
                 {
+                  active: ctx.railMode === "all",
                   onClick: ctx.openCommentList,
                   testId: "comment-open-all",
+                  children: ctx.railMode === "closed" ? `Open comments (${total})` : `All comments (${total})`
+                }
+              ),
+              resolvedCount > 0 && /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  "aria-pressed": showResolved,
+                  onClick: () => setShowResolved((shown) => !shown),
+                  className: cn(
+                    "rounded-full border px-2 py-1 text-xs font-medium transition-colors",
+                    showResolved ? "border-primary bg-primary text-primary-foreground" : "border-border bg-background text-muted-foreground hover:text-foreground"
+                  ),
                   children: [
-                    "All comments (",
-                    total,
+                    "Resolved (",
+                    resolvedCount,
                     ")"
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx(
+              ctx.railMode !== "closed" && /* @__PURE__ */ jsx(
                 "button",
                 {
                   type: "button",
                   onClick: ctx.closeRail,
                   className: "ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground",
-                  children: "Hide"
+                  children: ctx.railMode === "all" ? "Close" : "Hide"
                 }
               )
-            ] }),
-            /* @__PURE__ */ jsx(
+            ]
+          }
+        ),
+        ctx.railMode === "all" ? /* @__PURE__ */ jsx(
+          AllComments,
+          {
+            ctx,
+            comments: visible,
+            label,
+            emptyLabel: resolvedCount > 0 ? "No open comments." : "No comments yet."
+          }
+        ) : ctx.railMode === "focused" && ctx.focusedAnchor ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref: focusedRef,
+            "data-testid": "comment-focused-rail",
+            className: "relative space-y-3",
+            style: focusedOffset == null ? void 0 : { top: focusedOffset },
+            children: /* @__PURE__ */ jsx(
               FocusedComments,
               {
                 ctx,
+                comments: visible,
                 anchor: ctx.focusedAnchor,
                 label: label(ctx.focusedAnchor),
                 ...props.compact !== void 0 ? { compact: props.compact } : {}
               }
             )
-          ]
-        }
-      ) : /* @__PURE__ */ jsxs(RailToggle, { onClick: ctx.openCommentList, testId: "comment-open-all", children: [
-        "Open comments (",
-        total,
-        ")"
-      ] })
+          }
+        ) : null
+      ]
     }
   );
 }

package/dist/comments/CommentSidePanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommentSidePanel.js","sources":["../../src/comments/CommentSidePanel.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, type MouseEvent } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiComment } from \"../icons\";\nimport { CommentThread } from \"./CommentThread\";\nimport { CommentThreadList } from \"./CommentThreadList\";\nimport {\n  useCommentContextOptional,\n  type CommentContextValue,\n} from \"./comment-context\";\nimport {\n  buildThreadListHandlers,\n  getRoots,\n  sortReplies,\n  buildReplyMap,\n} from \"./comment-utils\";\nimport {\n  DOCUMENT_ANCHOR,\n  type Comment,\n  type CommentAnchor,\n} from \"./comment-types\";\n\nexport type CommentSidePanelProps = {\n  /** Explicit label per anchor key. */\n  anchorLabels?: Record<CommentAnchor, string>;\n  /** Fallback label formatter for anchors without an explicit label. */\n  formatAnchorLabel?: (anchor: CommentAnchor) => string;\n  compact?: boolean;\n  /** Position the focused thread beside its registered content anchor. */\n  focusedAlignment?: \"flow\" | \"anchor\";\n  className?: string;\n};\n\nfunction defaultAnchorLabel(anchor: CommentAnchor): string {\n  if (anchor === DOCUMENT_ANCHOR) return \"General\";\n  return anchor\n    .replace(/\\[\\d+\\]/g, \"\")\n    .replaceAll(\".\", \" › \")\n    .replaceAll(\"_\", \" \")\n    .trim();\n}\n\nfunction useAnchorLabel(props: CommentSidePanelProps) {\n  return (anchor: CommentAnchor): string =>\n    props.anchorLabels?.[anchor] ??\n    props.formatAnchorLabel?.(anchor) ??\n    defaultAnchorLabel(anchor);\n}\n\nfunction LocationMeta({ label }: { label: string }) {\n  return (\n    <span\n      data-testid=\"comment-location-meta\"\n      className=\"inline-flex items-center rounded-full bg-muted px-2 py-1 text-[10px] font-medium text-muted-foreground\"\n    >\n      {label}\n    </span>\n  );\n}\n\nfunction RailToggle({\n  active,\n  onClick,\n  children,\n  testId,\n}: {\n  active?: boolean;\n  onClick: () => void;\n  children: React.ReactNode;\n  testId?: string;\n}) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      data-testid={testId}\n      className={cn(\n        \"inline-flex items-center gap-1.5 rounded-full border px-3 py-1.5 text-xs font-medium shadow-sm transition-colors\",\n        active\n          ? \"border-primary bg-primary text-primary-foreground\"\n          : \"border-border bg-background text-muted-foreground hover:text-foreground\",\n      )}\n    >\n      <Icon icon={UiComment} className=\"text-xs\" />\n      {children}\n    </button>\n  );\n}\n\nfunction orderedAnchors(ctx: CommentContextValue): string[] {\n  return Object.keys(ctx.commentMeta).sort((a, b) => {\n    if (a === DOCUMENT_ANCHOR) return -1;\n    if (b === DOCUMENT_ANCHOR) return 1;\n    const at = ctx.getAnchorTop(a);\n    const bt = ctx.getAnchorTop(b);\n    if (at == null && bt == null) return a.localeCompare(b);\n    if (at == null) return 1;\n    if (bt == null) return -1;\n    if (at !== bt) return at - bt;\n    return a.localeCompare(b);\n  });\n}\n\nfunction orderComments(\n  comments: Comment[],\n  anchorOrder: Map<string, number>,\n): Comment[] {\n  const replyMap = buildReplyMap(comments);\n  const roots = getRoots(comments).sort((a, b) => {\n    const ai =\n      anchorOrder.get(a.anchor ?? DOCUMENT_ANCHOR) ?? Number.MAX_SAFE_INTEGER;\n    const bi =\n      anchorOrder.get(b.anchor ?? DOCUMENT_ANCHOR) ?? Number.MAX_SAFE_INTEGER;\n    if (ai !== bi) return ai - bi;\n    if (a.createdAt !== b.createdAt)\n      return a.createdAt.localeCompare(b.createdAt);\n    return String(a.id).localeCompare(String(b.id));\n  });\n  return roots.flatMap((root) => [\n    root,\n    ...sortReplies(replyMap.get(root.id) ?? []),\n  ]);\n}\n\nfunction AllComments({\n  ctx,\n  label,\n}: {\n  ctx: CommentContextValue;\n  label: (a: CommentAnchor) => string;\n}) {\n  const ordered = useMemo(() => {\n    const anchorOrder = new Map(orderedAnchors(ctx).map((a, i) => [a, i]));\n    return orderComments(ctx.comments, anchorOrder);\n  }, [ctx]);\n  const handlers = buildThreadListHandlers(ordered, ctx.config, ctx.callbacks);\n\n  function activateThread(\n    event: MouseEvent<HTMLDivElement>,\n    anchor: CommentAnchor,\n  ) {\n    const target = event.target as Element;\n    if (\n      target.closest(\n        'button, a, input, textarea, select, [contenteditable=\"true\"]',\n      )\n    )\n      return;\n    const roleButton = target.closest('[role=\"button\"]');\n    if (roleButton && roleButton !== target.closest(\"[data-comment-kind]\"))\n      return;\n    if (anchor !== DOCUMENT_ANCHOR) {\n      const found = ctx.scrollToAnchor(anchor, {\n        behavior: \"smooth\",\n        block: \"start\",\n        offset: 12,\n      });\n      if (!found) return;\n    }\n    ctx.focusAnchor(anchor);\n  }\n\n  if (ordered.length === 0) {\n    return (\n      <p className=\"rounded-lg bg-muted/40 px-3 py-2 text-xs text-muted-foreground\">\n        No comments yet.\n      </p>\n    );\n  }\n\n  return (\n    <div\n      data-testid=\"comment-all-rail\"\n      className=\"space-y-3 overflow-y-auto pr-1\"\n    >\n      <CommentThreadList\n        comments={ordered}\n        config={ctx.config}\n        compact\n        renderRootMeta={(c) => {\n          const anchor = c.anchor ?? DOCUMENT_ANCHOR;\n          const available =\n            anchor === DOCUMENT_ANCHOR || ctx.getAnchorTop(anchor) != null;\n          return (\n            <LocationMeta\n              label={`${label(anchor)}${available ? \"\" : \" · Unavailable\"}`}\n            />\n          );\n        }}\n        getThreadProps={(c) => ({\n          \"data-testid\": \"comment-feed-item\",\n          onMouseEnter: () =>\n            ctx.setHighlightAnchor(c.anchor ?? DOCUMENT_ANCHOR),\n          onMouseLeave: () => ctx.setHighlightAnchor(null),\n          onClick: (event) =>\n            activateThread(event, c.anchor ?? DOCUMENT_ANCHOR),\n        })}\n        {...handlers}\n      />\n    </div>\n  );\n}\n\nfunction FocusedComments({\n  ctx,\n  anchor,\n  label,\n  compact,\n}: {\n  ctx: CommentContextValue;\n  anchor: CommentAnchor;\n  label: string;\n  compact?: boolean;\n}) {\n  const comments = ctx.comments.filter(\n    (c) => (c.anchor ?? DOCUMENT_ANCHOR) === anchor,\n  );\n  const hasComments = comments.length > 0;\n  return (\n    <div className=\"space-y-3\" data-comment-anchor={anchor}>\n      <LocationMeta\n        label={\n          anchor === DOCUMENT_ANCHOR\n            ? \"Whole-page comment\"\n            : `Attached to ${label}`\n        }\n      />\n      <CommentThread\n        comments={comments}\n        config={ctx.config}\n        anchor={anchor}\n        compact={compact ?? false}\n        autoFocusComposer={!hasComments}\n        defaultExpandedRoots={hasComments}\n        composerPlaceholder={\n          hasComments ? \"Add another top-level comment…\" : \"Add a comment…\"\n        }\n        {...ctx.callbacks}\n      />\n    </div>\n  );\n}\n\n/**\n * A controlled comment rail driven by {@link CommentProvider}. Shows a focused\n * thread for the active anchor, the full document feed in anchor order, or a\n * toggle when collapsed. Renders nothing outside a provider or when empty.\n */\nexport function CommentSidePanel(props: CommentSidePanelProps) {\n  const ctx = useCommentContextOptional();\n  const label = useAnchorLabel(props);\n  const railRef = useRef<HTMLElement>(null);\n  const focusedRef = useRef<HTMLDivElement>(null);\n  const [focusedOffset, setFocusedOffset] = useState<number | null>(null);\n  const focusedAnchor = ctx?.railMode === \"focused\" ? ctx.focusedAnchor : null;\n\n  useEffect(() => {\n    if (!ctx || props.focusedAlignment !== \"anchor\" || !focusedAnchor) {\n      setFocusedOffset(null);\n      return;\n    }\n    const content = ctx.contentRef.current;\n    const rail = railRef.current;\n    const focused = focusedRef.current;\n    if (!content || !rail || !focused) return;\n\n    const update = () => {\n      const anchorTop = ctx.getAnchorTop(focusedAnchor);\n      if (anchorTop == null) {\n        setFocusedOffset(null);\n        return;\n      }\n      const desiredTop = anchorTop + content.getBoundingClientRect().top;\n      const currentOffset = Number.parseFloat(focused.style.top) || 0;\n      const nextOffset =\n        currentOffset + desiredTop - focused.getBoundingClientRect().top;\n      setFocusedOffset(Math.max(0, nextOffset));\n    };\n    update();\n    content.addEventListener(\"scroll\", update, { passive: true });\n    window.addEventListener(\"resize\", update);\n    const observer =\n      typeof ResizeObserver === \"undefined\" ? null : new ResizeObserver(update);\n    observer?.observe(content);\n    observer?.observe(rail);\n    return () => {\n      content.removeEventListener(\"scroll\", update);\n      window.removeEventListener(\"resize\", update);\n      observer?.disconnect();\n    };\n  }, [ctx, focusedAnchor, props.focusedAlignment]);\n\n  if (!ctx) return null;\n\n  const total = Object.values(ctx.commentCounts).reduce((a, b) => a + b, 0);\n  if (ctx.railMode === \"closed\" && total === 0) return null;\n\n  return (\n    <aside\n      ref={railRef}\n      data-testid=\"comment-side-panel\"\n      className={cn(\"relative w-[320px] space-y-3\", props.className)}\n    >\n      {ctx.railMode === \"all\" ? (\n        <>\n          <div className=\"flex items-center gap-2\">\n            <RailToggle active onClick={ctx.openCommentList}>\n              All comments ({total})\n            </RailToggle>\n            <button\n              type=\"button\"\n              onClick={ctx.closeRail}\n              className=\"ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground\"\n            >\n              Close\n            </button>\n          </div>\n          <AllComments ctx={ctx} label={label} />\n        </>\n      ) : ctx.railMode === \"focused\" && ctx.focusedAnchor ? (\n        <div\n          ref={focusedRef}\n          data-testid=\"comment-focused-rail\"\n          className=\"relative space-y-3\"\n          style={focusedOffset == null ? undefined : { top: focusedOffset }}\n        >\n          <div className=\"flex items-center gap-2\">\n            {total > 0 && (\n              <RailToggle\n                onClick={ctx.openCommentList}\n                testId=\"comment-open-all\"\n              >\n                All comments ({total})\n              </RailToggle>\n            )}\n            <button\n              type=\"button\"\n              onClick={ctx.closeRail}\n              className=\"ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground\"\n            >\n              Hide\n            </button>\n          </div>\n          <FocusedComments\n            ctx={ctx}\n            anchor={ctx.focusedAnchor}\n            label={label(ctx.focusedAnchor)}\n            {...(props.compact !== undefined ? { compact: props.compact } : {})}\n          />\n        </div>\n      ) : (\n        <RailToggle onClick={ctx.openCommentList} testId=\"comment-open-all\">\n          Open comments ({total})\n        </RailToggle>\n      )}\n    </aside>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"CommentSidePanel.js","sources":["../../src/comments/CommentSidePanel.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, type MouseEvent } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiComment } from \"../icons\";\nimport { CommentThread } from \"./CommentThread\";\nimport { CommentThreadList } from \"./CommentThreadList\";\nimport {\n  useCommentContextOptional,\n  type CommentContextValue,\n} from \"./comment-context\";\nimport {\n  buildThreadListHandlers,\n  getRoots,\n  selectAnchorThreads,\n  selectUnresolvedThreads,\n  sortReplies,\n  buildReplyMap,\n} from \"./comment-utils\";\nimport {\n  DOCUMENT_ANCHOR,\n  type Comment,\n  type CommentAnchor,\n} from \"./comment-types\";\n\nexport type CommentSidePanelProps = {\n  /** Explicit label per anchor key. */\n  anchorLabels?: Record<CommentAnchor, string>;\n  /** Fallback label formatter for anchors without an explicit label. */\n  formatAnchorLabel?: (anchor: CommentAnchor) => string;\n  compact?: boolean;\n  /** Position the focused thread beside its registered content anchor. */\n  focusedAlignment?: \"flow\" | \"anchor\";\n  className?: string;\n};\n\nfunction defaultAnchorLabel(anchor: CommentAnchor): string {\n  if (anchor === DOCUMENT_ANCHOR) return \"General\";\n  return anchor\n    .replace(/\\[\\d+\\]/g, \"\")\n    .replaceAll(\".\", \" › \")\n    .replaceAll(\"_\", \" \")\n    .trim();\n}\n\nfunction useAnchorLabel(props: CommentSidePanelProps) {\n  return (anchor: CommentAnchor): string =>\n    props.anchorLabels?.[anchor] ??\n    props.formatAnchorLabel?.(anchor) ??\n    defaultAnchorLabel(anchor);\n}\n\nfunction LocationMeta({ label }: { label: string }) {\n  return (\n    <span\n      data-testid=\"comment-location-meta\"\n      className=\"inline-flex items-center rounded-full bg-muted px-2 py-1 text-[10px] font-medium text-muted-foreground\"\n    >\n      {label}\n    </span>\n  );\n}\n\nfunction RailToggle({\n  active,\n  onClick,\n  children,\n  testId,\n}: {\n  active?: boolean;\n  onClick: () => void;\n  children: React.ReactNode;\n  testId?: string;\n}) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      data-testid={testId}\n      className={cn(\n        \"inline-flex items-center gap-1.5 rounded-full border px-3 py-1.5 text-xs font-medium shadow-sm transition-colors\",\n        active\n          ? \"border-primary bg-primary text-primary-foreground\"\n          : \"border-border bg-background text-muted-foreground hover:text-foreground\",\n      )}\n    >\n      <Icon icon={UiComment} className=\"text-xs\" />\n      {children}\n    </button>\n  );\n}\n\nfunction orderedAnchors(ctx: CommentContextValue): string[] {\n  return Object.keys(ctx.commentMeta).sort((a, b) => {\n    if (a === DOCUMENT_ANCHOR) return -1;\n    if (b === DOCUMENT_ANCHOR) return 1;\n    const at = ctx.getAnchorTop(a);\n    const bt = ctx.getAnchorTop(b);\n    if (at == null && bt == null) return a.localeCompare(b);\n    if (at == null) return 1;\n    if (bt == null) return -1;\n    if (at !== bt) return at - bt;\n    return a.localeCompare(b);\n  });\n}\n\nfunction orderComments(\n  comments: Comment[],\n  anchorOrder: Map<string, number>,\n): Comment[] {\n  const replyMap = buildReplyMap(comments);\n  const roots = getRoots(comments).sort((a, b) => {\n    const ai =\n      anchorOrder.get(a.anchor ?? DOCUMENT_ANCHOR) ?? Number.MAX_SAFE_INTEGER;\n    const bi =\n      anchorOrder.get(b.anchor ?? DOCUMENT_ANCHOR) ?? Number.MAX_SAFE_INTEGER;\n    if (ai !== bi) return ai - bi;\n    if (a.createdAt !== b.createdAt)\n      return a.createdAt.localeCompare(b.createdAt);\n    return String(a.id).localeCompare(String(b.id));\n  });\n  return roots.flatMap((root) => [\n    root,\n    ...sortReplies(replyMap.get(root.id) ?? []),\n  ]);\n}\n\nfunction AllComments({\n  ctx,\n  comments,\n  label,\n  emptyLabel,\n}: {\n  ctx: CommentContextValue;\n  comments: Comment[];\n  label: (a: CommentAnchor) => string;\n  emptyLabel: string;\n}) {\n  const ordered = useMemo(() => {\n    const anchorOrder = new Map(orderedAnchors(ctx).map((a, i) => [a, i]));\n    return orderComments(comments, anchorOrder);\n  }, [ctx, comments]);\n  const handlers = buildThreadListHandlers(ordered, ctx.config, ctx.callbacks);\n\n  function activateThread(\n    event: MouseEvent<HTMLDivElement>,\n    anchor: CommentAnchor,\n  ) {\n    const target = event.target as Element;\n    if (\n      target.closest(\n        'button, a, input, textarea, select, [contenteditable=\"true\"]',\n      )\n    )\n      return;\n    const roleButton = target.closest('[role=\"button\"]');\n    if (roleButton && roleButton !== target.closest(\"[data-comment-kind]\"))\n      return;\n    if (anchor !== DOCUMENT_ANCHOR) {\n      const found = ctx.scrollToAnchor(anchor, {\n        behavior: \"smooth\",\n        block: \"start\",\n        offset: 12,\n      });\n      if (!found) return;\n    }\n    ctx.focusAnchor(anchor);\n  }\n\n  if (ordered.length === 0) {\n    return (\n      <p className=\"rounded-lg bg-muted/40 px-3 py-2 text-xs text-muted-foreground\">\n        {emptyLabel}\n      </p>\n    );\n  }\n\n  return (\n    <div\n      data-testid=\"comment-all-rail\"\n      className=\"space-y-3 overflow-y-auto pr-1\"\n    >\n      <CommentThreadList\n        comments={ordered}\n        config={ctx.config}\n        compact\n        renderRootMeta={(c) => {\n          const anchor = c.anchor ?? DOCUMENT_ANCHOR;\n          const available =\n            anchor === DOCUMENT_ANCHOR || ctx.getAnchorTop(anchor) != null;\n          return (\n            <LocationMeta\n              label={`${label(anchor)}${available ? \"\" : \" · Unavailable\"}`}\n            />\n          );\n        }}\n        getThreadProps={(c) => ({\n          \"data-testid\": \"comment-feed-item\",\n          onMouseEnter: () =>\n            ctx.setHighlightAnchor(c.anchor ?? DOCUMENT_ANCHOR),\n          onMouseLeave: () => ctx.setHighlightAnchor(null),\n          onClick: (event) =>\n            activateThread(event, c.anchor ?? DOCUMENT_ANCHOR),\n        })}\n        {...handlers}\n      />\n    </div>\n  );\n}\n\nfunction FocusedComments({\n  ctx,\n  comments: visible,\n  anchor,\n  label,\n  compact,\n}: {\n  ctx: CommentContextValue;\n  comments: Comment[];\n  anchor: CommentAnchor;\n  label: string;\n  compact?: boolean;\n}) {\n  const comments = selectAnchorThreads(visible, anchor);\n  const hasComments = comments.length > 0;\n  return (\n    <div className=\"space-y-3\" data-comment-anchor={anchor}>\n      <LocationMeta\n        label={\n          anchor === DOCUMENT_ANCHOR\n            ? \"Whole-page comment\"\n            : `Attached to ${label}`\n        }\n      />\n      <CommentThread\n        comments={comments}\n        config={ctx.config}\n        anchor={anchor}\n        compact={compact ?? false}\n        autoFocusComposer={!hasComments}\n        defaultExpanded={hasComments}\n        composerPlaceholder={\n          hasComments ? \"Add another top-level comment…\" : \"Add a comment…\"\n        }\n        {...ctx.callbacks}\n      />\n    </div>\n  );\n}\n\n/**\n * A controlled comment rail driven by {@link CommentProvider}. Shows a focused\n * thread for the active anchor, the full document feed in anchor order, or a\n * toggle when collapsed. Renders nothing outside a provider or when empty.\n */\nexport function CommentSidePanel(props: CommentSidePanelProps) {\n  const ctx = useCommentContextOptional();\n  const label = useAnchorLabel(props);\n  const railRef = useRef<HTMLElement>(null);\n  const focusedRef = useRef<HTMLDivElement>(null);\n  const [focusedOffset, setFocusedOffset] = useState<number | null>(null);\n  const [showResolved, setShowResolved] = useState(false);\n  const focusedAnchor = ctx?.railMode === \"focused\" ? ctx.focusedAnchor : null;\n\n  useEffect(() => {\n    if (!ctx || props.focusedAlignment !== \"anchor\" || !focusedAnchor) {\n      setFocusedOffset(null);\n      return;\n    }\n    const content = ctx.contentRef.current;\n    const rail = railRef.current;\n    const focused = focusedRef.current;\n    if (!content || !rail || !focused) return;\n\n    const update = () => {\n      const anchorTop = ctx.getAnchorTop(focusedAnchor);\n      if (anchorTop == null) {\n        setFocusedOffset(null);\n        return;\n      }\n      const desiredTop = anchorTop + content.getBoundingClientRect().top;\n      const currentOffset = Number.parseFloat(focused.style.top) || 0;\n      const nextOffset =\n        currentOffset + desiredTop - focused.getBoundingClientRect().top;\n      setFocusedOffset(Math.max(0, nextOffset));\n    };\n    update();\n    content.addEventListener(\"scroll\", update, { passive: true });\n    window.addEventListener(\"resize\", update);\n    const observer =\n      typeof ResizeObserver === \"undefined\" ? null : new ResizeObserver(update);\n    observer?.observe(content);\n    observer?.observe(rail);\n    return () => {\n      content.removeEventListener(\"scroll\", update);\n      window.removeEventListener(\"resize\", update);\n      observer?.disconnect();\n    };\n  }, [ctx, focusedAnchor, props.focusedAlignment]);\n\n  if (!ctx) return null;\n\n  // Threads, not cards: a reply is part of its root, never a separate entry.\n  const unresolved = selectUnresolvedThreads(ctx.comments, ctx.config);\n  const visible = showResolved ? ctx.comments : unresolved;\n  const total = getRoots(visible).length;\n  const resolvedCount = getRoots(ctx.comments).length - getRoots(unresolved).length;\n  if (ctx.railMode === \"closed\" && total === 0 && resolvedCount === 0) return null;\n\n  return (\n    <aside\n      ref={railRef}\n      data-testid=\"comment-side-panel\"\n      className={cn(\"relative w-[320px] space-y-3\", props.className)}\n    >\n      <div\n        data-testid=\"comment-rail-header\"\n        className=\"sticky top-0 z-20 flex items-center gap-2 bg-background py-2\"\n      >\n        {(total > 0 || ctx.railMode === \"all\") && (\n          <RailToggle\n            active={ctx.railMode === \"all\"}\n            onClick={ctx.openCommentList}\n            testId=\"comment-open-all\"\n          >\n            {ctx.railMode === \"closed\"\n              ? `Open comments (${total})`\n              : `All comments (${total})`}\n          </RailToggle>\n        )}\n        {resolvedCount > 0 && (\n          <button\n            type=\"button\"\n            aria-pressed={showResolved}\n            onClick={() => setShowResolved((shown) => !shown)}\n            className={cn(\n              \"rounded-full border px-2 py-1 text-xs font-medium transition-colors\",\n              showResolved\n                ? \"border-primary bg-primary text-primary-foreground\"\n                : \"border-border bg-background text-muted-foreground hover:text-foreground\",\n            )}\n          >\n            Resolved ({resolvedCount})\n          </button>\n        )}\n        {ctx.railMode !== \"closed\" && (\n          <button\n            type=\"button\"\n            onClick={ctx.closeRail}\n            className=\"ml-auto rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground\"\n          >\n            {ctx.railMode === \"all\" ? \"Close\" : \"Hide\"}\n          </button>\n        )}\n      </div>\n      {ctx.railMode === \"all\" ? (\n        <AllComments\n          ctx={ctx}\n          comments={visible}\n          label={label}\n          emptyLabel={resolvedCount > 0 ? \"No open comments.\" : \"No comments yet.\"}\n        />\n      ) : ctx.railMode === \"focused\" && ctx.focusedAnchor ? (\n        <div\n          ref={focusedRef}\n          data-testid=\"comment-focused-rail\"\n          className=\"relative space-y-3\"\n          style={focusedOffset == null ? undefined : { top: focusedOffset }}\n        >\n          <FocusedComments\n            ctx={ctx}\n            comments={visible}\n            anchor={ctx.focusedAnchor}\n            label={label(ctx.focusedAnchor)}\n            {...(props.compact !== undefined ? { compact: props.compact } : {})}\n          />\n        </div>\n      ) : null}\n    </aside>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/comments/CommentThread.cjs

@@ -12,7 +12,7 @@ function CommentThread({
   anchor,
   compact = false,
   autoFocusComposer = false,
-  defaultExpandedRoots = false,
+  defaultExpanded = false,
   composerPlaceholder,
   hideComposer = false,
   renderRootMeta,
@@ -38,7 +38,7 @@ function CommentThread({
         comments,
         config,
         compact,
-        defaultExpandedRoots,
+        defaultExpanded,
         ...renderRootMeta ? { renderRootMeta } : {},
         ...renderBody ? { renderBody } : {},
         ...listHandlers