@adecore/editor-react 0.21.1 → 0.21.2

package/dist/rename.js

@@ -1,9 +1,11 @@
 import { StaleResultError } from '@adecore/lsp';
+import { lineTextOf } from './line-text.js';
 import { occurrencesOf, renamePreviewOf, renameTargetOf, wordRangeAt } from './rename-model.js';
 import { isShortcut } from './shortcut-keys.js';
+import { messageOf } from './error-message.js';
 const METHOD = 'textDocument/rename';
 const TOAST_ID = 'language-rename';
-/* How many names are offered, and how many other lines and files are read to say how the symbol is used. */
+/* How much is read to tell a name suggester how the symbol is used: its first places, other files and lines around it. */
 const SAMPLE_LOCATIONS = 8;
 const SAMPLE_OTHER_FILES = 3;
 const CONTEXT_LINES = 3;
@@ -13,9 +15,6 @@ const CONTEXT_LINES = 3;
  * Edits to other files land as unsaved drafts (`applyWorkspaceEdit`), so nothing is written to disk here.
  */
 export class RenameFeature {
-    tell(kind, title) {
-        this.language.project.host.notify?.({ id: TOAST_ID, kind, title });
-    }
     language;
     session = null;
     constructor(language) {
@@ -60,7 +59,7 @@ export class RenameFeature {
             }
             return;
         }
-        const target = renameTargetOf(answer, (range) => editor.textInRange(range), () => wordRangeAt(editor.textInRange({ start: { line: caret.line, character: 0 }, end: { line: caret.line, character: Number.MAX_SAFE_INTEGER } }), caret));
+        const target = renameTargetOf(answer, (range) => editor.textInRange(range), () => wordRangeAt(lineTextOf(editor, caret.line), caret));
         if (target === null) {
             this.tell('error', this.say('nothing'));
             return;
@@ -110,7 +109,7 @@ export class RenameFeature {
         }
         catch (error) {
             if (this.session === session) {
-                this.fail(error instanceof StaleResultError ? this.say('stale') : error instanceof Error ? error.message : String(error));
+                this.fail(error instanceof StaleResultError ? this.say('stale') : messageOf(error));
             }
         }
     }
@@ -127,6 +126,12 @@ export class RenameFeature {
         }
         this.finish();
     }
+    /* The name was changed, which answers the failure under it. */
+    edited() {
+        if (this.language.popups.getState().rename?.error != null) {
+            this.publish({ error: null });
+        }
+    }
     async apply(session) {
         const result = await this.language.project.applyWorkspaceEdit(session.edit);
         if (this.session !== session) {
@@ -146,12 +151,6 @@ export class RenameFeature {
             this.publish({ phase: 'input', busy: false, files: [], error: this.say('failed', { message }) });
         }
     }
-    /* The name was changed, which answers the failure under it. */
-    edited() {
-        if (this.language.popups.getState().rename?.error != null) {
-            this.publish({ error: null });
-        }
-    }
     finish() {
         this.session?.names.abort();
         this.session = null;
@@ -251,6 +250,9 @@ export class RenameFeature {
             }
         });
     }
+    tell(kind, title) {
+        this.language.project.host.notify?.({ id: TOAST_ID, kind, title });
+    }
     say(key, options) {
         return this.language.project.i18n.t(`editor:language.rename.${key}`, options);
     }

package/dist/review-group.d.ts

@@ -9,6 +9,7 @@ export declare class ReviewGroup {
     hide(runIds: readonly string[]): void;
     show(runIds: readonly string[]): void;
     refresh(): void;
+    private each;
 }
 export declare function joinReviewGroup(key: string): {
     group: ReviewGroup;

package/dist/review-group.js

@@ -12,31 +12,27 @@ export class ReviewGroup {
         };
     }
     hide(runIds) {
-        for (const member of [...this.members]) {
-            member.hide(runIds);
-        }
+        this.each((member) => member.hide(runIds));
     }
     show(runIds) {
-        for (const member of [...this.members]) {
-            member.show(runIds);
-        }
+        this.each((member) => member.show(runIds));
     }
     refresh() {
+        this.each((member) => member.refresh());
+    }
+    /* Over a copy, since a member may leave while it hears. */
+    each(action) {
         for (const member of [...this.members]) {
-            member.refresh();
+            action(member);
         }
     }
 }
 const groups = new Map();
 /* The host supplies a shared file key; the group is released with its last editor. */
 export function joinReviewGroup(key) {
-    let entry = groups.get(key);
-    if (entry === undefined) {
-        entry = { group: new ReviewGroup(), holders: 0 };
-        groups.set(key, entry);
-    }
-    entry.holders++;
-    const held = entry;
+    const held = groups.get(key) ?? { group: new ReviewGroup(), holders: 0 };
+    groups.set(key, held);
+    held.holders++;
     let left = false;
     return {
         group: held.group,

package/dist/row-host.d.ts

@@ -5,29 +5,13 @@ export interface HostedRow {
     placement: 'above' | 'below';
     height: number;
 }
-export declare class RowHost {
-    private readonly editor;
-    private readonly owner;
-    private readonly containers;
-    private readonly listeners;
-    private version;
-    private signature;
-    constructor(editor: Editor, owner: string);
-    getVersion: () => number;
-    subscribe: (listener: () => void) => (() => void);
-    container(id: string): HTMLElement | undefined;
-    set(rows: readonly HostedRow[]): void;
-    clear(): void;
-    private mounted;
-    private bump;
-}
 export interface HostedAction {
     id: string;
     line: number;
 }
-export declare class LineActionHost {
-    private readonly editor;
-    private readonly owner;
+declare abstract class ContainerHost {
+    protected readonly editor: Editor;
+    protected readonly owner: string;
     private readonly containers;
     private readonly listeners;
     private version;
@@ -36,7 +20,16 @@ export declare class LineActionHost {
     getVersion: () => number;
     subscribe: (listener: () => void) => (() => void);
     container(id: string): HTMLElement | undefined;
+    protected replace(signature: string, ids: readonly string[]): boolean;
+    protected mounted(id: string, container: HTMLElement): void;
+    protected bump(): void;
+}
+export declare class RowHost extends ContainerHost {
+    set(rows: readonly HostedRow[]): void;
+    clear(): void;
+}
+export declare class LineActionHost extends ContainerHost {
     set(actions: readonly HostedAction[]): void;
     clear(): void;
-    private bump;
 }
+export {};

package/dist/row-host.js

@@ -1,9 +1,5 @@
-/*
- * The rows of one owner in an editor, and the elements the editor draws them in, so React can portal
- * into them. The editor makes an element again whenever its row scrolls back into view, which is why a
- * row's content never keeps state of its own.
- */
-export class RowHost {
+/* The elements an editor made for one owner's entries, and a version React reads them by. */
+class ContainerHost {
     editor;
     owner;
     containers = new Map();
@@ -24,19 +20,42 @@ export class RowHost {
     container(id) {
         return this.containers.get(id);
     }
-    /* Sets the owner's rows; the same rows again are left alone, so an editor does not measure them twice. */
-    set(rows) {
-        const signature = rows.map((row) => `${row.id}@${row.line}${row.placement}`).join('|');
+    /* False for the same entries again, so an editor does not measure them twice; otherwise drops the elements of entries that left. */
+    replace(signature, ids) {
         if (signature === this.signature) {
-            return;
+            return false;
         }
         this.signature = signature;
-        const kept = new Set(rows.map((row) => row.id));
+        const kept = new Set(ids);
         for (const id of [...this.containers.keys()]) {
             if (!kept.has(id)) {
                 this.containers.delete(id);
             }
         }
+        return true;
+    }
+    mounted(id, container) {
+        this.containers.set(id, container);
+        this.bump();
+    }
+    bump() {
+        this.version++;
+        for (const listener of [...this.listeners]) {
+            listener();
+        }
+    }
+}
+/*
+ * The rows of one owner in an editor, and the elements the editor draws them in, so React can portal
+ * into them. The editor makes an element again whenever its row scrolls back into view, which is why a
+ * row's content never keeps state of its own.
+ */
+export class RowHost extends ContainerHost {
+    set(rows) {
+        const signature = rows.map((row) => `${row.id}@${row.line}${row.placement}`).join('|');
+        if (!this.replace(signature, rows.map((row) => row.id))) {
+            return;
+        }
         this.editor.setWidgets(rows.map((row) => ({
             id: row.id,
             line: row.line,
@@ -49,72 +68,26 @@ export class RowHost {
     clear() {
         this.set([]);
     }
-    mounted(id, container) {
-        this.containers.set(id, container);
-        this.bump();
-    }
-    bump() {
-        this.version++;
-        for (const listener of [...this.listeners]) {
-            listener();
-        }
-    }
 }
 /*
  * The actions of one owner after the end of lines in an editor, and the elements the editor makes for
  * them. An element lives as long as its action does, unlike a row's, so what React draws into it keeps
  * its state.
  */
-export class LineActionHost {
-    editor;
-    owner;
-    containers = new Map();
-    listeners = new Set();
-    version = 0;
-    signature = '';
-    constructor(editor, owner) {
-        this.editor = editor;
-        this.owner = owner;
-    }
-    getVersion = () => this.version;
-    subscribe = (listener) => {
-        this.listeners.add(listener);
-        return () => {
-            this.listeners.delete(listener);
-        };
-    };
-    container(id) {
-        return this.containers.get(id);
-    }
+export class LineActionHost extends ContainerHost {
     set(actions) {
         const signature = actions.map((action) => `${action.id}@${action.line}`).join('|');
-        if (signature === this.signature) {
+        if (!this.replace(signature, actions.map((action) => action.id))) {
             return;
         }
-        this.signature = signature;
-        const kept = new Set(actions.map((action) => action.id));
-        for (const id of [...this.containers.keys()]) {
-            if (!kept.has(id)) {
-                this.containers.delete(id);
-            }
-        }
         this.editor.setLineActions(actions.map((action) => ({
             id: action.id,
             line: action.line,
-            render: (container) => {
-                this.containers.set(action.id, container);
-                this.bump();
-            }
+            render: (container) => this.mounted(action.id, container)
         })), this.owner);
         this.bump();
     }
     clear() {
         this.set([]);
     }
-    bump() {
-        this.version++;
-        for (const listener of [...this.listeners]) {
-            listener();
-        }
-    }
 }

package/dist/semantic-model.js

@@ -1,10 +1,8 @@
 /*
- * The TextMate scopes a classification stands for, so the editor's theme colors it the way its own
- * grammar colors the same thing. Null where the grammar already did better: a keyword, a string, a
- * local variable. A function being called, a method, a static member and a declaration are scopes of
- * their own, as the platform's color scheme tells them apart. `scoped` says the server marks what is
- * local to a function, so a variable it leaves unmarked lives at the top of a file or comes from a
- * library, which the scheme draws as a global.
+ * The TextMate scopes a classification stands for, so the theme colors it as its grammar would; null where
+ * the grammar already did better (a keyword, a string, a local variable). Calls, methods, statics and
+ * declarations get scopes of their own, as the color scheme tells them apart. `scoped` says the server
+ * marks what is local to a function, so a variable it leaves unmarked is drawn as a global.
  */
 export function scopesOf(type, modifiers, scoped = false) {
     switch (type) {

package/dist/semantic-tokens.js

@@ -4,10 +4,8 @@ import { realTimers } from './timers.js';
 const METHOD = 'textDocument/semanticTokens/full';
 const PAUSE_MS = 200;
 /*
- * Colors the editor draws from what the language servers know, over what the grammar made of the text:
- * a class is a class and a call is a call where the grammar could only guess. It asks after a pause in
- * typing and when a server says its offer changed, and keeps drawing the last answer, which follows its
- * text through edits, in between, so the colors never blink out while the next one is on its way.
+ * Colors from what the language servers know, over the grammar's guess. It asks after a pause in typing
+ * and when a server's offer changed, and keeps drawing the last answer meanwhile so the colors never blink out.
  */
 export class SemanticTokensFeature {
     refresher;

package/dist/signature.js

@@ -57,7 +57,7 @@ export class SignatureFeature {
     trigger() {
         this.ask({ triggerKind: 2, triggerCharacter: '(', isRetrigger: false });
     }
-    /* Shows the next overload, or the one before, while the card is up and has more than one; false when it has not, which leaves the arrow to the caret. */
+    /* Shows the next or previous overload; false when the card has fewer than two, which leaves the arrow to the caret. */
     cycle(step) {
         const { help } = this;
         if (help === null || help.signatures.length < 2 || !this.isOpen) {

package/dist/snippet-session.js

@@ -7,10 +7,9 @@ export function positionInInsertion(start, text, offset) {
         : { line: start.line + lines.length - 1, character: lines[lines.length - 1].length };
 }
 /*
- * The tab stops of a snippet that was just inserted. The caret goes to the first one, with its default text
- * selected; Tab goes on to the next and Shift+Tab back, and the last stop (`$0`, or the end of the text)
- * ends it. Escape, a caret that leaves the snippet and any change that is not typing end it too. Typing in
- * a stop does not touch the others: they follow the text, but a mirror of a stop is not edited along.
+ * The tab stops of a snippet that was just inserted. Tab and Shift+Tab move between them; the last stop,
+ * Escape, a caret that leaves the snippet and any change that is not typing end it. A mirror of a stop
+ * follows the text but is not edited along.
  */
 export class SnippetFeature {
     language;

package/dist/symbol-links.js

@@ -1,7 +1,7 @@
 /* The classes a name in a signature has: a pointer and an underline on hover, and the accent only then, so the signature stays calm. */
 export const SYMBOL_LINK_CLASS = 'cursor-pointer hover:text-accent hover:underline';
-/* A name that reads as a type: it starts with a capital and has a lowercase letter, which leaves `DEFAULT_WEIGHTS` and `T` alone. */
 const TYPE_NAME = /^[A-Z][A-Za-z0-9_]*$/;
+/* A name that starts with a capital and has a lowercase letter, which leaves `DEFAULT_WEIGHTS` and `T` alone. */
 export function isTypeName(name) {
     return TYPE_NAME.test(name) && /[a-z]/.test(name);
 }
@@ -17,7 +17,7 @@ const DECLARES = /\b(?:class|interface|enum|trait|type|namespace|struct|function
 export function declaredNameOf(code) {
     return DECLARES.exec(code)?.[1] ?? null;
 }
-/* What a workspace symbol is that a type name can mean. */
+/* The symbol kinds a type name can mean: module, namespace, class, enum, interface, struct and type parameter. */
 const TYPE_KINDS = new Set([2, 3, 5, 10, 11, 23, 26]);
 /*
  * The places a type name leads to among the symbols a server found for it. Only symbols of exactly that name

package/dist/symbol-picker-model.js

@@ -32,6 +32,7 @@ const GROUP_OF_KIND = {
 export function groupOfKind(kind) {
     return GROUP_OF_KIND[kind] ?? 'other';
 }
+const ENUM_MEMBER = 22;
 const LETTERS = {
     namespaces: 'N',
     classes: 'C',
@@ -46,17 +47,22 @@ const LETTERS = {
 };
 /* The letter in the badge in front of a symbol. */
 export function letterOfKind(kind) {
-    return kind === 22 ? 'e' : LETTERS[groupOfKind(kind)];
+    return kind === ENUM_MEMBER ? 'e' : LETTERS[groupOfKind(kind)];
 }
+const TONES = {
+    namespaces: 'other',
+    classes: 'type',
+    interfaces: 'type',
+    enums: 'type',
+    functions: 'callable',
+    methods: 'callable',
+    properties: 'value',
+    variables: 'value',
+    constants: 'value',
+    other: 'other'
+};
 export function toneOfKind(kind) {
-    const group = groupOfKind(kind);
-    return group === 'functions' || group === 'methods'
-        ? 'callable'
-        : group === 'classes' || group === 'interfaces' || group === 'enums'
-            ? 'type'
-            : group === 'properties' || group === 'variables' || group === 'constants'
-                ? 'value'
-                : 'other';
+    return TONES[groupOfKind(kind)];
 }
 function isHierarchical(symbols) {
     return symbols.length > 0 && 'selectionRange' in symbols[0];

package/dist/symbol-picker.js

@@ -2,6 +2,7 @@ import { StaleResultError } from '@adecore/lsp';
 import { basenameOf } from './paths.js';
 import { entriesOf, workspaceEntriesOf } from './symbol-picker-model.js';
 import { isShortcut } from './shortcut-keys.js';
+import { messageOf } from './error-message.js';
 const TOAST_ID = 'language-symbols';
 /*
  * Go to symbol: a picker over the symbols the language servers know in the file, filtered as it is typed.
@@ -39,7 +40,7 @@ export class SymbolPickerFeature {
                 this.language.project.host.notify?.({
                     id: TOAST_ID,
                     kind: 'error',
-                    title: this.language.project.i18n.t('editor:language.symbols.failed', { message: error instanceof Error ? error.message : String(error) })
+                    title: this.language.project.i18n.t('editor:language.symbols.failed', { message: messageOf(error) })
                 });
             }
         }

package/dist/symbols.d.ts

@@ -1,7 +1,13 @@
 import type { EditorBlock } from '@adecore/editor';
-import type { DocumentSymbolResult } from '@adecore/lsp';
+import type { DocumentSymbolResult, Range } from '@adecore/lsp';
 import type { EditorLanguage } from './editor-language.ts';
 import { type Timers } from './timers.ts';
+export interface SymbolSpan {
+    readonly name: string;
+    readonly kind: number;
+    readonly range: Range;
+}
+export declare function symbolSpansOf(result: DocumentSymbolResult): SymbolSpan[];
 export declare function blocksOf(result: DocumentSymbolResult): EditorBlock[];
 export declare class SymbolsFeature {
     private readonly refresher;

package/dist/symbols.js

@@ -17,40 +17,34 @@ const KINDS = {
     14: 'constant',
     23: 'struct'
 };
-function isHierarchical(symbols) {
-    return symbols.length > 0 && 'range' in symbols[0];
-}
-function blockOf(name, kind, startLine, endLine) {
-    const label = KINDS[kind];
-    // A one-line symbol has no body to pin, and a property or an enum member is part of the block around it.
-    return label === undefined || endLine <= startLine ? null : { startLine: startLine + 1, endLine: endLine + 1, name, kind: label };
-}
-function walk(symbols, blocks) {
+function walk(symbols, spans) {
     for (const symbol of symbols) {
-        const block = blockOf(symbol.name, symbol.kind, symbol.range.start.line, symbol.range.end.line);
-        if (block !== null) {
-            blocks.push(block);
-        }
-        walk(symbol.children ?? [], blocks);
+        spans.push({ name: symbol.name, kind: symbol.kind, range: symbol.range });
+        walk(symbol.children ?? [], spans);
     }
 }
-/* The multi-line symbols of a file as blocks, outermost first, in one-based lines. */
-export function blocksOf(result) {
-    const blocks = [];
+/* Every symbol of an answer, a parent before its children, whether the server sent a tree or a flat list. */
+export function symbolSpansOf(result) {
+    const spans = [];
     if (result === null || result.length === 0) {
-        return blocks;
-    }
-    if (isHierarchical(result)) {
-        walk(result, blocks);
+        return spans;
     }
-    else {
-        for (const symbol of result) {
-            const block = blockOf(symbol.name, symbol.kind, symbol.location.range.start.line, symbol.location.range.end.line);
-            if (block !== null) {
-                blocks.push(block);
-            }
-        }
+    if ('range' in result[0]) {
+        walk(result, spans);
+        return spans;
     }
+    return result.map((symbol) => ({ name: symbol.name, kind: symbol.kind, range: symbol.location.range }));
+}
+function blockOf({ name, kind, range }) {
+    const label = KINDS[kind];
+    // A one-line symbol has no body to pin, and a property or an enum member is part of the block around it.
+    return label === undefined || range.end.line <= range.start.line
+        ? null
+        : { startLine: range.start.line + 1, endLine: range.end.line + 1, name, kind: label };
+}
+/* The multi-line symbols of a file as blocks, outermost first, in one-based lines. */
+export function blocksOf(result) {
+    const blocks = symbolSpansOf(result).flatMap((span) => blockOf(span) ?? []);
     return blocks.sort((left, right) => left.startLine - right.startLine || right.endLine - left.endLine);
 }
 /*

package/dist/testing.js

@@ -1,4 +1,4 @@
-import { applyContentChanges, LspError, StaleResultError } from '@adecore/lsp';
+import { applyContentChanges, ErrorCodes, LspError, StaleResultError } from '@adecore/lsp';
 export { ManualTimers } from './timers.js';
 export class FakeLanguageService {
     documents = new Map();
@@ -20,7 +20,7 @@ export class FakeLanguageService {
     async changeDocument(uri, changes) {
         const held = this.documents.get(uri);
         if (held === undefined) {
-            throw new LspError('Document is not open', -32002);
+            throw new LspError('Document is not open', ErrorCodes.ServerNotInitialized);
         }
         held.text = applyContentChanges(held.text, changes);
         held.version++;
@@ -56,7 +56,7 @@ export class FakeLanguageService {
     }
     async request(method, uri, params, options = {}) {
         if (!this.supports(method, uri)) {
-            throw new LspError(`${method} is unavailable`, -32601);
+            throw new LspError(`${method} is unavailable`, ErrorCodes.MethodNotFound);
         }
         options.signal?.throwIfAborted();
         const version = this.documents.get(uri)?.version;

package/dist/word-diff.js

@@ -2,10 +2,8 @@ import { diffLines } from '@adecore/merge';
 /* A word, a run of spaces or one other character, so a change inside a line is found by word and not by letter. */
 const TOKEN = /\w+|\s+|[^\w\s]/g;
 /*
- * The character ranges of each removed line that the added lines changed, `[start, end)` per line, for
- * the stronger tint on the words a change replaced. Lines are only compared when as many were added as
- * removed, since then each removed line has the line it became; any other change has no such pairing
- * and draws no words.
+ * The `[start, end)` ranges of each removed line that the added lines replaced. Lines pair up only when as
+ * many were added as removed; any other change has no pairing and marks no words.
  */
 export function replacedWords(removed, added) {
     return removed.map((line, index) => (removed.length === added.length ? replacedRanges(line, added[index]) : []));

package/dist/workspace-edit.js

@@ -1,4 +1,5 @@
 import { applyTextEdits, fileUriToPath } from '@adecore/lsp';
+import { messageOf } from './error-message.js';
 function refused(failureReason) {
     return { applied: false, failureReason };
 }
@@ -48,12 +49,10 @@ function contentChangeOf(edit) {
     return { range: edit.range, text: edit.newText };
 }
 /*
- * Applies an LSP workspace edit on the client, step by step in the order it says. A file an editor holds takes
- * its edits as one undo step. Any other file gets its new text as an unsaved draft that a person saves, and
- * nothing is written to disk on a server's word alone, unless the edit also moves a file: the edits and the
- * move are then one change, so every file is saved through the machine and the move is made there. A file
- * the edit creates is made through the machine with the text the edit writes into it. The edit is checked
- * against every text first, so one that does not fit changes nothing.
+ * Applies an LSP workspace edit step by step, after checking it against every text so one that does not fit
+ * changes nothing. A file an editor holds takes its edits as one undo step; any other file gets an unsaved
+ * draft, since nothing is written to disk on a server's word alone, unless the edit also moves a file: then it
+ * is one change, saved and moved through the machine. A file the edit creates is made through the machine.
  */
 export async function applyWorkspaceEdit(edit, host) {
     const steps = stepsOf(edit);
@@ -141,7 +140,7 @@ async function plan(steps, host) {
                 created.text = applyTextEdits(created.text, step.edits);
             }
             catch (error) {
-                return error instanceof Error ? error.message : String(error);
+                return messageOf(error);
             }
             continue;
         }
@@ -165,7 +164,7 @@ async function plan(steps, host) {
             after = applyTextEdits(held.text, step.edits);
         }
         catch (error) {
-            return error instanceof Error ? error.message : String(error);
+            return messageOf(error);
         }
         planned.push({ kind: 'edits', uri: step.uri, edits: step.edits, before: held.text, after, disk: held.disk });
         texts.set(source, { text: after, disk: held.disk });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adecore/editor-react",
-  "version": "0.21.1",
+  "version": "0.21.2",
   "type": "module",
   "description": "Language-enabled editors, feature coordination and React popups over injected language services.",
   "license": "FSL-1.1-MIT",
@@ -57,9 +57,9 @@
     "test": "bun test --conditions=source"
   },
   "dependencies": {
-    "@adecore/editor": "0.21.1",
-    "@adecore/lsp": "0.21.1",
-    "@adecore/merge": "0.21.1",
+    "@adecore/editor": "0.21.2",
+    "@adecore/lsp": "0.21.2",
+    "@adecore/merge": "0.21.2",
     "lucide-react": "^1.47.0",
     "react-markdown": "^10.1.0",
     "remark-breaks": "^4.0.0",
@@ -67,7 +67,7 @@
     "zustand": "^5.0.15"
   },
   "peerDependencies": {
-    "@adecore/ui": "^0.21.1",
+    "@adecore/ui": "^0.21.2",
     "i18next": "^26.4.2",
     "react": "^19.3.0",
     "react-dom": "^19.3.0",

package/src/AnchoredPopup.tsx

@@ -14,9 +14,8 @@ export interface AnchoredPopupProps {
 }
 
 /*
- * A card next to a character of the editor, in a layer of the page itself: a canvas puts a scale on its
- * nodes, and a card inside one would be drawn at that scale and cut off by the node's edge. It is
- * placed from the character's screen rectangle, so it is right at any zoom, and it never leaves the window.
+ * A card next to a character of the editor, portaled to the page: inside a scaled canvas node it would be
+ * drawn at that scale and clipped by the node. Placed from the character's screen rectangle, so it holds at any zoom.
  */
 export function AnchoredPopup({ rect, className, children, placement, onPointerEnter, onPointerLeave }: AnchoredPopupProps) {
     const element = useRef<HTMLDivElement>(null);