@tangle-network/ui 11.4.0 → 11.6.0

package/dist/{chunk-SRAKCVPO.js → chunk-R5GVQDL3.js}

@@ -2,7 +2,7 @@ import {
   ExpandableContent,
   InlineToolItem,
   RunRowShell
-} from "./chunk-4ORVXSMU.js";
+} from "./chunk-J2G7KCYH.js";
 import {
   formatDuration,
   truncateText

package/dist/{chunk-IH2VRPGZ.js → chunk-RKC3GXHE.js}

@@ -6,11 +6,11 @@ import {
 import {
   InlineThinkingItem,
   RunGroup
-} from "./chunk-SRAKCVPO.js";
+} from "./chunk-R5GVQDL3.js";
 import {
   ToolCallGroup,
   ToolCallStep
-} from "./chunk-4ORVXSMU.js";
+} from "./chunk-J2G7KCYH.js";
 import {
   getToolDisplayMetadata
 } from "./chunk-ULDNFLIM.js";

package/dist/{chunk-J3YZIQNI.js → chunk-XPYPZMYT.js}

@@ -1,7 +1,7 @@
 import {
   ToolCallGroup,
   ToolCallStep
-} from "./chunk-4ORVXSMU.js";
+} from "./chunk-J2G7KCYH.js";
 import {
   Markdown
 } from "./chunk-P5F43A65.js";

package/dist/{chunk-HW4ROISY.js → chunk-XROQW5J7.js}

@@ -11,7 +11,7 @@ import {
 } from "./chunk-OEX7NZE3.js";
 import {
   parseToolEvent
-} from "./chunk-J3YZIQNI.js";
+} from "./chunk-XPYPZMYT.js";
 
 // src/hooks/use-dropdown-menu.ts
 import { useEffect, useRef, useState } from "react";

package/dist/{document-editor-pane-MX3FIZSE.js → document-editor-pane-A3JURPW5.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   DocumentEditorPane
-} from "./chunk-NZLLDHEG.js";
+} from "./chunk-QGTIBEPX.js";
 import "./chunk-Q56BYXQF.js";
 import "./chunk-LTEKI7YJ.js";
 import "./chunk-P5F43A65.js";

package/dist/{document-editor-pane-C3cYEDWZ.d.ts → document-editor-pane-IAEQn_Dl.d.ts}

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
 import { a as ArtifactPaneProps } from './artifact-pane-DpuWcAiF.js';
 import { HocuspocusProvider } from '@hocuspocus/provider';
-import * as Y from 'yjs';
+import * as Yjs from 'yjs';
 
 /**
  * Connection state for the Hocuspocus provider.
@@ -24,7 +24,7 @@ interface Collaborator {
  */
 interface EditorContextValue {
     /** The Y.Doc instance for collaboration */
-    doc: Y.Doc;
+    doc: Yjs.Doc;
     /** The Hocuspocus provider instance */
     provider: HocuspocusProvider | null;
     /** Current connection state */
@@ -83,9 +83,13 @@ interface EditorProviderProps {
 }
 /**
  * EditorProvider wraps children with Hocuspocus collaboration context.
- * Manages WebSocket connection, Y.Doc, and awareness state.
+ * Manages WebSocket connection, Y.Doc, and awareness state. Loads `yjs` and
+ * `@hocuspocus/provider` — and no tiptap package — before it renders children,
+ * because every child hook reads a context that only the loaded provider can
+ * supply. A consumer that drives its own editor from that context therefore
+ * needs those two peers alone.
  */
-declare function EditorProvider({ websocketUrl, documentName, token, tokenExpiresAt, user, autoConnect, autoReconnect, maxReconnectAttempts, onConnectionChange, onSync, onAuthError, onRefreshToken, children, }: EditorProviderProps): react_jsx_runtime.JSX.Element;
+declare function EditorProvider(props: EditorProviderProps): react_jsx_runtime.JSX.Element;
 /**
  * Hook to access the editor context.
  * Must be used within an EditorProvider.

package/dist/editor.d.ts

@@ -1,5 +1,5 @@
-import { C as Collaborator, a as ConnectionState } from './document-editor-pane-C3cYEDWZ.js';
-export { D as DocumentEditorBackend, b as DocumentEditorMode, c as DocumentEditorPane, d as DocumentEditorPaneCollaborationConfig, e as DocumentEditorPaneProps, E as EditorContextValue, f as EditorProvider, g as EditorProviderProps, h as EditorTokenRefreshResult, i as EditorUser, u as useEditorContext } from './document-editor-pane-C3cYEDWZ.js';
+import { C as Collaborator, a as ConnectionState } from './document-editor-pane-IAEQn_Dl.js';
+export { D as DocumentEditorBackend, b as DocumentEditorMode, c as DocumentEditorPane, d as DocumentEditorPaneCollaborationConfig, e as DocumentEditorPaneProps, E as EditorContextValue, f as EditorProvider, g as EditorProviderProps, h as EditorTokenRefreshResult, i as EditorUser, u as useEditorContext } from './document-editor-pane-IAEQn_Dl.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { Editor } from '@tiptap/react';
 import { HocuspocusProvider } from '@hocuspocus/provider';
@@ -41,9 +41,10 @@ interface TiptapEditorProps {
 }
 /**
  * TiptapEditor - Collaborative markdown editor with Y.js sync.
- * Must be used within an EditorProvider.
+ * Must be used within an EditorProvider. Loads its tiptap, Hocuspocus and
+ * yjs peers on first render.
  */
-declare function TiptapEditor({ initialContent, placeholder, readOnly, autoFocus, className, contentClassName, onUpdate, onSelectionUpdate, onReady, }: TiptapEditorProps): react_jsx_runtime.JSX.Element;
+declare function TiptapEditor(props: TiptapEditorProps): react_jsx_runtime.JSX.Element;
 /**
  * Collaborators list component.
  * Shows active users in the document.

package/dist/editor.js

@@ -11,7 +11,7 @@ import {
   useEditorConnection,
   useEditorContext,
   useYjsState
-} from "./chunk-NZLLDHEG.js";
+} from "./chunk-QGTIBEPX.js";
 import "./chunk-Q56BYXQF.js";
 import "./chunk-LTEKI7YJ.js";
 import "./chunk-P5F43A65.js";

package/dist/files.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { GitStatusEntry, ContextMenuItem, ContextMenuOpenContext, GitStatus } from '@pierre/trees';
 import { ReactNode, CSSProperties } from 'react';
-import { b as DocumentEditorMode, D as DocumentEditorBackend, d as DocumentEditorPaneCollaborationConfig } from './document-editor-pane-C3cYEDWZ.js';
+import { b as DocumentEditorMode, D as DocumentEditorBackend, d as DocumentEditorPaneCollaborationConfig } from './document-editor-pane-IAEQn_Dl.js';
 import { a as ArtifactPaneProps } from './artifact-pane-DpuWcAiF.js';
 import '@hocuspocus/provider';
 import 'yjs';

package/dist/files.js

@@ -5,7 +5,7 @@ import {
   FileTree,
   RichFileTree,
   filterFileTree
-} from "./chunk-7O22XQ4D.js";
+} from "./chunk-PLWRAS5Z.js";
 import {
   detectFileFormat,
   fileExtension,

package/dist/hooks.js

@@ -11,15 +11,15 @@ import {
   useSSEStream,
   useSdkSession,
   useToolCallStream
-} from "./chunk-HW4ROISY.js";
+} from "./chunk-XROQW5J7.js";
 import "./chunk-OEX7NZE3.js";
 import {
   useAutoScroll,
   useRunCollapseState,
   useRunGroups
 } from "./chunk-AZWDI2JG.js";
-import "./chunk-J3YZIQNI.js";
-import "./chunk-4ORVXSMU.js";
+import "./chunk-XPYPZMYT.js";
+import "./chunk-J2G7KCYH.js";
 import "./chunk-ULDNFLIM.js";
 import "./chunk-AAUNOHVL.js";
 import "./chunk-ZRVH3WCA.js";

package/dist/index.d.ts

@@ -3,7 +3,7 @@ export { Avatar, AvatarFallback, AvatarImage, Badge, BadgeProps, Card, CardConte
 export { Logo, LogoProps, TangleKnot } from '@tangle-network/brand';
 export { A as ArtifactPane, a as ArtifactPaneProps } from './artifact-pane-DpuWcAiF.js';
 export { AgentTimeline, AgentTimelineArtifactItem, AgentTimelineCustomItem, AgentTimelineItem, AgentTimelineMessageItem, AgentTimelineProps, AgentTimelineStatusItem, AgentTimelineTone, AgentTimelineToolGroupItem, AgentTimelineToolItem, ChatContainer, ChatContainerProps, ChatMessage, ChatMessageProps, MessageList, MessageListProps, MessageRole, ThinkingIndicator, ThinkingIndicatorProps, UserMessage, UserMessageProps } from './chat.js';
-export { ExpandedToolDetail, ExpandedToolDetailProps, InlineThinkingItem, InlineThinkingItemProps, InlineToolItem, InlineToolItemProps, LiveDuration, RunGroup, RunGroupProps } from './run.js';
+export { ExpandedToolDetail, ExpandedToolDetailProps, InlineThinkingItem, InlineThinkingItemProps, InlineToolItem, InlineToolItemProps, LiveDuration, RunGroup, RunGroupProps, RunRowShell, RunRowShellProps, RunRowStatus, RunRowStatusDot } from './run.js';
 export { F as FeedSegment, T as ToolCallData, a as ToolCallFeed, b as ToolCallFeedProps, c as ToolCallStatus, d as ToolCallType, p as parseToolEvent } from './tool-call-feed-D9iofJgW.js';
 export { OpenUIAction, OpenUIActionsNode, OpenUIArtifactRenderer, OpenUIArtifactRendererProps, OpenUIBadgeNode, OpenUICardNode, OpenUICodeNode, OpenUIComponentNode, OpenUIGridNode, OpenUIHeadingNode, OpenUIKeyValueNode, OpenUIMarkdownNode, OpenUIPrimitive, OpenUISeparatorNode, OpenUIStackNode, OpenUIStatNode, OpenUITableNode, OpenUITextNode } from './openui.js';
 export { FileArtifactPane, FileArtifactPaneProps, FileFormat, FileNode, FilePreview, FilePreviewProps, FileTabData, FileTabs, FileTabsProps, FileTree, FileTreeProps, FileTreeVisibilityOptions, RichFileTree, RichFileTreeGitEntry, RichFileTreeGitStatus, RichFileTreeProps, RichFileTreeThemeVars, detectFileFormat, fileExtension, filterFileTree, getCodeLanguage, getFormatLabel, getSyntaxLanguage } from './files.js';
@@ -35,7 +35,7 @@ import '@radix-ui/react-progress';
 import '@radix-ui/react-switch';
 import '@radix-ui/react-label';
 import '@pierre/trees';
-import './document-editor-pane-C3cYEDWZ.js';
+import './document-editor-pane-IAEQn_Dl.js';
 import '@hocuspocus/provider';
 import 'yjs';
 import 'nanostores';

package/dist/index.js

@@ -20,7 +20,7 @@ import {
   useSSEStream,
   useSdkSession,
   useToolCallStream
-} from "./chunk-HW4ROISY.js";
+} from "./chunk-XROQW5J7.js";
 import {
   addMessage,
   addParts,
@@ -146,26 +146,28 @@ import {
   MessageList,
   ThinkingIndicator,
   UserMessage
-} from "./chunk-IH2VRPGZ.js";
+} from "./chunk-RKC3GXHE.js";
 import {
   useAutoScroll,
   useRunCollapseState,
   useRunGroups
 } from "./chunk-AZWDI2JG.js";
-import "./chunk-47XH56SV.js";
+import "./chunk-LQS34IGP.js";
 import {
   ToolCallFeed,
   parseToolEvent
-} from "./chunk-J3YZIQNI.js";
+} from "./chunk-XPYPZMYT.js";
 import {
   InlineThinkingItem,
   RunGroup
-} from "./chunk-SRAKCVPO.js";
+} from "./chunk-R5GVQDL3.js";
 import {
   ExpandedToolDetail,
   InlineToolItem,
-  LiveDuration
-} from "./chunk-4ORVXSMU.js";
+  LiveDuration,
+  RunRowShell,
+  RunRowStatusDot
+} from "./chunk-J2G7KCYH.js";
 import {
   TOOL_CATEGORY_ICONS,
   formatBytes,
@@ -219,7 +221,7 @@ import {
   FileTree,
   RichFileTree,
   filterFileTree
-} from "./chunk-7O22XQ4D.js";
+} from "./chunk-PLWRAS5Z.js";
 import {
   detectFileFormat,
   fileExtension,
@@ -324,6 +326,8 @@ export {
   RedactedDocument,
   RichFileTree,
   RunGroup,
+  RunRowShell,
+  RunRowStatusDot,
   SegmentedControl,
   Select,
   SelectContent,

package/dist/run.d.ts

@@ -28,6 +28,53 @@ interface RunGroupProps {
  */
 declare const RunGroup: React.MemoExoticComponent<({ run, partMap, collapsed, onToggle, branding, renderToolDetail, headerActions, renderToolActions, }: RunGroupProps) => react_jsx_runtime.JSX.Element | null>;
 
+type RunRowStatus = "running" | "success" | "error" | "idle";
+/**
+ * Trailing status indicator shared by every run row: a spinner while running,
+ * a green/red dot on terminal states, nothing when idle. Status is shown here
+ * — it never replaces the row's semantic lead icon.
+ */
+declare function RunRowStatusDot({ status }: {
+    status: RunRowStatus;
+}): react_jsx_runtime.JSX.Element | null;
+interface RunRowShellProps {
+    /** Semantic lead glyph — always visible; never replaced by status. */
+    icon: ReactNode;
+    /** Row title. A string in the common case; a node when the title carries its
+     *  own treatment (e.g. an active-state shimmer sweep) — it renders inline in
+     *  the shell's title slot either way. */
+    title: ReactNode;
+    /** Secondary inline text (tool path/command, or a reasoning preview). */
+    description?: string;
+    /** Render the description in mono (tools) vs prose (reasoning). */
+    descriptionMono?: boolean;
+    status?: RunRowStatus;
+    /** Live-ticks a duration while running. */
+    startTime?: number;
+    /** Static duration shown once the row is no longer running. */
+    durationMs?: number;
+    /** Radius shaping when rows are stacked into a group. */
+    groupPosition?: "single" | "first" | "middle" | "last";
+    /** Message shown below the header while collapsed (tool errors). */
+    collapsedError?: string;
+    actions?: ReactNode;
+    /** Controlled open state. Omit for internal (uncontrolled) state. */
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    defaultOpen?: boolean;
+    className?: string;
+    contentClassName?: string;
+    /** Expanded body. When absent the row is not expandable. */
+    children?: ReactNode;
+}
+/**
+ * Shared shell for the agent activity rows (reasoning + tool). Owns the
+ * bordered container, the lead icon badge, title/description, the trailing
+ * meta cluster (duration + status + chevron) and the collapsible body, so
+ * both row kinds read as one family instead of two bespoke layouts.
+ */
+declare function RunRowShell({ icon, title, description, descriptionMono, status, startTime, durationMs, groupPosition, collapsedError, actions, open: openProp, onOpenChange, defaultOpen, className, contentClassName, children, }: RunRowShellProps): react_jsx_runtime.JSX.Element;
+
 interface InlineToolItemProps {
     part: ToolPart;
     renderToolDetail?: CustomToolRenderer;
@@ -71,4 +118,4 @@ declare function LiveDuration({ startTime }: {
     startTime: number;
 }): react_jsx_runtime.JSX.Element;
 
-export { ExpandedToolDetail, type ExpandedToolDetailProps, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, LiveDuration, RunGroup, type RunGroupProps };
+export { ExpandedToolDetail, type ExpandedToolDetailProps, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, LiveDuration, RunGroup, type RunGroupProps, RunRowShell, type RunRowShellProps, type RunRowStatus, RunRowStatusDot };

package/dist/run.js

@@ -1,17 +1,19 @@
-import "./chunk-47XH56SV.js";
+import "./chunk-LQS34IGP.js";
 import {
   ToolCallFeed,
   parseToolEvent
-} from "./chunk-J3YZIQNI.js";
+} from "./chunk-XPYPZMYT.js";
 import {
   InlineThinkingItem,
   RunGroup
-} from "./chunk-SRAKCVPO.js";
+} from "./chunk-R5GVQDL3.js";
 import {
   ExpandedToolDetail,
   InlineToolItem,
-  LiveDuration
-} from "./chunk-4ORVXSMU.js";
+  LiveDuration,
+  RunRowShell,
+  RunRowStatusDot
+} from "./chunk-J2G7KCYH.js";
 import "./chunk-ULDNFLIM.js";
 import "./chunk-AAUNOHVL.js";
 import "./chunk-3M7BPSSW.js";
@@ -27,6 +29,8 @@ export {
   InlineToolItem,
   LiveDuration,
   RunGroup,
+  RunRowShell,
+  RunRowStatusDot,
   ToolCallFeed,
   parseToolEvent
 };

package/dist/sdk-hooks.js

@@ -5,15 +5,15 @@ import {
   useSSEStream,
   useSdkSession,
   useToolCallStream
-} from "./chunk-HW4ROISY.js";
+} from "./chunk-XROQW5J7.js";
 import "./chunk-OEX7NZE3.js";
 import {
   useAutoScroll,
   useRunCollapseState,
   useRunGroups
 } from "./chunk-AZWDI2JG.js";
-import "./chunk-J3YZIQNI.js";
-import "./chunk-4ORVXSMU.js";
+import "./chunk-XPYPZMYT.js";
+import "./chunk-J2G7KCYH.js";
 import "./chunk-ULDNFLIM.js";
 import "./chunk-AAUNOHVL.js";
 import "./chunk-ZRVH3WCA.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tangle-network/ui",
-  "version": "11.4.0",
+  "version": "11.6.0",
   "description": "Generic React UI components for Tangle products — primitives, chat, run, files, editor, markdown.",
   "type": "module",
   "license": "MIT",

package/src/editor/document-editor-pane.test.tsx

@@ -0,0 +1,58 @@
+import { render, screen, waitFor } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import type * as EditorPeers from "./editor-peers";
+
+const markdown = "# Release notes\n\nThe editor loads on demand.";
+
+afterEach(() => {
+  vi.resetModules();
+});
+
+/** Loads the pane with every peer loader rejecting, as for a consumer that
+ *  installed neither tiptap nor the collaboration stack. The spies report
+ *  whether a render reached a loader at all. */
+async function paneWithoutPeers(message: string) {
+  const loaders = {
+    loadDocumentEditorPeers: vi.fn(async () => {
+      throw new Error(message);
+    }),
+    loadCollaborationPeers: vi.fn(async () => {
+      throw new Error(message);
+    }),
+    loadEditorProviderPeers: vi.fn(async () => {
+      throw new Error(message);
+    }),
+  };
+  vi.resetModules();
+  vi.doMock("./editor-peers", async () => ({
+    ...(await vi.importActual<typeof EditorPeers>("./editor-peers")),
+    ...loaders,
+  }));
+  const { DocumentEditorPane } = await import("./document-editor-pane");
+  return { DocumentEditorPane, loaders };
+}
+
+describe("DocumentEditorPane without the editor peers", () => {
+  it("renders the preview, because only the edit tab needs the peers", async () => {
+    const { DocumentEditorPane, loaders } = await paneWithoutPeers(
+      "peers are not installed",
+    );
+
+    render(<DocumentEditorPane title="Notes" markdown={markdown} />);
+
+    // The promise this pane's editors carry is exactly this: a consumer that
+    // never opens the edit tab pays nothing for tiptap.
+    expect(screen.getByText("Release notes")).toBeInTheDocument();
+    expect(screen.getByText("The editor loads on demand.")).toBeInTheDocument();
+    expect(screen.getByRole("tab", { name: "Edit" })).toBeInTheDocument();
+
+    // Reaching no loader is the claim. Asserting only that the placeholder is
+    // absent would also pass for a pane that rendered nothing at all.
+    await waitFor(() => {
+      expect(screen.queryByText("Loading editor…")).toBeNull();
+    });
+    expect(loaders.loadDocumentEditorPeers).not.toHaveBeenCalled();
+    expect(loaders.loadCollaborationPeers).not.toHaveBeenCalled();
+    expect(loaders.loadEditorProviderPeers).not.toHaveBeenCalled();
+  });
+});

package/src/editor/editor-lazy.test.tsx

@@ -0,0 +1,102 @@
+import { fireEvent, render, screen } from "@testing-library/react";
+import { Component, type ReactNode, Suspense } from "react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { retryableLazyEditor } from "./editor-lazy";
+import { MissingEditorPeersError } from "./editor-peers";
+
+/** Catches the rejection the lazy component throws, and can mount it again. */
+class ResettableBoundary extends Component<
+  { children: ReactNode },
+  { failure: Error | null }
+> {
+  state = { failure: null as Error | null };
+
+  static getDerivedStateFromError(error: Error) {
+    return { failure: error };
+  }
+
+  render() {
+    if (this.state.failure) {
+      return (
+        <button type="button" onClick={() => this.setState({ failure: null })}>
+          failed: {this.state.failure.message}
+        </button>
+      );
+    }
+    return this.props.children;
+  }
+}
+
+function Loaded() {
+  return <span>editor</span>;
+}
+
+/** React reports a caught render error on the console; the assertions read it. */
+let consoleError: ReturnType<typeof vi.spyOn>;
+
+beforeEach(() => {
+  consoleError = vi.spyOn(console, "error").mockImplementation(() => {});
+});
+
+afterEach(() => {
+  consoleError.mockRestore();
+});
+
+function renderRetryable(load: () => Promise<typeof Loaded>) {
+  const lazyEditor = retryableLazyEditor(load);
+  function Host() {
+    const LazyEditor = lazyEditor();
+    return (
+      <Suspense fallback={<span>loading</span>}>
+        <LazyEditor />
+      </Suspense>
+    );
+  }
+  return render(
+    <ResettableBoundary>
+      <Host />
+    </ResettableBoundary>,
+  );
+}
+
+describe("retryableLazyEditor", () => {
+  it("re-attempts the load after a transient failure", async () => {
+    // `lazy` caches its first rejection for the life of the component, so one
+    // failed chunk fetch would otherwise hold the editor broken until a full
+    // page reload.
+    const load = vi
+      .fn<() => Promise<typeof Loaded>>()
+      .mockRejectedValueOnce(new Error("Failed to fetch dynamically imported module"))
+      .mockResolvedValue(Loaded);
+
+    renderRetryable(load);
+
+    const retry = await screen.findByRole("button");
+    expect(retry).toHaveTextContent("Failed to fetch dynamically imported module");
+    expect(load).toHaveBeenCalledTimes(1);
+
+    fireEvent.click(retry);
+
+    expect(await screen.findByText("editor")).toBeInTheDocument();
+    expect(load).toHaveBeenCalledTimes(2);
+  });
+
+  it("keeps a missing peer permanent, so a remount does not import it again", async () => {
+    // A package does not install itself mid-session. Retrying would only
+    // repeat the same failure and hide the install list behind a loop.
+    const load = vi
+      .fn<() => Promise<typeof Loaded>>()
+      .mockRejectedValue(new MissingEditorPeersError("Install @tiptap/react."));
+
+    renderRetryable(load);
+
+    const retry = await screen.findByRole("button");
+    expect(retry).toHaveTextContent("Install @tiptap/react.");
+    expect(load).toHaveBeenCalledTimes(1);
+
+    fireEvent.click(retry);
+
+    expect(await screen.findByRole("button")).toHaveTextContent("Install @tiptap/react.");
+    expect(load).toHaveBeenCalledTimes(1);
+  });
+});

package/src/editor/editor-lazy.ts

@@ -0,0 +1,40 @@
+import { type ComponentType, lazy, type LazyExoticComponent } from "react";
+import { isMissingEditorPeersError } from "./editor-peers";
+
+/**
+ * Builds a `lazy` editor component that a remount can re-attempt.
+ *
+ * `lazy` caches its first rejection for the life of the component. That is
+ * right for a missing peer, which stays missing for the session, and wrong for
+ * a transient chunk fetch: one failed network request would otherwise hold the
+ * editor broken until a full page reload.
+ *
+ * The returned function gives the component to render, and a caller must call
+ * it on every render: a transient failure replaces the component, and a caller
+ * that holds the one it got earlier keeps replaying the cached rejection.
+ *
+ * A `MissingEditorPeersError` keeps the cached rejection, so the install list
+ * reaches the consumer's error boundary once and the loader does not run
+ * again. Any other rejection replaces the component, so the next mount — an
+ * error boundary that resets, or a remount by the parent — starts a fresh
+ * attempt.
+ */
+export function retryableLazyEditor<P extends object>(
+  loadComponent: () => Promise<ComponentType<P>>,
+): () => LazyExoticComponent<ComponentType<P>> {
+  function build(): LazyExoticComponent<ComponentType<P>> {
+    return lazy(async () => {
+      try {
+        return { default: await loadComponent() };
+      } catch (error) {
+        if (!isMissingEditorPeersError(error)) {
+          current = build();
+        }
+        throw error;
+      }
+    });
+  }
+
+  let current = build();
+  return () => current;
+}

package/src/editor/editor-loading.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import { cn } from "../lib/utils";
+
+/**
+ * Stands in for an editor while its optional peers load. The editors reach
+ * tiptap through a dynamic import, so an editor's first frame waits for that
+ * chunk. The live region announces the wait, which a screen reader has no
+ * other way to notice. Callers put their own minimum height first, so a
+ * caller-supplied className still wins.
+ */
+export function EditorLoadingPlaceholder({ className }: { className?: string }) {
+  return (
+    <div
+      role="status"
+      aria-live="polite"
+      className={cn(
+        "flex w-full items-center justify-center rounded-lg border border-border border-dashed bg-muted text-muted-foreground text-sm",
+        className,
+      )}
+    >
+      Loading editor…
+    </div>
+  );
+}