@kerebron/extension-codemirror 0.3.2 → 0.4.2

package/esm/extension-autocomplete/src/AutocompletePlugin.js

@@ -0,0 +1,232 @@
+import { Plugin, PluginKey } from 'prosemirror-state';
+import { Decoration, DecorationSet } from 'prosemirror-view';
+import { createDefaultMatcher } from './createDefaultMatcher.js';
+import { DefaultRenderer } from './DefaultRenderer.js';
+export const AutocompletePluginKey = new PluginKey('autocomplete');
+export class AutocompletePlugin extends Plugin {
+    constructor(config, editor) {
+        let props;
+        const renderer = config.renderer ||
+            new DefaultRenderer(editor);
+        super({
+            key: AutocompletePluginKey,
+            view() {
+                return {
+                    update: async (view, prevState) => {
+                        const prev = this.key?.getState(prevState);
+                        const next = this.key?.getState(view.state);
+                        const moved = prev.active && next.active &&
+                            prev.range.from !== next.range.from;
+                        const started = !prev.active && next.active;
+                        const stopped = prev.active && !next.active;
+                        const changed = !started && !stopped && prev.query !== next.query;
+                        const handleStart = started || (moved && changed);
+                        const handleChange = changed || moved;
+                        let handleExit = stopped || (moved && changed);
+                        if (!handleStart && !handleChange && !handleExit) {
+                            return;
+                        }
+                        const state = handleExit && !handleStart ? prev : next;
+                        // await new Promise(r => setTimeout(r, 100));
+                        const decorationNode = view.dom.querySelector(`[data-decoration-id="${state.decorationId}"]`);
+                        props = {
+                            range: state.range,
+                            query: state.query,
+                            text: state.text,
+                            items: [],
+                            command: (selected) => {
+                                if (!config.onSelect) {
+                                    return () => { };
+                                }
+                                return config.onSelect(selected, state.range);
+                            },
+                            decorationNode,
+                            // virtual node for popper.js or tippy.js
+                            // this can be used for building popups without a DOM node
+                            clientRect: decorationNode
+                                ? () => {
+                                    // because of `items` can be asynchrounous we’ll search for the current decoration node
+                                    const { decorationId } = this.key?.getState(editor.state); // eslint-disable-line
+                                    const currentDecorationNode = view.dom.querySelector(`[data-decoration-id="${decorationId}"]`);
+                                    return currentDecorationNode?.getBoundingClientRect() || null;
+                                }
+                                : null,
+                        };
+                        if (handleStart) {
+                            renderer?.onBeforeStart?.(props);
+                        }
+                        if (handleChange) {
+                            renderer?.onBeforeUpdate?.(props);
+                        }
+                        if (handleChange || handleStart) {
+                            if (config.getItems) {
+                                try {
+                                    const ctx = { state, range: state.range, isActive: true };
+                                    props.items = await config.getItems(state.query, ctx);
+                                }
+                                catch (err) {
+                                    if (err.isLSP) {
+                                        props.items = [];
+                                        console.error('LSP error config.getItems()', err.message, config.getItems);
+                                    }
+                                    else {
+                                        throw err;
+                                    }
+                                }
+                                if (props.items.length === 0) {
+                                    handleExit = true;
+                                }
+                            }
+                        }
+                        if (handleExit) {
+                            renderer?.onExit?.(props);
+                        }
+                        if (handleChange) {
+                            renderer?.onUpdate?.(props);
+                        }
+                        if (handleStart) {
+                            renderer?.onStart?.(props);
+                        }
+                    },
+                    destroy: () => {
+                        if (!props) {
+                            return;
+                        }
+                        renderer?.onExit?.(props);
+                    },
+                };
+            },
+            state: {
+                // Initialize the plugin's internal state.
+                init() {
+                    const state = {
+                        manual: false,
+                        active: false,
+                        range: {
+                            from: 0,
+                            to: 0,
+                        },
+                        query: null,
+                        text: null,
+                        composing: false,
+                    };
+                    return state;
+                },
+                // Apply changes to the plugin state from a view transaction.
+                apply(transaction, prev, _oldState, state) {
+                    // const { isEditable } = editor; // TODO
+                    const isEditable = true;
+                    const { composing } = editor.view;
+                    const { selection } = transaction;
+                    const { empty, from } = selection;
+                    const next = { ...prev };
+                    const meta = transaction.getMeta(AutocompletePluginKey);
+                    if (!meta && !transaction.isGeneric) {
+                        return next;
+                    }
+                    if (meta?.type === 'deactivate') {
+                        console.info('Deactivate autocomplete');
+                        next.active = false;
+                        return next;
+                    }
+                    if (meta?.type === 'activate') {
+                        console.info('Trigger manual autocomplete');
+                        next.range = { from: selection.from, to: selection.to };
+                        next.active = true;
+                        next.manual = true;
+                        next.query = null;
+                        return next;
+                    }
+                    next.composing = composing;
+                    const parentNode = selection.$anchor.parent;
+                    if (!['code_block'].includes(parentNode?.type.name) && isEditable &&
+                        (empty || editor.view.composing)) {
+                        // Reset active state if we just left the previous suggestion range
+                        if ((from < prev.range.from || from > prev.range.to) && !composing &&
+                            !prev.composing) {
+                            next.active = false;
+                        }
+                        const matchers = config.matchers ||
+                            [createDefaultMatcher()];
+                        let match = undefined;
+                        for (const matcher of matchers) {
+                            match = matcher(selection.$from);
+                            if (match) {
+                                break;
+                            }
+                        }
+                        const decorationId = `id_${Math.floor(Math.random() * 0xffffffff)}`;
+                        // If we found a match, update the current state to show it
+                        if (match && (!config.allow || config.allow({
+                            state,
+                            range: match.range,
+                            isActive: prev.active,
+                        }))) {
+                            console.info('Trigger matcher autocomplete', match);
+                            next.active = true;
+                            next.decorationId = prev.decorationId
+                                ? prev.decorationId
+                                : decorationId;
+                            next.range = match.range;
+                            next.query = match.query;
+                            next.text = match.text;
+                        }
+                        else {
+                            next.active = false;
+                        }
+                    }
+                    else {
+                        next.active = false;
+                    }
+                    next.manual = false;
+                    // Make sure to empty the range if suggestion is inactive
+                    if (!next.active) {
+                        next.decorationId = null;
+                        next.range = { from: 0, to: 0 };
+                        next.query = null;
+                        next.text = null;
+                    }
+                    return next;
+                },
+            },
+            props: {
+                // Call the keydown hook if suggestion is active.
+                handleKeyDown(view, event) {
+                    const { active, range } = this.getState(view.state);
+                    if (event.key === ' ' && event.ctrlKey) {
+                        const tr = view.state.tr.setMeta(AutocompletePluginKey, {
+                            type: 'activate',
+                        });
+                        console.info('Manual autocomplete key');
+                        view.dispatch(tr);
+                        return true;
+                    }
+                    if (active) {
+                        return renderer?.onKeyDown?.({ view, event, range }) || false;
+                    }
+                    return false;
+                },
+                // Setup decorator on the currently active suggestion.
+                decorations(state) {
+                    const { active, range, decorationId } = this.getState(state);
+                    if (!active) {
+                        return null;
+                    }
+                    const node = document.createElement('span');
+                    node.className = config.decorationClass || 'kb-autocomplete--decor';
+                    node.setAttribute('data-decoration-id', decorationId);
+                    return DecorationSet.create(state.doc, [
+                        Decoration.widget(range.from, node),
+                    ]);
+                },
+            },
+        });
+        renderer.addEventListener('close', () => {
+            const tr = editor.state.tr.setMeta(AutocompletePluginKey, {
+                type: 'deactivate',
+            });
+            console.info('Manual autocomplete deactivate');
+            editor.view.dispatch(tr);
+        });
+    }
+}

package/esm/extension-autocomplete/src/DefaultRenderer.d.ts

@@ -0,0 +1,17 @@
+import { CoreEditor } from '../../editor/src/mod.js';
+import { AutocompleteRenderer, SuggestionKeyDownProps, SuggestionProps } from './types.js';
+export declare class DefaultRenderer<Item> extends EventTarget implements AutocompleteRenderer {
+    private editor;
+    command: (props: any) => void;
+    wrapper: HTMLElement | undefined;
+    items: Array<Item>;
+    pos: number;
+    constructor(editor: CoreEditor);
+    onStart(props: SuggestionProps<Item>): void;
+    onUpdate(props: SuggestionProps<Item>): void;
+    onExit(): void;
+    onKeyDown(props: SuggestionKeyDownProps): boolean;
+    createListItem(item: Item, cnt: number): any;
+    recreateList(props?: SuggestionProps<Item>): void;
+}
+//# sourceMappingURL=DefaultRenderer.d.ts.map

package/esm/extension-autocomplete/src/DefaultRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultRenderer.d.ts","sourceRoot":"","sources":["../../../src/extension-autocomplete/src/DefaultRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EACL,oBAAoB,EACpB,sBAAsB,EACtB,eAAe,EAChB,MAAM,YAAY,CAAC;AAIpB,qBAAa,eAAe,CAAC,IAAI,CAAE,SAAQ,WACzC,YAAW,oBAAoB;IAMnB,OAAO,CAAC,MAAM;IAL1B,OAAO,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B,OAAO,EAAE,WAAW,GAAG,SAAS,CAAC;IACjC,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,CAAM;IACxB,GAAG,EAAE,MAAM,CAAM;gBAEG,MAAM,EAAE,UAAU;IAKtC,OAAO,CAAC,KAAK,EAAE,eAAe,CAAC,IAAI,CAAC;IAiBpC,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC,IAAI,CAAC;IAMrC,MAAM;IASN,SAAS,CAAC,KAAK,EAAE,sBAAsB;IA0CvC,cAAc,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM;IAatC,YAAY,CAAC,KAAK,CAAC,EAAE,eAAe,CAAC,IAAI,CAAC;CAyB3C"}

package/esm/extension-autocomplete/src/DefaultRenderer.js

@@ -0,0 +1,137 @@
+const CSS_PREFIX = 'kb-autocomplete';
+export class DefaultRenderer extends EventTarget {
+    constructor(editor) {
+        super();
+        Object.defineProperty(this, "editor", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: editor
+        });
+        Object.defineProperty(this, "command", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "wrapper", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "items", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        Object.defineProperty(this, "pos", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: -1
+        });
+        this.command = () => { };
+    }
+    onStart(props) {
+        this.command = props.command;
+        if (this.wrapper) {
+            this.wrapper.parentElement?.removeChild(this.wrapper);
+        }
+        const root = ('root' in this.editor.view)
+            ? this.editor.view.root
+            : document || document;
+        this.wrapper = document.createElement('ul');
+        this.wrapper.classList.add(CSS_PREFIX + '__wrapper');
+        (root.body || root).appendChild(this.wrapper);
+        this.items.splice(0, this.items.length, ...props.items);
+        this.recreateList(props);
+    }
+    onUpdate(props) {
+        this.command = props.command;
+        this.items.splice(0, this.items.length, ...props.items);
+        this.recreateList(props);
+    }
+    onExit() {
+        if (this.wrapper) {
+            this.wrapper.parentNode?.removeChild(this.wrapper);
+            this.wrapper = undefined;
+        }
+        this.dispatchEvent(new Event('close'));
+        this.pos = -1;
+    }
+    onKeyDown(props) {
+        if (!this.wrapper) {
+            return false;
+        }
+        if (this.items.length === 0) {
+            return false;
+        }
+        if (props.event.key === 'Escape') {
+            if (this.wrapper) {
+                this.wrapper.parentNode?.removeChild(this.wrapper);
+                this.wrapper = undefined;
+                return true;
+            }
+        }
+        if (props.event.key === 'ArrowUp') {
+            if (this.pos > -1) {
+                this.pos = this.pos - 1;
+                this.recreateList();
+            }
+            return true;
+        }
+        if (props.event.key === 'ArrowDown') {
+            if (this.pos < this.items.length - 1) {
+                this.pos++;
+                this.recreateList();
+            }
+            return true;
+        }
+        if (props.event.key === 'Enter') {
+            if (this.pos > -1 && this.pos < this.items.length) {
+                this.command(this.items[this.pos]);
+                this.items.splice(0, this.items.length);
+                this.onExit();
+                return true;
+            }
+        }
+        return false;
+    }
+    createListItem(item, cnt) {
+        const li = document.createElement('li');
+        if (cnt === this.pos) {
+            li.classList.add('active');
+        }
+        li.innerText = '' + item; // TODO item to string and item formatting
+        li.style.cursor = 'pointer';
+        li.addEventListener('click', () => {
+            this.command(item);
+        });
+        return li;
+    }
+    recreateList(props) {
+        if (!this.wrapper) {
+            return;
+        }
+        this.wrapper.innerHTML = '';
+        for (let cnt = 0; cnt < this.items.length; cnt++) {
+            const item = this.items[cnt];
+            this.wrapper.appendChild(this.createListItem(item, cnt));
+        }
+        if (this.items.length === 0) {
+            this.wrapper.style.display = 'none';
+        }
+        else {
+            this.wrapper.style.display = '';
+        }
+        const rect = props?.clientRect?.();
+        if (rect?.height) {
+            const left = rect.left;
+            const bottom = rect.bottom;
+            this.wrapper.style.left = left + 'px';
+            this.wrapper.style.top = bottom + 'px';
+        }
+    }
+}

package/esm/extension-autocomplete/src/ExtensionAutocomplete.d.ts

@@ -0,0 +1,26 @@
+import type { EditorState, Plugin } from 'prosemirror-state';
+import { Extension, type TextRange } from '../../editor/src/mod.js';
+import { AutocompletePlugin } from './AutocompletePlugin.js';
+import { AutocompleteMatcher, AutocompleteRenderer } from './types.js';
+export interface AutocompleteProps {
+    state: EditorState;
+    range: TextRange;
+    isActive?: boolean;
+}
+export interface AutocompleteConfig<I = any, TSelected = any> {
+    getItems: (query: string, props: AutocompleteProps) => I[] | Promise<I[]>;
+    onSelect?: (selected: TSelected, range: TextRange) => void;
+    allow?: (props: AutocompleteProps) => boolean;
+    matchers?: AutocompleteMatcher[];
+    renderer?: AutocompleteRenderer<I, TSelected>;
+    decorationTag?: string;
+    decorationClass?: string;
+}
+export declare class ExtensionAutocomplete extends Extension {
+    protected config: AutocompleteConfig;
+    name: string;
+    plugin: AutocompletePlugin<unknown, unknown>;
+    constructor(config: AutocompleteConfig);
+    getProseMirrorPlugins(): Plugin[];
+}
+//# sourceMappingURL=ExtensionAutocomplete.d.ts.map

package/esm/extension-autocomplete/src/ExtensionAutocomplete.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExtensionAutocomplete.d.ts","sourceRoot":"","sources":["../../../src/extension-autocomplete/src/ExtensionAutocomplete.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAG7D,OAAO,EAAmB,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAErF,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAEvE,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,kBAAkB,CAAC,CAAC,GAAG,GAAG,EAAE,SAAS,GAAG,GAAG;IAC1D,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,iBAAiB,KAAK,CAAC,EAAE,GAAG,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;IAE1E,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC3D,KAAK,CAAC,EAAE,CACN,KAAK,EAAE,iBAAiB,KACrB,OAAO,CAAC;IAEb,QAAQ,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACjC,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC;IAE9C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,qBAAa,qBAAsB,SAAQ,SAAS;cAK7B,MAAM,EAAE,kBAAkB;IAJ/C,IAAI,SAAkB;IACtB,MAAM,EAAG,kBAAkB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;gBAGzB,MAAM,EAAE,kBAAkB;IAKtC,qBAAqB,IAAI,MAAM,EAAE;CAK3C"}

package/esm/extension-autocomplete/src/ExtensionAutocomplete.js

@@ -0,0 +1,30 @@
+import { Extension } from '../../editor/src/mod.js';
+import { AutocompletePlugin } from './AutocompletePlugin.js';
+export class ExtensionAutocomplete extends Extension {
+    constructor(config) {
+        super(config);
+        Object.defineProperty(this, "config", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: config
+        });
+        Object.defineProperty(this, "name", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: 'autocomplete'
+        });
+        Object.defineProperty(this, "plugin", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+    }
+    getProseMirrorPlugins() {
+        return [
+            new AutocompletePlugin(this.config, this.editor),
+        ];
+    }
+}

package/esm/extension-autocomplete/src/createDefaultMatcher.d.ts

@@ -0,0 +1,11 @@
+import { AutocompleteMatcher } from './types.js';
+export declare function escapeForRegEx(string: string): string;
+export interface MatcherConfig {
+    char?: string;
+    allowSpaces?: boolean;
+    allowToIncludeChar?: boolean;
+    allowedPrefixes?: string[] | null;
+    startOfLine?: boolean;
+}
+export declare function createDefaultMatcher(config?: MatcherConfig): AutocompleteMatcher;
+//# sourceMappingURL=createDefaultMatcher.d.ts.map

package/esm/extension-autocomplete/src/createDefaultMatcher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createDefaultMatcher.d.ts","sourceRoot":"","sources":["../../../src/extension-autocomplete/src/createDefaultMatcher.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAmB,MAAM,YAAY,CAAC;AAGlE,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAErD;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,eAAe,CAAC,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,oBAAoB,CAClC,MAAM,GAAE,aAAkB,GACzB,mBAAmB,CA4ErB"}

package/esm/extension-autocomplete/src/createDefaultMatcher.js

@@ -0,0 +1,58 @@
+// source: https://stackoverflow.com/a/6969486
+export function escapeForRegEx(string) {
+    return string.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&');
+}
+export function createDefaultMatcher(config = {}) {
+    const char = config.char || '@';
+    const allowToIncludeChar = config.allowToIncludeChar || false;
+    const allowedPrefixes = config.allowedPrefixes || [' '];
+    const startOfLine = config.startOfLine || false;
+    return ($position) => {
+        const allowSpaces = config.allowSpaces && !allowToIncludeChar;
+        const escapedChar = escapeForRegEx(char);
+        const suffix = new RegExp(`\\s${escapedChar}$`);
+        const prefix = startOfLine ? '^' : '';
+        const finalEscapedChar = allowToIncludeChar ? '' : escapedChar;
+        const regexp = allowSpaces
+            ? new RegExp(`${prefix}${escapedChar}.*?(?=\\s${finalEscapedChar}|$)`, 'gm')
+            : new RegExp(`${prefix}(?:^)?${escapedChar}[^\\s${finalEscapedChar}]*`, 'gm');
+        const text = $position.nodeBefore?.isText && $position.nodeBefore.text;
+        if (!text) {
+            return null;
+        }
+        const textFrom = $position.pos - text.length;
+        const match = Array.from(text.matchAll(regexp)).pop();
+        if (!match || match.input === undefined || match.index === undefined) {
+            return null;
+        }
+        // JavaScript doesn't have lookbehinds. This hacks a check that first character
+        // is a space or the start of the line
+        const matchPrefix = match.input.slice(Math.max(0, match.index - 1), match.index);
+        const matchPrefixIsAllowed = new RegExp(`^[${allowedPrefixes?.join('')}\0]?$`)
+            .test(matchPrefix);
+        if (allowedPrefixes !== null && !matchPrefixIsAllowed) {
+            return null;
+        }
+        // The absolute position of the match in the document
+        const from = textFrom + match.index;
+        let to = from + match[0].length;
+        // Edge case handling; if spaces are allowed and we're directly in between
+        // two triggers
+        if (allowSpaces && suffix.test(text.slice(to - 1, to + 1))) {
+            match[0] += ' ';
+            to += 1;
+        }
+        // If the $position is located within the matched substring, return that range
+        if (from < $position.pos && to >= $position.pos) {
+            return {
+                range: {
+                    from,
+                    to,
+                },
+                query: match[0],
+                text: match[0],
+            };
+        }
+        return null;
+    };
+}

package/esm/extension-autocomplete/src/createRegexMatcher.d.ts

@@ -0,0 +1,4 @@
+import { AutocompleteMatcher } from './types.js';
+export declare function ensureAnchor(expr: RegExp, start: boolean): RegExp;
+export declare function createRegexMatcher(regexes: RegExp[]): AutocompleteMatcher;
+//# sourceMappingURL=createRegexMatcher.d.ts.map

package/esm/extension-autocomplete/src/createRegexMatcher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createRegexMatcher.d.ts","sourceRoot":"","sources":["../../../src/extension-autocomplete/src/createRegexMatcher.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAmB,MAAM,YAAY,CAAC;AAElE,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,UASxD;AAqBD,wBAAgB,kBAAkB,CAChC,OAAO,EAAE,MAAM,EAAE,GAChB,mBAAmB,CAmCrB"}

package/esm/extension-autocomplete/src/createRegexMatcher.js

@@ -0,0 +1,50 @@
+export function ensureAnchor(expr, start) {
+    let { source } = expr;
+    let addStart = start && source[0] != '^', addEnd = source[source.length - 1] != '$';
+    if (!addStart && !addEnd)
+        return expr;
+    return new RegExp(`${addStart ? '^' : ''}(?:${source})${addEnd ? '$' : ''}`, expr.flags ?? (expr.ignoreCase ? 'i' : ''));
+}
+function matchBefore($position, expr) {
+    const text = $position.nodeBefore?.isText && $position.nodeBefore.text;
+    if (!text) {
+        return null;
+    }
+    const textFrom = $position.pos - text.length;
+    const start = Math.max(textFrom, $position.pos - 250);
+    const str = text.slice();
+    const found = str.search(ensureAnchor(expr, false));
+    return found < 0
+        ? null
+        : { from: start + found, to: $position.pos, text: str.slice(found) };
+}
+export function createRegexMatcher(regexes) {
+    return ($position) => {
+        const text = $position.nodeBefore?.isText && $position.nodeBefore.text;
+        if (!text) {
+            return null;
+        }
+        const textFrom = $position.pos - text.length;
+        const matches = regexes.map((regex) => matchBefore($position, regex))
+            .filter((m) => !!m);
+        if (matches.length === 0) {
+            return null;
+        }
+        matches.sort((a, b) => b.text.length - a.text.length);
+        let from = matches[0].from;
+        let matchedText = matches[0].text;
+        let to = matches[0].to;
+        while (matchedText.match(/^\s/)) {
+            matchedText = matchedText.substring(1);
+            from++;
+        }
+        return {
+            range: {
+                from,
+                to,
+            },
+            query: matchedText,
+            text: matchedText,
+        };
+    };
+}

package/esm/extension-autocomplete/src/mod.d.ts

@@ -0,0 +1,3 @@
+export * from './ExtensionAutocomplete.js';
+export { createRegexMatcher } from './createRegexMatcher.js';
+//# sourceMappingURL=mod.d.ts.map

package/esm/extension-autocomplete/src/mod.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mod.d.ts","sourceRoot":"","sources":["../../../src/extension-autocomplete/src/mod.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC;AAC3C,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC"}

package/esm/extension-autocomplete/src/mod.js

@@ -0,0 +1,2 @@
+export * from './ExtensionAutocomplete.js';
+export { createRegexMatcher } from './createRegexMatcher.js';

package/esm/extension-autocomplete/src/types.d.ts

@@ -0,0 +1,60 @@
+import type { ResolvedPos } from 'prosemirror-model';
+import type { TextRange } from '../../editor/src/mod.js';
+import { EditorView } from 'prosemirror-view';
+export type SuggestionMatch = {
+    range: TextRange;
+    query: string;
+    text: string;
+} | null;
+export type AutocompleteMatcher = (pos: ResolvedPos) => SuggestionMatch;
+export interface SuggestionKeyDownProps {
+    view: EditorView;
+    event: KeyboardEvent;
+    range: TextRange;
+}
+export interface AutocompleteRenderer<I = any, TSelected = any> {
+    onBeforeStart?: (props: SuggestionProps<I, TSelected>) => void;
+    onStart?: (props: SuggestionProps<I, TSelected>) => void;
+    onBeforeUpdate?: (props: SuggestionProps<I, TSelected>) => void;
+    onUpdate?: (props: SuggestionProps<I, TSelected>) => void;
+    onExit?: (props: SuggestionProps<I, TSelected>) => void;
+    onKeyDown?: (props: SuggestionKeyDownProps) => boolean;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener(type: string, callback: EventListenerOrEventListenerObject | null, options?: EventListenerOptions | boolean): void;
+}
+export interface SuggestionProps<I = any, TSelected = any> {
+    /**
+     * The range of the suggestion.
+     */
+    range: TextRange;
+    /**
+     * The current suggestion query.
+     */
+    query: string;
+    /**
+     * The current suggestion text.
+     */
+    text: string;
+    /**
+     * The suggestion items array.
+     */
+    items: I[];
+    /**
+     * A function that is called when a suggestion is selected.
+     * @param props The props object.
+     * @returns void
+     */
+    command: (props: TSelected) => void;
+    /**
+     * The decoration node HTML element
+     * @default null
+     */
+    decorationNode: Element | null;
+    /**
+     * The function that returns the client rect
+     * @default null
+     * @example () => new DOMRect(0, 0, 0, 0)
+     */
+    clientRect?: (() => DOMRect | null) | null;
+}
+//# sourceMappingURL=types.d.ts.map

package/esm/extension-autocomplete/src/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/extension-autocomplete/src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE9C,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,GAAG,IAAI,CAAC;AAET,MAAM,MAAM,mBAAmB,GAAG,CAAC,GAAG,EAAE,WAAW,KAAK,eAAe,CAAC;AAExE,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,EAAE,aAAa,CAAC;IACrB,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,WAAW,oBAAoB,CAAC,CAAC,GAAG,GAAG,EAAE,SAAS,GAAG,GAAG;IAC5D,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,EAAE,SAAS,CAAC,KAAK,IAAI,CAAC;IAC/D,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,EAAE,SAAS,CAAC,KAAK,IAAI,CAAC;IACzD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,EAAE,SAAS,CAAC,KAAK,IAAI,CAAC;IAChE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,EAAE,SAAS,CAAC,KAAK,IAAI,CAAC;IAC1D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,EAAE,SAAS,CAAC,KAAK,IAAI,CAAC;IACxD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,OAAO,CAAC;IAEvD,gBAAgB,CACd,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,kCAAkC,EAC5C,OAAO,CAAC,EAAE,OAAO,GAAG,uBAAuB,GAC1C,IAAI,CAAC;IACR,mBAAmB,CACjB,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,kCAAkC,GAAG,IAAI,EACnD,OAAO,CAAC,EAAE,oBAAoB,GAAG,OAAO,GACvC,IAAI,CAAC;CACT;AAED,MAAM,WAAW,eAAe,CAAC,CAAC,GAAG,GAAG,EAAE,SAAS,GAAG,GAAG;IACvD;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,KAAK,EAAE,CAAC,EAAE,CAAC;IAEX;;;;OAIG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAEpC;;;OAGG;IACH,cAAc,EAAE,OAAO,GAAG,IAAI,CAAC;IAE/B;;;;OAIG;IACH,UAAU,CAAC,EAAE,CAAC,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC;CAC5C"}