@kerebron/extension-autocomplete 0.4.0

package/LICENSE

@@ -0,0 +1,23 @@
+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.

package/README.md

@@ -0,0 +1,82 @@
+# Kerebron - Prosemirror based online editor kit
+
+## Watch a Demo
+
+<a href="https://youtube.com/shorts/OdJjhAPj-wA?feature=share" target="_blank">
+  <img src="https://github.com/user-attachments/assets/b63ec84a-0ed2-4f98-920c-76f6d3215168" alt="Alt Text" width="200">
+</a>
+
+## Playground Demo
+
+[playground](https://demo.kerebron.com) - be nice.
+
+## Overview
+
+Using vanilla Prosemirror modules is often impossible because of
+incompatibilities.
+
+Kerebron forks several prosemirror projects into one monorepo in order to keep
+them in sync.
+
+Project is inspired on https://tiptap.dev/, but instead of building wrapper
+around a wrapper it borrows concept of extension and command manager.
+
+It has simplified tooling (deno), fewer dependencies and resulting in lower
+number of output npm modules.
+
+**Work in progress**
+
+
+## Build
+
+### Build static examples and `.wasm` files
+
+```sh
+deno task build
+```
+
+## Development
+
+To start example server:
+
+```sh
+deno task -f server-deno-hono start
+```
+
+## Examples
+
+TODO
+
+### NPM packages are generated using DNT
+
+- https://deno.com/blog/publish-esm-cjs-module-dnt - the easiest way to publish
+  a hybrid npm module for ESM and CommonJS
+- https://github.com/denoland/dnt
+- https://gaubee.com/article/Publishing-Your-Deno-Project-as-a-Monorepo-using-dnt/
+
+To generate npm packages
+
+```sh
+deno -A ./build/build_npm.ts
+```
+
+## Run through docker
+
+```sh
+docker build . -t editor-test
+docker run -it -p 8000:8000 -v $PWD:/usr/src/app editor-test
+```
+
+## Prerequisites
+
+Install deno
+
+```
+npm install -g deno
+```
+
+Install rust
+
+```
+curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
+```

package/assets/autocomplete.css

@@ -0,0 +1,12 @@
+.kb-autocomplete__wrapper {
+  position: fixed;
+  z-index: 99999;
+  padding: 6px var(--kb-space-sm);
+  background: var(--kb-color-surface-elevated);
+  list-style: none;
+}
+
+.kb-autocomplete__wrapper li.active {
+  background: rgba(232, 234, 237, 0.08);
+  color: #fff;
+}

package/esm/editor/src/CoreEditor.d.ts

@@ -0,0 +1,40 @@
+import { EditorView } from 'prosemirror-view';
+import { Node as ProseMirrorNode, Schema } from 'prosemirror-model';
+import type { EditorConfig, JSONContent } from './types.js';
+import { EditorState, Transaction } from 'prosemirror-state';
+import { DummyEditorView } from './DummyEditorView.js';
+import { ChainedCommands } from './commands/mod.js';
+import { Extension } from './Extension.js';
+import { EditorUi } from './ui.js';
+export declare class CoreEditor extends EventTarget {
+    readonly config: Partial<EditorConfig>;
+    private extensionManager;
+    private commandManager;
+    view: EditorView | DummyEditorView;
+    state: EditorState;
+    ui: EditorUi;
+    constructor(config?: Partial<EditorConfig>);
+    getExtension<T extends Extension>(name: string): T | undefined;
+    get schema(): Schema<any, any>;
+    get run(): {
+        [key: string]: (...args: any[]) => boolean;
+    };
+    get commandFactories(): {
+        [key: string]: import("./commands/types.js").CommandFactory;
+    };
+    chain(): ChainedCommands;
+    can(): ChainedCommands;
+    private createView;
+    dispatchTransaction(transaction: Transaction): void;
+    private setupPlugins;
+    clearDocument(): void;
+    setDocument(content: any): void;
+    getDocument(): ProseMirrorNode;
+    loadDocument(mediaType: string, content: Uint8Array): Promise<void>;
+    saveDocument(mediaType: string): Promise<Uint8Array>;
+    getJSON(): JSONContent;
+    clone(options?: Partial<EditorConfig>): CoreEditor;
+    debug(doc?: ProseMirrorNode): void;
+    destroy(): void;
+}
+//# sourceMappingURL=CoreEditor.d.ts.map

package/esm/editor/src/CoreEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoreEditor.d.ts","sourceRoot":"","sources":["../../../src/editor/src/CoreEditor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,IAAI,IAAI,eAAe,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAGpE,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAG7D,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAa,QAAQ,EAAE,MAAM,SAAS,CAAC;AAc9C,qBAAa,UAAW,SAAQ,WAAW;IACzC,SAAgB,MAAM,EAAE,OAAO,CAAC,YAAY,CAAC,CAG3C;IACF,OAAO,CAAC,gBAAgB,CAAmB;IAC3C,OAAO,CAAC,cAAc,CAAiB;IAChC,IAAI,EAAG,UAAU,GAAG,eAAe,CAAC;IACpC,KAAK,EAAG,WAAW,CAAC;IACpB,EAAE,EAAE,QAAQ,CAAmB;gBAE1B,MAAM,GAAE,OAAO,CAAC,YAAY,CAAM;IA+B9C,YAAY,CAAC,CAAC,SAAS,SAAS,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC,GAAG,SAAS;IAI9D,IAAW,MAAM,qBAEhB;IAED,IAAW,GAAG;;MAEb;IAED,IAAW,gBAAgB;;MAE1B;IAEM,KAAK,IAAI,eAAe;IAIxB,GAAG,IAAI,eAAe;IAI7B,OAAO,CAAC,UAAU;IA8CX,mBAAmB,CAAC,WAAW,EAAE,WAAW;IAsBnD,OAAO,CAAC,YAAY;IAcb,aAAa;IASb,WAAW,CAAC,OAAO,EAAE,GAAG;IAyBxB,WAAW;IAIL,YAAY,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU;IA0BnD,YAAY,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,UAAU,CAAC;IAY1D,OAAO,IAAI,WAAW;IAItB,KAAK,CAAC,OAAO,GAAE,OAAO,CAAC,YAAY,CAAM,GAAG,UAAU;IAOtD,KAAK,CAAC,GAAG,CAAC,EAAE,eAAe;IAO3B,OAAO;CAOf"}

package/esm/editor/src/CoreEditor.js

@@ -0,0 +1,252 @@
+import { EditorView } from 'prosemirror-view';
+import { Node as ProseMirrorNode } from 'prosemirror-model';
+import { ExtensionManager } from './ExtensionManager.js';
+import { EditorState } from 'prosemirror-state';
+import { CommandManager } from './commands/CommandManager.js';
+import { nodeToTreeString } from './nodeToTreeString.js';
+import { DummyEditorView } from './DummyEditorView.js';
+import { createNodeFromObject } from './utilities/createNodeFromContent.js';
+import { defaultUi } from './ui.js';
+function ensureDocSchema(doc, schema) {
+    if (doc.type.schema === schema) {
+        return doc;
+    }
+    const json = doc.toJSON();
+    return ProseMirrorNode.fromJSON(schema, json);
+}
+export class CoreEditor extends EventTarget {
+    constructor(config = {}) {
+        super();
+        Object.defineProperty(this, "config", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {
+                element: undefined,
+                extensions: [],
+            }
+        });
+        Object.defineProperty(this, "extensionManager", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "commandManager", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "view", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "state", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "ui", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: defaultUi(this)
+        });
+        this.config = {
+            ...this.config,
+            ...config,
+        };
+        this.commandManager = new CommandManager(this);
+        this.extensionManager = new ExtensionManager(this.config.extensions || [], this, this.commandManager);
+        this.extensionManager.created();
+        // const content = this.options.content ? this.options.content : {
+        //   type: this.extensionManager.schema.topNodeType.name,
+        //   content: this.extensionManager.schema.topNodeType.spec.EMPTY_DOC,
+        // };
+        const content = this.config.content
+            ? this.config.content
+            : this.extensionManager.schema.topNodeType.spec.EMPTY_DOC;
+        this.createView(content);
+        this.setupPlugins();
+    }
+    getExtension(name) {
+        return this.extensionManager.getExtension(name);
+    }
+    get schema() {
+        return this.extensionManager.schema;
+    }
+    get run() {
+        return this.commandManager.run;
+    }
+    get commandFactories() {
+        return this.commandManager.commandFactories;
+    }
+    chain() {
+        return this.commandManager.createChain();
+    }
+    can() {
+        return this.commandManager.createCan();
+    }
+    createView(content) {
+        const doc = createNodeFromObject(content, this.schema);
+        this.state = EditorState.create({ doc });
+        if (this.config.element) {
+            const view = new EditorView(this.config.element, {
+                state: this.state,
+                attributes: {
+                    class: 'kb-editor',
+                },
+                dispatchTransaction: (tx) => this.dispatchTransaction(tx),
+            });
+            this.view = view;
+            const parent = this.config.element.parentNode;
+            if (parent) {
+                const observer = new MutationObserver((mutations) => {
+                    for (const mutation of mutations) {
+                        for (const removedNode of mutation.removedNodes) {
+                            if (removedNode.contains(view.dom)) {
+                                // Editor DOM was removed
+                                observer.disconnect(); // Prevent multiple calls
+                                view.destroy();
+                                return;
+                            }
+                        }
+                    }
+                });
+            }
+        }
+        else {
+            this.view = new DummyEditorView({
+                state: this.state,
+                dispatchTransaction: (tx) => this.dispatchTransaction(tx),
+            });
+        }
+        const event = new CustomEvent('doc:loaded', {
+            detail: {
+                editor: this,
+                doc,
+            },
+        });
+        this.dispatchEvent(event);
+    }
+    dispatchTransaction(transaction) {
+        this.state = this.state.apply(transaction);
+        if (this.view) {
+            this.view.updateState(this.state);
+            const event = new CustomEvent('transaction', {
+                detail: {
+                    editor: this,
+                    transaction,
+                },
+            });
+            this.dispatchEvent(event);
+        }
+        if (transaction.docChanged) {
+            const event = new CustomEvent('changed', {
+                detail: {
+                    editor: this,
+                },
+            });
+            this.dispatchEvent(event);
+        }
+    }
+    setupPlugins() {
+        this.state = this.state.reconfigure({
+            plugins: this.extensionManager.plugins,
+        });
+        if (this.view) {
+            this.view.updateState(this.state);
+            this.view.setProps({
+                nodeViews: this.extensionManager.nodeViews,
+            });
+        }
+    }
+    clearDocument() {
+        const content = {
+            type: this.extensionManager.schema.topNodeType.name,
+            content: this.extensionManager.schema.topNodeType.spec.EMPTY_DOC.content,
+        };
+        this.setDocument(content);
+    }
+    setDocument(content) {
+        let doc = createNodeFromObject(content, this.schema, {
+            errorOnInvalidContent: true,
+        });
+        doc = ensureDocSchema(doc, this.schema);
+        this.state = EditorState.create({
+            doc,
+            plugins: this.state.plugins,
+            storedMarks: this.state.storedMarks,
+        });
+        if (this.view) {
+            this.view.updateState(this.state);
+        }
+        const event = new CustomEvent('doc:loaded', {
+            detail: {
+                editor: this,
+                doc,
+            },
+        });
+        this.dispatchEvent(event);
+    }
+    getDocument() {
+        return this.state.doc;
+    }
+    async loadDocument(mediaType, content) {
+        const converter = this.extensionManager.converters[mediaType];
+        if (!converter) {
+            throw new Error('Converter not found for: ' + mediaType);
+        }
+        const doc = await converter.toDoc(content);
+        this.state = EditorState.create({
+            doc,
+            plugins: this.state.plugins,
+            storedMarks: this.state.storedMarks,
+        });
+        if (this.view) {
+            this.view.updateState(this.state);
+        }
+        const event = new CustomEvent('doc:loaded', {
+            detail: {
+                editor: this,
+                doc,
+            },
+        });
+        this.dispatchEvent(event);
+    }
+    async saveDocument(mediaType) {
+        const converter = this.extensionManager.converters[mediaType];
+        if (!converter) {
+            throw new Error('Converter not found for: ' + mediaType);
+        }
+        const json = this.state.doc.toJSON();
+        const clonedDoc = ProseMirrorNode.fromJSON(this.state.schema, json);
+        return await converter.fromDoc(clonedDoc);
+    }
+    getJSON() {
+        return this.state.doc.toJSON();
+    }
+    clone(options = {}) {
+        return new CoreEditor({
+            ...options,
+            extensions: [...(this.config.extensions || [])],
+        });
+    }
+    debug(doc) {
+        if (!doc) {
+            doc = this.state.doc;
+        }
+        console.debug(nodeToTreeString(doc));
+    }
+    destroy() {
+        const event = new CustomEvent('beforeDestroy', {
+            detail: {},
+        });
+        this.dispatchEvent(event);
+        this.view.destroy();
+    }
+}

package/esm/editor/src/DummyEditorView.d.ts

@@ -0,0 +1,60 @@
+import { EditorState, Plugin, Transaction } from 'prosemirror-state';
+import { Mark, Node } from 'prosemirror-model';
+import { EditorView, MarkView, NodeView } from 'prosemirror-view';
+import { Decoration, DecorationSource } from 'prosemirror-view';
+export declare class DummyEditorView {
+    private _props;
+    private directPlugins;
+    private nodeViews;
+    private prevDirectPlugins;
+    private pluginViews;
+    state: EditorState;
+    constructor(props: DirectEditorProps);
+    editable: boolean;
+    get composing(): boolean;
+    get dom(): {
+        addEventListener(): void;
+        removeEventListener(): void;
+    };
+    get props(): DirectEditorProps;
+    update(props: DirectEditorProps): void;
+    setProps(props: Partial<DirectEditorProps>): void;
+    updateState(state: EditorState): void;
+    private updateStateInner;
+    scrollToSelection(): void;
+    private destroyPluginViews;
+    private updatePluginViews;
+    someProp<PropName extends keyof EditorProps, Result>(propName: PropName, f: (value: NonNullable<EditorProps[PropName]>) => Result): Result | undefined;
+    someProp<PropName extends keyof EditorProps>(propName: PropName): NonNullable<EditorProps[PropName]> | undefined;
+    hasFocus(): boolean;
+    focus(): void;
+    destroy(): void;
+    get isDestroyed(): boolean;
+    dispatchEvent(event: Event): void;
+    dispatch: (tr: Transaction) => void;
+}
+export type NodeViewConstructor = (node: Node, view: EditorView, getPos: () => number | undefined, decorations: readonly Decoration[], innerDecorations: DecorationSource) => NodeView;
+export type MarkViewConstructor = (mark: Mark, view: EditorView, inline: boolean) => MarkView;
+export interface DOMEventMap extends HTMLElementEventMap {
+    [event: string]: any;
+}
+export interface EditorProps<P = any> {
+    nodeViews?: {
+        [node: string]: NodeViewConstructor;
+    };
+    markViews?: {
+        [mark: string]: MarkViewConstructor;
+    };
+    editable?: (this: P, state: EditorState) => boolean;
+    attributes?: {
+        [name: string]: string;
+    } | ((state: EditorState) => {
+        [name: string]: string;
+    });
+}
+export interface DirectEditorProps extends EditorProps {
+    state: EditorState;
+    plugins?: readonly Plugin[];
+    dispatchTransaction?: (tr: Transaction) => void;
+}
+//# sourceMappingURL=DummyEditorView.d.ts.map

package/esm/editor/src/DummyEditorView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DummyEditorView.d.ts","sourceRoot":"","sources":["../../../src/editor/src/DummyEditorView.ts"],"names":[],"mappings":"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"}