@arbidocs/blocks 0.4.33 → 0.4.38

package/dist/{chunk-6YVI74BC.js → chunk-JH25QIZW.js}

@@ -1,17 +1,16 @@
 "use client";
 import { filterMentionCandidates, MentionMenu, findMentionQuery, extractMentions } from './chunk-AA3PT6KR.js';
 import { unzipSync, strFromU8, strToU8, zipSync } from 'fflate';
-import React2, { createContext, useContext, useState, useRef, useEffect, useLayoutEffect } from 'react';
+import { collectReviewItems, revisionItemsOf } from '@docx-editor.dev/core/store';
+import React3, { createContext, useContext, useState, useRef, useCallback, useEffect, useLayoutEffect, useMemo } from 'react';
+import { useDocxEditor, ReviewRailContext, useEditorSnapshot, useChromeTranslate, DocxEditor, createFontSource } from '@docx-editor.dev/react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
-import { useReviewItem, useReview, DocxEditorReview, reviewModule } from '@docx-editor.dev/pro/react';
 import { Dialog, DialogContent, DialogHeader, DialogTitle, splitMarkdownBlocks, AiMarkdown } from '@arbidocs/react/ui';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { renderToStaticMarkup } from 'react-dom/server';
 import * as Y from 'yjs';
-import { useChromeTranslate, DocxEditor, createFontSource } from '@docx-editor.dev/react';
-import { collaborationModule } from '@docx-editor.dev/pro';
-import { DOCUMENT_COLLABORATION_VERSIONS } from '@docx-editor.dev/pro/collaboration';
-import { createHocuspocusCollaboration } from '@docx-editor.dev/pro/collaboration/hocuspocus';
+import { DOCUMENT_COLLABORATION_VERSIONS, collaborationModule } from '@arbidocs/coedit';
+import { createHocuspocusCollaboration } from '@arbidocs/coedit/hocuspocus';
 import { Type, Ellipsis, WifiOff, Check, Download, Save, RefreshCw } from 'lucide-react';
 
 function normalizeDocxExport(data) {
@@ -78,6 +77,435 @@ function normalizeDocxExport(data) {
   if (!changed) return data;
   return zipSync(files).slice().buffer;
 }
+function findNode(node, id) {
+  if (node.id === id) return node;
+  for (const child of node.children ?? []) {
+    const found = findNode(child, id);
+    if (found) return found;
+  }
+  return void 0;
+}
+function revisionItemsOfParagraph(part, paragraphId) {
+  const paragraph = findNode(part.root, paragraphId);
+  if (!paragraph) return [];
+  return revisionItemsOf({ ...part, root: paragraph });
+}
+function reviewModule() {
+  return {
+    id: "review",
+    review: {
+      displayModes: ["all-markup", "simple-markup", "proposed", "original"],
+      collectReviewItems,
+      revisionItemsOfParagraph
+    }
+  };
+}
+var NONE = [];
+var ok = (result) => result?.ok === true;
+function useReview() {
+  const editor = useDocxEditor();
+  const version = useEditorSnapshot(editor);
+  const revision = editor?.getReviewRevision() ?? 0;
+  const items = useMemo(() => editor ? editor.getReviewItems() : NONE, [editor, revision]);
+  const paneOpen = editor?.isReviewPaneOpen() ?? false;
+  const activeKey = items.find((item) => item.isActive)?.key ?? null;
+  return useMemo(
+    () => ({
+      ready: editor !== null,
+      items,
+      activeKey,
+      paneOpen,
+      setPaneOpen: (open) => {
+        if (editor && editor.isReviewPaneOpen() !== open) editor.exec({ type: "toggleReviewPane" });
+      },
+      setActive: (key, options) => ok(editor?.setActiveReviewItem(key, options)),
+      reply: (entry, text) => ok(editor?.replyToReviewItem(entry.key, text)),
+      accept: (entry) => ok(editor?.acceptReviewItem(entry.key)),
+      reject: (entry) => ok(editor?.rejectReviewItem(entry.key)),
+      resolve: (entry, resolved) => ok(editor?.setCommentResolved(entry.key, resolved)),
+      remove: (entry) => ok(editor?.deleteReviewItem(entry.key)),
+      addComment: (text) => ok(editor?.addComment(text)),
+      navigate: (direction) => ok(editor?.exec({ type: "navigateReviewChange", direction })),
+      resolveAll: (action) => ok(editor?.exec({ type: "resolveAllReviewChanges", action }))
+    }),
+    [editor, items, activeKey, paneOpen, version]
+  );
+}
+var ReviewItemContext = createContext(null);
+function useReviewItem() {
+  return useContext(ReviewItemContext);
+}
+var CARD_GAP = 8;
+var REVISION_LABELS = {
+  insert: "Inserted",
+  delete: "Deleted",
+  replace: "Replaced",
+  moveFrom: "Moved from here",
+  moveTo: "Moved to here",
+  format: "Formatted",
+  paragraphMark: "Paragraph break",
+  structural: "Table change"
+};
+function isTopLevel(entry) {
+  if (entry.kind === "comment") return !entry.parentId && !entry.parentRevisionId;
+  if (entry.kind === "custom") return entry.item.carded;
+  return true;
+}
+function formatDate(value) {
+  if (!value) return "";
+  const date = new Date(value);
+  return Number.isNaN(date.getTime()) ? "" : date.toLocaleString();
+}
+function Avatar({ entry }) {
+  return /* @__PURE__ */ jsx("span", { className: "native-docx-review-avatar", "aria-hidden": "true", children: entry.initials });
+}
+function Message({ entry }) {
+  return /* @__PURE__ */ jsxs("div", { className: "native-docx-review-message", children: [
+    /* @__PURE__ */ jsxs("div", { className: "native-docx-review-byline", children: [
+      /* @__PURE__ */ jsx(Avatar, { entry }),
+      /* @__PURE__ */ jsx("span", { className: "native-docx-review-author", children: entry.author || "Reviewer" }),
+      /* @__PURE__ */ jsx("time", { className: "native-docx-review-date", children: formatDate(entry.date) })
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "native-docx-review-text", "data-testid": "review-text", children: entry.text })
+  ] });
+}
+function ReplyForm({
+  entry,
+  review
+}) {
+  const [text, setText] = useState("");
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      className: "native-docx-review-reply",
+      onSubmit: (event) => {
+        event.preventDefault();
+        const value = text.trim();
+        if (value && review.reply(entry, value)) setText("");
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            "data-testid": "review-reply-input",
+            "aria-label": "Reply",
+            placeholder: "Reply",
+            value: text,
+            onChange: (event) => setText(event.target.value),
+            onKeyDown: (event) => {
+              if (event.key === "Escape") {
+                event.stopPropagation();
+                review.setActive(null);
+              }
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx("button", { type: "submit", disabled: !text.trim(), children: "Reply" }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "data-testid": "review-reply-cancel",
+            onClick: () => review.setActive(null),
+            children: "Cancel"
+          }
+        )
+      ]
+    }
+  );
+}
+function Card({
+  entry,
+  replies,
+  review,
+  extra,
+  cardRef,
+  top
+}) {
+  const resolved = entry.kind === "comment" && entry.resolved;
+  return /* @__PURE__ */ jsx(ReviewItemContext.Provider, { value: entry, children: /* @__PURE__ */ jsxs(
+    "article",
+    {
+      ref: cardRef,
+      className: "native-docx-review-card",
+      tabIndex: 0,
+      "aria-label": `${entry.kind === "revision" ? "Change" : "Comment"} by ${entry.author || "reviewer"}`,
+      onKeyDown: (event) => {
+        if (event.target !== event.currentTarget) return;
+        if ((event.key === "Enter" || event.key === " ") && entry.activatable) {
+          event.preventDefault();
+          review.setActive(entry.key);
+        }
+      },
+      "data-testid": "review-card",
+      "data-kind": entry.kind,
+      "data-active": entry.isActive || void 0,
+      "data-resolved": resolved || void 0,
+      style: { top },
+      onClick: () => {
+        if (entry.activatable && !entry.isActive) review.setActive(entry.key);
+      },
+      children: [
+        entry.kind === "revision" && /* @__PURE__ */ jsx("div", { className: "native-docx-review-kind", children: REVISION_LABELS[entry.revisionKind] ?? "Change" }),
+        /* @__PURE__ */ jsx(Message, { entry }),
+        replies.map((reply) => /* @__PURE__ */ jsx(Message, { entry: reply }, reply.key)),
+        extra,
+        /* @__PURE__ */ jsxs("div", { className: "native-docx-review-actions", children: [
+          entry.kind === "revision" && !entry.readOnly && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "data-testid": "review-accept",
+                onClick: () => review.accept(entry),
+                children: "Accept"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "data-testid": "review-reject",
+                onClick: () => review.reject(entry),
+                children: "Reject"
+              }
+            )
+          ] }),
+          entry.kind === "comment" && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "data-testid": "review-resolve",
+                onClick: () => review.resolve(entry, !entry.resolved),
+                children: entry.resolved ? "Reopen" : "Resolve"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "data-testid": "review-delete",
+                onClick: () => review.remove(entry),
+                children: "Delete"
+              }
+            )
+          ] })
+        ] }),
+        entry.isActive && entry.kind !== "custom" && /* @__PURE__ */ jsx(ReplyForm, { entry, review })
+      ]
+    }
+  ) });
+}
+function Draft({
+  top,
+  onSubmit,
+  onCancel,
+  formRef
+}) {
+  const [text, setText] = useState("");
+  const input = useRef(null);
+  useEffect(() => input.current?.focus(), []);
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      ref: formRef,
+      className: "native-docx-review-card native-docx-review-draft",
+      "data-testid": "review-draft",
+      style: { top },
+      onSubmit: (event) => {
+        event.preventDefault();
+        if (text.trim()) onSubmit(text.trim());
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: input,
+            "data-testid": "review-draft-input",
+            "aria-label": "Comment",
+            placeholder: "Add a comment",
+            value: text,
+            onChange: (event) => setText(event.target.value),
+            onKeyDown: (event) => {
+              if (event.key === "Escape") onCancel();
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "native-docx-review-actions", children: [
+          /* @__PURE__ */ jsx("button", { type: "submit", disabled: !text.trim(), children: "Comment" }),
+          /* @__PURE__ */ jsx("button", { type: "button", "data-testid": "review-draft-cancel", onClick: onCancel, children: "Cancel" })
+        ] })
+      ]
+    }
+  );
+}
+function DocxEditorReviewRail({
+  children
+}) {
+  const editor = useDocxEditor();
+  const registry = useContext(ReviewRailContext);
+  const review = useReview();
+  const [draft, setDraft] = useState(null);
+  const [tops, setTops] = useState({});
+  const [showResolved, setShowResolved] = useState(true);
+  const elements = useRef(/* @__PURE__ */ new Map());
+  const openDraft = useCallback(() => {
+    const placement = editor?.getSelectionPlacement();
+    if (!placement) return;
+    review.setPaneOpen(true);
+    setDraft({ anchorY: placement.anchorY });
+  }, [editor, review.setPaneOpen]);
+  useEffect(() => registry?.register(), [registry]);
+  useEffect(() => registry?.registerCommentDraft(openDraft), [registry, openDraft]);
+  const scale = editor?.getRenderScale() ?? 1;
+  const top = review.items.filter(isTopLevel).filter((entry) => entry.anchorY !== null).filter((entry) => showResolved || entry.kind !== "comment" || !entry.resolved);
+  const hasChanges = review.items.some((entry) => entry.kind === "revision");
+  const hasResolved = review.items.some((entry) => entry.kind === "comment" && entry.resolved);
+  const repliesOf = useCallback(
+    (entry) => review.items.filter(
+      (other) => other.kind === "comment" && (other.parentId === entry.id || other.parentRevisionId === entry.id)
+    ),
+    [review.items]
+  );
+  useLayoutEffect(() => {
+    if (!review.paneOpen) return;
+    const next = {};
+    let floor = 0;
+    const rows = top.map((entry) => ({
+      key: entry.key,
+      y: (entry.anchorY ?? 0) * scale
+    }));
+    if (draft) rows.push({ key: "__draft", y: draft.anchorY * scale });
+    rows.sort((a, b) => a.y - b.y);
+    for (const row of rows) {
+      const y = Math.max(row.y, floor);
+      next[row.key] = y;
+      const height = elements.current.get(row.key)?.offsetHeight ?? 96;
+      floor = y + height + CARD_GAP;
+    }
+    setTops((previous) => {
+      const same = Object.keys(next).length === Object.keys(previous).length && Object.entries(next).every(([key, value]) => previous[key] === value);
+      return same ? previous : next;
+    });
+  });
+  if (!review.ready) return null;
+  const selection = editor?.getSelectionPlacement();
+  const addComment = selection && /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      className: "native-docx-review-add",
+      "data-testid": "review-add-comment",
+      "aria-label": "Add comment",
+      style: { top: selection.anchorY * scale },
+      onMouseDown: (event) => event.preventDefault(),
+      onClick: openDraft,
+      children: "+"
+    }
+  );
+  if (!review.paneOpen) {
+    return /* @__PURE__ */ jsxs("div", { className: "native-docx-review-markers", "data-testid": "review-markers", children: [
+      addComment,
+      top.map((entry) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "native-docx-review-marker",
+          "data-testid": "review-marker",
+          "data-kind": entry.kind,
+          "aria-label": `${entry.author}: ${entry.text.slice(0, 60)}`,
+          style: { top: (entry.anchorY ?? 0) * scale },
+          onClick: () => {
+            review.setPaneOpen(true);
+            review.setActive(entry.key);
+          }
+        },
+        entry.key
+      ))
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("aside", { className: "native-docx-review-pane", "data-testid": "review-pane", "aria-label": "Review", children: [
+    addComment,
+    /* @__PURE__ */ jsxs("div", { className: "native-docx-review-toolbar", "data-testid": "review-toolbar", children: [
+      hasChanges && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "data-testid": "review-previous",
+            onClick: () => review.navigate("previous"),
+            children: "Previous change"
+          }
+        ),
+        /* @__PURE__ */ jsx("button", { type: "button", "data-testid": "review-next", onClick: () => review.navigate("next"), children: "Next change" }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "data-testid": "review-accept-all",
+            onClick: () => review.resolveAll("accept"),
+            children: "Accept all"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "data-testid": "review-reject-all",
+            onClick: () => review.resolveAll("reject"),
+            children: "Reject all"
+          }
+        )
+      ] }),
+      hasResolved && /* @__PURE__ */ jsxs("label", { children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "checkbox",
+            "data-testid": "review-show-resolved",
+            checked: showResolved,
+            onChange: (event) => setShowResolved(event.target.checked)
+          }
+        ),
+        "Show resolved"
+      ] })
+    ] }),
+    draft && /* @__PURE__ */ jsx(
+      Draft,
+      {
+        top: tops.__draft ?? draft.anchorY * scale,
+        formRef: (element) => {
+          if (element) elements.current.set("__draft", element);
+        },
+        onCancel: () => setDraft(null),
+        onSubmit: (text) => {
+          if (review.addComment(text)) setDraft(null);
+        }
+      }
+    ),
+    top.map((entry) => /* @__PURE__ */ jsx(
+      Card,
+      {
+        entry,
+        replies: repliesOf(entry),
+        review,
+        extra: children?.(entry),
+        top: tops[entry.key] ?? (entry.anchorY ?? 0) * scale,
+        cardRef: (element) => {
+          if (element) elements.current.set(entry.key, element);
+          else elements.current.delete(entry.key);
+        }
+      },
+      entry.key
+    )),
+    top.length === 0 && !draft && /* @__PURE__ */ jsx("p", { className: "native-docx-review-empty", "data-testid": "review-empty", children: "No comments or changes." })
+  ] });
+}
+function ReviewCardSlot({ children }) {
+  return /* @__PURE__ */ jsx("div", { className: "native-docx-review-extra", children });
+}
+var DocxEditorReview = Object.assign(DocxEditorReviewRail, { Card: ReviewCardSlot });
 
 // src/docx/mentions.ts
 function mentionCandidates(mentions) {
@@ -585,7 +1013,7 @@ function covered(room, vector, receipt) {
     }
   return true;
 }
-var EditorBoundary = class extends React2.Component {
+var EditorBoundary = class extends React3.Component {
   state = {};
   static getDerivedStateFromError(error) {
     return { error };
@@ -802,7 +1230,6 @@ function NativeDocxEditor({
         url: ws.toString(),
         roomId: session.room_id,
         identity: session.identity,
-        bootstrap: { kind: "join" },
         offlineEditing: true,
         token: async () => {
           const next = initial ? session : await adapter.open(documentId);
@@ -1231,6 +1658,6 @@ function StreamedWordArtifact({
   );
 }
 
-export { DocxCommentActivity, DocxMentions, DocxParticipants, DocxRibbon, NativeDocxEditor, StreamedWordArtifact, loadDocxFonts, normalizeDocxExport };
-//# sourceMappingURL=chunk-6YVI74BC.js.map
-//# sourceMappingURL=chunk-6YVI74BC.js.map
+export { DocxCommentActivity, DocxEditorReview, DocxMentions, DocxParticipants, DocxRibbon, NativeDocxEditor, StreamedWordArtifact, loadDocxFonts, normalizeDocxExport, reviewModule, useReview, useReviewItem };
+//# sourceMappingURL=chunk-JH25QIZW.js.map
+//# sourceMappingURL=chunk-JH25QIZW.js.map