@formicoidea/labre-core 0.58.0 → 0.59.0

package/dist/_pkgs/affine-gfx-template/builtin/slides/build.d.ts

@@ -0,0 +1,81 @@
+import type { BlockStdScope } from '../../../std/index.js';
+import { type SurfaceChildBlockJSON, type SurfaceElementsJSON } from '../../make-snapshot.js';
+import { type SlideTextRole } from './consts.js';
+import type { SlideMask } from './masks.js';
+/**
+ * The one builder of the slide masks: a mask declaration (`masks.ts`) in, a
+ * template snapshot (one 1600 x 900 frame and the elements it holds) and a
+ * tile preview out. Nothing here knows a particular mask.
+ */
+/** The map key of the slide number, the LAST element of every mask. */
+export declare const SLIDE_NUMBER_KEY = "number";
+/** The map key of the footer line. */
+export declare const SLIDE_FOOTER_KEY = "footer";
+/** A text box's height for the lines it is sized for. */
+export declare function slideTextHeight(role: SlideTextRole, lines?: number): number;
+/** The elements of one mask, footer and slide number last, in paint order. */
+export declare function slideElements(mask: SlideMask, std?: BlockStdScope): SurfaceElementsJSON;
+/** The template content of one mask: a page, its surface, the frame. */
+export declare function slideSnapshot(mask: SlideMask, std?: BlockStdScope): {
+    type: string;
+    meta: {
+        id: string;
+        title: string;
+        createDate: number;
+        tags: never[];
+    };
+    blocks: {
+        type: string;
+        id: string;
+        flavour: string;
+        props: {
+            title: {
+                '$blocksuite:internal:text$': boolean;
+                delta: {
+                    insert: string;
+                }[];
+            };
+        };
+        children: {
+            type: string;
+            id: string;
+            flavour: string;
+            props: {
+                elements: SurfaceElementsJSON;
+            };
+            children: SurfaceChildBlockJSON[];
+        }[];
+    };
+};
+/**
+ * Write the slide number once, at placement: the inserted frame's rank among
+ * the document's frames in presentation order (`presentationIndex`, the
+ * legacy frames without one after the keyed ones, as the frame manager
+ * orders them). Later reordering does not renumber: the number is the
+ * author's text from then on.
+ *
+ * ponytail: the template snapshot carries no `presentationIndex`, so the
+ * inserted frame takes the schema default, `generateKeyBetweenV2(null,
+ * null)`, whose random suffix ranks it anywhere among the frames: the number
+ * is the frame's true rank, but that rank is arbitrary until the template
+ * job's `presentationIndex` middleware (a key after the last frame) lands,
+ * after which the new slide is always last. Nothing here changes then.
+ */
+export declare function numberSlide(std: BlockStdScope, insertedIds: string[]): void;
+/** The fields of a frame the slide number is ranked by. */
+type RankedFrame = {
+    props: {
+        presentationIndex?: string;
+    };
+};
+/** A frame's 1-based rank among `frames`; ties count as before it. */
+export declare function slideNumberOf<T extends RankedFrame>(own: T, frames: T[]): number;
+/**
+ * The tile: the slide itself, drawn from its own declaration at 1/10th, so a
+ * preview can never drift from what the mask inserts. Texts are bars, the
+ * light side of every colour is used (a tile is chrome on the panel's own
+ * paper), and the slide gets a hairline so a white slide shows on a white
+ * panel.
+ */
+export declare function slidePreview(mask: SlideMask): string;
+export {};

package/dist/_pkgs/affine-gfx-template/builtin/slides/build.js

@@ -0,0 +1,276 @@
+import { ColorScheme, ConnectorMode, FontFamily, PointStyle, resolveColor, ShapeStyle, StrokeStyle, TextAlign, } from '../../../affine-model/index.js';
+import { GfxControllerIdentifier } from '../../../std/gfx/index.js';
+import * as Y from 'yjs';
+import { makeTemplateSnapshot, surfaceText, } from '../../make-snapshot.js';
+import { SLIDE_SEED_FOOTER, SLIDE_SEED_IMAGE } from '../../translations.js';
+import { tr } from '../other.js';
+import { SLIDE_FOOTER_Y, SLIDE_HAIRLINE_WIDTH, SLIDE_HEIGHT, SLIDE_LINE_HEIGHT, SLIDE_MARGIN, SLIDE_PALETTES, SLIDE_RADIUS, SLIDE_TYPE, SLIDE_WIDTH, SLIDE_ZONE_STROKE_WIDTH, } from './consts.js';
+/**
+ * The one builder of the slide masks: a mask declaration (`masks.ts`) in, a
+ * template snapshot (one 1600 x 900 frame and the elements it holds) and a
+ * tile preview out. Nothing here knows a particular mask.
+ */
+/** The map key of the slide number, the LAST element of every mask. */
+export const SLIDE_NUMBER_KEY = 'number';
+/** The map key of the footer line. */
+export const SLIDE_FOOTER_KEY = 'footer';
+const xywh = (x, y, w, h) => `[${x},${y},${w},${h}]`;
+/** A text box's height for the lines it is sized for. */
+export function slideTextHeight(role, lines = 1) {
+    return Math.ceil(lines * SLIDE_TYPE[role].fontSize * SLIDE_LINE_HEIGHT);
+}
+const ALIGN = {
+    left: TextAlign.Left,
+    center: TextAlign.Center,
+    right: TextAlign.Right,
+};
+function textElement(zone, words, palette) {
+    const type = SLIDE_TYPE[zone.role];
+    return {
+        type: 'text',
+        text: surfaceText(words),
+        color: zone.tone === 'muted' ? palette.muted : palette.ink,
+        fontFamily: FontFamily.Inter,
+        fontSize: type.fontSize,
+        fontWeight: type.fontWeight,
+        textAlign: ALIGN[zone.align ?? 'left'],
+        hasMaxWidth: true,
+        xywh: xywh(zone.x, zone.y, zone.w, slideTextHeight(zone.role, zone.lines)),
+    };
+}
+function shapeElement(x, y, w, h, opts) {
+    const element = {
+        type: 'shape',
+        shapeType: opts.shapeType,
+        filled: opts.fill !== null,
+        fillColor: opts.fill ?? SLIDE_PALETTES.paper.paper,
+        strokeColor: opts.stroke,
+        strokeWidth: opts.dash ? SLIDE_ZONE_STROKE_WIDTH : SLIDE_HAIRLINE_WIDTH,
+        strokeStyle: opts.dash ? StrokeStyle.Dash : StrokeStyle.Solid,
+        shapeStyle: ShapeStyle.General,
+        roughness: 0,
+        radius: opts.shapeType === 'rect' ? opts.radius : 0,
+        xywh: xywh(x, y, w, h),
+    };
+    if (opts.label !== undefined) {
+        const type = SLIDE_TYPE[opts.labelRole ?? 'caption'];
+        element.text = surfaceText(opts.label);
+        element.color = opts.labelColor;
+        element.fontFamily = FontFamily.Inter;
+        element.fontSize = type.fontSize;
+        element.fontWeight = type.fontWeight;
+        element.textAlign = TextAlign.Center;
+    }
+    return element;
+}
+/** A fill zone touching the frame's edge bleeds: no rounded corner there. */
+function bleeds(zone) {
+    return (zone.x <= 0 ||
+        zone.y <= 0 ||
+        zone.x + zone.w >= SLIDE_WIDTH ||
+        zone.y + zone.h >= SLIDE_HEIGHT);
+}
+function zoneElement(zone, palette, std) {
+    switch (zone.kind) {
+        case 'text':
+            return textElement(zone, zone.seed ? tr(std, zone.seed, zone.params) : (zone.digits ?? ''), palette);
+        case 'image':
+            return shapeElement(zone.x, zone.y, zone.w, zone.h, {
+                shapeType: zone.shape ?? 'rect',
+                fill: palette.hairline,
+                stroke: palette.zoneStroke,
+                dash: true,
+                radius: bleeds(zone) ? 0 : SLIDE_RADIUS,
+                label: tr(std, zone.label ?? SLIDE_SEED_IMAGE),
+                labelRole: 'body',
+                labelColor: palette.ink,
+            });
+        case 'card':
+            return shapeElement(zone.x, zone.y, zone.w, zone.h, {
+                shapeType: zone.shape ?? 'rect',
+                fill: zone.filled ? palette.hairline : null,
+                stroke: zone.stroke === 'muted' ? palette.muted : palette.hairline,
+                dash: false,
+                radius: SLIDE_RADIUS,
+                label: zone.label ? tr(std, zone.label, zone.params) : undefined,
+                labelRole: 'body',
+                labelColor: palette.ink,
+            });
+        case 'dot':
+            return shapeElement(zone.x, zone.y, zone.size, zone.size, {
+                shapeType: 'ellipse',
+                fill: palette.ink,
+                stroke: palette.ink,
+                dash: false,
+                radius: 0,
+            });
+        case 'line':
+            return {
+                type: 'connector',
+                mode: ConnectorMode.Straight,
+                stroke: palette.muted,
+                strokeWidth: SLIDE_HAIRLINE_WIDTH,
+                strokeStyle: StrokeStyle.Solid,
+                frontEndpointStyle: PointStyle.None,
+                rearEndpointStyle: zone.arrow ? PointStyle.Triangle : PointStyle.None,
+                source: { position: zone.from },
+                target: { position: zone.to },
+            };
+    }
+}
+/** The elements of one mask, footer and slide number last, in paint order. */
+export function slideElements(mask, std) {
+    const palette = SLIDE_PALETTES[mask.variant];
+    const elements = {};
+    mask.zones.forEach((zone, i) => {
+        elements[`z${i}`] = zoneElement(zone, palette, std);
+    });
+    const footerWidth = 800;
+    const numberWidth = 200;
+    elements[SLIDE_FOOTER_KEY] = textElement({
+        kind: 'text',
+        role: 'caption',
+        x: SLIDE_MARGIN,
+        y: SLIDE_FOOTER_Y,
+        w: footerWidth,
+        tone: 'muted',
+    }, tr(std, SLIDE_SEED_FOOTER), palette);
+    // The digits are rewritten at placement by `numberSlide`; "1" is what a
+    // copy shows before (and what `content`, the English build, carries).
+    elements[SLIDE_NUMBER_KEY] = textElement({
+        kind: 'text',
+        role: 'caption',
+        x: SLIDE_WIDTH - SLIDE_MARGIN - numberWidth,
+        y: SLIDE_FOOTER_Y,
+        w: numberWidth,
+        align: 'right',
+        tone: 'muted',
+    }, '1', palette);
+    return elements;
+}
+/**
+ * The mask's frame: the slide itself. Its title is the tile's name, resolved
+ * once at placement (a frame title is document content, ADR 0023). No
+ * `presentationIndex`: the schema default applies, like a pasted frame.
+ */
+function slideFrame(mask, elements, std) {
+    const name = tr(std, mask.name);
+    return {
+        type: 'block',
+        id: `block:slide-${mask.id}`,
+        flavour: 'affine:frame',
+        props: {
+            title: {
+                '$blocksuite:internal:text$': true,
+                delta: [{ insert: name }],
+            },
+            background: SLIDE_PALETTES[mask.variant].paper,
+            xywh: xywh(0, 0, SLIDE_WIDTH, SLIDE_HEIGHT),
+            index: 'a0',
+            childElementIds: Object.fromEntries(Object.keys(elements).map(id => [id, true])),
+        },
+        children: [],
+    };
+}
+/** The template content of one mask: a page, its surface, the frame. */
+export function slideSnapshot(mask, std) {
+    const elements = slideElements(mask, std);
+    return makeTemplateSnapshot(elements, mask.name[1], [
+        slideFrame(mask, elements, std),
+    ]);
+}
+/* ── Slide number ─────────────────────────────────────────────────────── */
+/**
+ * Write the slide number once, at placement: the inserted frame's rank among
+ * the document's frames in presentation order (`presentationIndex`, the
+ * legacy frames without one after the keyed ones, as the frame manager
+ * orders them). Later reordering does not renumber: the number is the
+ * author's text from then on.
+ *
+ * ponytail: the template snapshot carries no `presentationIndex`, so the
+ * inserted frame takes the schema default, `generateKeyBetweenV2(null,
+ * null)`, whose random suffix ranks it anywhere among the frames: the number
+ * is the frame's true rank, but that rank is arbitrary until the template
+ * job's `presentationIndex` middleware (a key after the last frame) lands,
+ * after which the new slide is always last. Nothing here changes then.
+ */
+export function numberSlide(std, insertedIds) {
+    if (std.store.readonly)
+        return;
+    const numberId = insertedIds.at(-1);
+    if (!numberId)
+        return;
+    const frames = std.store.getModelsByFlavour('affine:frame');
+    const own = frames.find(frame => frame.childIds.includes(numberId));
+    if (!own)
+        return;
+    std.get(GfxControllerIdentifier).updateElement(numberId, {
+        text: new Y.Text(String(slideNumberOf(own, frames))),
+    });
+}
+/** A frame's 1-based rank among `frames`; ties count as before it. */
+export function slideNumberOf(own, frames) {
+    const rank = (frame) => frame.props.presentationIndex || '\uffff';
+    const ownRank = rank(own);
+    return (1 + frames.filter(frame => frame !== own && rank(frame) <= ownRank).length);
+}
+/* ── Preview ──────────────────────────────────────────────────────────── */
+const light = (color) => resolveColor(color, ColorScheme.Light);
+/** A text line drawn as a bar, the width of its English words (roughly). */
+function textBars(zone, words, palette) {
+    const { fontSize } = SLIDE_TYPE[zone.role];
+    const height = Math.max(6, fontSize * 0.55);
+    const step = fontSize * SLIDE_LINE_HEIGHT;
+    const full = words.length * fontSize * 0.5;
+    const lines = Math.max(1, Math.min(zone.lines ?? 1, Math.ceil(full / zone.w)));
+    const fill = light(zone.tone === 'muted' ? palette.muted : palette.ink);
+    let out = '';
+    for (let i = 0; i < lines; i++) {
+        const remaining = full - i * zone.w;
+        const w = Math.max(fontSize, Math.min(zone.w, remaining));
+        const x = zone.align === 'center'
+            ? zone.x + (zone.w - w) / 2
+            : zone.align === 'right'
+                ? zone.x + zone.w - w
+                : zone.x;
+        out += `<rect x="${x}" y="${zone.y + i * step + (step - height) / 2}" width="${w}" height="${height}" rx="${height / 2}" fill="${fill}"/>`;
+    }
+    return out;
+}
+function previewZone(zone, palette) {
+    switch (zone.kind) {
+        case 'text':
+            return textBars(zone, zone.seed?.[1] ?? zone.digits ?? '', palette);
+        case 'image':
+        case 'card': {
+            const filled = zone.kind === 'image' || (zone.kind === 'card' && zone.filled);
+            const fill = filled ? light(palette.hairline) : 'none';
+            const stroke = light(zone.kind === 'card' && zone.stroke === 'muted'
+                ? palette.muted
+                : zone.kind === 'image'
+                    ? palette.zoneStroke
+                    : palette.hairline);
+            const dash = zone.kind === 'image' ? ' stroke-dasharray="16 12"' : '';
+            if (zone.shape === 'ellipse') {
+                return `<ellipse cx="${zone.x + zone.w / 2}" cy="${zone.y + zone.h / 2}" rx="${zone.w / 2}" ry="${zone.h / 2}" fill="${fill}" stroke="${stroke}" stroke-width="6"${dash}/>`;
+            }
+            return `<rect x="${zone.x}" y="${zone.y}" width="${zone.w}" height="${zone.h}" rx="${SLIDE_RADIUS}" fill="${fill}" stroke="${stroke}" stroke-width="6"${dash}/>`;
+        }
+        case 'dot':
+            return `<circle cx="${zone.x + zone.size / 2}" cy="${zone.y + zone.size / 2}" r="${zone.size / 2}" fill="${light(palette.ink)}"/>`;
+        case 'line':
+            return `<path d="M${zone.from[0]} ${zone.from[1]} L${zone.to[0]} ${zone.to[1]}" stroke="${light(palette.muted)}" stroke-width="6"/>`;
+    }
+}
+/**
+ * The tile: the slide itself, drawn from its own declaration at 1/10th, so a
+ * preview can never drift from what the mask inserts. Texts are bars, the
+ * light side of every colour is used (a tile is chrome on the panel's own
+ * paper), and the slide gets a hairline so a white slide shows on a white
+ * panel.
+ */
+export function slidePreview(mask) {
+    const palette = SLIDE_PALETTES[mask.variant];
+    const body = mask.zones.map(zone => previewZone(zone, palette)).join('');
+    return `<svg width="100%" height="100%" viewBox="-20 -20 ${SLIDE_WIDTH + 40} ${SLIDE_HEIGHT + 40}" xmlns="http://www.w3.org/2000/svg"><rect x="0" y="0" width="${SLIDE_WIDTH}" height="${SLIDE_HEIGHT}" rx="16" fill="${light(palette.paper)}" stroke="${light(SLIDE_PALETTES.paper.hairline)}" stroke-width="8"/>${body}</svg>`;
+}

package/dist/_pkgs/affine-gfx-template/builtin/slides/consts.d.ts

@@ -0,0 +1,126 @@
+import { type Color, FontWeight } from '../../../affine-model/index.js';
+/**
+ * The slide masks' one system: geometry, typography and the two paper
+ * variants. Every mask in `masks.ts` reads these and restates none of them,
+ * so a size or a colour changes here, once, for the whole set.
+ */
+/** A 16:9 slide, the frame menu's own `16:9` preset (1600 × 900). */
+export declare const SLIDE_WIDTH = 1600;
+export declare const SLIDE_HEIGHT = 900;
+/** The side margin every mask aligns its content on. */
+export declare const SLIDE_MARGIN = 96;
+/** Where the footer line (footer text, slide number) sits. */
+export declare const SLIDE_FOOTER_Y = 846;
+/**
+ * A slide is read from across a room: its type is the document's heading
+ * scale (DESIGN.md, The Title-Ratio Rule) times one factor, so the steps
+ * between levels stay the editor's own. 1.5 puts the title at 48 model units
+ * on a 1600-wide slide, the proportion of the PO's reference deck.
+ */
+export declare const SLIDE_TYPE_FACTOR = 1.5;
+export type SlideTextRole = 'display' | 'title' | 'heading' | 'body' | 'caption' | 'figure';
+export type SlideType = {
+    fontSize: number;
+    fontWeight: FontWeight;
+};
+export declare const SLIDE_TYPE: Readonly<Record<SlideTextRole, SlideType>>;
+/**
+ * What a text box adds to its font size per line. The renderer measures the
+ * real line box in the DOM (`getLineHeight`, `gfx/text`); the seeds only need
+ * a box tall enough not to overlap the next zone.
+ *
+ * ponytail: a fixed 1.25 ratio, close to Inter's measured line box. The
+ * ceiling is a host font with a taller line box, whose seeds would overlap
+ * by a few units until edited; the upgrade is measuring with `wrapText` and
+ * `getLineHeight` at placement, which needs a DOM the snapshot build has not.
+ */
+export declare const SLIDE_LINE_HEIGHT = 1.25;
+/**
+ * The colours a slide paints with. Only `{ light, dark }` pairs of the base
+ * palette or palette values that read on both papers: a mask's elements
+ * carry no role and sit on no framework board, so they are painted as stored
+ * on a dark canvas (ADR 0039, point 6). A raw hex would leave a white slide
+ * on a dark canvas; a pair inverts with the theme.
+ */
+export type SlidePalette = {
+    /** The frame's background. */
+    paper: Color;
+    /** Titles, headings, body text, key figures. */
+    ink: Color;
+    /** Eyebrows, captions, footer, slide number, axis labels. */
+    muted: Color;
+    /** Hairlines, card outlines, the fill of a placeholder. */
+    hairline: Color;
+    /** The dashed outline of a fill zone. */
+    zoneStroke: Color;
+};
+/**
+ * Two variants, so the set reads as one deck: `paper`, a light slide that
+ * turns dark grey on a dark canvas, and `inverse`, the ink slide of a section
+ * divider, a statement or a quote, which swaps paper and ink.
+ */
+export declare const SLIDE_PALETTES: {
+    readonly paper: {
+        readonly paper: Color;
+        readonly ink: string | {
+            normal: string;
+        } | {
+            dark: string;
+            light: string;
+        };
+        readonly muted: string | {
+            normal: string;
+        } | {
+            dark: string;
+            light: string;
+        };
+        readonly hairline: {
+            dark: string;
+            light: string;
+        };
+        readonly zoneStroke: string | {
+            normal: string;
+        } | {
+            dark: string;
+            light: string;
+        };
+    };
+    readonly inverse: {
+        readonly paper: string | {
+            normal: string;
+        } | {
+            dark: string;
+            light: string;
+        };
+        readonly ink: string | {
+            normal: string;
+        } | {
+            dark: string;
+            light: string;
+        };
+        readonly muted: string | {
+            normal: string;
+        } | {
+            dark: string;
+            light: string;
+        };
+        readonly hairline: string | {
+            normal: string;
+        } | {
+            dark: string;
+            light: string;
+        };
+        readonly zoneStroke: string | {
+            normal: string;
+        } | {
+            dark: string;
+            light: string;
+        };
+    };
+};
+export type SlideVariant = keyof typeof SLIDE_PALETTES;
+/** Stroke widths, model units. */
+export declare const SLIDE_HAIRLINE_WIDTH = 2;
+export declare const SLIDE_ZONE_STROKE_WIDTH = 2;
+/** Corner radius of a card or a fill zone. */
+export declare const SLIDE_RADIUS = 12;

package/dist/_pkgs/affine-gfx-template/builtin/slides/consts.js

@@ -0,0 +1,101 @@
+import { DefaultTheme, FontWeight } from '../../../affine-model/index.js';
+import { HEADING_SCALE } from '../../../affine-shared/consts/index.js';
+import { darkThemeV2, lightThemeV2 } from '@toeverything/theme/v2';
+/**
+ * The slide masks' one system: geometry, typography and the two paper
+ * variants. Every mask in `masks.ts` reads these and restates none of them,
+ * so a size or a colour changes here, once, for the whole set.
+ */
+/** A 16:9 slide, the frame menu's own `16:9` preset (1600 × 900). */
+export const SLIDE_WIDTH = 1600;
+export const SLIDE_HEIGHT = 900;
+/** The side margin every mask aligns its content on. */
+export const SLIDE_MARGIN = 96;
+/** Where the footer line (footer text, slide number) sits. */
+export const SLIDE_FOOTER_Y = 846;
+/**
+ * A slide is read from across a room: its type is the document's heading
+ * scale (DESIGN.md, The Title-Ratio Rule) times one factor, so the steps
+ * between levels stay the editor's own. 1.5 puts the title at 48 model units
+ * on a 1600-wide slide, the proportion of the PO's reference deck.
+ */
+export const SLIDE_TYPE_FACTOR = 1.5;
+/**
+ * The doc title has no entry in `HEADING_SCALE` (it sits above the scale,
+ * DESIGN.md, Hierarchy: 700, 40px); the body is 15px. Both are restated
+ * here as the two values the scale does not carry.
+ */
+const DOC_TITLE_SIZE = 40;
+const BODY_SIZE = 15;
+const CAPTION_SIZE = 12;
+const size = (px) => Math.round(px * SLIDE_TYPE_FACTOR);
+const weight = (value) => String(value);
+export const SLIDE_TYPE = {
+    /** The cover's and a section's title: the doc title's tier. */
+    display: { fontSize: size(DOC_TITLE_SIZE), fontWeight: FontWeight.Bold },
+    /** Every slide's own title: H1. */
+    title: {
+        fontSize: size(HEADING_SCALE.h1.fontSize),
+        fontWeight: weight(HEADING_SCALE.h1.fontWeight),
+    },
+    /** A point's or a column's heading: H3. */
+    heading: {
+        fontSize: size(HEADING_SCALE.h3.fontSize),
+        fontWeight: weight(HEADING_SCALE.h3.fontWeight),
+    },
+    body: { fontSize: size(BODY_SIZE), fontWeight: FontWeight.Regular },
+    /** Footer, slide number, eyebrow, axis and placeholder labels. */
+    caption: { fontSize: size(CAPTION_SIZE), fontWeight: FontWeight.Regular },
+    /** A key figure: twice the slide title, the one number a slide is about. */
+    figure: {
+        fontSize: 2 * size(HEADING_SCALE.h1.fontSize),
+        fontWeight: FontWeight.Bold,
+    },
+};
+/**
+ * What a text box adds to its font size per line. The renderer measures the
+ * real line box in the DOM (`getLineHeight`, `gfx/text`); the seeds only need
+ * a box tall enough not to overlap the next zone.
+ *
+ * ponytail: a fixed 1.25 ratio, close to Inter's measured line box. The
+ * ceiling is a host font with a taller line box, whose seeds would overlap
+ * by a few units until edited; the upgrade is measuring with `wrapText` and
+ * `getLineHeight` at placement, which needs a DOM the snapshot build has not.
+ */
+export const SLIDE_LINE_HEIGHT = 1.25;
+const MEDIUM_GREY = DefaultTheme.StrokeColorShortMap['Grey'];
+/**
+ * The theme's one grey that has a dark side, the note palette's grey
+ * (`#e6e6e6` / `#565656`). `DefaultTheme` maps no grey note, so the pair is
+ * read from the same theme tables `getColorByKey` reads.
+ */
+const NOTE_GREY = {
+    dark: darkThemeV2['edgeless/note/grey'],
+    light: lightThemeV2['edgeless/note/grey'],
+};
+/**
+ * Two variants, so the set reads as one deck: `paper`, a light slide that
+ * turns dark grey on a dark canvas, and `inverse`, the ink slide of a section
+ * divider, a statement or a quote, which swaps paper and ink.
+ */
+export const SLIDE_PALETTES = {
+    paper: {
+        paper: DefaultTheme.NoteBackgroundColorMap['White'],
+        ink: DefaultTheme.black,
+        muted: MEDIUM_GREY,
+        hairline: NOTE_GREY,
+        zoneStroke: MEDIUM_GREY,
+    },
+    inverse: {
+        paper: DefaultTheme.black,
+        ink: DefaultTheme.white,
+        muted: MEDIUM_GREY,
+        hairline: MEDIUM_GREY,
+        zoneStroke: MEDIUM_GREY,
+    },
+};
+/** Stroke widths, model units. */
+export const SLIDE_HAIRLINE_WIDTH = 2;
+export const SLIDE_ZONE_STROKE_WIDTH = 2;
+/** Corner radius of a card or a fill zone. */
+export const SLIDE_RADIUS = 12;

package/dist/_pkgs/affine-gfx-template/builtin/slides/index.d.ts

@@ -0,0 +1,8 @@
+import type { TemplateCategory } from '../../toolbar/template-type.js';
+/**
+ * The built-in "Slides" category: one 16:9 frame per mask, ready to fill.
+ * Built in and ungated like "Other": a frame, shapes, texts and connectors
+ * are core, so no flag can take the masks away (ADR 0009 gates a framework's
+ * tooling, and a slide belongs to no framework).
+ */
+export declare const slidesTemplateCategory: TemplateCategory;

package/dist/_pkgs/affine-gfx-template/builtin/slides/index.js

@@ -0,0 +1,27 @@
+import { TEMPLATE_PANEL_CATEGORY_SLIDES } from '../../translations.js';
+import { numberSlide, slidePreview, slideSnapshot } from './build.js';
+import { SLIDE_MASKS } from './masks.js';
+function slideTemplate(mask) {
+    const [nameKey, name] = mask.name;
+    return {
+        name,
+        nameKey,
+        keywords: mask.keywords,
+        type: 'template',
+        preview: slidePreview(mask),
+        content: slideSnapshot(mask),
+        localize: std => slideSnapshot(mask, std),
+        afterInsert: numberSlide,
+    };
+}
+/**
+ * The built-in "Slides" category: one 16:9 frame per mask, ready to fill.
+ * Built in and ungated like "Other": a frame, shapes, texts and connectors
+ * are core, so no flag can take the masks away (ADR 0009 gates a framework's
+ * tooling, and a slide belongs to no framework).
+ */
+export const slidesTemplateCategory = {
+    name: TEMPLATE_PANEL_CATEGORY_SLIDES[1],
+    nameKey: TEMPLATE_PANEL_CATEGORY_SLIDES[0],
+    templates: SLIDE_MASKS.map(slideTemplate),
+};