@adecore/editor-react 0.17.0-beta.1 → 0.17.0

package/src/HoverCard.tsx

@@ -1,6 +1,6 @@
 import { useTranslation } from 'react-i18next';
 import { CircleX, Info, TriangleAlert } from 'lucide-react';
-import { fileUriToPath } from '@adecore/lsp';
+import { fileUriToPath, type Location } from '@adecore/lsp';
 import { Button, Icon, Tooltip } from '@adecore/ui';
 import { formatNumber } from '@adecore/ui/format';
 import type { EditorPosition } from '@adecore/editor';
@@ -13,6 +13,28 @@ import { SymbolSections } from './HoverSections.tsx';
 const SEVERITY_ICONS = { error: CircleX, warning: TriangleAlert, info: Info, hint: Info } as const;
 const SEVERITY_COLORS = { error: 'text-status-error', warning: 'text-status-needs-you', info: 'text-status-running', hint: 'text-text-muted' } as const;
 
+/*
+ * Where a definition is: only its line in the file of the card, else the file and the line, with a long name cut
+ * short before the line. A definition outside the project folder, such as the stubs of a standard library, has none.
+ */
+export function DefinitionPlace({ definition, uri, folder }: { definition: Location; uri: string; folder: string }) {
+    const { t } = useTranslation('editor');
+    const path = fileUriToPath(definition.uri);
+    const line = formatNumber(definition.range.start.line + 1);
+    if (path === null || (folder !== '' && !path.startsWith(`${folder}/`))) {
+        return null;
+    }
+    if (definition.uri === uri) {
+        return <span className="text-text-faint">{t('language.hover.line', { line })}</span>;
+    }
+    return (
+        <span className="flex min-w-0 font-mono text-text-faint">
+            <span className="truncate">{basenameOf(path)}</span>
+            <span className="shrink-0">:{line}</span>
+        </span>
+    );
+}
+
 function ProblemSection({ problem, language }: { problem: Problem; language: EditorLanguage }) {
     const { t } = useTranslation('editor');
     const { diagnostic } = problem;
@@ -75,7 +97,6 @@ export function HoverCard({
     position: EditorPosition;
 }) {
     const { t } = useTranslation('editor');
-    const place = info?.definition === null || info === null ? null : fileUriToPath(info.definition.uri);
     return (
         <div className="flex w-max min-w-[280px] max-w-[min(520px,calc(100vw-16px))] flex-col divide-y divide-border">
             {info !== null && (
@@ -87,29 +108,27 @@ export function HoverCard({
                             void language.navigation.goToName(name, anchor, name === (declared ?? info.word) ? info.definition : null);
                         }}
                     />
-                    <div className="flex items-center gap-3 px-3 py-1.5 text-xs">
-                        {info.definition !== null && (
-                            <button type="button" className="text-accent hover:underline" onClick={() => language.goTo(info.definition!)}>
-                                {t('language.hover.definition')}
-                            </button>
-                        )}
-                        {info.references !== null && info.references > 0 && (
-                            <button
-                                type="button"
-                                className="text-accent hover:underline"
-                                onClick={() => {
-                                    language.hover.hide();
-                                    void language.peek.open(position);
-                                }}
-                            >
-                                {t('language.hover.references', { count: info.references, formatted: formatNumber(info.references) })}
-                            </button>
-                        )}
-                        {place !== null && info.definition !== null && (
-                            <span className="ml-auto font-mono text-text-faint">
-                                {basenameOf(place)}:{formatNumber(info.definition.range.start.line + 1)}
-                            </span>
-                        )}
+                    <div className="flex flex-col gap-0.5 px-3 py-1.5 text-xs">
+                        <div className="flex items-center gap-3 whitespace-nowrap">
+                            {info.definition !== null && (
+                                <button type="button" className="text-accent hover:underline" onClick={() => language.goTo(info.definition!)}>
+                                    {t('language.hover.definition')}
+                                </button>
+                            )}
+                            {info.references !== null && info.references > 0 && (
+                                <button
+                                    type="button"
+                                    className="text-accent hover:underline"
+                                    onClick={() => {
+                                        language.hover.hide();
+                                        void language.peek.open(position);
+                                    }}
+                                >
+                                    {t('language.hover.references', { count: info.references, formatted: formatNumber(info.references) })}
+                                </button>
+                            )}
+                        </div>
+                        {info.definition !== null && <DefinitionPlace definition={info.definition} uri={language.uri} folder={language.project.folder} />}
                     </div>
                 </>
             )}

package/src/LanguagePopups.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useReducer } from 'react';
+import { useEffect, useReducer, type ReactNode } from 'react';
 import { useStore } from 'zustand';
 import type { EditorLanguage } from './editor-language.ts';
 import { AnchoredPopup } from './AnchoredPopup.tsx';
@@ -15,9 +15,9 @@ import { SignatureCard } from './SignatureCard.tsx';
 /*
  * Every card a language feature opens over the editor. Each feature keeps its own state and these
  * only draw it, placed by the screen position of the character it belongs to, which is read again
- * whenever the editor scrolls or resizes.
+ * whenever the editor scrolls or resizes. `contextMenuItems` adds rows of the app to the context menu.
  */
-export function LanguagePopups({ language }: { language: EditorLanguage }) {
+export function LanguagePopups({ language, contextMenuItems }: { language: EditorLanguage; contextMenuItems?: (language: EditorLanguage) => ReactNode }) {
     const [, redraw] = useReducer((count: number) => count + 1, 0);
     const hover = useStore(language.popups, (state) => state.hover);
     const completion = useStore(language.popups, (state) => state.completion);
@@ -51,7 +51,11 @@ export function LanguagePopups({ language }: { language: EditorLanguage }) {
             )}
             {completion !== null && completionRect !== null && <CompletionPopup language={language} view={completion} rect={completionRect} />}
             {pick !== null && pickRect !== null && <PickPopup language={language} view={pick} rect={pickRect} />}
-            {menu !== null && <EditorContextMenu language={language} view={menu} />}
+            {menu !== null && (
+                <EditorContextMenu language={language} view={menu}>
+                    {contextMenuItems?.(language)}
+                </EditorContextMenu>
+            )}
             {symbols !== null && <SymbolPicker language={language} view={symbols} />}
             {peek !== null && <PeekPanel language={language} view={peek} />}
             {authors !== null && <CodeAuthorsCard language={language} view={authors} />}

package/src/code-actions-model.ts

@@ -107,7 +107,7 @@ function linesOf(text: string): string[] {
     return text.split(/\r\n|\r|\n/);
 }
 
-/* Null when the edit changes nothing, or creates or deletes a file, which a preview of lines cannot show. */
+/* Null when the edit changes nothing, or deletes a file, which a preview of lines cannot show. A file it creates counts as another file. */
 export function previewOf(text: string, edit: WorkspaceEdit, uri: string): EditPreview | null {
     const entries = entriesOf(edit);
     if (entries === null) {

package/src/code-actions.ts

@@ -1,4 +1,3 @@
-import i18next from 'i18next';
 import { ErrorCodes, LspError, StaleResultError, type CodeAction, type Command, type Diagnostic, type Position } from '@adecore/lsp';
 import type { EditorPosition, EditorRange } from '@adecore/editor';
 import {
@@ -49,10 +48,6 @@ interface AskOptions {
     readonly groups?: readonly ActionGroup[];
 }
 
-function say(key: string, options?: Record<string, unknown>): string {
-    return i18next.t(`editor:language.actions.${key}`, options);
-}
-
 /*
  * What the language servers offer to do at the caret or the selection: a lightbulb in the gutter on the line
  * that has something, a list under the caret (Mod+.) grouped by kind with the change an action would make
@@ -72,12 +67,10 @@ export class CodeActionsFeature {
 
     constructor(language: EditorLanguage, timers: Timers = realTimers) {
         this.language = language;
-        const { editor, project, uri } = language;
+        const { editor } = language;
         this.refresher = new Refresher((signal) => this.hint(signal), PAUSE_MS, timers);
-        const providers = project.service.onProvidersChanged((changed) => {
-            if (changed === uri) {
-                this.refresher.later();
-            }
+        const providers = language.onProvidersChanged(() => {
+            this.refresher.later();
         });
         const offs = [
             editor.onCaret(() => {
@@ -98,7 +91,7 @@ export class CodeActionsFeature {
                 return false;
             }),
             language.diagnostics.onChange(() => this.refresher.later()),
-            () => providers.dispose()
+            providers
         ];
         language.onDispose(() => {
             for (const off of offs) {
@@ -137,7 +130,7 @@ export class CodeActionsFeature {
         const entries = await this.request(everything, ['source.organizeImports'], INVOKED);
         const entry = entries?.find((candidate) => candidate.action.kind?.startsWith('source.organizeImports') === true);
         if (entry === undefined) {
-            this.tell('success', say(entries === null ? 'unavailable' : 'organized'));
+            this.tell('success', this.say(entries === null ? 'unavailable' : 'organized'));
             return;
         }
         await this.apply(entry);
@@ -146,13 +139,13 @@ export class CodeActionsFeature {
     async formatDocument(): Promise<void> {
         const { editor, project, uri } = this.language;
         if (!project.service.supports('textDocument/formatting', uri)) {
-            this.tell('error', say('noFormatter'));
+            this.tell('error', this.say('noFormatter'));
             return;
         }
         try {
             const edits = await project.service.formatting(uri, { ...editor.getIndentation() });
             if (edits !== null && edits.length > 0 && !editor.applyEdits(edits.map((edit) => ({ range: edit.range, text: edit.newText })))) {
-                this.tell('error', say('readOnly'));
+                this.tell('error', this.say('readOnly'));
             }
         } catch (error) {
             this.fail(error);
@@ -175,7 +168,7 @@ export class CodeActionsFeature {
 
     private async ask(options: AskOptions): Promise<void> {
         if (!this.supported) {
-            this.tell('error', say('unavailable'));
+            this.tell('error', this.say('unavailable'));
             return;
         }
         // The press on a card or the gutter may have taken the focus, and the list answers to the editor's keys.
@@ -193,13 +186,13 @@ export class CodeActionsFeature {
             return;
         }
         if (entries.length === 0) {
-            this.tell('success', say('none'));
+            this.tell('success', this.say('none'));
             return;
         }
         const byId = new Map(entries.map((entry) => [entry.id, entry]));
         const groups: PickGroup[] = (options.groups ?? ACTION_GROUPS).flatMap((group): PickGroup[] => {
             const rows = entries.filter((entry) => entry.group === group).map((entry) => ({ id: entry.id, label: entry.action.title, detail: '' }));
-            return rows.length === 0 ? [] : [{ title: say(`groups.${group}`), rows }];
+            return rows.length === 0 ? [] : [{ title: this.say(`groups.${group}`), rows }];
         });
         this.language.completion.close();
         this.language.pick.open({
@@ -278,7 +271,7 @@ export class CodeActionsFeature {
         if (signal.aborted || this.asking) {
             return;
         }
-        editor.setGutterAction(entries?.some(isHint) === true ? { line: editor.getCaret().line, label: say('show') } : null);
+        editor.setGutterAction(entries?.some(isHint) === true ? { line: editor.getCaret().line, label: this.say('show') } : null);
     }
 
     private async resolve(entry: ActionEntry, signal?: AbortSignal): Promise<CodeAction> {
@@ -325,9 +318,9 @@ export class CodeActionsFeature {
             return null;
         }
         const notes = [
-            ...(found.hiddenLines > 0 ? [say('moreLines', { count: found.hiddenLines })] : []),
-            ...(found.otherFiles > 0 ? [say('otherFiles', { count: found.otherFiles })] : []),
-            ...(found.moves > 0 ? [say('moves', { count: found.moves })] : [])
+            ...(found.hiddenLines > 0 ? [this.say('moreLines', { count: found.hiddenLines })] : []),
+            ...(found.otherFiles > 0 ? [this.say('otherFiles', { count: found.otherFiles })] : []),
+            ...(found.moves > 0 ? [this.say('moves', { count: found.moves })] : [])
         ];
         return { removed: found.removed, added: found.added, note: notes.length === 0 ? null : notes.join(' · ') };
     }
@@ -353,7 +346,7 @@ export class CodeActionsFeature {
             if (action.edit !== undefined) {
                 const result = await project.applyWorkspaceEdit(action.edit);
                 if (!result.applied) {
-                    this.tell('error', say('failed', { message: result.failureReason ?? say('refused') }));
+                    this.tell('error', this.say('failed', { message: result.failureReason ?? this.say('refused') }));
                     return;
                 }
             }
@@ -381,7 +374,11 @@ export class CodeActionsFeature {
 
     private fail(error: unknown): void {
         if (!(error instanceof StaleResultError)) {
-            this.tell('error', say('failed', { message: error instanceof Error ? error.message : String(error) }));
+            this.tell('error', this.say('failed', { message: error instanceof Error ? error.message : String(error) }));
         }
     }
+
+    private say(key: string, options?: Record<string, unknown>): string {
+        return this.language.project.i18n.t(`editor:language.actions.${key}`, options);
+    }
 }

package/src/code-authors.ts

@@ -1,4 +1,4 @@
-import i18next from 'i18next';
+import type { i18n } from 'i18next';
 import { diffLines, splitLines } from '@adecore/merge';
 import type { GitBlameCommit, GitBlameResult } from './host-types.ts';
 import { formatNumber } from '@adecore/ui/format';
@@ -94,10 +94,10 @@ export function authorshipOf(commits: readonly GitBlameCommit[], mapped: Int32Ar
 }
 
 /* The row's words: the author with most lines, how many others wrote some, and a star when the range is edited since the commit. */
-export function authorsText(authorship: CodeAuthorship): string {
+export function authorsText(authorship: CodeAuthorship, i18n: i18n): string {
     const main = authorship.authors[0];
     if (main === undefined) {
-        return i18next.t('editor:language.codeVision.newCode');
+        return i18n.t('editor:language.codeVision.newCode');
     }
     const others = authorship.authors.length - 1;
     return `${main.name}${others > 0 ? ` +${formatNumber(others)}` : ''}${authorship.modified ? ' *' : ''}`;

package/src/code-vision-model.ts

@@ -1,6 +1,6 @@
 import type { DocumentSymbol, DocumentSymbolResult, Position, SymbolInformation } from '@adecore/lsp';
 import { formatNumber } from '@adecore/ui/format';
-import i18next from 'i18next';
+import type { i18n } from 'i18next';
 
 /* More declarations than this in one file and the rows are left out, which is the file that is too big for them to be quiet. */
 export const MAX_DECLARATIONS = 3000;
@@ -223,8 +223,8 @@ export function declarationsOf(result: DocumentSymbolResult, source: Declaration
 }
 
 /* "No usages", "1 usage" and "N usages". */
-export function usagesText(count: number): string {
+export function usagesText(count: number, i18n: i18n): string {
     return count === 0
-        ? i18next.t('editor:language.codeVision.usagesNone')
-        : i18next.t('editor:language.codeVision.usages', { count, formatted: formatNumber(count) });
+        ? i18n.t('editor:language.codeVision.usagesNone')
+        : i18n.t('editor:language.codeVision.usages', { count, formatted: formatNumber(count) });
 }

package/src/code-vision.ts

@@ -62,7 +62,7 @@ export class CodeVisionFeature {
     constructor(language: EditorLanguage, onSymbols: (listener: (result: DocumentSymbolResult) => void) => () => void, timers: Timers = realTimers) {
         this.language = language;
         this.timers = timers;
-        const { editor, project, uri } = language;
+        const { editor } = language;
         const offs = [
             onSymbols((result) => this.read(result)),
             editor.onTextChange(() => {
@@ -74,19 +74,17 @@ export class CodeVisionFeature {
                 this.scrollTimer = this.timers.set(() => this.plan(), SCROLL_PAUSE_MS);
             })
         ];
-        const providers = project.service.onProvidersChanged((changed) => {
-            if (changed === uri) {
-                this.failed.clear();
-                this.publish();
-                this.plan();
-            }
+        const providers = language.onProvidersChanged(() => {
+            this.failed.clear();
+            this.publish();
+            this.plan();
         });
         language.onDispose(() => {
             this.disposed = true;
             for (const off of offs) {
                 off();
             }
-            providers.dispose();
+            providers();
             this.timers.clear(this.scrollTimer);
             for (const controller of this.running.values()) {
                 controller.abort();
@@ -209,7 +207,11 @@ export class CodeVisionFeature {
             const entries: EditorCodeVisionEntry[] = [];
             const known = this.counts.get(declaration.id);
             if (counted && declaration.usages && known !== undefined) {
-                entries.push({ id: 'usages', text: usagesText(known.count), activate: () => void this.language.peek.open(declaration.position) });
+                entries.push({
+                    id: 'usages',
+                    text: usagesText(known.count, this.language.project.i18n),
+                    activate: () => void this.language.peek.open(declaration.position)
+                });
             }
             if (mapped !== null && declaration.authors) {
                 let authorship = this.authorships.get(declaration.id);
@@ -220,7 +222,7 @@ export class CodeVisionFeature {
                 const shown = authorship;
                 entries.push({
                     id: 'authors',
-                    text: authorsText(shown),
+                    text: authorsText(shown, this.language.project.i18n),
                     ...(shown.authors.length > 0 ? { icon: shown.authors.length > 1 ? ('users' as const) : ('user' as const) } : {}),
                     activate: (anchor) => this.showAuthors(declaration, shown, anchor)
                 });

package/src/completion.ts

@@ -1,4 +1,3 @@
-import i18next from 'i18next';
 import { StaleResultError, type CompletionContext, type CompletionItem } from '@adecore/lsp';
 import type { EditorContentChange, EditorPosition, EditorRange, EditorTextChange } from '@adecore/editor';
 import { comparePositions, shiftPosition } from './diagnostics-model.ts';
@@ -399,7 +398,7 @@ export class CompletionFeature {
         const asked = this.explicit && !refresh;
         this.refilter();
         if (asked && !this.isOpen && !this.incomplete) {
-            this.language.project.host.notify?.({ id: TOAST_ID, kind: 'error', title: i18next.t('editor:language.completion.none') });
+            this.language.project.host.notify?.({ id: TOAST_ID, kind: 'error', title: this.language.project.i18n.t('editor:language.completion.none') });
         } else if (asked && this.ranked.length === 1 && !this.incomplete) {
             // One answer to a list that was asked for is the one wanted.
             void this.accept(false, 0);

package/src/editor-language.ts

@@ -145,6 +145,32 @@ export class EditorLanguage {
         this.pick.open({ anchor, title, groups: [{ title: null, rows }], accept: (id) => this.goTo(places[Number(id)]!) });
     }
 
+    /*
+     * Runs `listener` once the document is open and again whenever the service says what it can ask for
+     * this document changed. A service that is ready before the document opens never says so, so the
+     * opening counts as the first change.
+     */
+    onProvidersChanged(listener: () => void): () => void {
+        let listening = true;
+        void this.document.ready.then(
+            () => {
+                if (listening && !this.disposed) {
+                    listener();
+                }
+            },
+            () => undefined
+        );
+        const providers = this.project.service.onProvidersChanged((uri) => {
+            if (uri === this.uri) {
+                listener();
+            }
+        });
+        return () => {
+            listening = false;
+            providers.dispose();
+        };
+    }
+
     /* Runs `dispose` when the editor lets go of its document. */
     onDispose(dispose: () => void): void {
         this.disposers.push(dispose);

package/src/folding.ts

@@ -1,4 +1,4 @@
-import type { EditorFoldHints, EditorFoldRange, EditorFoldSymbol } from '@adecore/editor';
+import type { EditorFoldHints, EditorFoldRangeHint, EditorFoldSymbol } from '@adecore/editor';
 import type { DocumentSymbol, DocumentSymbolResult, FoldingRange, SymbolInformation } from '@adecore/lsp';
 import type { EditorLanguage } from './editor-language.ts';
 import { Refresher } from './refresher.ts';
@@ -51,11 +51,17 @@ export function foldSymbolsOf(result: DocumentSymbolResult): EditorFoldSymbol[]
     return found;
 }
 
-/* The ranges a server folds that span more than one line. */
-export function foldRangesOf(ranges: readonly FoldingRange[] | null): (EditorFoldRange & { kind?: string })[] {
+/* The ranges a server folds that span more than one line, with where a range starts and ends within its lines when it says. */
+export function foldRangesOf(ranges: readonly FoldingRange[] | null): EditorFoldRangeHint[] {
     return (ranges ?? [])
         .filter((range) => range.endLine > range.startLine)
-        .map((range) => ({ startLine: range.startLine, endLine: range.endLine, ...(range.kind === undefined ? {} : { kind: range.kind }) }));
+        .map((range) => ({
+            startLine: range.startLine,
+            endLine: range.endLine,
+            ...(range.kind === undefined ? {} : { kind: range.kind }),
+            ...(range.startCharacter === undefined ? {} : { startCharacter: range.startCharacter }),
+            ...(range.endCharacter === undefined ? {} : { endCharacter: range.endCharacter })
+        }));
 }
 
 /*
@@ -65,7 +71,7 @@ export function foldRangesOf(ranges: readonly FoldingRange[] | null): (EditorFol
  */
 export class FoldingFeature {
     private symbols: EditorFoldSymbol[] = [];
-    private ranges: (EditorFoldRange & { kind?: string })[] = [];
+    private ranges: EditorFoldRangeHint[] = [];
     private readonly refresher: Refresher;
     private readonly language: EditorLanguage;
 
@@ -91,15 +97,13 @@ export class FoldingFeature {
             this.publish();
         });
         const edits = editor.onTextChange(() => this.refresher.later());
-        const providers = project.service.onProvidersChanged((changed) => {
-            if (changed === uri) {
-                this.refresher.now();
-            }
+        const providers = language.onProvidersChanged(() => {
+            this.refresher.now();
         });
         language.onDispose(() => {
             symbols();
             edits();
-            providers.dispose();
+            providers();
             this.refresher.dispose();
             editor.setFoldHints(null);
         });

package/src/history.ts

@@ -1,4 +1,3 @@
-import i18next from 'i18next';
 import type { EditorLanguage } from './editor-language.ts';
 import { isShortcut } from './shortcut-keys.ts';
 
@@ -51,7 +50,7 @@ export class HistoryFeature {
         this.language.locations(
             places.map((place) => ({ uri: place.uri, range: { start: place.position, end: place.position } })),
             this.language.editor.getCaret(),
-            i18next.t('editor:language.history.recent')
+            this.language.project.i18n.t('editor:language.history.recent')
         );
     }
 }

package/src/host-types.ts

@@ -1,3 +1,4 @@
+import type { i18n } from 'i18next';
 import type { Keymap } from '@adecore/editor/keymap';
 import type { ProjectFiles } from './workspace-edit.ts';
 import type { Place } from './navigation-history.ts';
@@ -37,6 +38,8 @@ export interface RenameSuggestionsRequest {
 }
 
 export interface LanguageHost {
+    /* The instance the app hands `UIProvider`, which the features read their words from too; the default instance without one. */
+    readonly i18n?: i18n;
     readonly folder?: string;
     readonly files?: ProjectFiles;
     readonly apple?: boolean;

package/src/hover.ts

@@ -1,4 +1,3 @@
-import i18next from 'i18next';
 import type { EditorHover, EditorPosition, EditorRange } from '@adecore/editor';
 import type { EditorLanguage } from './editor-language.ts';
 import { rangeHolds, type Problem } from './diagnostics-model.ts';
@@ -212,7 +211,7 @@ export class HoverFeature {
         if (problems.length === 0 && info === null) {
             this.hide();
             if (pinned) {
-                this.language.project.host.notify?.({ id: TOAST_ID, kind: 'error', title: i18next.t('editor:language.hover.none') });
+                this.language.project.host.notify?.({ id: TOAST_ID, kind: 'error', title: this.language.project.i18n.t('editor:language.hover.none') });
             }
             return;
         }

package/src/inlay-hints.ts

@@ -71,15 +71,13 @@ export class InlayHintsFeature {
                 this.refresher.later();
             }
         });
-        const providers = project.service.onProvidersChanged((changed) => {
-            if (changed === uri) {
-                this.refresher.now();
-            }
+        const providers = language.onProvidersChanged(() => {
+            this.refresher.now();
         });
         language.onDispose(() => {
             edits();
             scrolls();
-            providers.dispose();
+            providers();
             this.refresher.dispose();
             editor.setInlayHints([]);
         });

package/src/language-ids.ts

@@ -15,7 +15,8 @@ const LSP_IDS: Record<string, string> = {
     yaml: 'yaml',
     python: 'python',
     shellscript: 'shellscript',
-    docker: 'dockerfile'
+    docker: 'dockerfile',
+    twig: 'twig'
 };
 
 /* The LSP language id of a file, or null when no language server here knows its language. */
@@ -45,7 +46,8 @@ const PATH_IDS: Record<string, string> = {
     css: 'css',
     scss: 'scss',
     html: 'html',
-    md: 'markdown'
+    md: 'markdown',
+    twig: 'twig'
 };
 
 /* The highlighter id for the code of a file we only know by its path, such as a place another file refers to. */

package/src/locales/en.json

@@ -6,6 +6,7 @@
             "definition": "Go to definition",
             "references_one": "{{formatted}} reference",
             "references_other": "{{formatted}} references",
+            "line": "Line {{line}}",
             "none": "No information for this position"
         },
         "edit": {

package/src/locales/nl.json

@@ -6,6 +6,7 @@
             "definition": "Ga naar definitie",
             "references_one": "{{formatted}} referentie",
             "references_other": "{{formatted}} referenties",
+            "line": "Regel {{line}}",
             "none": "Geen informatie voor deze plek"
         },
         "edit": {

package/src/navigation.ts

@@ -1,4 +1,3 @@
-import i18next from 'i18next';
 import { StaleResultError, fileUriToPath, type Location, type LocationLink, type NavigationResult, type Range } from '@adecore/lsp';
 import type { EditorPosition } from '@adecore/editor';
 import { basenameOf } from './paths.ts';
@@ -24,10 +23,6 @@ const SHORTCUT_KINDS: readonly [NavigationKind, 'goToDefinition' | 'goToTypeDefi
 
 const TOAST_ID = 'language-navigation';
 
-function say(key: string, options?: Record<string, unknown>): string {
-    return i18next.t(`editor:language.navigation.${key}`, options);
-}
-
 /* The places of a result, each once: the two servers of a Vue file may both know the same one. `target` is the whole declaration when the server gave it. */
 export function uniquePlaces(result: NavigationResult): { location: Location; target: Range | null }[] {
     const seen = new Set<string>();
@@ -96,7 +91,7 @@ export class NavigationFeature {
     async go(kind: NavigationKind, position: EditorPosition = this.language.editor.getCaret()): Promise<void> {
         const { project, uri, editor } = this.language;
         if (!this.supports(kind)) {
-            this.tell(say('unavailable'));
+            this.tell(this.say('unavailable'));
             return;
         }
         let result: NavigationResult;
@@ -111,20 +106,20 @@ export class NavigationFeature {
                     : service.implementation(uri, position));
         } catch (error) {
             if (!(error instanceof StaleResultError)) {
-                this.tell(say('failed', { message: error instanceof Error ? error.message : String(error) }));
+                this.tell(this.say('failed', { message: error instanceof Error ? error.message : String(error) }));
             }
             return;
         }
         const places = uniqueLocations(result);
         if (places.length === 0) {
-            this.tell(say('none'));
+            this.tell(this.say('none'));
         } else if (kind === 'definition' && places.length === 1 && places[0]!.uri === uri && rangeHolds(places[0]!.range, position)) {
             // The name is its own definition, so what a person wants to see is where it is used.
             void this.language.peek.open(position);
         } else if (places.length === 1) {
             this.language.goTo(places[0]!);
         } else {
-            this.language.locations(places, position, say(`titles.${kind}`));
+            this.language.locations(places, position, this.say(`titles.${kind}`));
         }
         editor.focus();
     }
@@ -148,7 +143,7 @@ export class NavigationFeature {
             if (places.length === 1) {
                 this.language.goTo(places[0]!);
             } else if (places.length > 1) {
-                this.language.locations(places, anchor, say('titles.symbol'));
+                this.language.locations(places, anchor, this.say('titles.symbol'));
             }
         } catch {
             // A name that cannot be found is a link that does nothing, not an error.
@@ -158,6 +153,10 @@ export class NavigationFeature {
     private tell(title: string): void {
         this.language.project.host.notify?.({ id: TOAST_ID, kind: 'error', title });
     }
+
+    private say(key: string, options?: Record<string, unknown>): string {
+        return this.language.project.i18n.t(`editor:language.navigation.${key}`, options);
+    }
 }
 
 /* How a place reads in a list: the file and the line, with the folder it is in. */