@agent-native/core-corpus 0.201.0-nightly-20261005153421 → 0.201.0

package/corpus/templates/content/app/components/editor/database/sidebar.tsx

@@ -1,4 +1,3 @@
-import { useActionQuery } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
 import { parseIconValue, serializeIconValue } from "@agent-native/core/icons";
 import type { IconValue } from "@agent-native/core/icons";
@@ -6,7 +5,6 @@ import type {
   ContentDatabaseItem,
   ContentDatabaseNavigationItem,
   ContentDatabaseNavigationPageResponse,
-  ContentDatabaseNavigationSort,
   ContentDatabaseOpenPagesIn,
   ContentDatabasePersonalViewOverrides,
   ContentDatabaseResponse,
@@ -63,13 +61,15 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { ScrollArea } from "@/components/ui/scroll-area";
-import { Skeleton } from "@/components/ui/skeleton";
 import {
   Tooltip,
   TooltipContent,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
-import { filesNavigationPageParams } from "@/lib/files-navigation";
+import {
+  filesNavigationPageParams,
+  useFilesNavigationPage,
+} from "@/lib/files-navigation";
 import type { SidebarRowsHint } from "@/lib/sidebar-layout-hint";
 import {
   SIDEBAR_FILES_ROW_ELEMENT_TIMING,
@@ -143,8 +143,6 @@ export function navigationItemAsDatabaseItem(
 
 export function PagedContentFilesSidebarView({
   databaseId,
-  sort,
-  viewId,
   activeDocumentId,
   expandedDocumentIds,
   onDocumentExpandedChange,
@@ -159,10 +157,10 @@ export function PagedContentFilesSidebarView({
   untitledLabel,
   rootPlaceholder,
   onRootPageShown,
+  branchPlaceholders,
+  onBranchShown,
 }: {
   databaseId: string;
-  sort: ContentDatabaseNavigationSort;
-  viewId?: string;
   activeDocumentId?: string | null;
   expandedDocumentIds: ReadonlySet<string>;
   onDocumentExpandedChange: (documentId: string, expanded: boolean) => void;
@@ -180,6 +178,10 @@ export function PagedContentFilesSidebarView({
   rootPlaceholder?: SidebarRowsHint;
   /** Reports what the root page drew, for the next load's placeholder. */
   onRootPageShown?: (shown: SidebarRowsHint) => void;
+  /** Rows to hold while an open folder's first page loads, by folder ID. */
+  branchPlaceholders?: Readonly<Record<string, SidebarRowsHint>>;
+  /** Reports what an open folder's first page drew. */
+  onBranchShown?: (documentId: string, shown: SidebarRowsHint) => void;
 }) {
   return (
     <nav
@@ -188,13 +190,13 @@ export function PagedContentFilesSidebarView({
       data-paged-files-navigation
     >
       <PagedContentFilesBranch
-        key={`${databaseId}:root:${sort}:${viewId ?? ""}`}
+        key={`${databaseId}:root`}
         databaseId={databaseId}
         parentId={null}
-        sort={sort}
-        viewId={viewId}
         rootPlaceholder={rootPlaceholder}
         onRootPageShown={onRootPageShown}
+        branchPlaceholders={branchPlaceholders}
+        onBranchShown={onBranchShown}
         depth={0}
         activeDocumentId={activeDocumentId}
         expandedDocumentIds={expandedDocumentIds}
@@ -229,14 +231,14 @@ function PagedContentFilesBranch({
   cursor?: string;
   rootPlaceholder?: SidebarRowsHint;
   onRootPageShown?: (shown: SidebarRowsHint) => void;
+  branchPlaceholders?: Readonly<Record<string, SidebarRowsHint>>;
+  onBranchShown?: (documentId: string, shown: SidebarRowsHint) => void;
   precedingDocumentIds?: ReadonlySet<string>;
   /**
    * Reloads the branch from its first page. Returns false when an automatic
    * reload is refused because the branch reloaded itself moments ago.
    */
   reloadBranch?: (automatic: boolean) => boolean;
-  sort: ContentDatabaseNavigationSort;
-  viewId?: string;
   depth: number;
   activeDocumentId?: string | null;
   expandedDocumentIds: ReadonlySet<string>;
@@ -256,15 +258,13 @@ function PagedContentFilesBranch({
   const [continuationGeneration, setContinuationGeneration] = useState(0);
   const lastAutomaticReload = useRef(Number.NEGATIVE_INFINITY);
   const [reloadRefused, setReloadRefused] = useState(false);
-  const query = useActionQuery(
-    "query-content-database-items",
+  const query = useFilesNavigationPage(
     filesNavigationPageParams({
       databaseId: props.databaseId,
       parentId: props.parentId,
-      sort: props.sort,
-      viewId: props.viewId,
       cursor,
     }),
+    props.expandedDocumentIds,
   );
   const data =
     query.data && !("available" in query.data)
@@ -328,47 +328,46 @@ function PagedContentFilesBranch({
   }, [rootRowsShown]);
 
   const firstRoot = props.depth === 0 && !cursor;
-  const rootRowCount =
-    firstRoot && data
+  const firstPageRowCount =
+    !cursor && data
       ? data.items.length +
         props.activePathDocuments.filter(
           (document) =>
-            document.parentId === null &&
+            document.parentId === props.parentId &&
             !data.items.some((item) => item.documentId === document.id),
         ).length
       : null;
-  const rootHasMore = Boolean(
+  const firstPageHasMore = Boolean(
     data?.pagination.hasMore && data.pagination.nextCursor,
   );
   useEffect(() => {
-    if (rootRowCount === null) return;
-    onRootPageShown?.({ rows: rootRowCount, more: rootHasMore });
+    if (firstPageRowCount === null) return;
+    const shown = { rows: firstPageRowCount, more: firstPageHasMore };
+    if (props.parentId === null) onRootPageShown?.(shown);
+    else props.onBranchShown?.(props.parentId, shown);
     // The callback identity changes per render; only what was drawn matters.
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [rootRowCount, rootHasMore]);
+  }, [firstPageRowCount, firstPageHasMore]);
 
-  if (firstRoot && (query.isLoading || (cursorExpired && !reloadRefused))) {
+  if (query.isLoading || (cursorExpired && !reloadRefused)) {
+    // A first page holds the rows it drew last time, in the rows' own
+    // geometry, so the rows below it do not move when the page arrives.
+    const placeholder = cursor
+      ? undefined
+      : props.parentId === null
+        ? rootPlaceholder
+        : props.branchPlaceholders?.[props.parentId];
     return (
       <SidebarRowsSkeleton
         framed={false}
-        rows={rootPlaceholder?.rows ?? 3}
-        more={rootPlaceholder?.more}
-        firstRowProps={startupAnchor("sidebar-files-first-row")}
+        rows={placeholder?.rows ?? 3}
+        more={placeholder?.more}
+        firstRowProps={
+          firstRoot ? startupAnchor("sidebar-files-first-row") : undefined
+        }
       />
     );
   }
-  if (query.isLoading || (cursorExpired && !reloadRefused)) {
-    return (
-      <div aria-hidden="true" className="grid gap-1 p-1">
-        {[70, 55, 85].map((width) => (
-          <div key={width} className="flex h-7 items-center gap-1.5 px-1.5">
-            <Skeleton className="size-3.5 shrink-0 rounded-sm" />
-            <Skeleton className="h-3 rounded" style={{ width: `${width}%` }} />
-          </div>
-        ))}
-      </div>
-    );
-  }
   if (query.isError || !data) {
     return (
       <div className="px-1 py-1">
@@ -468,7 +467,7 @@ function PagedContentFilesBranch({
             {expanded && navigationItem.hasChildren ? (
               <PagedContentFilesBranch
                 {...props}
-                key={`${props.databaseId}:${navigationItem.documentId}:${props.sort}:${props.viewId ?? ""}`}
+                key={`${props.databaseId}:${navigationItem.documentId}`}
                 parentId={navigationItem.documentId}
                 depth={props.depth + 1}
               />
@@ -1193,7 +1192,7 @@ function DatabaseSidebarRow({
     : t("sidebar.expandItem", { title });
   const rowRef = useRef<HTMLDivElement>(null);
   useEffect(() => {
-    if (active) revealActiveSidebarRow(rowRef.current);
+    if (active) return revealActiveSidebarRow(rowRef.current);
   }, [active]);
   const isLocalFile = item.document.source?.mode === "local-files";
   const canChangePage = canEdit && !isLocalFile && pageActions !== null;

package/corpus/templates/content/app/components/editor/document-editor-layout.ts

@@ -34,6 +34,12 @@ export const DOCUMENT_EDITOR_TITLE_CLASS_NAME =
 export const DOCUMENT_EDITOR_PAGE_TITLE_SIZE_CLASS_NAME =
   "text-3xl md:text-4xl md:pb-0.5";
 
+export const DOCUMENT_EDITOR_DATABASE_TITLE_SIZE_CLASS_NAME = "text-3xl";
+
+export function documentEditorDatabaseRegionClassName() {
+  return "shrink-0 min-w-0 w-full max-w-none px-4 pb-8 sm:px-8 lg:px-10";
+}
+
 export function documentEditorBodyClassName(host: "page" | "preview") {
   return cn(
     "mx-auto w-full max-w-3xl flex-1 cursor-text px-4",
@@ -44,3 +50,15 @@ export function documentEditorBodyClassName(host: "page" | "preview") {
 // What sits above the title: the page icon (56px), the "Add icon" button an
 // editor sees on a page without one (28px), or nothing for a reader.
 export type DocumentEditorIconRow = "icon" | "add" | "none";
+
+// What sits below the title: a page body; a page body beside the review margin
+// its open comments and suggestions hold open; or a collection, whose tabs row
+// may sit above a row of the view's sorts and filters.
+export type DocumentEditorShape =
+  | "page"
+  | "review"
+  | "database"
+  | "database-constrained";
+
+// The review margin opens only when the page column is at least this wide.
+export const DOCUMENT_EDITOR_INLINE_REVIEW_MIN_WIDTH = 1088;

package/corpus/templates/content/app/components/editor/extensions/NotionExtensions.tsx

@@ -32,11 +32,13 @@ import {
   mergeAttributes,
   type NodeViewProps,
 } from "@tiptap/react";
+import { useState } from "react";
 
 import { usePageLinkTarget } from "../../../hooks/use-content-links";
 import { ContentIcon } from "../../icons/ContentIcon";
 import { EmojiPicker } from "../EmojiPicker";
 import { MathRenderer } from "../MathRenderer";
+import { isSuggestingEdits } from "../suggestions/read-only-blocks";
 
 const BLOCK_ATOM_TAGS = [
   "page",
@@ -351,9 +353,13 @@ export function focusToggleSummaryAtPosition(
 }
 
 function ToggleView({ node, editor, getPos }: NodeViewProps) {
-  const open = !!node.attrs.open;
+  // The page stores whether a Toggle is open, and a suggestion cannot change
+  // a Toggle, so while suggesting it opens and closes only in this view.
+  const suggesting = isSuggestingEdits(editor.state);
+  const [suggestingOpen, setSuggestingOpen] = useState<boolean | null>(null);
+  const open = suggestingOpen ?? !!node.attrs.open;
   const summary = (node.attrs.summary || "") as string;
-  const isEditable = editor.isEditable;
+  const isEditable = editor.isEditable && !suggesting;
   const bodyHasNoBlocks = node.childCount === 0;
 
   const updateToggleAttributes = (
@@ -374,7 +380,9 @@ function ToggleView({ node, editor, getPos }: NodeViewProps) {
   };
 
   const setOpen = (value: boolean) =>
-    updateToggleAttributes({ open: value }, "pointer");
+    suggesting
+      ? setSuggestingOpen(value)
+      : updateToggleAttributes({ open: value }, "pointer");
 
   const focusEmptyBody = (event: React.MouseEvent<HTMLElement>) => {
     if (!isEditable) return;

package/corpus/templates/content/app/components/editor/suggestions/draft-session.ts

@@ -2,7 +2,10 @@ import type {
   ResourceSuggestion,
   SuggestionOperation,
 } from "@agent-native/core/review";
-import { SuggestionFormattingMappingError } from "@shared/suggestion-formatting";
+import {
+  SuggestionFormattingMappingError,
+  suggestionSourceAlignment,
+} from "@shared/suggestion-formatting";
 
 import {
   draftSuggestionAnchors,
@@ -233,23 +236,28 @@ export function recordSuggestionReplacementIntent(
     return false;
   }
   const operations = suggestionDraftOperations(session, currentContent);
+  // Intents are stored-base offsets; the draft is the base's canonical form.
+  const alignment = suggestionSourceAlignment(session.baseContent);
+  if (!alignment) return false;
   const baseOffset = (position: number, side: "start" | "end") => {
     let delta = 0;
     for (const operation of operations) {
-      const start = operation.anchor.from + delta;
+      const from = alignment.map(operation.anchor.from, "stored");
+      const to = alignment.map(operation.anchor.to, "stored");
+      if (from === null || to === null) return null;
+      const start = from + delta;
       const end = start + operation.after.changedText.length;
-      if (position < start) return position - delta;
+      if (position < start) return alignment.map(position - delta, "canonical");
       if (position === start) return operation.anchor.from;
       if (position < end)
         return side === "start" ? operation.anchor.from : operation.anchor.to;
-      delta +=
-        operation.after.changedText.length -
-        (operation.anchor.to - operation.anchor.from);
+      delta += operation.after.changedText.length - (to - from);
     }
-    return position - delta;
+    return alignment.map(position - delta, "canonical");
   };
   const start = baseOffset(candidates[0]!, "start");
   const end = baseOffset(candidates[0]! + input.beforeText.length, "end");
+  if (start === null || end === null) return false;
   if (start === end) return true;
   const intents = session.replacementIntents ?? [];
   if (!intents.some((intent) => intent.from <= start && intent.to >= end)) {

package/corpus/templates/content/app/components/editor/suggestions/model.ts

@@ -84,6 +84,19 @@ export const SUPPORTED_SUGGESTION_BLOCKS = new Set([
   "horizontalRule",
 ]);
 
+const SUPPORTED_SUGGESTION_INLINE_NODES = new Set(["hardBreak"]);
+
+// A suggestion must leave every other node unchanged: the server refuses a
+// proposal that edits one, so the suggesting editor keeps them read-only.
+export function supportsSuggestionNode(type: string): boolean {
+  return (
+    type === "doc" ||
+    type === "text" ||
+    SUPPORTED_SUGGESTION_BLOCKS.has(type) ||
+    SUPPORTED_SUGGESTION_INLINE_NODES.has(type)
+  );
+}
+
 export const SUPPORTED_SUGGESTION_MARKS = new Set<SuggestionMark>([
   "bold",
   "italic",

package/corpus/templates/content/app/components/editor/suggestions/read-only-blocks.ts

@@ -0,0 +1,136 @@
+import { RICH_MARKDOWN_PROGRAMMATIC_TRANSACTION } from "@agent-native/toolkit/editor";
+import { Extension } from "@tiptap/core";
+import type {
+  Fragment,
+  Node as ProseMirrorNode,
+  Slice,
+} from "@tiptap/pm/model";
+import {
+  Plugin,
+  PluginKey,
+  type EditorState,
+  type Transaction,
+} from "@tiptap/pm/state";
+import { Decoration, DecorationSet } from "@tiptap/pm/view";
+
+import { supportsSuggestionNode } from "./model";
+
+type NodeRange = { from: number; to: number };
+
+export function unsupportedSuggestionRanges(doc: ProseMirrorNode): NodeRange[] {
+  const ranges: NodeRange[] = [];
+  doc.descendants((node, pos) => {
+    if (supportsSuggestionNode(node.type.name)) return true;
+    ranges.push({ from: pos, to: pos + node.nodeSize });
+    return false;
+  });
+  return ranges;
+}
+
+// Mark and attribute steps have empty step maps, so read the range each step
+// touches from its own fields rather than from its map.
+function stepRange(
+  step: Transaction["steps"][number],
+  doc: ProseMirrorNode,
+): NodeRange | null {
+  const { from, to, pos } = step as unknown as {
+    from?: number;
+    to?: number;
+    pos?: number;
+  };
+  if (typeof from === "number" && typeof to === "number") return { from, to };
+  if (typeof pos === "number") {
+    return { from: pos, to: pos + (doc.nodeAt(pos)?.nodeSize ?? 0) };
+  }
+  return null;
+}
+
+function holdsUnsupportedNode(
+  content: Fragment,
+  from = 0,
+  to = content.size,
+): boolean {
+  let found = false;
+  content.nodesBetween(from, to, (node) => {
+    if (found) return false;
+    if (supportsSuggestionNode(node.type.name)) return true;
+    found = true;
+    return false;
+  });
+  return found;
+}
+
+// Loading a draft or the canonical body replaces the whole document outside
+// undo history. Select-all followed by typing also replaces the whole
+// document, so the history flag is what tells a load from an edit. A step
+// that inserts an unsupported node is refused too: once in the draft, the
+// node would be read-only and could not be removed again.
+export function editsUnsupportedSuggestionNode(
+  transaction: Transaction,
+): boolean {
+  if (transaction.getMeta(RICH_MARKDOWN_PROGRAMMATIC_TRANSACTION)) return false;
+  const loadsBody = transaction.getMeta("addToHistory") === false;
+  return transaction.steps.some((step, index) => {
+    const doc = transaction.docs[index]!;
+    const range = stepRange(step, doc);
+    if (!range) return true;
+    if (loadsBody && range.from === 0 && range.to === doc.content.size) {
+      return false;
+    }
+    const { slice } = step as { slice?: Slice };
+    return (
+      (slice !== undefined && holdsUnsupportedNode(slice.content)) ||
+      holdsUnsupportedNode(doc.content, range.from, range.to)
+    );
+  });
+}
+
+const readOnlyBlocksKey = new PluginKey("suggestingReadOnlyBlocks");
+
+export function isSuggestingEdits(state: EditorState): boolean {
+  return readOnlyBlocksKey.get(state)?.spec.isSuggesting?.() === true;
+}
+
+export function suggestingReadOnlyBlocksPlugin(isSuggesting: () => boolean) {
+  let cached: { doc: ProseMirrorNode; decorations: DecorationSet } | null =
+    null;
+  return new Plugin({
+    key: readOnlyBlocksKey,
+    isSuggesting,
+    filterTransaction: (transaction) =>
+      !isSuggesting() ||
+      !transaction.docChanged ||
+      !editsUnsupportedSuggestionNode(transaction),
+    props: {
+      decorations(state) {
+        if (!isSuggesting()) return null;
+        if (cached?.doc !== state.doc) {
+          cached = {
+            doc: state.doc,
+            decorations: DecorationSet.create(
+              state.doc,
+              unsupportedSuggestionRanges(state.doc).map(({ from, to }) =>
+                Decoration.node(from, to, { contenteditable: "false" }),
+              ),
+            ),
+          };
+        }
+        return cached.decorations;
+      },
+    },
+  });
+}
+
+export const SuggestingReadOnlyBlocks = Extension.create<{
+  isSuggesting: () => boolean;
+}>({
+  name: "suggestingReadOnlyBlocks",
+
+  addOptions() {
+    return { isSuggesting: () => false };
+  },
+
+  addProseMirrorPlugins() {
+    return [suggestingReadOnlyBlocksPlugin(this.options.isSuggesting)];
+  },
+});

package/corpus/templates/content/app/components/editor/table-view.ts

@@ -0,0 +1,73 @@
+import { TableView } from "@tiptap/extension-table";
+import type { Node as ProseMirrorNode } from "@tiptap/pm/model";
+import type { EditorView } from "@tiptap/pm/view";
+
+// The table's CSS keeps it at least as wide as the page, so this floor only
+// matters once unresized columns stop fitting: the table then scrolls inside
+// `.tableWrapper` instead of squeezing each column to a letter per line.
+// Tiptap's `cellMinWidth` stays small because it is also the drag minimum.
+export const READABLE_TABLE_COLUMN_MIN_WIDTH = 96;
+
+// Column drags rewrite the table's inline `min-width` on every frame, so the
+// floor lives in a custom property that the stylesheet enforces instead.
+export const READABLE_TABLE_MIN_WIDTH_PROPERTY = "--content-table-min-width";
+
+export function readableTableMinWidth(colgroup: HTMLElement): number | null {
+  let total = 0;
+  let hasUnsizedColumn = false;
+  for (const col of Array.from(colgroup.children)) {
+    const width = Number.parseFloat((col as HTMLElement).style.width);
+    if (width > 0) {
+      total += width;
+    } else {
+      total += READABLE_TABLE_COLUMN_MIN_WIDTH;
+      hasUnsizedColumn = true;
+    }
+  }
+  return hasUnsizedColumn ? total : null;
+}
+
+export class ContentTableView extends TableView {
+  // A column drag restyles the <col>s on every frame but writes the new width
+  // to the document only on release, so the floor follows the <col>s.
+  private readonly columnObserver = new MutationObserver(() =>
+    this.applyReadableMinWidth(),
+  );
+
+  constructor(
+    node: ProseMirrorNode,
+    cellMinWidth: number,
+    view?: EditorView,
+    HTMLAttributes: Record<string, unknown> = {},
+  ) {
+    super(node, cellMinWidth, view, HTMLAttributes);
+    this.applyReadableMinWidth();
+    this.columnObserver.observe(this.colgroup, {
+      attributeFilter: ["style"],
+      childList: true,
+      subtree: true,
+    });
+  }
+
+  override update(node: ProseMirrorNode) {
+    if (!super.update(node)) return false;
+    this.applyReadableMinWidth();
+    return true;
+  }
+
+  destroy() {
+    this.columnObserver.disconnect();
+  }
+
+  private applyReadableMinWidth() {
+    const minWidth = readableTableMinWidth(this.colgroup);
+    if (minWidth === null) {
+      this.table.style.removeProperty(READABLE_TABLE_MIN_WIDTH_PROPERTY);
+    } else {
+      this.table.style.setProperty(
+        READABLE_TABLE_MIN_WIDTH_PROPERTY,
+        `${minWidth}px`,
+      );
+    }
+  }
+}

package/corpus/templates/content/app/components/layout/ContentStartupShell.tsx

@@ -114,7 +114,7 @@ export function ContentStartupShell({
           <main className="agent-native-app-main relative flex min-w-0 min-h-0 flex-1 flex-col overflow-x-hidden">
             {contentStartupShowsPage(pathname) ? (
               <SidebarTriggerContext.Provider value={compactSidebarTrigger}>
-                <DocumentEditorSkeleton iconRow="startup" />
+                <DocumentEditorSkeleton iconRow="startup" shape="startup" />
               </SidebarTriggerContext.Provider>
             ) : null}
           </main>

package/corpus/templates/content/app/components/layout/Layout.tsx

@@ -38,8 +38,11 @@ import {
   applyRegisteredDocumentHistoryRestore,
   prepareRegisteredDocumentHistoryRestore,
 } from "@/lib/document-history-restore-controller";
-import { readPageIconRowHint } from "@/lib/page-icon-row-hint";
 import { retirePageOpenReads } from "@/lib/page-open-reads";
+import {
+  readPageIconRowHint,
+  readPageShapeHint,
+} from "@/lib/page-startup-hints";
 
 import { Header } from "./Header";
 import { isContentSettingsRoute } from "./settings-route-policy";
@@ -367,6 +370,7 @@ export function Layout({ children }: LayoutProps) {
                 <DocumentEditorSkeleton
                   title={pendingDocumentTitle}
                   iconRow={readPageIconRowHint(pendingDocumentId)}
+                  shape={readPageShapeHint(pendingDocumentId)}
                 />
               ) : (
                 children