@formicoidea/labre-core 0.46.2 → 0.47.1

package/dist/_pkgs/affine-block-surface/extensions/canvas-grid/commands.js

@@ -1,9 +1,10 @@
 import { CanvasGrid, TelemetryProvider } from '../../../affine-shared/services/index.js';
 /**
  * The canvas grid's two commands (ADR 0031 §11, §12), `owner: 'core'`, on the
- * palette and the agent. The library has no page "more" menu — that belongs
- * to the host — so these are the grid's whole UI here; a host puts them in
- * its own menu through `runCommand`.
+ * palette, the agent and the host's view menu (`'view-menu'`, ADR 0034
+ * amendment of 2026-10-13). The library has no page "more" menu — that
+ * belongs to the host — so these are the grid's whole UI here; a host lists
+ * them with `getViewActions` and runs them through `runCommand`.
  *
  * Both self-emit `CanvasGridToggled` (see the telemetry README): `scope` is
  * which gesture ran, and a save that changes nothing reports nothing.
@@ -27,11 +28,17 @@ const toggleGrid = {
     labelFallback: 'Show or hide the grid',
     descriptionKey: 'com.labre.command.canvas.grid.toggle.description',
     descriptionFallback: 'Show or hide the canvas grid on your screen only. Nothing changes for anyone else.',
+    category: 'display',
+    iconKey: 'canvas.grid',
     keywords: ['grid', 'dots', 'background'],
-    surfaces: ['palette', 'agent'],
+    surfaces: ['palette', 'agent', 'view-menu'],
+    order: 0,
     scope: 'edgeless',
     defaultKeys: { mac: [], other: [] },
     when: std => !!std.getOptional(CanvasGrid),
+    // What this viewer sees now. A signal read, so a menu that reads it inside
+    // an effect ticks and unticks with the grid, whoever flips it.
+    checked: std => std.getOptional(CanvasGrid)?.visible$.value ?? false,
     run: std => {
         const grid = std.getOptional(CanvasGrid);
         if (!grid)
@@ -51,13 +58,20 @@ const saveGridForEveryone = {
     labelKey: 'com.labre.command.canvas.grid.save-for-everyone',
     labelFallback: 'Save the grid for everyone',
     descriptionKey: 'com.labre.command.canvas.grid.save-for-everyone.description',
-    descriptionFallback: 'Make the grid as you see it now the setting of this document, for everyone who opens it.',
+    descriptionFallback: 'Make the grid as you see it now the setting of this page, for everyone who opens it.',
+    category: 'display',
     keywords: ['grid', 'dots', 'background', 'document'],
-    surfaces: ['palette', 'agent'],
+    surfaces: ['palette', 'agent', 'view-menu'],
+    order: 1,
     scope: 'edgeless',
     defaultKeys: { mac: [], other: [] },
     availability: 'editable',
-    when: std => !!std.getOptional(CanvasGrid),
+    // Offered once this viewer has a grid of their own (`source$` is
+    // `'local'`, i.e. after a toggle): that is what the gesture saves, and the
+    // follow-up the hosts' menus already showed after the toggle. A signal
+    // read, so a view menu read inside an effect shows the entry right after a
+    // toggle and drops it after the save.
+    when: std => std.getOptional(CanvasGrid)?.source$.value === 'local',
     run: std => {
         const saved = std.getOptional(CanvasGrid)?.saveForEveryone() ?? null;
         if (saved === null)

package/dist/_pkgs/affine-block-surface/extensions/export-manager/commands.d.ts

@@ -0,0 +1,2 @@
+import type { AnyCommandDescriptor } from '../../../std/index.js';
+export declare const canvasExportCommands: AnyCommandDescriptor[];

package/dist/_pkgs/affine-block-surface/extensions/export-manager/commands.js

@@ -0,0 +1,79 @@
+import { downloadBlob } from '../../../affine-shared/utils/index.js';
+import { ExportManager } from './export-manager.js';
+/**
+ * "Export as PNG" and "Export as PDF" of the canvas, in the command registry
+ * (ADR 0034, amendment of 2026-10-13). `owner: 'core'`: the picture is the
+ * canvas's, whatever drew on it.
+ *
+ * On the `'view-menu'` surface because the export is proper to the canvas
+ * VIEW (the host's "This view" section reads them through `getViewActions`),
+ * and on the palette. Not `'agent'`: an agent turn would drop a file on the
+ * user's disk they did not ask for.
+ *
+ * The library renders and the host decides where the bytes go: given
+ * `params.deliver` (`CommandFileParams`), the command hands the file over and
+ * downloads nothing — `runViewAction` passes one and returns the file. Without
+ * it (the palette, a bound chord) the command downloads the file itself, which
+ * is what a standalone editor needs. Nothing to draw, no file, no error.
+ *
+ * It READS, so there is no read-only guard: a reader exports what they see.
+ * No `telemetry` field, for `export.svg`'s reason — it names no framework —
+ * and usage is still measured by `runCommand`.
+ */
+function deliverOf(params) {
+    const deliver = params?.deliver;
+    return typeof deliver === 'function' ? deliver : undefined;
+}
+async function exportCanvas(std, render, params) {
+    const exporter = std.getOptional(ExportManager);
+    if (!exporter)
+        return;
+    const file = await render(exporter);
+    if (!file)
+        return;
+    const deliver = deliverOf(params);
+    if (deliver)
+        deliver(file);
+    else
+        downloadBlob(file.blob, file.filename);
+}
+const exportPng = {
+    id: 'canvas.export.png',
+    owner: 'core',
+    kind: 'action',
+    labelKey: 'com.labre.command.canvas.export.png',
+    labelFallback: 'Export as PNG',
+    descriptionKey: 'com.labre.command.canvas.export.png.description',
+    descriptionFallback: 'Download the whole canvas as an image, as you see it on your screen.',
+    category: 'export',
+    iconKey: 'canvas.export.png',
+    keywords: ['png', 'image', 'export', 'download', 'picture'],
+    surfaces: ['view-menu', 'palette'],
+    order: 10,
+    scope: 'edgeless',
+    defaultKeys: { mac: [], other: [] },
+    when: std => !!std.getOptional(ExportManager),
+    run: (std, _invocation, params) => exportCanvas(std, exporter => exporter.pngFile(), params),
+};
+const exportPdf = {
+    id: 'canvas.export.pdf',
+    owner: 'core',
+    kind: 'action',
+    labelKey: 'com.labre.command.canvas.export.pdf',
+    labelFallback: 'Export as PDF',
+    descriptionKey: 'com.labre.command.canvas.export.pdf.description',
+    descriptionFallback: 'Download the whole canvas as a one-page PDF holding its image.',
+    category: 'export',
+    iconKey: 'canvas.export.pdf',
+    keywords: ['pdf', 'export', 'download', 'print'],
+    surfaces: ['view-menu', 'palette'],
+    order: 11,
+    scope: 'edgeless',
+    defaultKeys: { mac: [], other: [] },
+    when: std => !!std.getOptional(ExportManager),
+    run: (std, _invocation, params) => exportCanvas(std, exporter => exporter.pdfFile(), params),
+};
+export const canvasExportCommands = [
+    exportPng,
+    exportPdf,
+];

package/dist/_pkgs/affine-block-surface/extensions/export-manager/export-manager.d.ts

@@ -1,5 +1,5 @@
 import type { IBound } from '../../../global/gfx/index.js';
-import { type BlockStdScope, type EditorHost } from '../../../std/index.js';
+import { type BlockStdScope, type CommandFile, type EditorHost } from '../../../std/index.js';
 import { GfxBlockElementModel, type GfxController, GfxPrimitiveElementModel } from '../../../std/gfx/index.js';
 import type { ExtensionType, Store } from '../../../store/index.js';
 import { CanvasRenderer } from '../../renderer/canvas-renderer.js';
@@ -39,7 +39,24 @@ export declare class ExportManager {
     edgelessToCanvas(surfaceRenderer: CanvasRenderer, bound: IBound, gfx: GfxController, blocks?: GfxBlockElementModel[], elements?: GfxPrimitiveElementModel[], edgelessBackground?: {
         zoom: number;
     }): Promise<HTMLCanvasElement | undefined>;
+    /**
+     * The canvas (or, in page mode, the document) as a PNG file, or `null` when
+     * there is nothing to draw. Renders, never downloads: the caller decides
+     * where the bytes go (`canvas.export.png` hands them to a host, or to the
+     * browser).
+     */
+    pngFile(): Promise<CommandFile | null>;
+    /**
+     * The same picture in a one-page PDF (`pdf-lib`, loaded on demand), or
+     * `null` when there is nothing to draw. The PDF is an image: its text is
+     * not selectable.
+     */
+    pdfFile(): Promise<CommandFile | null>;
+    /** Render, then hand the file to the browser. Nothing to draw, no file. */
     exportPdf(): Promise<void>;
+    /** Render, then hand the file to the browser. Nothing to draw, no file. */
     exportPng(): Promise<void>;
+    /** The document title, sanitised; the translated "Untitled" without one. */
+    private _fileStem;
 }
 export declare const ExportManagerExtension: ExtensionType;

package/dist/_pkgs/affine-block-surface/extensions/export-manager/export-manager.js

@@ -2,14 +2,13 @@ import { ImageBlockModel } from '../../../affine-model/index.js';
 import { FetchUtils, ImageProxyService } from '../../../affine-shared/adapters/index.js';
 import { CANVAS_EXPORT_IGNORE_TAGS } from '../../../affine-shared/consts/index.js';
 import { CanvasGrid, CHROME_UNTITLED, translateKey, } from '../../../affine-shared/services/index.js';
-import { isInsidePageEditor, matchModels, normalizeCanvasExportColors, toLegacyColors, } from '../../../affine-shared/utils/index.js';
+import { downloadBlob, isInsidePageEditor, matchModels, normalizeCanvasExportColors, safeFilename, toLegacyColors, } from '../../../affine-shared/utils/index.js';
 import { BlockSuiteError, ErrorCode } from '../../../global/exceptions/index.js';
 import { deserializeXYWH } from '../../../global/gfx/index.js';
 import { StdIdentifier, } from '../../../std/index.js';
 import { GfxBlockElementModel, GfxControllerIdentifier, GfxPrimitiveElementModel, isGfxGroupCompatibleModel, } from '../../../std/gfx/index.js';
 import { CanvasRenderer } from '../../renderer/canvas-renderer.js';
 import { getBgGridGap } from '../../utils/get-bg-grip-gap.js';
-import { FileExporter } from './file-exporter.js';
 /**
  * The SVG the PNG export paints the canvas background from: the background
  * colour, plus the dotted grid unless `gridColor` is `null` — what this
@@ -379,38 +378,62 @@ export class ExportManager {
         ctx.drawImage(surfaceCanvas, 50, 50, bound.w, bound.h);
         return canvas;
     }
-    async exportPdf() {
-        const rootModel = this.doc.root;
-        if (!rootModel)
-            return;
-        const canvasImage = await this._toCanvas();
-        if (!canvasImage) {
-            return;
-        }
+    /**
+     * The canvas (or, in page mode, the document) as a PNG file, or `null` when
+     * there is nothing to draw. Renders, never downloads: the caller decides
+     * where the bytes go (`canvas.export.png` hands them to a host, or to the
+     * browser).
+     */
+    async pngFile() {
+        if (!this.doc.root)
+            return null;
+        const canvas = await this._toCanvas();
+        if (!canvas)
+            return null;
+        const blob = await new Promise(resolve => canvas.toBlob(resolve, 'image/png'));
+        if (!blob)
+            return null;
+        return { blob, filename: `${this._fileStem()}.png` };
+    }
+    /**
+     * The same picture in a one-page PDF (`pdf-lib`, loaded on demand), or
+     * `null` when there is nothing to draw. The PDF is an image: its text is
+     * not selectable.
+     */
+    async pdfFile() {
+        if (!this.doc.root)
+            return null;
+        const canvas = await this._toCanvas();
+        if (!canvas)
+            return null;
         const PDFLib = await import('pdf-lib');
         const pdfDoc = await PDFLib.PDFDocument.create();
-        const page = pdfDoc.addPage([canvasImage.width, canvasImage.height]);
-        const imageEmbed = await pdfDoc.embedPng(canvasImage.toDataURL('PNG'));
-        const { width, height } = imageEmbed.scale(1);
-        page.drawImage(imageEmbed, {
-            x: 0,
-            y: 0,
-            width,
-            height,
-        });
-        const pdfBase64 = await pdfDoc.saveAsBase64({ dataUri: true });
-        FileExporter.exportFile(rootModel.props.title.toString() + '.pdf', pdfBase64);
+        const page = pdfDoc.addPage([canvas.width, canvas.height]);
+        const image = await pdfDoc.embedPng(canvas.toDataURL('image/png'));
+        const { width, height } = image.scale(1);
+        page.drawImage(image, { x: 0, y: 0, width, height });
+        const bytes = await pdfDoc.save();
+        return {
+            blob: new Blob([bytes], { type: 'application/pdf' }),
+            filename: `${this._fileStem()}.pdf`,
+        };
     }
+    /** Render, then hand the file to the browser. Nothing to draw, no file. */
+    async exportPdf() {
+        const file = await this.pdfFile();
+        if (file)
+            downloadBlob(file.blob, file.filename);
+    }
+    /** Render, then hand the file to the browser. Nothing to draw, no file. */
     async exportPng() {
-        const rootModel = this.doc.root;
-        if (!rootModel)
-            return;
-        const canvasImage = await this._toCanvas();
-        if (!canvasImage) {
-            return;
-        }
-        const title = this.doc.root.props.title.toString();
-        FileExporter.exportPng(title.trim() || translateKey(this.std, ...CHROME_UNTITLED), canvasImage.toDataURL('image/png'));
+        const file = await this.pngFile();
+        if (file)
+            downloadBlob(file.blob, file.filename);
+    }
+    /** The document title, sanitised; the translated "Untitled" without one. */
+    _fileStem() {
+        const root = this.doc.root;
+        return safeFilename(root?.props.title.toString(), translateKey(this.std, ...CHROME_UNTITLED));
     }
 }
 export const ExportManagerExtension = {

package/dist/_pkgs/affine-block-surface/extensions/export-manager/index.d.ts

@@ -1 +1,2 @@
+export { canvasExportCommands } from './commands.js';
 export { ExportManager, ExportManagerExtension } from './export-manager.js';

package/dist/_pkgs/affine-block-surface/extensions/export-manager/index.js

@@ -1 +1,2 @@
+export { canvasExportCommands } from './commands.js';
 export { ExportManager, ExportManagerExtension } from './export-manager.js';

package/dist/_pkgs/affine-block-surface/extensions/interchange-import.js

@@ -292,7 +292,7 @@ const IMPORT_DEFAULT_NAME_FALLBACK = 'Imported diagram';
  * because nothing is wrong with the FILE.
  */
 const IMPORT_READONLY_KEY = 'com.labre.interchange.import.readonly';
-const IMPORT_READONLY_FALLBACK = 'This document became read-only while the file was being read, so nothing was imported.';
+const IMPORT_READONLY_FALLBACK = 'This page became read-only while the file was being read, so nothing was imported.';
 const IMPORT_REMARKS_KEY = 'com.labre.interchange.import.remarks';
 const IMPORT_REMARKS_FALLBACK = 'What the import could not keep as it was';
 const IMPORT_CONSOLE_KEY = 'com.labre.interchange.import.console';

package/dist/_pkgs/affine-block-surface/extensions/selection-pane/commands.js

@@ -293,7 +293,7 @@ const hideForEveryone = {
     labelKey: 'com.labre.command.canvas.visibility.hide-for-everyone',
     labelFallback: 'Hide for everyone',
     descriptionKey: 'com.labre.command.canvas.visibility.hide-for-everyone.description',
-    descriptionFallback: 'Hide the selected elements for everyone who opens this document. They stay in the document and in the selection pane.',
+    descriptionFallback: 'Hide the selected elements for everyone who opens this page. They stay in the page and in the selection pane.',
     surfaces: ['palette', 'agent'],
     scope: 'edgeless',
     defaultKeys: { mac: [], other: [] },

package/dist/_pkgs/affine-block-surface/renderer/element-highlight-overlay.d.ts

@@ -1,8 +1,14 @@
 import type { GfxController } from '../../std/gfx/index.js';
 import { Overlay } from './overlay.js';
 /**
- * Draws the transient emphasis ring around the elements held by
- * `gfx.highlight` (`ElementHighlightManager`).
+ * Draws the transient emphasis around the elements held by `gfx.highlight`
+ * (`ElementHighlightManager`).
+ *
+ * The emphasis is the canvas's existing vocabulary, a square border on the
+ * element's bounds like the selection frame (`edgeless-selected-rect`), not a
+ * second, detached ring: the product owner asked for the border alone after
+ * the P1 recette, so a selection-pane hover reads as « this one » and not as a
+ * new kind of mark.
  *
  * The overlay is a pure renderer: it owns no state, reads nothing from the
  * store and mutates nothing, which makes it safe on a read-only editor.

package/dist/_pkgs/affine-block-surface/renderer/element-highlight-overlay.js

@@ -2,15 +2,17 @@ import { getChromeAccentColor } from '../../affine-shared/services/index.js';
 import { DisposableGroup } from '../../global/disposable/index.js';
 import { effect } from '@preact/signals-core';
 import { Overlay } from './overlay.js';
-/** Ring thickness, in screen pixels. */
+/** Border thickness, in screen pixels: the selection frame's. */
 const HIGHLIGHT_STROKE_WIDTH = 2;
-/** Gap between the element bounds and the ring, in screen pixels. */
-const HIGHLIGHT_GAP = 4;
-/** Ring corner radius, in screen pixels. */
-const HIGHLIGHT_RADIUS = 4;
 /**
- * Draws the transient emphasis ring around the elements held by
- * `gfx.highlight` (`ElementHighlightManager`).
+ * Draws the transient emphasis around the elements held by `gfx.highlight`
+ * (`ElementHighlightManager`).
+ *
+ * The emphasis is the canvas's existing vocabulary, a square border on the
+ * element's bounds like the selection frame (`edgeless-selected-rect`), not a
+ * second, detached ring: the product owner asked for the border alone after
+ * the P1 recette, so a selection-pane hover reads as « this one » and not as a
+ * new kind of mark.
  *
  * The overlay is a pure renderer: it owns no state, reads nothing from the
  * store and mutates nothing, which makes it safe on a read-only editor.
@@ -37,8 +39,6 @@ export class ElementHighlightOverlay extends Overlay {
         if (elements.length === 0)
             return;
         const { zoom } = this.gfx.viewport;
-        const gap = HIGHLIGHT_GAP / zoom;
-        const radius = HIGHLIGHT_RADIUS / zoom;
         ctx.save();
         ctx.strokeStyle = this._strokeColor;
         ctx.lineWidth = HIGHLIGHT_STROKE_WIDTH / zoom;
@@ -46,14 +46,12 @@ export class ElementHighlightOverlay extends Overlay {
             const [x, y, w, h] = element.deserializedXYWH;
             ctx.save();
             // Rotate around the element center so rotated elements keep a tight
-            // ring; connectors and other non-rotatable elements use their bound box.
+            // border; connectors and other non-rotatable elements use their bound box.
             ctx.translate(x + w / 2, y + h / 2);
             if (element.rotate) {
                 ctx.rotate((element.rotate * Math.PI) / 180);
             }
-            ctx.beginPath();
-            ctx.roundRect(-w / 2 - gap, -h / 2 - gap, w + gap * 2, h + gap * 2, radius);
-            ctx.stroke();
+            ctx.strokeRect(-w / 2, -h / 2, w, h);
             ctx.restore();
         }
         ctx.restore();

package/dist/_pkgs/affine-block-surface/view.js

@@ -1,9 +1,10 @@
+import { ExportToPdfIcon, ExportToPngIcon, GridIcon, } from '@blocksuite/icons/lit';
 import { ViewExtensionProvider, } from '../affine-ext-loader/index.js';
 import { CanvasGrid, CanvasLocalVisibility, } from '../affine-shared/services/index.js';
 import { BlockViewExtension, CommandExtension, FlavourExtension, } from '../std/index.js';
 import { literal } from 'lit/static-html.js';
 import { effects } from './effects.js';
-import { auditCommands, CanvasActiveLayer, canvasGridCommands, EdgelessCRUDExtension, EdgelessLegacySlotExtension, EditPropsMiddlewareBuilder, exportSvgCommands, exportSvgToolbarExtension, mapQualityCommands, mapQualityWidget, ReadingManager, readingProposalWidget, readingToolbarExtension, selectionPaneCommands, SelectionPaneModel, SpotlightManager, UserLayerMiddlewareBuilder, userLayerCommands, ValidationManager, validationExceptionToolbarExtension, ValidationOverlay, violationDetailWidget, } from './extensions/index.js';
+import { auditCommands, CanvasActiveLayer, canvasExportCommands, canvasGridCommands, EdgelessCRUDExtension, EdgelessLegacySlotExtension, EditPropsMiddlewareBuilder, exportSvgCommands, exportSvgToolbarExtension, mapQualityCommands, mapQualityWidget, ReadingManager, readingProposalWidget, readingToolbarExtension, selectionPaneCommands, SelectionPaneModel, SpotlightManager, UserLayerMiddlewareBuilder, userLayerCommands, ValidationManager, validationExceptionToolbarExtension, ValidationOverlay, violationDetailWidget, } from './extensions/index.js';
 import { ExportManagerExtension } from './extensions/export-manager/export-manager.js';
 import { BackgroundStackingExtension } from './framework-background/stacking.js';
 import { ElementHighlightOverlay } from './renderer/element-highlight-overlay.js';
@@ -87,7 +88,15 @@ export class SurfaceViewExtension extends ViewExtensionProvider {
             // the edgeless root's background, the surface container and the PNG
             // export; previews follow the document setting alone.
             context.register(CanvasGrid);
-            context.register(CommandExtension(canvasGridCommands));
+            context.register(CommandExtension(canvasGridCommands, { 'canvas.grid': GridIcon() }));
+            // The canvas's PNG and PDF export (ADR 0034, amendment of 2026-10-13):
+            // the "This view" entries a host lists with `getViewActions`. Edgeless
+            // only — the page-mode export was never offered — and never gated: a
+            // picture of what is on the canvas is not a framework's tooling.
+            context.register(CommandExtension(canvasExportCommands, {
+                'canvas.export.png': ExportToPngIcon(),
+                'canvas.export.pdf': ExportToPdfIcon(),
+            }));
             // User layers (ADR 0031 §2-§6): the viewer's active layer (session
             // only), the `beforeAdd` middleware that stamps it on what is created,
             // and the commands the pane's layer rows run. Content, never gated.

package/dist/_pkgs/affine-block-surface-ref/translations.js

@@ -94,35 +94,35 @@ export const SURFACE_REF_PLACEHOLDER_NOT_AVAILABLE = [
  */
 export const SURFACE_REF_PLACEHOLDER_DELETED_FRAME = [
     'com.labre.surface-ref.placeholder.deleted.frame',
-    'The frame is deleted or not in this doc.',
+    'The frame is deleted or not in this page.',
 ];
 export const SURFACE_REF_PLACEHOLDER_DELETED_GROUP = [
     'com.labre.surface-ref.placeholder.deleted.group',
-    'The group is deleted or not in this doc.',
+    'The group is deleted or not in this page.',
 ];
 export const SURFACE_REF_PLACEHOLDER_DELETED_MINDMAP = [
     'com.labre.surface-ref.placeholder.deleted.mindmap',
-    'The mind map is deleted or not in this doc.',
+    'The mind map is deleted or not in this page.',
 ];
 export const SURFACE_REF_PLACEHOLDER_DELETED_EDGELESS = [
     'com.labre.surface-ref.placeholder.deleted.edgeless',
-    'The canvas content is deleted or not in this doc.',
+    'The canvas content is deleted or not in this page.',
 ];
 export const SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_FRAME = [
     'com.labre.surface-ref.placeholder.cannot-display.frame',
-    'The frame is inserted but cannot display in canvas mode. Switch to document mode to view the block.',
+    'The frame is inserted but cannot display in canvas mode. Switch to page mode to view the block.',
 ];
 export const SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_GROUP = [
     'com.labre.surface-ref.placeholder.cannot-display.group',
-    'The group is inserted but cannot display in canvas mode. Switch to document mode to view the block.',
+    'The group is inserted but cannot display in canvas mode. Switch to page mode to view the block.',
 ];
 export const SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_MINDMAP = [
     'com.labre.surface-ref.placeholder.cannot-display.mindmap',
-    'The mind map is inserted but cannot display in canvas mode. Switch to document mode to view the block.',
+    'The mind map is inserted but cannot display in canvas mode. Switch to page mode to view the block.',
 ];
 export const SURFACE_REF_PLACEHOLDER_CANNOT_DISPLAY_EDGELESS = [
     'com.labre.surface-ref.placeholder.cannot-display.edgeless',
-    'The canvas content is inserted but cannot display in canvas mode. Switch to document mode to view the block.',
+    'The canvas content is inserted but cannot display in canvas mode. Switch to page mode to view the block.',
 ];
 /**
  * Per-kind table joining the two placeholder sentences above to the

package/dist/_pkgs/affine-components/translations.js

@@ -117,7 +117,7 @@ export const EMBED_CARD_TITLE_ALIAS_PLACEHOLDER = [
 ];
 export const EMBED_CARD_DESCRIPTION_ALIAS_PLACEHOLDER = [
     'com.labre.embed.card.description-alias-placeholder',
-    'Add description alias (empty to inherit document content)',
+    'Add description alias (empty to inherit page content)',
 ];
 export const EMBED_CARD_TITLE_PLACEHOLDER = [
     'com.labre.embed.card.title-placeholder',
@@ -292,7 +292,7 @@ export const EMOJI_GROUP_WORDINGS = {
 /* ── Linked doc title chip ───────────────────────────────────────────── */
 export const DOC_TITLE_ARIA = [
     'com.labre.linked-doc.title-aria',
-    'Doc title',
+    'Page title',
 ];
 /* ── Linked-doc notifications ─────────────────────────────────────────── */
 export const NOTIFY_SWITCHED_TO_CARD_TITLE = [
@@ -309,7 +309,7 @@ export const NOTIFY_SWITCHED_TO_EMBED_TITLE = [
 ];
 export const NOTIFY_SWITCHED_TO_EMBED_MESSAGE = [
     'com.labre.notify.linked-doc.switched-to-embed.message',
-    'Custom alias removed. The linked doc now displays the original title and description.',
+    'Custom alias removed. The linked page now displays the original title and description.',
 ];
 export const NOTIFY_CLEARED_ALIASES_TITLE = [
     'com.labre.notify.linked-doc.cleared-aliases.title',
@@ -317,17 +317,17 @@ export const NOTIFY_CLEARED_ALIASES_TITLE = [
 ];
 export const NOTIFY_CLEARED_ALIASES_MESSAGE = [
     'com.labre.notify.linked-doc.cleared-aliases.message',
-    'Card view has been restored to original doc title and description. All custom aliases have been removed.',
+    'Card view has been restored to original page title and description. All custom aliases have been removed.',
 ];
 /* ── Open-doc dropdown ────────────────────────────────────────────────── */
 export const OPEN_LABEL = ['com.labre.open-doc.open', 'Open'];
 export const OPEN_DOC_MENU_ARIA = [
     'com.labre.open-doc.menu-aria',
-    'Open doc menu',
+    'Open page menu',
 ];
 export const OPEN_DOC_WITH_ARIA = [
     'com.labre.open-doc.with-aria',
-    'Open doc with',
+    'Open page with',
 ];
 /* ── Resource popover (attachment / image not-found or retrieve error) ─ */
 /**

package/dist/_pkgs/affine-fragment-doc-title/doc-title.d.ts

@@ -13,6 +13,14 @@ export declare class DocTitle extends DocTitle_base {
     get inlineEditor(): import("../affine-shared/types/index.js").AffineInlineEditor | null;
     get inlineEditorContainer(): HTMLDivElement;
     connectedCallback(): void;
+    /**
+     * The `std` the title band reads its seams from, when the band belongs
+     * here: in the page view, never inside a note on the canvas, where
+     * `edgeless-page-block-title` draws the band itself (ADR 0035 §11), so a
+     * host that renders this title in the note header does not get two.
+     */
+    private get _bandStd();
+    firstUpdated(): void;
     render(): import("lit-html").TemplateResult<1>;
     private accessor _isComposing;
     private accessor _isReadonly;

package/dist/_pkgs/affine-fragment-doc-title/doc-title.js

@@ -34,12 +34,12 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
 };
 import { CodeBlockModel, ListBlockModel, NoteBlockModel, NoteDisplayMode, ParagraphBlockModel, } from '../affine-model/index.js';
 import { focusTextModel } from '../affine-rich-text/index.js';
-import { translateKey } from '../affine-shared/services/index.js';
+import { TitleBandProvider, translateKey } from '../affine-shared/services/index.js';
 import { matchModels } from '../affine-shared/utils/index.js';
 import { WithDisposable } from '../global/lit/index.js';
 import { ShadowlessElement } from '../std/index.js';
 import { effect } from '@preact/signals-core';
-import { css, html } from 'lit';
+import { css, html, nothing } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
 import { DOC_TITLE_PLACEHOLDER } from './translations.js';
 const DOC_BLOCK_CHILD_PADDING = 24;
@@ -76,9 +76,18 @@ let DocTitle = (() => {
             if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
         static { this.styles = css `
+    /*
+     * The page title's family is a host's to choose (labre ADR-0049 §5: the
+     * Labre app sets Cabinet Grotesk); headings H1 to H6 stay in the body
+     * family. Unset, the title keeps the body family, DESIGN.md's One Family
+     * Rule.
+     */
     .doc-title-container {
       box-sizing: border-box;
-      font-family: var(--affine-font-family);
+      font-family: var(
+        --labre-doc-title-font-family,
+        var(--affine-font-family)
+      );
       font-size: var(--affine-font-base);
       line-height: var(--affine-line-height);
       color: var(--affine-text-primary-color);
@@ -112,6 +121,27 @@ let DocTitle = (() => {
       }
     }
 
+    .doc-title-container.doc-title-container-with-band {
+      padding-bottom: 8px;
+    }
+
+    .doc-title-band {
+      box-sizing: border-box;
+      width: 100%;
+      max-width: var(--affine-editor-width);
+      margin-left: auto;
+      margin-right: auto;
+      padding: 0 var(--affine-editor-side-padding, ${DOC_BLOCK_CHILD_PADDING}px)
+        24px;
+    }
+
+    @container viewport (width <= 640px) {
+      .doc-title-band {
+        padding-left: ${DOC_BLOCK_CHILD_PADDING}px;
+        padding-right: ${DOC_BLOCK_CHILD_PADDING}px;
+      }
+    }
+
     .doc-title-container-empty::before {
       content: attr(data-placeholder);
       color: var(--affine-placeholder-color);
@@ -178,13 +208,35 @@ let DocTitle = (() => {
                 });
             }
         }
+        /**
+         * The `std` the title band reads its seams from, when the band belongs
+         * here: in the page view, never inside a note on the canvas, where
+         * `edgeless-page-block-title` draws the band itself (ADR 0035 §11), so a
+         * host that renders this title in the note header does not get two.
+         */
+        get _bandStd() {
+            if (this.closest('edgeless-page-block-title'))
+                return null;
+            const std = this._std;
+            return std?.getOptional(TitleBandProvider) ? std : null;
+        }
+        firstUpdated() {
+            // `<doc-title>` sits beside the editor host, not inside it: on the first
+            // frame the host may not carry its `std` yet, and without one the band
+            // cannot read its seam. One more render once it has mounted.
+            if (this._std)
+                return;
+            const frame = requestAnimationFrame(() => this.requestUpdate());
+            this._disposables.add(() => cancelAnimationFrame(frame));
+        }
         render() {
             const isEmpty = !this._rootModel?.props.title.length && !this._isComposing;
+            const bandStd = this._bandStd;
             return html `
       <div
         class="doc-title-container ${isEmpty
                 ? 'doc-title-container-empty'
-                : ''}"
+                : ''} ${bandStd ? 'doc-title-container-with-band' : ''}"
         data-block-is-title="true"
         data-placeholder=${this._placeholder}
       >
@@ -197,6 +249,15 @@ let DocTitle = (() => {
           .wrapText=${this.wrapText}
         ></rich-text>
       </div>
+      ${bandStd
+                ? html `<div class="doc-title-band">
+            <labre-title-band
+              .std=${bandStd}
+              .docId=${this.doc.id}
+              .surface=${'page'}
+            ></labre-title-band>
+          </div>`
+                : nothing}
     `;
         }
         #_isComposing_accessor_storage;

package/dist/_pkgs/affine-fragment-doc-title/effects.d.ts

@@ -1,7 +1,9 @@
 import { DocTitle } from './doc-title.js';
+import { LABRE_TITLE_BAND, TitleBand } from './title-band/title-band.js';
 export declare function effects(): void;
 declare global {
     interface HTMLElementTagNameMap {
         'doc-title': DocTitle;
+        [LABRE_TITLE_BAND]: TitleBand;
     }
 }