@embedpdf/viewer-chrome 3.0.0-next.13 → 3.0.0-next.15

package/dist/comments-panel-pEcQg4Vs.cjs

@@ -0,0 +1,514 @@
+const require_icons = require("./icons-x0Tc05bs.cjs");
+let react = require("react");
+let _embedpdf_react_runtime = require("@embedpdf/react/runtime");
+let _embedpdf_react_stage = require("@embedpdf/react/stage");
+let _embedpdf_react_annotation = require("@embedpdf/react/annotation");
+let _embedpdf_react_i18n = require("@embedpdf/react/i18n");
+let _embedpdf_react_commands = require("@embedpdf/react/commands");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/ui/comment-config.ts
+const TYPE_CONFIG = {
+	text: {
+		icon: "message",
+		labelKey: "annotation.comment",
+		label: "Comment"
+	},
+	highlight: {
+		icon: "highlight",
+		labelKey: "annotation.highlight",
+		label: "Highlight"
+	},
+	underline: {
+		icon: "underline",
+		labelKey: "annotation.underline",
+		label: "Underline"
+	},
+	squiggly: {
+		icon: "squiggly",
+		labelKey: "annotation.squiggly",
+		label: "Squiggly"
+	},
+	strikeout: {
+		icon: "strikethrough",
+		labelKey: "annotation.strikeout",
+		label: "Strikethrough"
+	},
+	square: {
+		icon: "square",
+		labelKey: "annotation.square",
+		label: "Square"
+	},
+	circle: {
+		icon: "circle",
+		labelKey: "annotation.circle",
+		label: "Circle"
+	},
+	line: {
+		icon: "line",
+		labelKey: "annotation.line",
+		label: "Line"
+	},
+	polygon: {
+		icon: "polygon",
+		labelKey: "annotation.polygon",
+		label: "Polygon"
+	},
+	polyline: {
+		icon: "zigzag",
+		labelKey: "annotation.polyline",
+		label: "Polyline"
+	},
+	ink: {
+		icon: "pencilMarker",
+		labelKey: "annotation.ink",
+		label: "Ink"
+	},
+	"free-text": {
+		icon: "freeText",
+		labelKey: "annotation.freeText",
+		label: "Text"
+	},
+	stamp: {
+		icon: "rubberStamp",
+		labelKey: "annotation.stamp",
+		label: "Stamp"
+	},
+	caret: {
+		icon: "insertText",
+		labelKey: "annotation.caret",
+		label: "Caret"
+	},
+	redact: {
+		icon: "redact",
+		labelKey: "annotation.redact",
+		label: "Redact"
+	},
+	"file-attachment": {
+		icon: "paperclip",
+		labelKey: "annotation.fileAttachment",
+		label: "Attachment"
+	}
+};
+const FALLBACK = {
+	icon: "message",
+	labelKey: "annotation.comment",
+	label: "Comment"
+};
+const commentTypeConfig = (dto) => TYPE_CONFIG[dto.subtype] ?? FALLBACK;
+/**
+* The glyph's tint slots, read off the annotation itself — this is what makes
+* a card recognizable as "that yellow highlight on page 3". Free-text prefers
+* its `fontColor` override, since that is the color a reader actually sees.
+*/
+const commentIconAccent = (dto) => {
+	const anyA = dto;
+	const primary = anyA.fontColor ?? anyA.color;
+	const secondary = anyA.interiorColor ?? void 0;
+	return {
+		...primary ? { primary } : {},
+		...secondary ? { secondary } : {}
+	};
+};
+//#endregion
+//#region src/ui/comments-panel.tsx
+/**
+* The comments sidebar (right panel): a live view over the conversation
+* plane — page-grouped sections, and a card that identifies its annotation at
+* a glance by the type's glyph tinted with that annotation's own colors, plus
+* the ISO 32000 §12.5.6.3 review status per thread.
+*
+* There is no per-page loading dance: the plugin hydrates the whole document
+* at open (`annotations.list()`), so the list is complete the moment `hydration()`
+* says so, whether or not a page was ever scrolled to.
+*
+* Selection is two-way: clicking a card selects the annotation and
+* flies the camera to it (`stage.reveal`, the same verb search hits use);
+* selecting in the document scrolls that card into view here.
+*
+* Every action routes through the `comments` verbs — plain annotation writes
+* on the one optimistic pipeline — and every control is gated by
+* `permissionsFor`, the engine's own collab-resolver mirrors: what shows here
+* is what the engine will allow. With writing turned off (`comments.writing`,
+* which `readOnly` turns off) the threads are only read: no composer, no
+* status, no edit and no delete.
+*/
+const REVIEW_STATES = [
+	"none",
+	"accepted",
+	"rejected",
+	"cancelled",
+	"completed"
+];
+const dateLabel = (iso) => {
+	if (!iso) return "";
+	const date = new Date(iso);
+	if (Number.isNaN(date.getTime())) return "";
+	return date.toLocaleDateString(void 0, {
+		month: "short",
+		day: "numeric"
+	});
+};
+/** Whether people write here: the `comments.writing` feature is on. */
+function useWriting() {
+	const commands = (0, _embedpdf_react_commands.useCommands)();
+	(0, _embedpdf_react_commands.useCommandsSettings)((settings) => settings.disabledCategories);
+	return !commands.isCategoryDisabled("comments.writing");
+}
+function CommentsPanel() {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const writing = useWriting();
+	const status = (0, _embedpdf_react_annotation.useAnnotationState)((state) => state.status);
+	const comments = (0, _embedpdf_react_annotation.useComments)();
+	const threads = (0, _embedpdf_react_annotation.useCommentThreads)();
+	const anno = (0, _embedpdf_react_runtime.useCapability)(_embedpdf_react_annotation.AnnotationToken);
+	const stage = (0, _embedpdf_react_runtime.useCapability)(_embedpdf_react_stage.StageToken);
+	const selected = (0, _embedpdf_react_annotation.useAnnotationState)((state) => state.selected);
+	const selection = (0, react.useMemo)(() => selected.map((annotation) => annotation.ref), [selected]);
+	const scrollRef = (0, react.useRef)(null);
+	const cardRefs = (0, react.useRef)({});
+	/** Which thread the document's selection points at — any member counts, so
+	*  selecting a reply's parent shape highlights the same card. */
+	const selectedThreadKey = (0, react.useMemo)(() => {
+		for (const ref of selection) {
+			const thread = comments.getThread(ref);
+			if (thread) return (0, _embedpdf_react_annotation.annotationKey)(thread.root.ref);
+		}
+		return null;
+	}, [selection, comments]);
+	(0, react.useEffect)(() => {
+		if (!selectedThreadKey || !scrollRef.current) return;
+		const element = cardRefs.current[selectedThreadKey];
+		if (!element) return;
+		const container = scrollRef.current;
+		const top = element.offsetTop - container.clientHeight / 2 + element.clientHeight / 2 - container.offsetTop;
+		container.scrollTo({
+			top,
+			behavior: "smooth"
+		});
+	}, [selectedThreadKey]);
+	/** Click a card: select the annotation and fly the camera to it. */
+	const goTo = (view) => {
+		anno.selection.set([view.root.ref]);
+		if (view.pageIndex < 0) return;
+		stage?.reveal(view.pageIndex, {
+			rect: view.root.rect,
+			anchor: {
+				x: "center",
+				y: .35
+			},
+			behavior: "smooth"
+		});
+	};
+	const byPage = (0, react.useMemo)(() => {
+		const groups = /* @__PURE__ */ new Map();
+		for (const view of threads) {
+			const arr = groups.get(view.pageIndex);
+			if (arr) arr.push(view);
+			else groups.set(view.pageIndex, [view]);
+		}
+		return [...groups.entries()].sort((left, right) => left[0] - right[0]);
+	}, [threads]);
+	if (status === "loading") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Empty, {
+		icon: "comment",
+		text: t("demo.commentsLoading")
+	});
+	if (status === "forbidden") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Empty, {
+		icon: "lock",
+		text: t("demo.commentsForbidden")
+	});
+	if (status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Empty, {
+		icon: "alertTriangle",
+		text: t("demo.commentsError"),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			onClick: () => void anno.refresh(),
+			className: "bg-accent text-on-accent rounded-md px-3 py-1.5 text-sm font-medium",
+			children: t("demo.commentsRetry")
+		})
+	});
+	if (threads.length === 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Empty, {
+		icon: "comment",
+		text: t(writing ? "demo.commentsEmpty" : "demo.commentsEmptyReadOnly")
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		ref: scrollRef,
+		className: "min-h-0 flex-1 overflow-y-auto",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "flex flex-col gap-5 p-3",
+			children: byPage.map(([pageIndex, group]) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex flex-col gap-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "bg-surface sticky top-0 z-10",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "border-border-subtle border-b pb-1.5",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+							className: "text-fg text-sm font-semibold",
+							children: t("demo.commentsPage", { params: { page: group[0].pageLabel } })
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+							className: "text-fg-muted text-xs",
+							children: t(group.length === 1 ? "demo.commentCount" : "demo.commentCountPlural", { params: { count: String(group.length) } })
+						})]
+					})
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
+					className: "flex flex-col gap-2",
+					children: group.map((view) => {
+						const key = (0, _embedpdf_react_annotation.annotationKey)(view.root.ref);
+						return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ThreadCard, {
+							view,
+							writing,
+							selected: selectedThreadKey === key,
+							onSelect: () => goTo(view),
+							cardRef: (element) => {
+								cardRefs.current[key] = element;
+							}
+						}, key);
+					})
+				})]
+			}, pageIndex))
+		})
+	});
+}
+function Empty({ icon, text, children }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col items-center gap-3 px-4 py-10 text-center",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.Icon, {
+				name: icon,
+				size: 32,
+				className: "text-fg-muted"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-fg-muted text-sm",
+				children: text
+			}),
+			children
+		]
+	});
+}
+function ThreadCard({ view, writing, selected, onSelect, cardRef }) {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const comments = (0, _embedpdf_react_annotation.useComments)();
+	const [reply, setReply] = (0, react.useState)("");
+	const root = view.root.ref;
+	const perms = {
+		canDeleteThread: writing && comments.canDeleteThread(root),
+		canSetStatus: writing && comments.canSetStatus(root),
+		canReply: writing && comments.canReply(root)
+	};
+	const config = commentTypeConfig(view.root);
+	const status = view.review.mine?.state ?? "none";
+	const latest = view.review.lastChange;
+	const sendReply = () => {
+		const text = reply.trim();
+		if (!text) return;
+		setReply("");
+		comments.reply(view.root.ref, text);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
+		ref: cardRef,
+		onClick: onSelect,
+		className: `bg-surface cursor-pointer rounded-lg border shadow-sm transition-all hover:shadow-md ${selected ? "border-accent ring-accent/40 ring-2" : "border-border-subtle"}`,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex flex-col gap-2 p-3",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex items-start gap-2.5",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "bg-hover mt-0.5 grid h-8 w-8 shrink-0 place-items-center rounded-full",
+							title: t(config.labelKey, { fallback: config.label }),
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.Icon, {
+								name: config.icon,
+								size: 18,
+								accent: commentIconAccent(view.root)
+							})
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "min-w-0 flex-1",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "flex items-baseline gap-2",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "text-fg truncate text-sm font-medium",
+									children: view.root.author ?? t("demo.commentsAnonymous")
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "text-fg-muted ms-auto shrink-0 text-xs",
+									children: dateLabel(view.root.modifiedAt ?? view.root.createdAt)
+								})]
+							}), latest && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+								className: "bg-accent-light text-accent mt-1 inline-block rounded px-1.5 py-0.5 text-[11px] font-medium",
+								children: [statusLabel(t, latest.state), latest.by ? ` — ${latest.by}` : ""]
+							})]
+						}),
+						perms.canDeleteThread && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							onClick: (event) => {
+								event.stopPropagation();
+								comments.deleteThread(view.root.ref);
+							},
+							className: "text-fg-muted hover:text-fg grid h-6 w-6 shrink-0 place-items-center rounded",
+							title: t("demo.commentsDeleteThread"),
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.Icon, {
+								name: "trash",
+								size: 14
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CommentBody, {
+					annotationRef: view.root.ref,
+					text: view.root.contents ?? "",
+					deletable: false,
+					writing
+				}),
+				view.replies.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "border-border-subtle flex flex-col gap-2 border-t pt-2",
+					children: view.replies.map((replyDto) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Reply, {
+						dto: replyDto,
+						writing
+					}, (0, _embedpdf_react_annotation.annotationKey)(replyDto.ref)))
+				}),
+				(perms.canSetStatus || perms.canReply) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "border-border-subtle flex flex-col gap-1.5 border-t pt-2",
+					children: [perms.canSetStatus && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+						className: "text-fg-muted flex items-center gap-2 text-xs",
+						onClick: (event) => event.stopPropagation(),
+						children: [t("demo.commentsStatus"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
+							value: status,
+							onChange: (event) => void comments.setStatus(view.root.ref, event.target.value),
+							className: "border-border bg-surface text-fg flex-1 rounded-md border px-1.5 py-1 text-xs outline-none",
+							children: REVIEW_STATES.map((state) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+								value: state,
+								children: statusLabel(t, state)
+							}, state))
+						})]
+					}), perms.canReply && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex items-center gap-1.5",
+						onClick: (event) => event.stopPropagation(),
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+							type: "text",
+							value: reply,
+							placeholder: view.root.contents || view.replies.length ? t("demo.commentsReplyPlaceholder") : t("demo.commentsAddPlaceholder"),
+							onChange: (event) => setReply(event.target.value),
+							onKeyDown: (event) => event.key === "Enter" && sendReply(),
+							className: "border-border bg-surface text-fg focus:border-accent w-full min-w-0 flex-1 rounded-md border px-2 py-1 text-sm outline-none"
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							type: "button",
+							onClick: sendReply,
+							disabled: !reply.trim(),
+							className: "text-accent disabled:text-fg-muted grid h-7 w-7 shrink-0 place-items-center rounded-md",
+							title: t("demo.commentsReply"),
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.Icon, {
+								name: "arrowForwardUp",
+								size: 16
+							})
+						})]
+					})]
+				})
+			]
+		})
+	});
+}
+function Reply({ dto, writing }) {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "border-border-subtle ms-1 border-s-2 ps-2",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex items-baseline gap-2",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-fg-secondary text-xs font-medium",
+				children: dto.author ?? t("demo.commentsAnonymous")
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "text-fg-muted text-[11px]",
+				children: dateLabel(dto.modifiedAt ?? dto.createdAt)
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CommentBody, {
+			annotationRef: dto.ref,
+			text: dto.contents ?? "",
+			deletable: true,
+			writing
+		})]
+	});
+}
+/** One comment's text with inline edit (own, unlocked) and delete (replies), while people write. */
+function CommentBody({ annotationRef, text, deletable, writing }) {
+	const t = (0, _embedpdf_react_i18n.useT)();
+	const comments = (0, _embedpdf_react_annotation.useComments)();
+	const perms = {
+		canEditText: writing && comments.canSetText(annotationRef),
+		canDelete: writing && comments.canDelete(annotationRef)
+	};
+	const [draft, setDraft] = (0, react.useState)(null);
+	if (draft !== null) {
+		const save = () => {
+			const next = draft.trim();
+			setDraft(null);
+			if (next && next !== text) comments.setText(annotationRef, next);
+		};
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+			value: draft,
+			autoFocus: true,
+			rows: 2,
+			onClick: (event) => event.stopPropagation(),
+			onChange: (event) => setDraft(event.target.value),
+			onBlur: save,
+			onKeyDown: (event) => {
+				if (event.key === "Enter" && !event.shiftKey) {
+					event.preventDefault();
+					save();
+				}
+				if (event.key === "Escape") setDraft(null);
+			},
+			className: "border-accent bg-surface text-fg w-full resize-none rounded-md border px-2 py-1 text-sm outline-none"
+		});
+	}
+	if (!text && !perms.canEditText && !deletable) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "group/body flex items-start gap-1",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-fg min-w-0 flex-1 whitespace-pre-wrap text-sm",
+				children: text
+			}),
+			perms.canEditText && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				onClick: (event) => {
+					event.stopPropagation();
+					setDraft(text);
+				},
+				className: "text-fg-muted hover:text-fg grid h-5 w-5 shrink-0 place-items-center rounded opacity-0 group-hover/body:opacity-100",
+				title: t("demo.commentsEdit"),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.Icon, {
+					name: "pencilMarker",
+					size: 12
+				})
+			}),
+			deletable && perms.canDelete && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				onClick: (event) => {
+					event.stopPropagation();
+					comments.delete(annotationRef);
+				},
+				className: "text-fg-muted hover:text-fg grid h-5 w-5 shrink-0 place-items-center rounded opacity-0 group-hover/body:opacity-100",
+				title: t("demo.commentsDelete"),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.Icon, {
+					name: "trash",
+					size: 12
+				})
+			})
+		]
+	});
+}
+function statusLabel(t, state) {
+	switch (state) {
+		case "none": return t("demo.commentsStatusNone");
+		case "accepted": return t("demo.commentsStatusAccepted");
+		case "rejected": return t("demo.commentsStatusRejected");
+		case "cancelled": return t("demo.commentsStatusCancelled");
+		case "completed": return t("demo.commentsStatusCompleted");
+		default: return state;
+	}
+}
+//#endregion
+exports.CommentsPanel = CommentsPanel;
+
+//# sourceMappingURL=comments-panel-pEcQg4Vs.cjs.map

package/dist/comments-panel-pEcQg4Vs.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"comments-panel-pEcQg4Vs.cjs","names":["AnnotationToken","StageToken","Icon"],"sources":["../src/ui/comment-config.ts","../src/ui/comments-panel.tsx"],"sourcesContent":["import type { Annotation, Color } from '@embedpdf/react/annotation';\n\n/**\n * How a comment card identifies its annotation at a glance: the type's glyph,\n * tinted with that annotation's own colors. The icon names are the chrome icon\n * set's registry names and accent slots. The color model follows the spec:\n * there is exactly one `/C` (\"color\") and one `/IC` (\"interiorColor\"), so\n * `primary` is the annotation's `/C` and `secondary` its interior fill where\n * the family has one.\n */\n\nexport interface IconAccent {\n  primary?: string;\n  secondary?: string;\n}\n\nexport interface CommentTypeConfig {\n  /** Icon name in the chrome registry. */\n  icon: string;\n  /** i18n key for the type's display name (tooltip). */\n  labelKey: string;\n  /** Fallback when the locale has no entry. */\n  label: string;\n}\n\nconst TYPE_CONFIG: Record<string, CommentTypeConfig> = {\n  text: { icon: 'message', labelKey: 'annotation.comment', label: 'Comment' },\n  highlight: { icon: 'highlight', labelKey: 'annotation.highlight', label: 'Highlight' },\n  underline: { icon: 'underline', labelKey: 'annotation.underline', label: 'Underline' },\n  squiggly: { icon: 'squiggly', labelKey: 'annotation.squiggly', label: 'Squiggly' },\n  strikeout: { icon: 'strikethrough', labelKey: 'annotation.strikeout', label: 'Strikethrough' },\n  square: { icon: 'square', labelKey: 'annotation.square', label: 'Square' },\n  circle: { icon: 'circle', labelKey: 'annotation.circle', label: 'Circle' },\n  line: { icon: 'line', labelKey: 'annotation.line', label: 'Line' },\n  polygon: { icon: 'polygon', labelKey: 'annotation.polygon', label: 'Polygon' },\n  polyline: { icon: 'zigzag', labelKey: 'annotation.polyline', label: 'Polyline' },\n  ink: { icon: 'pencilMarker', labelKey: 'annotation.ink', label: 'Ink' },\n  'free-text': { icon: 'freeText', labelKey: 'annotation.freeText', label: 'Text' },\n  stamp: { icon: 'rubberStamp', labelKey: 'annotation.stamp', label: 'Stamp' },\n  caret: { icon: 'insertText', labelKey: 'annotation.caret', label: 'Caret' },\n  redact: { icon: 'redact', labelKey: 'annotation.redact', label: 'Redact' },\n  'file-attachment': {\n    icon: 'paperclip',\n    labelKey: 'annotation.fileAttachment',\n    label: 'Attachment',\n  },\n};\n\nconst FALLBACK: CommentTypeConfig = {\n  icon: 'message',\n  labelKey: 'annotation.comment',\n  label: 'Comment',\n};\n\nexport const commentTypeConfig = (dto: Annotation): CommentTypeConfig =>\n  TYPE_CONFIG[dto.subtype] ?? FALLBACK;\n\n/**\n * The glyph's tint slots, read off the annotation itself — this is what makes\n * a card recognizable as \"that yellow highlight on page 3\". Free-text prefers\n * its `fontColor` override, since that is the color a reader actually sees.\n */\nexport const commentIconAccent = (dto: Annotation): IconAccent => {\n  // Engine colors are `'#rrggbb'`, which CSS takes as they are.\n  const anyA = dto as { color?: Color; interiorColor?: Color | null; fontColor?: Color };\n  const primary = anyA.fontColor ?? anyA.color;\n  const secondary = anyA.interiorColor ?? undefined;\n  return {\n    ...(primary ? { primary } : {}),\n    ...(secondary ? { secondary } : {}),\n  };\n};\n","import { useEffect, useMemo, useRef, useState } from 'react';\nimport { useCapability } from '@embedpdf/react/runtime';\nimport {\n  AnnotationToken,\n  annotationKey,\n  useAnnotationState,\n  useComments,\n  useCommentThreads,\n  type Annotation,\n  type AnnotationRef,\n  type CommentThreadView,\n} from '@embedpdf/react/annotation';\nimport { StageToken } from '@embedpdf/react/stage';\nimport { useCommands, useCommandsSettings } from '@embedpdf/react/commands';\nimport { useT } from '@embedpdf/react/i18n';\nimport { Icon } from './icons';\nimport { commentIconAccent, commentTypeConfig } from './comment-config';\n\n/**\n * The comments sidebar (right panel): a live view over the conversation\n * plane — page-grouped sections, and a card that identifies its annotation at\n * a glance by the type's glyph tinted with that annotation's own colors, plus\n * the ISO 32000 §12.5.6.3 review status per thread.\n *\n * There is no per-page loading dance: the plugin hydrates the whole document\n * at open (`annotations.list()`), so the list is complete the moment `hydration()`\n * says so, whether or not a page was ever scrolled to.\n *\n * Selection is two-way: clicking a card selects the annotation and\n * flies the camera to it (`stage.reveal`, the same verb search hits use);\n * selecting in the document scrolls that card into view here.\n *\n * Every action routes through the `comments` verbs — plain annotation writes\n * on the one optimistic pipeline — and every control is gated by\n * `permissionsFor`, the engine's own collab-resolver mirrors: what shows here\n * is what the engine will allow. With writing turned off (`comments.writing`,\n * which `readOnly` turns off) the threads are only read: no composer, no\n * status, no edit and no delete.\n */\n\nconst REVIEW_STATES = ['none', 'accepted', 'rejected', 'cancelled', 'completed'] as const;\n\nconst dateLabel = (iso: string | null): string => {\n  if (!iso) return '';\n  const date = new Date(iso);\n  if (Number.isNaN(date.getTime())) return '';\n  return date.toLocaleDateString(undefined, { month: 'short', day: 'numeric' });\n};\n\n/** Whether people write here: the `comments.writing` feature is on. */\nfunction useWriting(): boolean {\n  const commands = useCommands();\n  // Read again whenever what's turned off changes.\n  useCommandsSettings((settings) => settings.disabledCategories);\n  return !commands.isCategoryDisabled('comments.writing');\n}\n\nexport function CommentsPanel() {\n  const t = useT();\n  const writing = useWriting();\n  const status = useAnnotationState((state) => state.status);\n  const comments = useComments();\n  const threads = useCommentThreads();\n  const anno = useCapability(AnnotationToken);\n  const stage = useCapability(StageToken);\n  const selected = useAnnotationState((state) => state.selected);\n  const selection = useMemo(() => selected.map((annotation) => annotation.ref), [selected]);\n  const scrollRef = useRef<HTMLDivElement>(null);\n  const cardRefs = useRef<Record<string, HTMLLIElement | null>>({});\n\n  /** Which thread the document's selection points at — any member counts, so\n   *  selecting a reply's parent shape highlights the same card. */\n  const selectedThreadKey = useMemo(() => {\n    for (const ref of selection) {\n      const thread = comments.getThread(ref);\n      if (thread) return annotationKey(thread.root.ref);\n    }\n    return null;\n    // `selection` identity changes on every selection write — the right key.\n  }, [selection, comments]);\n\n  // Reverse sync: the selected card scrolls itself into view.\n  useEffect(() => {\n    if (!selectedThreadKey || !scrollRef.current) return;\n    const element = cardRefs.current[selectedThreadKey];\n    if (!element) return;\n    const container = scrollRef.current;\n    const top =\n      element.offsetTop -\n      container.clientHeight / 2 +\n      element.clientHeight / 2 -\n      container.offsetTop;\n    container.scrollTo({ top, behavior: 'smooth' });\n  }, [selectedThreadKey]);\n\n  /** Click a card: select the annotation and fly the camera to it. */\n  const goTo = (view: CommentThreadView) => {\n    anno.selection.set([view.root.ref]);\n    if (view.pageIndex < 0) return;\n    // Anchor values are viewport fractions (0–1), not percentages:\n    // the annotation lands a third down the viewport, the find-bar feel.\n    stage?.reveal(view.pageIndex, {\n      rect: view.root.rect,\n      anchor: { x: 'center', y: 0.35 },\n      behavior: 'smooth',\n    });\n  };\n\n  // Page-grouped, preserving the lens's display order within each page.\n  const byPage = useMemo(() => {\n    const groups = new Map<number, CommentThreadView[]>();\n    for (const view of threads) {\n      const arr = groups.get(view.pageIndex);\n      if (arr) arr.push(view);\n      else groups.set(view.pageIndex, [view]);\n    }\n    return [...groups.entries()].sort((left, right) => left[0] - right[0]);\n  }, [threads]);\n\n  if (status === 'loading') return <Empty icon=\"comment\" text={t('demo.commentsLoading')} />;\n  if (status === 'forbidden') return <Empty icon=\"lock\" text={t('demo.commentsForbidden')} />;\n  if (status === 'error') {\n    return (\n      <Empty icon=\"alertTriangle\" text={t('demo.commentsError')}>\n        <button\n          type=\"button\"\n          onClick={() => void anno.refresh()}\n          className=\"bg-accent text-on-accent rounded-md px-3 py-1.5 text-sm font-medium\"\n        >\n          {t('demo.commentsRetry')}\n        </button>\n      </Empty>\n    );\n  }\n  if (threads.length === 0) {\n    return (\n      <Empty\n        icon=\"comment\"\n        text={t(writing ? 'demo.commentsEmpty' : 'demo.commentsEmptyReadOnly')}\n      />\n    );\n  }\n\n  return (\n    <div ref={scrollRef} className=\"min-h-0 flex-1 overflow-y-auto\">\n      <div className=\"flex flex-col gap-5 p-3\">\n        {byPage.map(([pageIndex, group]) => (\n          <div key={pageIndex} className=\"flex flex-col gap-2\">\n            <div className=\"bg-surface sticky top-0 z-10\">\n              <div className=\"border-border-subtle border-b pb-1.5\">\n                <h3 className=\"text-fg text-sm font-semibold\">\n                  {t('demo.commentsPage', { params: { page: group[0]!.pageLabel } })}\n                </h3>\n                <p className=\"text-fg-muted text-xs\">\n                  {t(group.length === 1 ? 'demo.commentCount' : 'demo.commentCountPlural', {\n                    params: { count: String(group.length) },\n                  })}\n                </p>\n              </div>\n            </div>\n            <ul className=\"flex flex-col gap-2\">\n              {group.map((view) => {\n                const key = annotationKey(view.root.ref);\n                return (\n                  <ThreadCard\n                    key={key}\n                    view={view}\n                    writing={writing}\n                    selected={selectedThreadKey === key}\n                    onSelect={() => goTo(view)}\n                    cardRef={(element) => {\n                      cardRefs.current[key] = element;\n                    }}\n                  />\n                );\n              })}\n            </ul>\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n}\n\nfunction Empty({\n  icon,\n  text,\n  children,\n}: {\n  icon: string;\n  text: string;\n  children?: React.ReactNode;\n}) {\n  return (\n    <div className=\"flex flex-col items-center gap-3 px-4 py-10 text-center\">\n      <Icon name={icon} size={32} className=\"text-fg-muted\" />\n      <p className=\"text-fg-muted text-sm\">{text}</p>\n      {children}\n    </div>\n  );\n}\n\nfunction ThreadCard({\n  view,\n  writing,\n  selected,\n  onSelect,\n  cardRef,\n}: {\n  view: CommentThreadView;\n  /** Whether people write here; without it the thread is only read. */\n  writing: boolean;\n  selected: boolean;\n  onSelect: () => void;\n  cardRef: (element: HTMLLIElement | null) => void;\n}) {\n  const t = useT();\n  const comments = useComments();\n  const [reply, setReply] = useState('');\n  const root = view.root.ref;\n  const perms = {\n    canDeleteThread: writing && comments.canDeleteThread(root),\n    canSetStatus: writing && comments.canSetStatus(root),\n    canReply: writing && comments.canReply(root),\n  };\n  const config = commentTypeConfig(view.root);\n  const status = view.review.mine?.state ?? 'none';\n  const latest = view.review.lastChange;\n\n  const sendReply = () => {\n    const text = reply.trim();\n    if (!text) return;\n    setReply('');\n    void comments.reply(view.root.ref, text);\n  };\n\n  return (\n    <li\n      ref={cardRef}\n      onClick={onSelect}\n      className={`bg-surface cursor-pointer rounded-lg border shadow-sm transition-all hover:shadow-md ${\n        selected ? 'border-accent ring-accent/40 ring-2' : 'border-border-subtle'\n      }`}\n    >\n      <div className=\"flex flex-col gap-2 p-3\">\n        {/* identity row: the annotation's own glyph + color is the anchor */}\n        <div className=\"flex items-start gap-2.5\">\n          <div\n            className=\"bg-hover mt-0.5 grid h-8 w-8 shrink-0 place-items-center rounded-full\"\n            title={t(config.labelKey, { fallback: config.label })}\n          >\n            <Icon name={config.icon} size={18} accent={commentIconAccent(view.root)} />\n          </div>\n          <div className=\"min-w-0 flex-1\">\n            <div className=\"flex items-baseline gap-2\">\n              <span className=\"text-fg truncate text-sm font-medium\">\n                {view.root.author ?? t('demo.commentsAnonymous')}\n              </span>\n              <span className=\"text-fg-muted ms-auto shrink-0 text-xs\">\n                {dateLabel(view.root.modifiedAt ?? view.root.createdAt)}\n              </span>\n            </div>\n            {latest && (\n              <span className=\"bg-accent-light text-accent mt-1 inline-block rounded px-1.5 py-0.5 text-[11px] font-medium\">\n                {statusLabel(t, latest.state)}\n                {latest.by ? ` — ${latest.by}` : ''}\n              </span>\n            )}\n          </div>\n          {perms.canDeleteThread && (\n            <button\n              type=\"button\"\n              onClick={(event) => {\n                event.stopPropagation();\n                void comments.deleteThread(view.root.ref);\n              }}\n              className=\"text-fg-muted hover:text-fg grid h-6 w-6 shrink-0 place-items-center rounded\"\n              title={t('demo.commentsDeleteThread')}\n            >\n              <Icon name=\"trash\" size={14} />\n            </button>\n          )}\n        </div>\n\n        <CommentBody\n          annotationRef={view.root.ref}\n          text={view.root.contents ?? ''}\n          deletable={false}\n          writing={writing}\n        />\n\n        {view.replies.length > 0 && (\n          <div className=\"border-border-subtle flex flex-col gap-2 border-t pt-2\">\n            {view.replies.map((replyDto) => (\n              <Reply key={annotationKey(replyDto.ref)} dto={replyDto} writing={writing} />\n            ))}\n          </div>\n        )}\n\n        {(perms.canSetStatus || perms.canReply) && (\n          <div className=\"border-border-subtle flex flex-col gap-1.5 border-t pt-2\">\n            {perms.canSetStatus && (\n              <label\n                className=\"text-fg-muted flex items-center gap-2 text-xs\"\n                onClick={(event) => event.stopPropagation()}\n              >\n                {t('demo.commentsStatus')}\n                <select\n                  value={status}\n                  onChange={(event) => void comments.setStatus(view.root.ref, event.target.value)}\n                  className=\"border-border bg-surface text-fg flex-1 rounded-md border px-1.5 py-1 text-xs outline-none\"\n                >\n                  {REVIEW_STATES.map((state) => (\n                    <option key={state} value={state}>\n                      {statusLabel(t, state)}\n                    </option>\n                  ))}\n                </select>\n              </label>\n            )}\n            {perms.canReply && (\n              <div\n                className=\"flex items-center gap-1.5\"\n                onClick={(event) => event.stopPropagation()}\n              >\n                <input\n                  type=\"text\"\n                  value={reply}\n                  placeholder={\n                    view.root.contents || view.replies.length\n                      ? t('demo.commentsReplyPlaceholder')\n                      : t('demo.commentsAddPlaceholder')\n                  }\n                  onChange={(event) => setReply(event.target.value)}\n                  onKeyDown={(event) => event.key === 'Enter' && sendReply()}\n                  className=\"border-border bg-surface text-fg focus:border-accent w-full min-w-0 flex-1 rounded-md border px-2 py-1 text-sm outline-none\"\n                />\n                <button\n                  type=\"button\"\n                  onClick={sendReply}\n                  disabled={!reply.trim()}\n                  className=\"text-accent disabled:text-fg-muted grid h-7 w-7 shrink-0 place-items-center rounded-md\"\n                  title={t('demo.commentsReply')}\n                >\n                  <Icon name=\"arrowForwardUp\" size={16} />\n                </button>\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </li>\n  );\n}\n\nfunction Reply({ dto, writing }: { dto: Annotation; writing: boolean }) {\n  const t = useT();\n  return (\n    <div className=\"border-border-subtle ms-1 border-s-2 ps-2\">\n      <div className=\"flex items-baseline gap-2\">\n        <span className=\"text-fg-secondary text-xs font-medium\">\n          {dto.author ?? t('demo.commentsAnonymous')}\n        </span>\n        <span className=\"text-fg-muted text-[11px]\">\n          {dateLabel(dto.modifiedAt ?? dto.createdAt)}\n        </span>\n      </div>\n      <CommentBody annotationRef={dto.ref} text={dto.contents ?? ''} deletable writing={writing} />\n    </div>\n  );\n}\n\n/** One comment's text with inline edit (own, unlocked) and delete (replies), while people write. */\nfunction CommentBody({\n  annotationRef,\n  text,\n  deletable,\n  writing,\n}: {\n  annotationRef: AnnotationRef;\n  text: string;\n  deletable: boolean;\n  writing: boolean;\n}) {\n  const t = useT();\n  const comments = useComments();\n  const perms = {\n    canEditText: writing && comments.canSetText(annotationRef),\n    canDelete: writing && comments.canDelete(annotationRef),\n  };\n  const [draft, setDraft] = useState<string | null>(null);\n\n  if (draft !== null) {\n    const save = () => {\n      const next = draft.trim();\n      setDraft(null);\n      if (next && next !== text) void comments.setText(annotationRef, next);\n    };\n    return (\n      <textarea\n        value={draft}\n        autoFocus\n        rows={2}\n        onClick={(event) => event.stopPropagation()}\n        onChange={(event) => setDraft(event.target.value)}\n        onBlur={save}\n        onKeyDown={(event) => {\n          if (event.key === 'Enter' && !event.shiftKey) {\n            event.preventDefault();\n            save();\n          }\n          if (event.key === 'Escape') setDraft(null);\n        }}\n        className=\"border-accent bg-surface text-fg w-full resize-none rounded-md border px-2 py-1 text-sm outline-none\"\n      />\n    );\n  }\n  if (!text && !perms.canEditText && !deletable) return null;\n  return (\n    <div className=\"group/body flex items-start gap-1\">\n      <p className=\"text-fg min-w-0 flex-1 whitespace-pre-wrap text-sm\">{text}</p>\n      {perms.canEditText && (\n        <button\n          type=\"button\"\n          onClick={(event) => {\n            event.stopPropagation();\n            setDraft(text);\n          }}\n          className=\"text-fg-muted hover:text-fg grid h-5 w-5 shrink-0 place-items-center rounded opacity-0 group-hover/body:opacity-100\"\n          title={t('demo.commentsEdit')}\n        >\n          <Icon name=\"pencilMarker\" size={12} />\n        </button>\n      )}\n      {deletable && perms.canDelete && (\n        <button\n          type=\"button\"\n          onClick={(event) => {\n            event.stopPropagation();\n            void comments.delete(annotationRef);\n          }}\n          className=\"text-fg-muted hover:text-fg grid h-5 w-5 shrink-0 place-items-center rounded opacity-0 group-hover/body:opacity-100\"\n          title={t('demo.commentsDelete')}\n        >\n          <Icon name=\"trash\" size={12} />\n        </button>\n      )}\n    </div>\n  );\n}\n\nfunction statusLabel(t: ReturnType<typeof useT>, state: string): string {\n  switch (state) {\n    case 'none':\n      return t('demo.commentsStatusNone');\n    case 'accepted':\n      return t('demo.commentsStatusAccepted');\n    case 'rejected':\n      return t('demo.commentsStatusRejected');\n    case 'cancelled':\n      return t('demo.commentsStatusCancelled');\n    case 'completed':\n      return t('demo.commentsStatusCompleted');\n    default:\n      return state; // custom vocabularies render verbatim\n  }\n}\n"],"mappings":"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"}