@formicoidea/labre-core 0.31.0 → 0.32.0

package/dist/_pkgs/affine-gfx-group/command/group-api.js

@@ -1,6 +1,68 @@
 import { EdgelessCRUDIdentifier } from '../../affine-block-surface/index.js';
 import { MindmapElementModel, } from '../../affine-model/index.js';
-import { GfxControllerIdentifier } from '../../std/gfx/index.js';
+import { batchAddChildren, batchRemoveChildren, generateKeyBetween, generateNKeysBetween, GfxControllerIdentifier, measureOperation, } from '../../std/gfx/index.js';
+/**
+ * Every element that sits at the root of the board, in painting order.
+ */
+const getTopLevelOrderedElements = (gfx) => {
+    const topLevelElements = gfx.layer.layers.reduce((elements, layer) => {
+        layer.elements.forEach(element => {
+            if (element.group === null) {
+                elements.push(element);
+            }
+        });
+        return elements;
+    }, []);
+    topLevelElements.sort((a, b) => gfx.layer.compare(a, b));
+    return topLevelElements;
+};
+/**
+ * The indexes the children of an ungrouped group should take: the slot the
+ * group itself occupied, so that everything it contained stays where the user
+ * last saw it instead of jumping to the top of the stack.
+ *
+ * The fallbacks go from "the exact slot" to "always valid", because the
+ * interval between the two siblings can be unusable — a document written by an
+ * older version, or two siblings sharing an index.
+ */
+const buildUngroupIndexes = (orderedElements, afterIndex, beforeIndex, fallbackAnchorIndex) => {
+    if (orderedElements.length === 0) {
+        return [];
+    }
+    const count = orderedElements.length;
+    const tryGenerateN = (left, right) => {
+        try {
+            const generated = generateNKeysBetween(left, right, count);
+            return generated.length === count ? generated : null;
+        }
+        catch {
+            return null;
+        }
+    };
+    const tryGenerateOneByOne = (left, right) => {
+        try {
+            let cursor = left;
+            return orderedElements.map(() => {
+                cursor = generateKeyBetween(cursor, right);
+                return cursor;
+            });
+        }
+        catch {
+            return null;
+        }
+    };
+    // Preferred: keep ungrouped children in the original group slot.
+    return (tryGenerateN(afterIndex, beforeIndex) ??
+        // Fallback: ignore the upper bound when legacy/broken data has reversed interval.
+        tryGenerateN(afterIndex, null) ??
+        // Fallback: use group index as anchor when sibling interval is unavailable.
+        tryGenerateN(fallbackAnchorIndex, null) ??
+        // Last resort: always valid.
+        tryGenerateN(null, null) ??
+        // Defensive fallback for unexpected library behavior.
+        tryGenerateOneByOne(null, null) ??
+        []);
+};
 export const createGroupCommand = (ctx, next) => {
     const { std, elements } = ctx;
     const gfx = std.get(GfxControllerIdentifier);
@@ -20,73 +82,99 @@ export const createGroupCommand = (ctx, next) => {
     next({ groupId });
 };
 export const createGroupFromSelectedCommand = (ctx, next) => {
-    const { std } = ctx;
-    const gfx = std.get(GfxControllerIdentifier);
-    const { selection, surface } = gfx;
-    if (!surface) {
-        return;
-    }
-    if (selection.selectedElements.length === 0 ||
-        !selection.selectedElements.every(element => element.group === selection.firstElement.group &&
-            !(element.group instanceof MindmapElementModel))) {
-        return;
-    }
-    const parent = selection.firstElement.group;
-    if (parent !== null) {
-        selection.selectedElements.forEach(element => {
-            // oxlint-disable-next-line unicorn/prefer-dom-node-remove
-            parent.removeChild(element);
+    measureOperation('edgeless:create-group-from-selected', () => {
+        const { std } = ctx;
+        const gfx = std.get(GfxControllerIdentifier);
+        const { selection, surface } = gfx;
+        if (!surface) {
+            return;
+        }
+        // Guarded BEFORE the child rewrites below: they write through raw
+        // transactions, and `crud.addElement` would refuse afterwards — leaving the
+        // selection orphaned from its parent group on a readonly board.
+        if (std.store.readonly) {
+            return;
+        }
+        if (selection.selectedElements.length === 0 ||
+            !selection.selectedElements.every(element => element.group === selection.firstElement.group &&
+                !(element.group instanceof MindmapElementModel))) {
+            return;
+        }
+        const parent = selection.firstElement.group;
+        const selectedElements = [...selection.selectedElements];
+        let groupId;
+        // One transaction for the whole regrouping, so a single undo takes the
+        // board back to where it was.
+        std.store.transact(() => {
+            const [_, result] = std.command.exec(createGroupCommand, {
+                elements: selectedElements,
+            });
+            if (!result.groupId) {
+                return;
+            }
+            groupId = result.groupId;
+            const group = surface.getElementById(groupId);
+            if (parent !== null && group) {
+                batchRemoveChildren(parent, selectedElements);
+                batchAddChildren(parent, [group]);
+            }
         });
-    }
-    const [_, result] = std.command.exec(createGroupCommand, {
-        elements: selection.selectedElements,
-    });
-    if (!result.groupId) {
-        return;
-    }
-    const group = surface.getElementById(result.groupId);
-    if (parent !== null && group) {
-        parent.addChild(group);
-    }
-    selection.set({
-        editing: false,
-        elements: [result.groupId],
+        if (!groupId) {
+            return;
+        }
+        selection.set({
+            editing: false,
+            elements: [groupId],
+        });
+        next({ groupId });
     });
-    next({ groupId: result.groupId });
 };
 export const ungroupCommand = (ctx, next) => {
-    const { std, group } = ctx;
-    const gfx = std.get(GfxControllerIdentifier);
-    const { selection } = gfx;
-    const parent = group.group;
-    const elements = group.childElements;
-    if (group instanceof MindmapElementModel) {
-        return;
-    }
-    if (parent !== null) {
-        // oxlint-disable-next-line unicorn/prefer-dom-node-remove
-        parent.removeChild(group);
-    }
-    elements.forEach(element => {
-        // oxlint-disable-next-line unicorn/prefer-dom-node-remove
-        group.removeChild(element);
-    });
-    // keep relative index order of group children after ungroup
-    elements
-        .sort((a, b) => gfx.layer.compare(a, b))
-        .forEach(element => {
+    measureOperation('edgeless:ungroup', () => {
+        const { std, group } = ctx;
+        const gfx = std.get(GfxControllerIdentifier);
+        const { selection } = gfx;
+        const parent = group.group;
+        const elements = [...group.childElements];
+        if (group instanceof MindmapElementModel) {
+            return;
+        }
+        // The child rewrites and the index rewrites below are raw transactions.
+        if (std.store.readonly) {
+            return;
+        }
+        const orderedElements = [...elements].sort((a, b) => gfx.layer.compare(a, b));
+        const siblings = parent
+            ? [...parent.childElements].sort((a, b) => gfx.layer.compare(a, b))
+            : getTopLevelOrderedElements(gfx);
+        const groupPosition = siblings.indexOf(group);
+        const beforeSiblingIndex = groupPosition > 0 ? (siblings[groupPosition - 1]?.index ?? null) : null;
+        const afterSiblingIndex = groupPosition === -1
+            ? null
+            : (siblings[groupPosition + 1]?.index ?? null);
+        const nextIndexes = buildUngroupIndexes(orderedElements, beforeSiblingIndex, afterSiblingIndex, group.index);
+        // One transaction for the whole ungrouping: opening one per child made a
+        // single undo put a single child back.
         std.store.transact(() => {
-            element.index = gfx.layer.generateIndex();
+            if (parent !== null) {
+                batchRemoveChildren(parent, [group]);
+            }
+            batchRemoveChildren(group, elements);
+            // keep relative index order of group children after ungroup
+            orderedElements.forEach((element, idx) => {
+                const index = nextIndexes[idx];
+                if (element.index !== index) {
+                    element.index = index;
+                }
+            });
+            if (parent !== null) {
+                batchAddChildren(parent, orderedElements);
+            }
         });
-    });
-    if (parent !== null) {
-        elements.forEach(element => {
-            parent.addChild(element);
+        selection.set({
+            editing: false,
+            elements: orderedElements.map(ele => ele.id),
         });
-    }
-    selection.set({
-        editing: false,
-        elements: elements.map(ele => ele.id),
+        next();
     });
-    next();
 };

package/dist/_pkgs/affine-gfx-group/text/edgeless-group-title-editor.js

@@ -33,6 +33,7 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     return useValue ? value : void 0;
 };
 import { DefaultTool } from '../../affine-block-surface/index.js';
+import { toOverlayCoord } from '../../affine-shared/utils/index.js';
 import { BlockSuiteError, ErrorCode } from '../../global/exceptions/index.js';
 import { Bound } from '../../global/gfx/index.js';
 import { WithDisposable } from '../../global/lit/index.js';
@@ -156,7 +157,9 @@ let EdgelessGroupTitleEditor = (() => {
             }
             const viewport = this.gfx.viewport;
             const bound = Bound.deserialize(this.group.externalXYWH);
-            const [x, y] = viewport.toViewCoord(bound.x, bound.y);
+            // The editor is mounted inside the container the host may have scaled, so
+            // it is placed the way the title it replaces is, not in screen pixels.
+            const [x, y] = toOverlayCoord(viewport, bound.x, bound.y);
             const inlineEditorStyle = styleMap({
                 transformOrigin: 'top left',
                 borderRadius: '2px',

package/dist/_pkgs/affine-gfx-pointer/tools/pan-tool.d.ts

@@ -7,10 +7,26 @@ export type PanToolOption = {
 export declare class PanTool extends BaseTool<PanToolOption> {
     static toolName: string;
     private _lastPoint;
+    /**
+     * Set while a finger drag has borrowed the pan tool; calling it gives the
+     * previous tool — and the selection it was holding — back.
+     */
+    private _fingerPanRestore;
     readonly panning$: Signal<boolean>;
     get allowDragWithRightButton(): boolean;
     dragEnd(_: PointerEventState): void;
     dragMove(e: PointerEventState): void;
     dragStart(e: PointerEventState): void;
     mounted(): void;
+    /**
+     * Activate the pan tool for the duration of a gesture.
+     *
+     * @returns a function restoring the previous tool and the selection it was
+     * holding, or `null` when the pan tool is already the user's own choice —
+     * there is then nothing to restore.
+     */
+    private _borrowPanTool;
+    private _releaseFingerPan;
+    /** Whether this drag is a bare finger sliding over empty canvas. */
+    private _shouldPanWithFinger;
 }

package/dist/_pkgs/affine-gfx-pointer/tools/pan-tool.js

@@ -2,10 +2,19 @@ import { EdgelessLegacySlotIdentifier } from '../../affine-block-surface/index.j
 import { on } from '../../affine-shared/utils/index.js';
 import { BaseTool, MouseButton } from '../../std/gfx/index.js';
 import { Signal } from '@preact/signals-core';
+/** The presentation tool, named here because it is not importable from gfx. */
+const PRESENT_TOOL_NAME = 'frameNavigator';
+/** The selection tool, named here because it is not importable from gfx. */
+const DEFAULT_TOOL_NAME = 'default';
 export class PanTool extends BaseTool {
     constructor() {
         super(...arguments);
         this._lastPoint = null;
+        /**
+         * Set while a finger drag has borrowed the pan tool; calling it gives the
+         * previous tool — and the selection it was holding — back.
+         */
+        this._fingerPanRestore = null;
         this.panning$ = new Signal(false);
     }
     static { this.toolName = 'pan'; }
@@ -15,6 +24,7 @@ export class PanTool extends BaseTool {
     dragEnd(_) {
         this._lastPoint = null;
         this.panning$.value = false;
+        this._releaseFingerPan();
     }
     dragMove(e) {
         if (!this._lastPoint)
@@ -37,45 +47,105 @@ export class PanTool extends BaseTool {
             if (!shouldPanWithMiddle) {
                 return;
             }
-            evt.raw.preventDefault();
-            const currentTool = this.controller.currentToolOption$.peek();
-            const restoreToPrevious = () => {
-                const { toolType, options: originalToolOptions } = currentTool;
-                const selectionToRestore = this.gfx.selection.surfaceSelections;
-                if (!toolType)
-                    return;
-                let finalOptions = originalToolOptions;
-                const PRESENT_TOOL_NAME = 'frameNavigator';
-                if (toolType.toolName === PRESENT_TOOL_NAME) {
-                    // When restoring PresentTool (frameNavigator) after a temporary pan (e.g., via middle mouse button),
-                    // set 'restoredAfterPan' to true. This allows PresentTool to avoid an unwanted viewport reset
-                    // and maintain the panned position.
-                    const currentPresentOptions = originalToolOptions;
-                    finalOptions = {
-                        ...currentPresentOptions,
-                        restoredAfterPan: true,
-                    };
-                }
-                this.controller.setTool(toolType, finalOptions);
-                this.gfx.selection.set(selectionToRestore);
-            };
-            // If in presentation mode, disable black background after middle mouse drag
-            if (currentTool.toolType?.toolName === 'frameNavigator') {
-                const slots = this.std.get(EdgelessLegacySlotIdentifier);
-                slots.navigatorSettingUpdated.next({
-                    blackBackground: false,
-                });
+            const restoreToPrevious = this._borrowPanTool();
+            // Already panning — the pan tool is the user's own choice, not a
+            // temporary borrow. There is nothing to switch to and nothing to
+            // restore, so stay out of the way and let the gesture through.
+            if (!restoreToPrevious) {
+                return;
             }
-            this.controller.setTool(PanTool, {
-                panning: true,
-            });
+            evt.raw.preventDefault();
             const dispose = on(document, 'pointerup', evt => {
                 if (evt.button === MouseButton.MIDDLE) {
                     restoreToPrevious();
-                    dispose();
                 }
+                // Whatever button ended the gesture, this listener has done its job:
+                // release it, or a right-click after a middle-click would leave it
+                // hanging on `document` and restore a stale tool later on.
+                dispose();
             });
             return false;
         });
+        // A finger dragging bare canvas slides the canvas, the way every touch
+        // surface behaves. Borrowing happens on `dragStart`, not on `pointerDown`:
+        // a tap must stay a tap, and the selection tool is still the one that has
+        // to answer it. The `dragStart` hook runs BEFORE the controller resolves
+        // which tool receives the event, so the pan tool below gets the whole
+        // gesture — moves and end alike.
+        this.addHook('dragStart', evt => {
+            if (!this._shouldPanWithFinger(evt))
+                return;
+            this._fingerPanRestore = this._borrowPanTool();
+        });
+    }
+    /**
+     * Activate the pan tool for the duration of a gesture.
+     *
+     * @returns a function restoring the previous tool and the selection it was
+     * holding, or `null` when the pan tool is already the user's own choice —
+     * there is then nothing to restore.
+     */
+    _borrowPanTool() {
+        const { toolType, options: originalToolOptions } = this.controller.currentToolOption$.peek();
+        if (toolType?.toolName === PanTool.toolName) {
+            return null;
+        }
+        // Snapshot the selection NOW. Activating the pan tool below goes through
+        // `ToolController.setTool`, which clears the selection, so reading it
+        // back at the end of the gesture would only ever restore an empty one.
+        const selectionToRestore = this.gfx.selection.surfaceSelections.slice();
+        const restoreToPrevious = () => {
+            if (!toolType)
+                return;
+            let finalOptions = originalToolOptions;
+            if (toolType.toolName === PRESENT_TOOL_NAME) {
+                // When restoring PresentTool (frameNavigator) after a temporary pan (e.g., via middle mouse button),
+                // set 'restoredAfterPan' to true. This allows PresentTool to avoid an unwanted viewport reset
+                // and maintain the panned position.
+                const currentPresentOptions = originalToolOptions;
+                finalOptions = {
+                    ...currentPresentOptions,
+                    restoredAfterPan: true,
+                };
+            }
+            this.controller.setTool(toolType, finalOptions);
+            // AFTER the switch, never before: `setTool` clears the selection.
+            this.gfx.selection.set(selectionToRestore);
+        };
+        // If in presentation mode, disable black background after middle mouse drag
+        if (toolType?.toolName === PRESENT_TOOL_NAME) {
+            const slots = this.std.get(EdgelessLegacySlotIdentifier);
+            slots.navigatorSettingUpdated.next({
+                blackBackground: false,
+            });
+        }
+        this.controller.setTool(PanTool, {
+            panning: true,
+        });
+        return restoreToPrevious;
+    }
+    _releaseFingerPan() {
+        const restore = this._fingerPanRestore;
+        this._fingerPanRestore = null;
+        restore?.();
+    }
+    /** Whether this drag is a bare finger sliding over empty canvas. */
+    _shouldPanWithFinger(e) {
+        // A second finger is a two-finger gesture — pan or pinch — and the
+        // edgeless root answers those itself. It never reaches here anyway: the
+        // drag controller ends the drag as soon as a non-primary pointer lands.
+        if (e.raw.pointerType !== 'touch' || !e.raw.isPrimary)
+            return false;
+        // Only the selection tool lends its gesture away. Every other tool —
+        // brush, shape, connector, the framework tools — draws on empty canvas,
+        // and a finger is precisely how it is meant to draw.
+        const { toolType } = this.controller.currentToolOption$.peek();
+        if (toolType?.toolName !== DEFAULT_TOOL_NAME)
+            return false;
+        // A finger landing on something moves that something; only bare canvas
+        // slides. This is what keeps dragging a Wardley or EDGY element by hand
+        // working.
+        const [modelX, modelY] = this.gfx.viewport.toModelCoord(e.x, e.y);
+        return !this.gfx.getElementByPoint(modelX, modelY);
     }
 }

package/dist/_pkgs/affine-gfx-shape/commands.d.ts

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

package/dist/_pkgs/affine-gfx-shape/commands.js

@@ -0,0 +1,33 @@
+import { ShapeElementModel, TextFitMode } from '../affine-model/index.js';
+import { GfxControllerIdentifier } from '../std/gfx/index.js';
+import { applyTextFitMode, nextTextFitMode } from './text-fit.js';
+/**
+ * Shape commands (edgeless scope, always-on — shapes are core canvas), so
+ * `owner: 'core'` rather than a framework. Host-rebindable through
+ * `ShortcutOverrides` exactly as before (`docs/adr/0008`).
+ */
+/** The selected shapes that carry text — the ones the gesture would cycle. */
+const textShapes = (std) => std
+    .get(GfxControllerIdentifier)
+    .selection.selectedElements.filter((el) => el instanceof ShapeElementModel && !!el.text);
+export const shapeCommands = [
+    {
+        id: 'shape.cycleTextFit',
+        owner: 'core',
+        kind: 'action',
+        labelKey: 'com.labre.keyboardShortcuts.shape.cycleTextFit',
+        labelFallback: 'Cycle text fit',
+        surfaces: ['palette', 'agent'],
+        scope: 'edgeless',
+        defaultKeys: { mac: ['Mod-Shift-f'], other: ['Mod-Shift-f'] },
+        availability: 'selection',
+        when: std => textShapes(std).length > 0,
+        run: std => {
+            const models = textShapes(std);
+            if (!models.length)
+                return;
+            const mode = models[0].textFitMode ?? TextFitMode.Grow;
+            applyTextFitMode(std, models, nextTextFitMode(mode));
+        },
+    },
+];

package/dist/_pkgs/affine-gfx-shape/element-renderer/shape-dom/index.js

@@ -1,17 +1,52 @@
 import { DefaultTheme } from '../../../affine-model/index.js';
 import { SVGShapeBuilder } from '../../../global/gfx/index.js';
 import { manageClassNames, setStyles } from './utils.js';
+const SVG_NS = 'http://www.w3.org/2000/svg';
+/**
+ * The nodes a shape host already owns, kept across renders. Rebuilding the
+ * `<svg>` on every frame made each pan or zoom allocate a fresh element per
+ * shape on the board; the attributes are cheap to overwrite in place.
+ */
+const retainedShapeDom = new WeakMap();
+function getRetainedShapeDom(element) {
+    const existing = retainedShapeDom.get(element);
+    if (existing) {
+        return existing;
+    }
+    const retained = {
+        svg: null,
+        polygon: null,
+    };
+    retainedShapeDom.set(element, retained);
+    return retained;
+}
+function getOrCreateSvg(retained, element) {
+    if (retained.svg && retained.polygon) {
+        return {
+            svg: retained.svg,
+            polygon: retained.polygon,
+        };
+    }
+    const svg = document.createElementNS(SVG_NS, 'svg');
+    svg.setAttribute('width', '100%');
+    svg.setAttribute('height', '100%');
+    svg.setAttribute('preserveAspectRatio', 'none');
+    const polygon = document.createElementNS(SVG_NS, 'polygon');
+    svg.append(polygon);
+    retained.svg = svg;
+    retained.polygon = polygon;
+    element.prepend(svg);
+    return { svg, polygon };
+}
+function removeSvg(retained) {
+    retained.svg?.remove();
+    retained.svg = null;
+    retained.polygon = null;
+}
 function applyShapeSpecificStyles(model, element, zoom) {
     // Reset properties that might be set by different shape types
     element.style.removeProperty('clip-path');
     element.style.removeProperty('border-radius');
-    // Clear DOM for shapes that don't use SVG, or if type changes from SVG-based to non-SVG-based
-    if (model.shapeType !== 'diamond' &&
-        model.shapeType !== 'triangle' &&
-        model.shapeType !== 'polygon') {
-        while (element.firstChild)
-            element.firstChild.remove();
-    }
     switch (model.shapeType) {
         case 'rect': {
             const w = model.w * zoom;
@@ -91,6 +126,7 @@ export const shapeDomRenderer = (model, element, renderer) => {
     const { zoom } = renderer.viewport;
     const unscaledWidth = model.w;
     const unscaledHeight = model.h;
+    const retained = getRetainedShapeDom(element);
     const fillColor = renderer.getColorValue(model.fillColor, DefaultTheme.shapeFillColor, true);
     const strokeColor = renderer.getColorValue(model.strokeColor, DefaultTheme.shapeStrokeColor, true);
     element.style.width = `${unscaledWidth * zoom}px`;
@@ -104,6 +140,7 @@ export const shapeDomRenderer = (model, element, renderer) => {
         // For diamond and triangle, fill and border are handled by inline SVG
         element.style.border = 'none'; // Ensure no standard CSS border interferes
         element.style.backgroundColor = 'transparent'; // Host element is transparent
+        const { polygon, svg } = getOrCreateSvg(retained, element);
         const strokeW = model.strokeWidth;
         let svgPoints = '';
         if (model.shapeType === 'diamond') {
@@ -140,14 +177,7 @@ export const shapeDomRenderer = (model, element, renderer) => {
             : 'none';
         // Determine fill color
         const finalFillColor = model.filled ? fillColor : 'transparent';
-        // Build SVG safely with DOM-API
-        const SVG_NS = 'http://www.w3.org/2000/svg';
-        const svg = document.createElementNS(SVG_NS, 'svg');
-        svg.setAttribute('width', '100%');
-        svg.setAttribute('height', '100%');
         svg.setAttribute('viewBox', `0 0 ${unscaledWidth} ${unscaledHeight}`);
-        svg.setAttribute('preserveAspectRatio', 'none');
-        const polygon = document.createElementNS(SVG_NS, 'polygon');
         polygon.setAttribute('points', svgPoints);
         polygon.setAttribute('fill', finalFillColor);
         polygon.setAttribute('stroke', finalStrokeColor);
@@ -155,18 +185,17 @@ export const shapeDomRenderer = (model, element, renderer) => {
         if (finalStrokeDasharray !== 'none') {
             polygon.setAttribute('stroke-dasharray', finalStrokeDasharray);
         }
-        svg.append(polygon);
-        // Replace existing children to avoid memory leaks
-        element.replaceChildren(svg);
+        else {
+            polygon.removeAttribute('stroke-dasharray');
+        }
     }
     else {
         // Standard rendering for other shapes (e.g., rect, ellipse)
-        // innerHTML was already cleared by applyShapeSpecificStyles if necessary
+        removeSvg(retained);
         element.style.backgroundColor = model.filled ? fillColor : 'transparent';
         applyBorderStyles(model, element, strokeColor, zoom); // Uses standard CSS border
     }
     applyTransformStyles(model, element);
-    element.style.zIndex = renderer.layerManager.getZIndex(model).toString();
     manageClassNames(model, element);
     applyShadowStyles(model, element, renderer);
 };

package/dist/_pkgs/affine-gfx-shape/index.d.ts

@@ -6,7 +6,7 @@ export * from './element-view.js';
 export * from './overlay/index.js';
 export * from './polygon-tool.js';
 export * from './shape-tool.js';
-export * from './shortcuts.js';
+export * from './commands.js';
 export * from './text/index.js';
 export * from './text-fit.js';
 export * from './toolbar/index.js';

package/dist/_pkgs/affine-gfx-shape/index.js

@@ -6,7 +6,7 @@ export * from './element-view.js';
 export * from './overlay/index.js';
 export * from './polygon-tool.js';
 export * from './shape-tool.js';
-export * from './shortcuts.js';
+export * from './commands.js';
 export * from './text/index.js';
 export * from './text-fit.js';
 export * from './toolbar/index.js';

package/dist/_pkgs/affine-gfx-shape/text/edgeless-shape-text-editor.d.ts

@@ -5,6 +5,7 @@ import { nothing } from 'lit';
 export declare function mountShapeTextEditor(shapeElement: ShapeElementModel, edgeless: BlockComponent): void;
 declare const EdgelessShapeTextEditor_base: typeof ShadowlessElement & import("../../global/utils/types.js").Constructor<import("../../global/lit/with-disposable.js").DisposableClass>;
 export declare class EdgelessShapeTextEditor extends EdgelessShapeTextEditor_base {
+    private _compositionUpdateRaf;
     private _keeping;
     private _lastXYWH;
     private _resizeObserver;
@@ -17,6 +18,31 @@ export declare class EdgelessShapeTextEditor extends EdgelessShapeTextEditor_bas
     private _initMindmapKeyBindings;
     private _stashMindMapTree;
     private _unmount;
+    private _cancelScheduledElementWHUpdate;
+    /**
+     * While an IME composition is in progress the text is only in the DOM, not
+     * yet in the model, so `renderComplete` never fires and the shape keeps the
+     * size it had before the user started composing — the preedit string spills
+     * out of it. Remeasure once per frame instead, and once more when the
+     * composition ends.
+     */
+    private _scheduleElementWHUpdate;
+    private _getInlineEditorContentRect;
+    /**
+     * The size the shape should take, measured on the editor DOM.
+     *
+     * Without a numeric `maxWidth` the editor box *is* the text box, so its own
+     * offset size is the whole measure. Every framework shape (Wardley, EDGY,
+     * DDD, Cynefin) is in that case, and takes exactly the path it took before
+     * mind map nodes gained a maximum width.
+     *
+     * With a numeric `maxWidth` the box is capped by CSS and wraps, so
+     * `offsetWidth` alone no longer describes the text: a preedit string the
+     * browser has not reflowed yet extends past the box it is painted in. Take
+     * the widest measure available, then clamp it back to `maxWidth` so the
+     * shape never grows past the cap.
+     */
+    private _measureEditorSize;
     private _updateElementWH;
     connectedCallback(): void;
     firstUpdated(): void;