@openeditor/react 0.0.22 → 0.0.23

package/dist/index.js

@@ -32904,15 +32904,34 @@ var pageSnapshotFromNode = (node) => {
     href: typeof node.attrs?.href === "string" ? node.attrs.href : null
   };
 };
+var useResolvedPageSnapshot = (cached, runtime) => {
+  const [resolved, setResolved] = useState(null);
+  useEffect(() => {
+    let active = true;
+    setResolved(null);
+    if (cached?.pageId && runtime?.resolvePage) {
+      void runtime.resolvePage(cached.pageId).then((page) => {
+        if (active && page) setResolved(page);
+      }).catch(() => {
+        if (active) setResolved(null);
+      });
+    }
+    return () => {
+      active = false;
+    };
+  }, [cached?.pageId, runtime]);
+  return [resolved ?? cached, setResolved];
+};
 var OpenEditorPageNodeView = ({ editor, node, updateAttributes: updateAttributes2 }) => {
   const runtime = use(OpenEditorPageRuntimeContext);
   const themeStyle = useOpenEditorThemeStyle();
   const [creating, setCreating] = useState(false);
   const [error, setError] = useState(null);
-  const snapshot = pageSnapshotFromNode(node);
-  const icon = normalizeEmoji(node.attrs.icon, DEFAULT_PAGE_EMOJI);
+  const cached = pageSnapshotFromNode(node);
+  const [page, setResolvedPage] = useResolvedPageSnapshot(cached, runtime);
+  const icon = normalizeEmoji(page?.icon, DEFAULT_PAGE_EMOJI);
   const openPage = () => {
-    if (snapshot) void runtime?.openPage?.(snapshot);
+    if (page) void runtime?.openPage?.(page);
   };
   const createPage = async () => {
     if (!runtime?.createPage || creating) return;
@@ -32929,10 +32948,11 @@ var OpenEditorPageNodeView = ({ editor, node, updateAttributes: updateAttributes
   };
   const updateIcon = async (nextIcon) => {
     updateAttributes2({ icon: nextIcon });
-    if (!snapshot?.pageId || !runtime?.updatePageIcon) return;
+    if (!page?.pageId || !runtime?.updatePageIcon) return;
+    setResolvedPage({ ...page, icon: nextIcon });
     setError(null);
     try {
-      await runtime.updatePageIcon(snapshot.pageId, nextIcon);
+      await runtime.updatePageIcon(page.pageId, nextIcon);
     } catch (cause) {
       setError(cause instanceof Error ? cause.message : "Could not update the page icon.");
     }
@@ -32940,22 +32960,22 @@ var OpenEditorPageNodeView = ({ editor, node, updateAttributes: updateAttributes
   return /* @__PURE__ */ jsxs(
     NodeViewWrapper,
     {
-      "aria-label": snapshot ? `Open ${snapshot.title}` : void 0,
+      "aria-label": page ? `Open ${page.title}` : void 0,
       className: "oe-page",
-      "data-page-id": snapshot?.pageId ?? "",
+      "data-page-id": page?.pageId ?? "",
       onClick: (event) => {
         if (event.target.closest(".oe-emoji-trigger, .oe-emoji-popover")) return;
         openPage();
       },
       onKeyDown: (event) => {
         if (event.target.closest(".oe-emoji-trigger, .oe-emoji-popover")) return;
-        if (snapshot && (event.key === "Enter" || event.key === " ")) {
+        if (page && (event.key === "Enter" || event.key === " ")) {
           event.preventDefault();
           openPage();
         }
       },
-      role: snapshot ? "button" : void 0,
-      tabIndex: snapshot ? 0 : void 0,
+      role: page ? "button" : void 0,
+      tabIndex: page ? 0 : void 0,
       children: [
         /* @__PURE__ */ jsx("span", { contentEditable: false, children: /* @__PURE__ */ jsx(
           OpenEditorEmojiPicker,
@@ -32968,7 +32988,7 @@ var OpenEditorPageNodeView = ({ editor, node, updateAttributes: updateAttributes
             onEmojiSelect: (nextIcon) => void updateIcon(nextIcon)
           }
         ) }),
-        /* @__PURE__ */ jsx(
+        page && page !== cached ? /* @__PURE__ */ jsx("div", { className: "oe-page-title", contentEditable: false, children: page.title }) : /* @__PURE__ */ jsx(
           NodeViewContent,
           {
             as: "div",
@@ -32976,7 +32996,7 @@ var OpenEditorPageNodeView = ({ editor, node, updateAttributes: updateAttributes
             contentEditable: false
           }
         ),
-        !snapshot && runtime?.createPage && editor.isEditable ? /* @__PURE__ */ jsx(
+        !page && runtime?.createPage && editor.isEditable ? /* @__PURE__ */ jsx(
           "button",
           {
             className: "oe-page-action",
@@ -33015,20 +33035,7 @@ var Page = Node3.create({
 var OpenEditorPageViewer = ({ node }) => {
   const runtime = use(OpenEditorPageRuntimeContext);
   const cached = pageSnapshotFromNode(node);
-  const [resolved, setResolved] = useState(null);
-  useEffect(() => {
-    let active = true;
-    setResolved(null);
-    if (cached?.pageId && runtime?.resolvePage) {
-      void runtime.resolvePage(cached.pageId).then((page2) => {
-        if (active && page2) setResolved(page2);
-      });
-    }
-    return () => {
-      active = false;
-    };
-  }, [cached?.pageId, runtime]);
-  const page = resolved ?? cached;
+  const [page] = useResolvedPageSnapshot(cached, runtime);
   const title = page?.title ?? (getNodeText(node) || "Untitled");
   const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [
     /* @__PURE__ */ jsx("span", { className: "oe-page-icon", "aria-hidden": "true", children: normalizeEmoji(page?.icon, DEFAULT_PAGE_EMOJI) }),