lean4monaco 1.1.9 → 1.1.11

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export * from './editor';
 export * from './leanmonaco';
 export { RpcSessionAtPos } from './vscode-lean4/vscode-lean4/src/infoview';
+export { DocumentPosition } from './vscode-lean4/lean4-infoview/src/infoview/util';
 export { LeanClient } from './vscode-lean4/vscode-lean4/src/leanclient';

package/dist/index.js

@@ -1,4 +1,5 @@
 export * from './editor';
 export * from './leanmonaco';
 export { RpcSessionAtPos } from './vscode-lean4/vscode-lean4/src/infoview';
+export { DocumentPosition } from './vscode-lean4/lean4-infoview/src/infoview/util';
 export { LeanClient } from './vscode-lean4/vscode-lean4/src/leanclient';

package/dist/leanmonaco.js

@@ -152,7 +152,7 @@ export class LeanMonaco {
             "editor.fontFamily": "'Noto Color Emoji', 'JuliaMono'",
             "editor.wordWrap": "on",
             "editor.wrappingStrategy": "advanced",
-            "workbench.colorTheme": "Visual Studio Light",
+            "workbench.colorTheme": isBrowserDefaultDark() ? "Visual Studio Dark" : "Visual Studio Light",
             ...options.vscode
         });
         if (this.disposed) {
@@ -253,3 +253,7 @@ export class LeanMonaco {
         this.abbreviationFeature = undefined;
     }
 }
+/** Returns true if the browser wants dark mode */
+function isBrowserDefaultDark() {
+    return window.matchMedia('(prefers-color-scheme: dark)').matches;
+}

package/dist/vscode-lean4/lean4-infoview/src/infoview/contexts.d.ts

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import { InfoviewConfig, LeanDiagnostic, LeanFileProgressProcessingInfo } from '@leanprover/infoview-api';
+import { EditorConnection } from './editorConnection';
+import { ServerVersion } from './serverVersion';
+import { DocumentPosition } from './util';
+export declare const EditorContext: React.Context<EditorConnection>;
+export declare const VersionContext: React.Context<ServerVersion | undefined>;
+export declare const ConfigContext: React.Context<InfoviewConfig>;
+export declare const LspDiagnosticsContext: React.Context<Map<string, LeanDiagnostic[]>>;
+export declare const ProgressContext: React.Context<Map<string, LeanFileProgressProcessingInfo[]>>;
+/**
+ * Certain infoview components and widget instances
+ * utilize data that has been introduced above a specific position
+ * in a Lean source file.
+ *
+ * For instance, if we declare a global constant with `def foo` on line 10,
+ * we can immediately display it in a widget on line 11.
+ * To achieve this, the widget code needs to have access
+ * to the environment on line 11 as that environment contains `foo`.
+ *
+ * {@link EnvPosContext} stores the position in the file
+ * from which an appropriate environment can be retrieved.
+ * This is used to look up global constants,
+ * in particular RPC methods (`@[server_rpc_method]`)
+ * and widget modules (`@[widget_module]`).
+ *
+ * Note that {@link EnvPosContext} may, but need not,
+ * be equal to any of the positions which the infoview keeps track of
+ * (such as the editor cursor position).
+ *
+ * #### Infoview implementation details
+ *
+ * In the infoview, {@link EnvPosContext} is set as follows:
+ * - in an `<InfoDisplay>`,
+ *   it is the position at which the info block is being displayed:
+ *   either a recent editor cursor position
+ *   (when shown in the at-cursor `<InfoDisplay>`,
+ *   this will lag behind the current editor cursor position
+ *   while the `<InfoDisplay>` is in the process of updating),
+ *   or a pinned position.
+ * - in an `<InteractiveMessage>` that comes from a diagnostic
+ *   emitted with a syntactic range,
+ *   it is the start of the diagnostic's `fullRange`.
+ */
+export declare const EnvPosContext: React.Context<DocumentPosition | undefined>;

package/dist/vscode-lean4/lean4-infoview/src/infoview/contexts.js

@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { defaultInfoviewConfig, } from '@leanprover/infoview-api';
+// Type-unsafe initializers for contexts which we immediately set up at the top-level.
+// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+export const EditorContext = React.createContext(null);
+export const VersionContext = React.createContext(undefined);
+export const ConfigContext = React.createContext(defaultInfoviewConfig);
+export const LspDiagnosticsContext = React.createContext(new Map());
+export const ProgressContext = React.createContext(new Map());
+/**
+ * Certain infoview components and widget instances
+ * utilize data that has been introduced above a specific position
+ * in a Lean source file.
+ *
+ * For instance, if we declare a global constant with `def foo` on line 10,
+ * we can immediately display it in a widget on line 11.
+ * To achieve this, the widget code needs to have access
+ * to the environment on line 11 as that environment contains `foo`.
+ *
+ * {@link EnvPosContext} stores the position in the file
+ * from which an appropriate environment can be retrieved.
+ * This is used to look up global constants,
+ * in particular RPC methods (`@[server_rpc_method]`)
+ * and widget modules (`@[widget_module]`).
+ *
+ * Note that {@link EnvPosContext} may, but need not,
+ * be equal to any of the positions which the infoview keeps track of
+ * (such as the editor cursor position).
+ *
+ * #### Infoview implementation details
+ *
+ * In the infoview, {@link EnvPosContext} is set as follows:
+ * - in an `<InfoDisplay>`,
+ *   it is the position at which the info block is being displayed:
+ *   either a recent editor cursor position
+ *   (when shown in the at-cursor `<InfoDisplay>`,
+ *   this will lag behind the current editor cursor position
+ *   while the `<InfoDisplay>` is in the process of updating),
+ *   or a pinned position.
+ * - in an `<InteractiveMessage>` that comes from a diagnostic
+ *   emitted with a syntactic range,
+ *   it is the start of the diagnostic's `fullRange`.
+ */
+export const EnvPosContext = React.createContext(undefined);

package/dist/vscode-lean4/lean4-infoview/src/infoview/editorConnection.d.ts

@@ -0,0 +1,27 @@
+import type { Location } from 'vscode-languageserver-protocol';
+import { ContextMenuAction, EditorApi, InfoviewAction, InfoviewActionKind, InfoviewApi, PlainGoal, PlainTermGoal } from '@leanprover/infoview-api';
+import { EventEmitter, Eventify } from './event';
+import { DocumentPosition } from './util';
+export type EditorEvents = Omit<Eventify<InfoviewApi>, 'requestedAction' | 'clickedContextMenu'> & {
+    requestedAction: EventEmitter<InfoviewAction, InfoviewActionKind>;
+    /**
+     * Must fire whenever the user clicks an infoview-specific context menu entry.
+     *
+     * Keys for this event are of the form `` `${action.entry}:${action.id}` ``.
+     */
+    clickedContextMenu: EventEmitter<ContextMenuAction, string>;
+};
+/** Provides higher-level wrappers around functionality provided by the editor,
+ * e.g. to insert a comment. See also {@link EditorApi}. */
+export declare class EditorConnection {
+    readonly api: EditorApi;
+    readonly events: EditorEvents;
+    constructor(api: EditorApi, events: EditorEvents);
+    /** Highlights the given range in a document in the editor. */
+    revealLocation(loc: Location): Promise<void>;
+    revealPosition(pos: DocumentPosition): Promise<void>;
+    /** Copies the text to a comment at the cursor position. */
+    copyToComment(text: string): Promise<void>;
+    requestPlainGoal(pos: DocumentPosition): Promise<PlainGoal | undefined>;
+    requestPlainTermGoal(pos: DocumentPosition): Promise<PlainTermGoal | undefined>;
+}

package/dist/vscode-lean4/lean4-infoview/src/infoview/editorConnection.js

@@ -0,0 +1,41 @@
+import { DocumentPosition } from './util';
+/** Provides higher-level wrappers around functionality provided by the editor,
+ * e.g. to insert a comment. See also {@link EditorApi}. */
+export class EditorConnection {
+    api;
+    events;
+    constructor(api, events) {
+        this.api = api;
+        this.events = events;
+    }
+    /** Highlights the given range in a document in the editor. */
+    async revealLocation(loc) {
+        const show = {
+            uri: loc.uri,
+            selection: loc.range,
+        };
+        await this.api.showDocument(show);
+    }
+    async revealPosition(pos) {
+        const loc = {
+            uri: pos.uri,
+            range: {
+                start: pos,
+                end: pos,
+            },
+        };
+        await this.revealLocation(loc);
+    }
+    /** Copies the text to a comment at the cursor position. */
+    async copyToComment(text) {
+        await this.api.insertText(`/-\n${text}\n-/`, 'above');
+    }
+    requestPlainGoal(pos) {
+        const params = DocumentPosition.toTdpp(pos);
+        return this.api.sendClientRequest(pos.uri, '$/lean/plainGoal', params);
+    }
+    requestPlainTermGoal(pos) {
+        const params = DocumentPosition.toTdpp(pos);
+        return this.api.sendClientRequest(pos.uri, '$/lean/plainTermGoal', params);
+    }
+}

package/dist/vscode-lean4/lean4-infoview/src/infoview/event.d.ts

@@ -0,0 +1,33 @@
+import type { Disposable } from 'vscode-languageserver-protocol';
+export declare class EventEmitter<E, in out K> {
+    private freshId;
+    private handlers;
+    private handlersWithKey;
+    current?: E;
+    /**
+     * Register a handler that will receive events from this emitter
+     * and return a closure that removes the handler registration.
+     *
+     * If `key` is specified, only events fired with that key
+     * will be propagated to this handler.
+     */
+    on(handler: (_: E) => void, key?: K): Disposable;
+    /**
+     * Propagate the event to registered handlers.
+     *
+     * The event is propagated to all keyless handlers.
+     * Furthermore if `key` is provided,
+     * the event is also propagated to handlers registered with that key.
+     */
+    fire(event: E, key?: K): void;
+}
+type ExcludeNonEvent<T, U> = T extends (...args: any) => Promise<void> ? U : never;
+/**
+ * Turn all fields in `T` which extend `(...args: As) => Promise<void>`
+ * into event emitter fields `f: EventEmitter<As>`.
+ * Other fields are removed.
+ */
+export type Eventify<T> = {
+    [P in keyof T as ExcludeNonEvent<T[P], P>]: T[P] extends (arg: infer A) => Promise<void> ? EventEmitter<A, never> : T[P] extends (...args: infer As) => Promise<void> ? EventEmitter<As, never> : never;
+};
+export {};

package/dist/vscode-lean4/lean4-infoview/src/infoview/event.js

@@ -0,0 +1,57 @@
+export class EventEmitter {
+    freshId = 0;
+    handlers = new Map();
+    handlersWithKey = new Map();
+    current;
+    /**
+     * Register a handler that will receive events from this emitter
+     * and return a closure that removes the handler registration.
+     *
+     * If `key` is specified, only events fired with that key
+     * will be propagated to this handler.
+     */
+    on(handler, key) {
+        const id = this.freshId;
+        this.freshId += 1;
+        if (key) {
+            const handlersForKey = this.handlersWithKey.get(key) ?? [];
+            handlersForKey.push(handler);
+            this.handlersWithKey.set(key, handlersForKey);
+        }
+        else {
+            this.handlers.set(id, handler);
+        }
+        return {
+            dispose: () => {
+                if (key) {
+                    const handlersForKey = this.handlersWithKey.get(key) ?? [];
+                    // We assume that no key has so many handlers registered
+                    // that the linear `filter` operation becomes a perf issue.
+                    this.handlersWithKey.set(key, handlersForKey.filter(h => h !== handler));
+                }
+                else {
+                    this.handlers.delete(id);
+                }
+            },
+        };
+    }
+    /**
+     * Propagate the event to registered handlers.
+     *
+     * The event is propagated to all keyless handlers.
+     * Furthermore if `key` is provided,
+     * the event is also propagated to handlers registered with that key.
+     */
+    fire(event, key) {
+        this.current = event;
+        for (const h of this.handlers.values()) {
+            h(event);
+        }
+        if (key) {
+            const handlersForKey = this.handlersWithKey.get(key) ?? [];
+            for (const h of handlersForKey) {
+                h(event);
+            }
+        }
+    }
+}

package/dist/vscode-lean4/lean4-infoview/src/infoview/serverVersion.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Keeps track of the Lean server version and available features.
+ * @module
+ */
+export declare class ServerVersion {
+    major: number;
+    minor: number;
+    patch: number;
+    constructor(version: string);
+}

package/dist/vscode-lean4/lean4-infoview/src/infoview/serverVersion.js

@@ -0,0 +1,25 @@
+/**
+ * Keeps track of the Lean server version and available features.
+ * @module
+ */
+export class ServerVersion {
+    major;
+    minor;
+    patch;
+    constructor(version) {
+        const vs = version.split('.');
+        if (vs.length === 2) {
+            this.major = parseInt(vs[0]);
+            this.minor = parseInt(vs[1]);
+            this.patch = 0;
+        }
+        else if (vs.length === 3) {
+            this.major = parseInt(vs[0]);
+            this.minor = parseInt(vs[1]);
+            this.patch = parseInt(vs[2]);
+        }
+        else {
+            throw new Error(`cannot parse Lean server version '${version}'`);
+        }
+    }
+}

package/dist/vscode-lean4/lean4-infoview/src/infoview/util.d.ts

@@ -0,0 +1,141 @@
+import * as React from 'react';
+import type { DocumentUri, Position, Range, TextDocumentPositionParams } from 'vscode-languageserver-protocol';
+import { EventEmitter } from './event';
+/** A document URI and a position in that document. */
+export interface DocumentPosition extends Position {
+    uri: DocumentUri;
+}
+export declare namespace DocumentPosition {
+    function isEqual(p1: DocumentPosition, p2: DocumentPosition): boolean;
+    function toTdpp(p: DocumentPosition): TextDocumentPositionParams;
+    function toString(p: DocumentPosition): string;
+}
+export declare namespace PositionHelpers {
+    function isLessThanOrEqual(p1: Position, p2: Position): boolean;
+}
+export declare namespace RangeHelpers {
+    function contains(range: Range, pos: Position, ignoreCharacter?: boolean): boolean;
+}
+export declare function escapeHtml(s: string): string;
+/** @deprecated (unused) */
+export declare function colorizeMessage(goal: string): string;
+export declare function basename(path: string): string;
+/**
+ * A specialization of {@link React.useEffect} which executes `f` with the event data
+ * whenever `ev` fires.
+ * If `key` is provided, `f` is only invoked on events fired with that key.
+ */
+export declare function useEvent<E, K>(ev: EventEmitter<E, K>, f: (_: E) => void, dependencies?: React.DependencyList, key?: K): void;
+/**
+ * A piece of React {@link React.useState} which returns the data that `ev` most recently fired with.
+ * If `f` is provided, the data is mapped through `f` first. */
+export declare function useEventResult<E, K>(ev: EventEmitter<E, K>): E | undefined;
+export declare function useEventResult<E, K, T>(ev: EventEmitter<E, K>, f: (newVal: E) => T): T | undefined;
+export declare function useServerNotificationEffect<T>(method: string, f: (params: T) => void, deps?: React.DependencyList): void;
+/**
+ * Returns the same tuple as `setState` such that whenever a server notification with `method`
+ * arrives at the editor, the state will be updated according to `f`.
+ */
+export declare function useServerNotificationState<S, T>(method: string, initial: S, f: (params: T) => Promise<(state: S) => S>, deps?: React.DependencyList): [S, React.Dispatch<React.SetStateAction<S>>];
+export declare function useClientNotificationEffect<T>(method: string, f: (params: T) => void, deps?: React.DependencyList): void;
+/**
+ * Like {@link useServerNotificationState} but for client->server notifications sent by the editor.
+ */
+export declare function useClientNotificationState<S, T>(method: string, initial: S, f: (state: S, params: T) => S, deps?: React.DependencyList): [S, React.Dispatch<React.SetStateAction<S>>];
+/** Useful for controlling {@link usePausableState} from child components. */
+export interface PausableProps {
+    isPaused: boolean;
+    setPaused: React.Dispatch<React.SetStateAction<boolean>>;
+}
+/**
+ * Returns `[{ isPaused, setPaused }, tPausable, tRef]` s.t.
+ * - `[isPaused, setPaused]` are the paused status state
+ * - for as long as `isPaused` is set, `tPausable` holds its initial value (the `t` passed before pausing)
+ *   rather than updates with changes to `t`.
+ * - `tRef` can be used to overwrite the paused state
+ *
+ * To pause child components, `startPaused` can be passed in their props.
+ */
+export declare function usePausableState<T>(startPaused: boolean, t: T): [PausableProps, T, React.MutableRefObject<T>];
+export type Keyed<T> = T & {
+    key: string;
+};
+/**
+ * Adds a unique `key` property to each element in `elems` using
+ * the values of (possibly non-injective) `getId`.
+ */
+export declare function addUniqueKeys<T>(elems: T[], getId: (el: T) => string): Keyed<T>[];
+export interface LogicalDomElement {
+    contains(el: Node): boolean;
+}
+export interface LogicalDomStorage {
+    /** Registers a descendant in the logical DOM.
+     * Returns a function which disposes of the registration. */
+    registerDescendant(el: LogicalDomElement): () => void;
+}
+export declare const LogicalDomContext: React.Context<LogicalDomStorage>;
+/** Suppose a component B appears as a React descendant of the component A. For layout reasons,
+ * we sometimes don't want B to appear as a descendant of A in the DOM, so we use `createPortal`.
+ * We may still however want to carry out `contains` checks as if B were there, i.e. according to
+ * the React tree structure rather than the DOM structure. While React already correctly propagates
+ * DOM events up the React tree, other functionality such as `contains` is not provided. We provide
+ * it in this hook.
+ *
+ * Accepts a ref to the observed {@link HTMLElement} (A in the example). Returns:
+ * - a {@link LogicalDomElement} which provides `contains` checks for that {@link HTMLElement}; and
+ * - a {@link LogicalDomStorage} which MUST be passed to a {@link LogicalDomContext} enclosing
+ *   the observed {@link HTMLElement}.
+ *
+ * Additionally, any component which introduces a portal MUST call `registerDescendant` in the
+ * {@link LogicalDomContext} with a ref to the portalled component (B in the example). */
+export declare function useLogicalDomObserver(elt: React.RefObject<HTMLElement>): [LogicalDomElement, LogicalDomStorage];
+/**
+ * An effect which calls `onClickOutside` whenever an element not logically descending from `ld`
+ * (see {@link useLogicalDomObserver}) is clicked. Note that `onClickOutside` is not called on clicks
+ * on the scrollbar since these should usually not impact the app's state.
+ * `isActive` controls whether the `onClickOutside` handler is active. This can be useful for performance,
+ * since having lots of `onClickOutside` handlers when they are not needed can be expensive.
+ */
+export declare function useOnClickOutside(ld: LogicalDomElement, onClickOutside: (_: PointerEvent) => void, isActive?: boolean): void;
+/** Sends an exception object to a throwable error.
+ * Maps JSON Rpc errors to throwable errors.
+ */
+export declare function mapRpcError(err: unknown): Error;
+/** Catch handler for RPC methods that just returns undefined if the method is not found.
+ * This is useful for compatibility with versions of Lean that do not yet have the given RPC method.
+ */
+export declare function discardMethodNotFound(e: unknown): undefined;
+export type AsyncState<T> = {
+    state: 'loading';
+} | {
+    state: 'resolved';
+    value: T;
+} | {
+    state: 'rejected';
+    error: any;
+};
+export type AsyncWithTriggerState<T> = {
+    state: 'notStarted';
+} | AsyncState<T>;
+export declare function useAsyncWithTrigger<T>(fn: () => Promise<T>, deps?: React.DependencyList): [AsyncWithTriggerState<T>, () => Promise<void>];
+/** This React hook will run the given promise function `fn` whenever the deps change
+ * and use it to update the status and result when the promise resolves.
+ *
+ * This function prevents race conditions if the requests resolve in a
+ * different order to that which they were requested in:
+ *
+ * - Request 1 is sent with, say, line=42.
+ * - Request 2 is sent with line=90.
+ * - Request 2 returns with diags=[].
+ * - Request 1 returns with diags=['error'].
+ *
+ * Without `useAsync` we would now return the diagnostics for line 42 even though we're at line 90.
+ *
+ * When the deps change, the function immediately returns `{ state: 'loading' }`.
+ */
+export declare function useAsync<T>(fn: () => Promise<T>, deps?: React.DependencyList): AsyncState<T>;
+/** Like {@link useAsync} but never transitions from `resolved` to `loading` by internally storing
+ * the latest `resolved` state and continuing to return it while an update is in flight. The lower
+ * amount of re-renders tends to be less visually jarring.
+ */
+export declare function useAsyncPersistent<T>(fn: () => Promise<T>, deps?: React.DependencyList): AsyncState<T>;

package/dist/vscode-lean4/lean4-infoview/src/infoview/util.js

@@ -0,0 +1,336 @@
+/* eslint-disable @typescript-eslint/no-namespace */
+/* eslint-disable react-hooks/exhaustive-deps */
+import * as React from 'react';
+import { isRpcError, RpcErrorCode } from '@leanprover/infoview-api';
+import { EditorContext } from './contexts';
+export var DocumentPosition;
+(function (DocumentPosition) {
+    function isEqual(p1, p2) {
+        return p1.uri === p2.uri && p1.line === p2.line && p1.character === p2.character;
+    }
+    DocumentPosition.isEqual = isEqual;
+    function toTdpp(p) {
+        return { textDocument: { uri: p.uri }, position: { line: p.line, character: p.character } };
+    }
+    DocumentPosition.toTdpp = toTdpp;
+    function toString(p) {
+        return `${p.uri}:${p.line + 1}:${p.character}`;
+    }
+    DocumentPosition.toString = toString;
+})(DocumentPosition || (DocumentPosition = {}));
+export var PositionHelpers;
+(function (PositionHelpers) {
+    function isLessThanOrEqual(p1, p2) {
+        return p1.line < p2.line || (p1.line === p2.line && p1.character <= p2.character);
+    }
+    PositionHelpers.isLessThanOrEqual = isLessThanOrEqual;
+})(PositionHelpers || (PositionHelpers = {}));
+export var RangeHelpers;
+(function (RangeHelpers) {
+    function contains(range, pos, ignoreCharacter) {
+        if (!ignoreCharacter) {
+            if (pos.line === range.start.line && pos.character < range.start.character)
+                return false;
+            if (pos.line === range.end.line && pos.character > range.end.character)
+                return false;
+        }
+        return range.start.line <= pos.line && pos.line <= range.end.line;
+    }
+    RangeHelpers.contains = contains;
+})(RangeHelpers || (RangeHelpers = {}));
+// https://stackoverflow.com/questions/6234773/can-i-escape-html-special-chars-in-javascript
+export function escapeHtml(s) {
+    return s
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#039;');
+}
+/** @deprecated (unused) */
+export function colorizeMessage(goal) {
+    return goal
+        .replace(/^([|⊢]) /gm, '<strong class="goal-vdash">$1</strong> ')
+        .replace(/^(\d+ goals|1 goal)/gm, '<strong class="goal-goals">$1</strong>')
+        .replace(/^(context|state):/gm, '<strong class="goal-goals">$1</strong>:')
+        .replace(/^(case) /gm, '<strong class="goal-case">$1</strong> ')
+        .replace(/^([^:\n< ][^:\n⊢{[(⦃]*) :/gm, '<strong class="goal-hyp">$1</strong> :');
+}
+export function basename(path) {
+    const bn = path.split(/[\\/]/).pop();
+    if (bn)
+        return bn;
+    else
+        return '';
+}
+/**
+ * A specialization of {@link React.useEffect} which executes `f` with the event data
+ * whenever `ev` fires.
+ * If `key` is provided, `f` is only invoked on events fired with that key.
+ */
+export function useEvent(ev, f, dependencies, key) {
+    React.useEffect(() => {
+        const h = ev.on(f, key);
+        return () => h.dispose();
+    }, dependencies);
+}
+export function useEventResult(ev, f) {
+    const fn = f ?? (x => x);
+    const [s, setS] = React.useState(ev.current ? fn(ev.current) : undefined);
+    useEvent(ev, newV => setS(newV ? fn(newV) : undefined));
+    return s;
+}
+export function useServerNotificationEffect(method, f, deps) {
+    const ec = React.useContext(EditorContext);
+    React.useEffect(() => {
+        void ec.api.subscribeServerNotifications(method).catch(ex => {
+            console.error(`Failed subscribing to server notification '${method}': ${ex}`);
+        });
+        const h = ec.events.gotServerNotification.on(([thisMethod, params]) => {
+            if (thisMethod !== method)
+                return;
+            f(params);
+        });
+        return () => {
+            h.dispose();
+            void ec.api.unsubscribeServerNotifications(method);
+        };
+    }, deps);
+}
+/**
+ * Returns the same tuple as `setState` such that whenever a server notification with `method`
+ * arrives at the editor, the state will be updated according to `f`.
+ */
+export function useServerNotificationState(method, initial, f, deps) {
+    const [s, setS] = React.useState(initial);
+    useServerNotificationEffect(method, (params) => void f(params).then(g => setS(g)), deps);
+    return [s, setS];
+}
+export function useClientNotificationEffect(method, f, deps) {
+    const ec = React.useContext(EditorContext);
+    React.useEffect(() => {
+        void ec.api.subscribeClientNotifications(method).catch(ex => {
+            console.error(`Failed subscribing to client notification '${method}': ${ex}`);
+        });
+        const h = ec.events.sentClientNotification.on(([thisMethod, params]) => {
+            if (thisMethod !== method)
+                return;
+            f(params);
+        });
+        return () => {
+            h.dispose();
+            void ec.api.unsubscribeClientNotifications(method);
+        };
+    }, deps);
+}
+/**
+ * Like {@link useServerNotificationState} but for client->server notifications sent by the editor.
+ */
+export function useClientNotificationState(method, initial, f, deps) {
+    const [s, setS] = React.useState(initial);
+    useClientNotificationEffect(method, (params) => {
+        setS(state => f(state, params));
+    }, deps);
+    return [s, setS];
+}
+/**
+ * Returns `[{ isPaused, setPaused }, tPausable, tRef]` s.t.
+ * - `[isPaused, setPaused]` are the paused status state
+ * - for as long as `isPaused` is set, `tPausable` holds its initial value (the `t` passed before pausing)
+ *   rather than updates with changes to `t`.
+ * - `tRef` can be used to overwrite the paused state
+ *
+ * To pause child components, `startPaused` can be passed in their props.
+ */
+export function usePausableState(startPaused, t) {
+    const [isPaused, setPaused] = React.useState(startPaused);
+    const old = React.useRef(t);
+    if (!isPaused)
+        old.current = t;
+    return [{ isPaused, setPaused }, old.current, old];
+}
+/**
+ * Adds a unique `key` property to each element in `elems` using
+ * the values of (possibly non-injective) `getId`.
+ */
+export function addUniqueKeys(elems, getId) {
+    const keys = {};
+    return elems.map(el => {
+        const id = getId(el);
+        keys[id] = (keys[id] || 0) + 1;
+        return { key: `${id}:${keys[id]}`, ...el };
+    });
+}
+export const LogicalDomContext = React.createContext({ registerDescendant: () => () => { } });
+/** Suppose a component B appears as a React descendant of the component A. For layout reasons,
+ * we sometimes don't want B to appear as a descendant of A in the DOM, so we use `createPortal`.
+ * We may still however want to carry out `contains` checks as if B were there, i.e. according to
+ * the React tree structure rather than the DOM structure. While React already correctly propagates
+ * DOM events up the React tree, other functionality such as `contains` is not provided. We provide
+ * it in this hook.
+ *
+ * Accepts a ref to the observed {@link HTMLElement} (A in the example). Returns:
+ * - a {@link LogicalDomElement} which provides `contains` checks for that {@link HTMLElement}; and
+ * - a {@link LogicalDomStorage} which MUST be passed to a {@link LogicalDomContext} enclosing
+ *   the observed {@link HTMLElement}.
+ *
+ * Additionally, any component which introduces a portal MUST call `registerDescendant` in the
+ * {@link LogicalDomContext} with a ref to the portalled component (B in the example). */
+export function useLogicalDomObserver(elt) {
+    const parentCtx = React.useContext(LogicalDomContext);
+    const descendants = React.useRef(new Set());
+    // Provides a `contains` check for the children only, but not the observed element.
+    // We pass this to the parent context under the assumption that its own DOM-based
+    // `contains` check already includes the observed element.
+    const logicalChildrenElt = React.useMemo(() => ({
+        contains: (e) => {
+            for (const d of descendants.current) {
+                if (d.contains(e))
+                    return true;
+            }
+            return false;
+        },
+    }), []);
+    React.useEffect(() => parentCtx.registerDescendant(logicalChildrenElt), [parentCtx, logicalChildrenElt]);
+    const logicalElt = React.useMemo(() => ({
+        contains: (e) => {
+            if (!elt.current)
+                return false;
+            if (elt.current.contains(e))
+                return true;
+            return logicalChildrenElt.contains(e);
+        },
+    }), [elt, logicalChildrenElt]);
+    const registerDescendant = React.useCallback((el) => {
+        descendants.current.add(el);
+        return () => {
+            descendants.current.delete(el);
+        };
+    }, []);
+    return [logicalElt, React.useMemo(() => ({ registerDescendant }), [registerDescendant])];
+}
+/**
+ * An effect which calls `onClickOutside` whenever an element not logically descending from `ld`
+ * (see {@link useLogicalDomObserver}) is clicked. Note that `onClickOutside` is not called on clicks
+ * on the scrollbar since these should usually not impact the app's state.
+ * `isActive` controls whether the `onClickOutside` handler is active. This can be useful for performance,
+ * since having lots of `onClickOutside` handlers when they are not needed can be expensive.
+ */
+export function useOnClickOutside(ld, onClickOutside, isActive = true) {
+    React.useEffect(() => {
+        if (!isActive) {
+            return;
+        }
+        const onClickAnywhere = (e) => {
+            if (e.target instanceof Node && !ld.contains(e.target)) {
+                if (e.target instanceof Element && e.target.tagName === 'HTML') {
+                    // then user might be clicking in a scrollbar, otherwise
+                    // e.target would be a tag other than 'HTML'
+                }
+                else
+                    onClickOutside(e);
+            }
+        };
+        document.addEventListener('pointerdown', onClickAnywhere);
+        return () => document.removeEventListener('pointerdown', onClickAnywhere);
+    }, [ld, onClickOutside, isActive]);
+}
+/** Sends an exception object to a throwable error.
+ * Maps JSON Rpc errors to throwable errors.
+ */
+export function mapRpcError(err) {
+    if (isRpcError(err)) {
+        return new Error(`Rpc error: ${RpcErrorCode[err.code]}: ${err.message}`);
+    }
+    else if (!(err instanceof Error)) {
+        return new Error(`Unrecognised error ${JSON.stringify(err)}`);
+    }
+    else {
+        return err;
+    }
+}
+/** Catch handler for RPC methods that just returns undefined if the method is not found.
+ * This is useful for compatibility with versions of Lean that do not yet have the given RPC method.
+ */
+export function discardMethodNotFound(e) {
+    if (isRpcError(e) && e.code === RpcErrorCode.MethodNotFound) {
+        return undefined;
+    }
+    else {
+        throw mapRpcError(e);
+    }
+}
+export function useAsyncWithTrigger(fn, deps = []) {
+    const asyncState = React.useRef({ state: 'notStarted' });
+    const asyncStateDeps = React.useRef([]);
+    // A monotonically increasing counter.
+    const tick = React.useRef(0);
+    // This is bumped up to the current `tick` whenever `asyncState.current` is assigned,
+    // in order to trigger a React update.
+    const [_, setUpdate] = React.useState(0);
+    const trigger = React.useCallback(async () => {
+        if (asyncState.current.state === 'loading' || asyncState.current.state === 'resolved')
+            return;
+        tick.current += 1;
+        asyncState.current = { state: 'loading' };
+        setUpdate(tick.current);
+        tick.current += 1;
+        const startTick = tick.current;
+        const set = (state) => {
+            if (tick.current === startTick) {
+                asyncState.current = state;
+                setUpdate(tick.current);
+            }
+        };
+        return fn().then(value => set({ state: 'resolved', value }), error => set({ state: 'rejected', error }));
+    }, deps);
+    const depsTheSame = asyncStateDeps.current.length === deps.length && asyncStateDeps.current.every((d, i) => Object.is(d, deps[i]));
+    if (!depsTheSame) {
+        tick.current += 1;
+        asyncState.current = { state: 'notStarted' };
+        asyncStateDeps.current = deps;
+        setUpdate(tick.current);
+    }
+    return [asyncState.current, trigger];
+}
+/** This React hook will run the given promise function `fn` whenever the deps change
+ * and use it to update the status and result when the promise resolves.
+ *
+ * This function prevents race conditions if the requests resolve in a
+ * different order to that which they were requested in:
+ *
+ * - Request 1 is sent with, say, line=42.
+ * - Request 2 is sent with line=90.
+ * - Request 2 returns with diags=[].
+ * - Request 1 returns with diags=['error'].
+ *
+ * Without `useAsync` we would now return the diagnostics for line 42 even though we're at line 90.
+ *
+ * When the deps change, the function immediately returns `{ state: 'loading' }`.
+ */
+export function useAsync(fn, deps = []) {
+    const [state, trigger] = useAsyncWithTrigger(fn, deps);
+    if (state.state === 'notStarted') {
+        void trigger();
+        return { state: 'loading' };
+    }
+    else {
+        return state;
+    }
+}
+/** Like {@link useAsync} but never transitions from `resolved` to `loading` by internally storing
+ * the latest `resolved` state and continuing to return it while an update is in flight. The lower
+ * amount of re-renders tends to be less visually jarring.
+ */
+export function useAsyncPersistent(fn, deps = []) {
+    const [latestState, setLatestState] = React.useState(undefined);
+    const state = useAsync(async () => {
+        const newState = await fn();
+        setLatestState(newState);
+        return newState;
+    }, deps);
+    if (state.state === 'loading' && latestState !== undefined) {
+        return { state: 'resolved', value: latestState };
+    }
+    return state;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lean4monaco",
-  "version": "1.1.9",
+  "version": "1.1.11",
   "description": "Monaco Editor support for the Lean 4 theorem prover.",
   "keywords": [
     "lean",