@formicoidea/labre-core 0.45.0 → 0.46.1

package/dist/_pkgs/affine-shared/services/outline-panel-service.d.ts

@@ -0,0 +1,31 @@
+import type { ExtensionType } from '../../store/index.js';
+/**
+ * The outline panel (ADR 0034 §1): the document's table of contents, drawn by
+ * the host beside the editor.
+ *
+ * The library never mounts an outline itself, so there is no default: a host
+ * that draws one registers this seam, a host that does not leaves it out. Its
+ * only caller in the library is the "View in TOC" link of the toast the note
+ * toolbar shows after a note's display mode changes
+ * (`blocks/note/src/configs/toolbar.ts`). Absent or `null`, that toast offers
+ * no link, because a link that opens nothing is a lie.
+ *
+ * It replaces the `open(tabId?)` seam inherited from AFFiNE (removed in 0.46,
+ * ADR 0034 §2): one caller, which opened a tab named by a string nobody typed
+ * anywhere else. Shaped exactly like `SelectionPaneService`, so every panel
+ * the library asks a host to show answers the same two verbs.
+ */
+export interface OutlinePanelService {
+    /** Show the outline. */
+    open(): void;
+    /** Put it away. Writes nothing. */
+    close(): void;
+}
+export declare const OutlinePanelProvider: import("../../global/di/types.js").ServiceIdentifier<OutlinePanelService> & (<U extends OutlinePanelService = OutlinePanelService>(variant: import("../../global/di/types.js").ServiceVariant) => import("../../global/di/types.js").ServiceIdentifier<U>);
+/**
+ * Host seam: the host's outline panel, or `null` to say there is none.
+ *
+ * `di.override`, like `SelectionPaneExtension`, so a later registration always
+ * wins and registering twice never throws at boot.
+ */
+export declare function OutlinePanelExtension(service: OutlinePanelService | null): ExtensionType;

package/dist/_pkgs/affine-shared/services/outline-panel-service.js

@@ -0,0 +1,17 @@
+import { createIdentifier } from '../../global/di/index.js';
+export const OutlinePanelProvider = createIdentifier('AffineOutlinePanel');
+/**
+ * Host seam: the host's outline panel, or `null` to say there is none.
+ *
+ * `di.override`, like `SelectionPaneExtension`, so a later registration always
+ * wins and registering twice never throws at boot.
+ */
+export function OutlinePanelExtension(service) {
+    return {
+        setup: di => {
+            // `null` rides through the factory on purpose: `getOptional` then
+            // reports the panel as absent, which is the whole "no link" story.
+            di.override(OutlinePanelProvider, () => service);
+        },
+    };
+}

package/dist/_pkgs/affine-shared/services/translation-service/chrome.d.ts

@@ -464,6 +464,17 @@ export declare const FILL_COLOR_LABEL: ChromeWording;
  * `ROOT_TOOLBAR_CREATE_LINKED_DOC` (`blocks/root`).
  */
 export declare const TOOLBAR_CREATE_LINKED_DOC_TITLE: ChromeWording;
+/**
+ * "Turn into" — the block toolbar's conversions dropdown, said identically by
+ * the note's text row and the callout's own row (#468). Was
+ * `ROOT_TOOLBAR_TURN_INTO` (`blocks/root`); the key is kept.
+ */
+export declare const TOOLBAR_TURN_INTO: ChromeWording;
+/**
+ * …and that dropdown's accessible name. Was `ROOT_TOOLBAR_CONVERSIONS_ARIA`
+ * (`blocks/root`); the key is kept.
+ */
+export declare const TOOLBAR_CONVERSIONS_ARIA: ChromeWording;
 /**
  * "Edgeless content" — the surface-ref placeholder's own generic reference
  * kind, said identically by the drag-handle preview's fallback label. Was

package/dist/_pkgs/affine-shared/services/translation-service/chrome.js

@@ -1034,6 +1034,23 @@ export const TOOLBAR_CREATE_LINKED_DOC_TITLE = [
     'com.labre.root.toolbar.create-linked-doc',
     'Create Linked Doc',
 ];
+/**
+ * "Turn into" — the block toolbar's conversions dropdown, said identically by
+ * the note's text row and the callout's own row (#468). Was
+ * `ROOT_TOOLBAR_TURN_INTO` (`blocks/root`); the key is kept.
+ */
+export const TOOLBAR_TURN_INTO = [
+    'com.labre.root.toolbar.turn-into',
+    'Turn into',
+];
+/**
+ * …and that dropdown's accessible name. Was `ROOT_TOOLBAR_CONVERSIONS_ARIA`
+ * (`blocks/root`); the key is kept.
+ */
+export const TOOLBAR_CONVERSIONS_ARIA = [
+    'com.labre.root.toolbar.conversions',
+    'Conversions',
+];
 /**
  * "Edgeless content" — the surface-ref placeholder's own generic reference
  * kind, said identically by the drag-handle preview's fallback label. Was
@@ -1283,6 +1300,8 @@ export const CHROME_WORDINGS = [
     COLOR_LABEL,
     FILL_COLOR_LABEL,
     TOOLBAR_CREATE_LINKED_DOC_TITLE,
+    TOOLBAR_TURN_INTO,
+    TOOLBAR_CONVERSIONS_ARIA,
     EDGELESS_CONTENT_LABEL,
     TOOLBAR_EDIT,
     TOOLBAR_REMOVE_LINK,

package/dist/_pkgs/affine-shared/utils/index.d.ts

@@ -18,6 +18,7 @@ export * from './label-mode.js';
 export * from './link-preview-refresh.js';
 export * from './math.js';
 export * from './model/index.js';
+export * from './panel-reorder-drag.js';
 export * from './popper-position.js';
 export * from './print-to-pdf.js';
 export * from './reference.js';

package/dist/_pkgs/affine-shared/utils/index.js

@@ -18,6 +18,7 @@ export * from './label-mode.js';
 export * from './link-preview-refresh.js';
 export * from './math.js';
 export * from './model/index.js';
+export * from './panel-reorder-drag.js';
 export * from './popper-position.js';
 export * from './print-to-pdf.js';
 export * from './reference.js';

package/dist/_pkgs/affine-shared/utils/panel-reorder-drag.d.ts

@@ -0,0 +1,85 @@
+/**
+ * The ONE drag-to-reorder gesture of the side panels (ADR 0034):
+ * the frame panel's cards and the selection pane's rows.
+ *
+ * Why it exists: the two panels each wrote their own drag and the two
+ * drifted. The frame panel's (`fragments/frame-panel/src/utils/drag.ts`, now
+ * deleted) ran on mouse events, never refused a read-only document, drew the
+ * drop line at 0 for a drop after the last card, and had no way out but the
+ * release. The selection pane's (hand-written in `selection-pane-widget.ts`)
+ * ran on pointer events, refused read-only and showed a `not-allowed` cursor,
+ * and swallowed Escape. Only the threshold was shared, and a comment held the
+ * rest together. Both panels now hand this controller what is theirs — the
+ * rows, the drop rule, the ghost, the write — and it owns the gesture:
+ *
+ * - pointer events, listened to on the document in the CAPTURE phase from the
+ *   press to the end, so a panel that stops its own events' propagation (the
+ *   pane does, to keep the canvas out of them) still sees every move;
+ * - a read-only document never starts one: the press adds no listener;
+ * - a press becomes a drag past {@link panelDragStarted} — called here and
+ *   nowhere else — and only then is anything picked up;
+ * - over the whole viewport, a mask carries the cursor: `grabbing` over a gap
+ *   that takes the drop, `not-allowed` elsewhere (its geometry stays in each
+ *   panel's stylesheet, the controller sets the cursor and nothing else);
+ * - Escape or `pointercancel` CANCELS: nothing is written, the release that
+ *   follows writes nothing, and the Escape does not reach the panel (which
+ *   would close it);
+ * - the click that follows a release or a cancel is not a click: the panel
+ *   asks {@link PanelReorderDrag.consumeSwallowedClick} in its click handler.
+ *
+ * Multi-selection is the panel's business: `onPickUp` decides what moves,
+ * `dropAt` skips the rows that move with it.
+ */
+/** A pointer position, in client coordinates. */
+export interface PanelDragPoint {
+    clientX: number;
+    clientY: number;
+}
+export interface PanelReorderDragOptions<Drop> {
+    /** Read at the press: a read-only document never starts a drag. */
+    readonly: () => boolean;
+    /** The rows, top first, read LIVE at every move. */
+    rows: () => readonly HTMLElement[];
+    /** The box a drop must land in; outside it, or `null`, refuses. */
+    bounds: () => HTMLElement | null;
+    /** The press became a drag: select what moves, build the ghost. */
+    onPickUp: (press: PanelDragPoint) => void;
+    /**
+     * What a release at the gap `gap` — before `rows()[gap]`, `rows().length`
+     * after the last — would do, or `null` to refuse it.
+     */
+    dropAt: (gap: number, point: PanelDragPoint) => Drop | null;
+    /** Every move of a drag: draw the ghost at `ghost`, the line for `drop`. */
+    onMove: (drop: Drop | null, ghost: PanelDragPoint) => void;
+    /** The release, over a gap that takes it. Before `onEnd`. */
+    onDrop: (drop: Drop) => void;
+    /** A drag ended — dropped, refused, cancelled or disposed. Always last. */
+    onEnd: () => void;
+    /** The cursor mask: appended to `host()` on pick-up, removed at the end. */
+    mask: {
+        host: () => ParentNode | null;
+        className: string;
+        testId?: string;
+    };
+    /** Carries `data-drag="valid" | "invalid"` while a drag is live. */
+    stateHost?: () => HTMLElement | null;
+}
+export interface PanelReorderDrag {
+    /** Hand it the row's `pointerdown`. */
+    press(event: PointerEvent): void;
+    /**
+     * Whether the click being handled follows a drag's release or cancel —
+     * answered `true` once, then `false`.
+     */
+    consumeSwallowedClick(): boolean;
+    /** Whether a press has become a drag that has not ended yet. */
+    readonly dragging: boolean;
+    /** Ends a live drag (`onEnd`, nothing written) and removes the listeners. */
+    dispose(): void;
+}
+/**
+ * The gap a pointer at `clientY` is over: how many rows have their middle
+ * above it. `0` is before the first row, `rects.length` after the last.
+ */
+export declare function panelReorderGap(rects: readonly DOMRect[], clientY: number): number;
+export declare function createPanelReorderDrag<Drop>(options: PanelReorderDragOptions<Drop>): PanelReorderDrag;

package/dist/_pkgs/affine-shared/utils/panel-reorder-drag.js

@@ -0,0 +1,162 @@
+import { panelDragStarted } from '../styles/panel-header.js';
+/**
+ * The gap a pointer at `clientY` is over: how many rows have their middle
+ * above it. `0` is before the first row, `rects.length` after the last.
+ */
+export function panelReorderGap(rects, clientY) {
+    let gap = 0;
+    for (const rect of rects) {
+        if (clientY > rect.top + rect.height / 2)
+            gap++;
+    }
+    return gap;
+}
+export function createPanelReorderDrag(options) {
+    let start = null;
+    let dragging = false;
+    let listening = null;
+    let mask = null;
+    let swallowClick = false;
+    const point = (event) => ({
+        clientX: event.clientX,
+        clientY: event.clientY,
+    });
+    const resolve = (at) => {
+        const bounds = options.bounds();
+        if (!bounds)
+            return null;
+        const box = bounds.getBoundingClientRect();
+        if (at.clientX < box.left ||
+            at.clientX > box.right ||
+            at.clientY < box.top ||
+            at.clientY > box.bottom) {
+            return null;
+        }
+        const rects = options.rows().map(row => row.getBoundingClientRect());
+        return options.dropAt(panelReorderGap(rects, at.clientY), at);
+    };
+    const show = (drop) => {
+        if (mask)
+            mask.style.cursor = drop ? 'grabbing' : 'not-allowed';
+        const host = options.stateHost?.();
+        if (host)
+            host.dataset.drag = drop ? 'valid' : 'invalid';
+    };
+    const unlisten = () => {
+        if (!listening)
+            return;
+        listening.removeEventListener('pointermove', onPointerMove, true);
+        listening.removeEventListener('pointerup', onPointerUp, true);
+        listening.removeEventListener('pointercancel', onPointerCancel, true);
+        listening.removeEventListener('keydown', onKeydown, true);
+        listening = null;
+    };
+    /** Back to idle; `onEnd` only when something was picked up. */
+    const finish = () => {
+        unlisten();
+        start = null;
+        if (!dragging)
+            return;
+        dragging = false;
+        mask?.remove();
+        mask = null;
+        const host = options.stateHost?.();
+        if (host)
+            delete host.dataset.drag;
+        options.onEnd();
+    };
+    const cancel = () => {
+        if (dragging)
+            swallowClick = true;
+        finish();
+    };
+    const pickUp = (event) => {
+        dragging = true;
+        const host = options.mask.host();
+        if (host) {
+            const doc = event.target?.ownerDocument ?? document;
+            mask = doc.createElement('div');
+            mask.className = options.mask.className;
+            if (options.mask.testId)
+                mask.dataset.testid = options.mask.testId;
+            mask.style.cursor = 'grabbing';
+            host.append(mask);
+        }
+        options.onPickUp({ clientX: start.x, clientY: start.y });
+    };
+    function onPointerMove(event) {
+        if (!start)
+            return;
+        if (!dragging) {
+            if (!panelDragStarted(start, { x: event.clientX, y: event.clientY })) {
+                return;
+            }
+            pickUp(event);
+        }
+        const at = point(event);
+        const drop = resolve(at);
+        show(drop);
+        options.onMove(drop, at);
+    }
+    function onPointerUp(event) {
+        if (!dragging) {
+            // A press that never became a drag: the click that follows is a click.
+            finish();
+            return;
+        }
+        const drop = resolve(point(event));
+        swallowClick = true;
+        try {
+            if (drop !== null)
+                options.onDrop(drop);
+        }
+        finally {
+            finish();
+        }
+    }
+    function onPointerCancel() {
+        cancel();
+    }
+    function onKeydown(event) {
+        if (event.key !== 'Escape')
+            return;
+        if (!dragging) {
+            // A press still under the threshold: forget it, and let the Escape do
+            // what it does in the panel.
+            finish();
+            return;
+        }
+        event.stopPropagation();
+        event.preventDefault();
+        cancel();
+    }
+    return {
+        press(event) {
+            // Any new press clears a click left armed by a release or a cancel
+            // that no click followed (released over another element).
+            swallowClick = false;
+            if (event.button !== 0 || start)
+                return;
+            if (options.readonly())
+                return;
+            start = { x: event.clientX, y: event.clientY };
+            const doc = event.target?.ownerDocument ?? document;
+            doc.addEventListener('pointermove', onPointerMove, true);
+            doc.addEventListener('pointerup', onPointerUp, true);
+            doc.addEventListener('pointercancel', onPointerCancel, true);
+            doc.addEventListener('keydown', onKeydown, true);
+            listening = doc;
+        },
+        consumeSwallowedClick() {
+            const swallowed = swallowClick;
+            swallowClick = false;
+            return swallowed;
+        },
+        get dragging() {
+            return dragging;
+        },
+        dispose() {
+            finish();
+        },
+    };
+}

package/dist/_pkgs/affine-widget-edgeless-toolbar/selection-pane/drop.d.ts

@@ -44,18 +44,19 @@ export interface PaneSlot {
  */
 export declare function paneSlotAtGap(rows: readonly PaneDropRow[], gap: number, parent: string, { lists, parentOf }: PaneLists): PaneSlot | null;
 /**
- * What a drop at `index` of `list` writes for the dragged row `dragId`: the
- * model it lands directly ABOVE (`null` = the bottom of its stack), or `null`
- * when the slot is refused.
+ * What a drop at `index` of `list` writes for the dragged rows `dragged` (one
+ * id, or the set a multi-row drag moves): the model they land directly ABOVE
+ * (`null` = the bottom of their stack), or `null` when the slot is refused.
  *
- * `stackOf(id)` names the model that stands for a row in the dragged row's
+ * `stackOf(id)` names the model that stands for a row in the dragged rows'
  * own stack — itself, or the frame it belongs to when the dragged row is a
  * loose element and that row is a frame's member (a frame's members paint
  * together, right above it) — or `undefined` for a row that is not in that
  * stack at all. A slot is refused when neither neighbour is in the stack, or
  * when both stand for the same model: the inside of a frame's block of rows,
- * where a loose element cannot be put.
+ * where a loose element cannot be put. A row that stands for a dragged model
+ * (a dragged frame's member) moves with it, so it is no neighbour either.
  */
-export declare function paneDropAbove(list: readonly SelectionPaneNode[], index: number, dragId: string, stackOf: (id: string) => string | undefined): {
+export declare function paneDropAbove(list: readonly SelectionPaneNode[], index: number, dragged: string | ReadonlySet<string>, stackOf: (id: string) => string | undefined): {
     above: string | null;
 } | null;

package/dist/_pkgs/affine-widget-edgeless-toolbar/selection-pane/drop.js

@@ -59,21 +59,24 @@ export function paneSlotAtGap(rows, gap, parent, { lists, parentOf }) {
     }
 }
 /**
- * What a drop at `index` of `list` writes for the dragged row `dragId`: the
- * model it lands directly ABOVE (`null` = the bottom of its stack), or `null`
- * when the slot is refused.
+ * What a drop at `index` of `list` writes for the dragged rows `dragged` (one
+ * id, or the set a multi-row drag moves): the model they land directly ABOVE
+ * (`null` = the bottom of their stack), or `null` when the slot is refused.
  *
- * `stackOf(id)` names the model that stands for a row in the dragged row's
+ * `stackOf(id)` names the model that stands for a row in the dragged rows'
  * own stack — itself, or the frame it belongs to when the dragged row is a
  * loose element and that row is a frame's member (a frame's members paint
  * together, right above it) — or `undefined` for a row that is not in that
  * stack at all. A slot is refused when neither neighbour is in the stack, or
  * when both stand for the same model: the inside of a frame's block of rows,
- * where a loose element cannot be put.
+ * where a loose element cannot be put. A row that stands for a dragged model
+ * (a dragged frame's member) moves with it, so it is no neighbour either.
  */
-export function paneDropAbove(list, index, dragId, stackOf) {
-    const before = list.slice(0, index).filter(node => node.id !== dragId);
-    const after = list.slice(index).filter(node => node.id !== dragId);
+export function paneDropAbove(list, index, dragged, stackOf) {
+    const moving = typeof dragged === 'string' ? new Set([dragged]) : dragged;
+    const stays = (node) => !moving.has(node.id) && !moving.has(stackOf(node.id) ?? '');
+    const before = list.slice(0, index).filter(stays);
+    const after = list.slice(index).filter(stays);
     const upper = before.length
         ? stackOf(before[before.length - 1].id)
         : undefined;

package/dist/_pkgs/affine-widget-edgeless-toolbar/selection-pane/selection-pane-widget.d.ts

@@ -24,8 +24,9 @@ export declare const EDGELESS_SELECTION_PANE_WIDGET = "edgeless-selection-pane-w
  * (shift / ctrl / cmd adds or removes it, like on the canvas), the padlock
  * locks that row alone, a double-click renames a group or a frame (a frame is
  * a row at its place in the stack, ADR 0031 amendments), and a drag moves a row
- * among its siblings. Every write goes through `runCommand`, so the read-only
- * refusal and the undo step live in one place.
+ * — or, pressed on a selected row, the whole selection of one stack — among
+ * its siblings (the side panels' one drag, ADR 0034). Every write goes through
+ * `runCommand`, so the read-only refusal and the undo step live in one place.
  */
 export declare class EdgelessSelectionPaneWidget extends WidgetComponent<RootBlockModel> {
     static styles: import("lit").CSSResult;
@@ -36,19 +37,22 @@ export declare class EdgelessSelectionPaneWidget extends WidgetComponent<RootBlo
     private accessor _filter;
     /** The group row being renamed, or `null`. */
     private accessor _renaming;
-    /** Where the dragged row would land. */
+    /** Where the dragged rows would land; `null` while refused. */
     private accessor _drop;
     /** Where the dragged row's ghost is drawn, in the panel's own box. */
     private accessor _ghost;
     /** Bumped when the canvas selection changes, so the rows repaint. */
     private accessor _selectionRevision;
-    private _drag;
+    /** The drag under way, from its pick-up to its end. */
+    private accessor _drag;
+    /** The last row pressed: what a pick-up picks up. */
+    private _pressed;
+    /** The side panels' one reorder gesture, wired in `_wire()`. */
+    private _reorder;
     /** The rows of the last render, top first: what a drag hit-tests. */
     private _visibleRows;
     /** The sibling lists before the filter: what a drop is computed in. */
     private _lists;
-    /** A drag ends with a click on the row it started on; that click is not one. */
-    private _swallowNextClick;
     get paneOpen(): boolean;
     private get _gfx();
     private _setOpen;
@@ -109,7 +113,21 @@ export declare class EdgelessSelectionPaneWidget extends WidgetComponent<RootBlo
     private _onRowContextMenu;
     private _commitRename;
     private readonly _onRenameKeydown;
+    private _createReorderDrag;
+    private _panel;
+    private _paneBody;
+    /** The rows on screen, top first, with the rows they draw. */
+    private _shownRows;
     private _onRowPointerDown;
+    /**
+     * The press became a drag. A canvas row picked up is selected, as the frame
+     * panel selects a card — unless it already is, and then the whole selection
+     * moves with it, as in the frame panel: every selected row the pane lists.
+     * Rows that are not all in the pressed row's stack and list have no one
+     * place to land, so every drop of theirs is refused, honestly, with a
+     * `not-allowed` cursor rather than a line that would write nothing.
+     */
+    private _pickUp;
     /**
      * Which model stands for a row in the dragged row's own stack — the stack
      * `canvas.element.reorder` restacks it in, the models sharing its raw
@@ -119,20 +137,18 @@ export declare class EdgelessSelectionPaneWidget extends WidgetComponent<RootBlo
      * mindmap node moves with its mindmap).
      */
     private _stackOf;
-    /** Where a release at `(clientX, clientY)` would land the dragged row. */
+    /**
+     * Where a release over the gap `gap` (the controller's count of rows whose
+     * middle is above the pointer, at `clientY`) would land the dragged rows,
+     * or `null` to refuse it.
+     */
     private _dropAt;
-    private _moveGhost;
-    private readonly _onDocumentPointerMove;
-    /** A canvas row picked up is selected, as the frame panel selects a card. */
-    private _pickUp;
-    private readonly _onDocumentPointerUp;
     /**
      * One write per gesture, through the command: `layer` for a drop into a
-     * layer, one `index` for a slot. The command writes nothing when the slot
-     * is where the row already is, and a refused drop never reaches it.
+     * layer, one restack for a slot. The command writes nothing when the slot
+     * is where the rows already are, and a refused drop never reaches it.
      */
     private _commitDrop;
-    private _endDrag;
     private _renderGhost;
     private _renderDropIndicator;
     private _filterName;