@sereneinserenade/tiptap-inline-suggestion/dist/index.js

Tiptap Extension for adding inline suggestions. Ex. for AI autocompletion.

/**
 * MIT License
 *
 * Copyright (c) 2023 Jeet Mandaliya jeet.mandaliya7@gmail.com
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in all
 * copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 * SOFTWARE.
 */

import { Extension } from '@tiptap/core';
import { PluginKey, Plugin } from '@tiptap/pm/state';
import { DecorationSet, Decoration } from '@tiptap/pm/view';


function __awaiter(thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
}

typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
    var e = new Error(message);
    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
};

const inlineSuggestionPluginKey = new PluginKey("inlineSuggestion");
const InlineSuggestion = Extension.create({
    name: "inlineSuggestion",
    addOptions() {
        return {
            fetchAutocompletion: () => __awaiter(this, void 0, void 0, function* () {
                const message = "[@sereneinserenade/tiptap-inline-suggestions] Please add a fetchSuggestion function to fetch suggestions from.";
                console.warn(message);
                return message;
            }),
        };
    },
    addStorage() {
        return {
            data: {},
        };
    },
    addCommands() {
        return {
            fetchSuggestion: () => ({ state, chain, editor }) => {
                if (this.storage.data.currentSuggestion) {
                    return chain()
                        .command(() => {
                        const chunkifiedSuggestion = this.storage.data.currentSuggestion.split("");
                        this.storage.data = {};
                        for (let i = 0; i < chunkifiedSuggestion.length; i++) {
                            setTimeout(() => editor
                                .chain()
                                .insertContent(chunkifiedSuggestion[i])
                                .focus()
                                .run(), 2 * i);
                        }
                        return true;
                    })
                        .run();
                }
                const { $from } = state.selection;
                const node = $from.parent;
                const [from, to] = [$from.start() - 1, $from.end() + 1];
                const existingText = node.textContent;
                if (existingText) {
                    this.options.fetchAutocompletion(existingText).then((res) => {
                        this.storage.data = {
                            currentSuggestion: res,
                            nodeDetails: {
                                from,
                                to,
                            },
                        };
                        editor.view.dispatch(editor.view.state.tr.setMeta("addToHistory", false));
                    });
                    return true;
                }
                return false;
            },
        };
    },
    addProseMirrorPlugins() {
        const getStorage = () => this.storage;
        const fetchSuggestion = () => this.editor.commands.fetchSuggestion();
        const handleNonTabKey = () => (this.storage.data = {});
        return [
            new Plugin({
                key: inlineSuggestionPluginKey,
                state: {
                    init() {
                        return DecorationSet.empty;
                    },
                    apply(tr) {
                        const storage = getStorage().data;
                        if (storage.currentSuggestion && storage.nodeDetails) {
                            const { from, to } = storage.nodeDetails;
                            const decoration = Decoration.node(from, to, {
                                "data-inline-suggestion": storage.currentSuggestion,
                            });
                            return DecorationSet.create(tr.doc, [decoration]);
                        }
                        return DecorationSet.empty;
                    },
                },
                props: {
                    decorations(state) {
                        return this.getState(state);
                    },
                    handleKeyDown(_, event) {
                        if (event.key === "Tab") {
                            event.preventDefault();
                            fetchSuggestion();
                            return true;
                        }
                        handleNonTabKey();
                    },
                },
            }),
        ];
    },
});

export { InlineSuggestion, InlineSuggestion as default, inlineSuggestionPluginKey };
//# sourceMappingURL=index.js.map