@kerebron/extension-basic-editor 0.4.27 → 0.4.29

package/src/MarkSubscript.ts

@@ -0,0 +1,42 @@
+import { type CoreEditor, Mark } from '@kerebron/editor';
+import type { MarkSpec, MarkType } from 'prosemirror-model';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+
+export class MarkSubscript extends Mark {
+  override name = 'subscript';
+  requires = ['doc'];
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      excludes: 'superscript',
+      parseDOM: [
+        { tag: 'sub' },
+        {
+          style: 'vertical-align',
+          getAttrs: (value) => value === 'sub' && null,
+        },
+      ],
+      toDOM() {
+        return ['sub', 0];
+      },
+    };
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: MarkType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleSubscript': () => editor.commandFactories.toggleMark(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {
+      'Mod-Shift-,': 'toggleSubscript',
+    };
+  }
+}

package/src/MarkSuperscript.ts

@@ -0,0 +1,42 @@
+import { type CoreEditor, Mark } from '@kerebron/editor';
+import type { MarkSpec, MarkType } from 'prosemirror-model';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+
+export class MarkSuperscript extends Mark {
+  override name = 'superscript';
+  requires = ['doc'];
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      excludes: 'subscript',
+      parseDOM: [
+        { tag: 'sup' },
+        {
+          style: 'vertical-align',
+          getAttrs: (value) => value === 'super' && null,
+        },
+      ],
+      toDOM() {
+        return ['sup', 0];
+      },
+    };
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: MarkType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleSuperscript': () => editor.commandFactories.toggleMark(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {
+      'Mod-Shift-.': 'toggleSuperscript',
+    };
+  }
+}

package/src/MarkTextColor.ts

@@ -0,0 +1,29 @@
+import { type MarkSpec } from 'prosemirror-model';
+import { Mark } from '@kerebron/editor';
+
+/** Mark for text color (foreground color) */
+export class MarkTextColor extends Mark {
+  override name = 'textColor';
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      attrs: {
+        color: { default: null },
+      },
+      parseDOM: [
+        {
+          tag: 'span[style*="color"]',
+          getAttrs(dom: HTMLElement) {
+            const color = dom.style.color;
+            return color ? { color } : false;
+          },
+        },
+      ],
+      toDOM(mark) {
+        const { color } = mark.attrs;
+        if (!color) return ['span', 0];
+        return ['span', { style: `color: ${color}` }, 0];
+      },
+    };
+  }
+}

package/src/MarkUnderline.ts

@@ -0,0 +1,47 @@
+import { CoreEditor, Mark } from '@kerebron/editor';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+import type { MarkSpec, MarkType } from 'prosemirror-model';
+
+export class MarkUnderline extends Mark {
+  override name = 'underline';
+  requires = ['doc'];
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      parseDOM: [
+        {
+          tag: 'u',
+        },
+        {
+          style: 'text-decoration',
+          consuming: false,
+          getAttrs: (
+            style,
+          ) => ((style as string).includes('underline') ? {} : false),
+        },
+      ],
+      toDOM() {
+        return ['u', 0];
+      },
+    };
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: MarkType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleUnderline': () => editor.commandFactories.toggleMark(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {
+      'Mod-u': 'toggleUnderline',
+      'Mod-U': 'toggleUnderline',
+    };
+  }
+}

package/src/NodeAside.ts

@@ -0,0 +1,19 @@
+import { NodeSpec } from 'prosemirror-model';
+import { Node } from '@kerebron/editor';
+
+export class NodeAside extends Node {
+  override name = 'aside';
+  requires = ['doc'];
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      content: 'block+',
+      group: 'block',
+      defining: true,
+      parseDOM: [{ tag: 'aside' }],
+      toDOM() {
+        return ['aside', 0];
+      },
+    };
+  }
+}

package/src/NodeBlockquote.ts

@@ -0,0 +1,51 @@
+import { NodeSpec, NodeType } from 'prosemirror-model';
+
+import { type CoreEditor, Node } from '@kerebron/editor';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+import {
+  InputRule,
+  wrappingInputRule,
+} from '@kerebron/editor/plugins/input-rules';
+
+export class NodeBlockquote extends Node {
+  override name = 'blockquote';
+  requires = ['doc'];
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      content: 'block+',
+      group: 'block',
+      defining: true,
+      parseDOM: [{ tag: 'blockquote' }],
+      toDOM() {
+        return ['blockquote', 0];
+      },
+    };
+  }
+
+  override getInputRules(type: NodeType): InputRule[] {
+    return [
+      /// Given a blockquote node type, returns an input rule that turns `"> "`
+      /// at the start of a textblock into a blockquote.
+      wrappingInputRule(/^\s*>\s$/, type),
+    ];
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: NodeType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleBlockquote': () => editor.commandFactories.wrapInList(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {
+      'Ctrl->': 'toggleBlockquote',
+    };
+  }
+}

package/src/NodeBookmark.ts

@@ -0,0 +1,23 @@
+import { NodeSpec } from 'prosemirror-model';
+
+import { Node } from '@kerebron/editor';
+
+export class NodeBookmark extends Node {
+  override name = 'bookmark-node';
+  requires = ['doc'];
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      inline: true,
+      group: 'inline',
+      selectable: false,
+      attrs: {
+        id: {},
+      },
+      parseDOM: [],
+      toDOM(mark) {
+        return ['a', { id: mark.attrs.id }, 0];
+      },
+    };
+  }
+}

package/src/NodeBulletList.ts

@@ -0,0 +1,51 @@
+import type { NodeSpec, NodeType } from 'prosemirror-model';
+
+import { type CoreEditor, Node } from '@kerebron/editor';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+import {
+  type InputRule,
+  wrappingInputRule,
+} from '@kerebron/editor/plugins/input-rules';
+
+export class NodeBulletList extends Node {
+  override name = 'bullet_list';
+  requires = ['doc'];
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      content: 'list_item+',
+      group: 'block',
+      parseDOM: [{ tag: 'ul' }],
+      toDOM() {
+        return ['ul', 0];
+      },
+    };
+  }
+
+  override getInputRules(type: NodeType): InputRule[] {
+    /// Given a list node type, returns an input rule that turns a bullet
+    /// (dash, plush, or asterisk) at the start of a textblock into a
+    /// bullet list.
+    return [
+      wrappingInputRule(/^\s*([-+*])\s$/, type),
+    ];
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: NodeType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleBulletList': () => editor.commandFactories.wrapInList(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {
+      'Shift-Ctrl-8': 'toggleBulletList',
+    };
+  }
+}

package/src/NodeCodeBlock.ts

@@ -0,0 +1,60 @@
+import type { NodeSpec, NodeType } from 'prosemirror-model';
+import { Node } from '@kerebron/editor';
+import {
+  type InputRule,
+  textblockTypeInputRule,
+} from '@kerebron/editor/plugins/input-rules';
+
+export class NodeCodeBlock extends Node {
+  override name = 'code_block';
+
+  override getNodeSpec(): NodeSpec {
+    // const langs = this.config.languageWhitelist || LANGS;
+
+    return {
+      content: 'text*',
+      marks: '',
+      group: 'block',
+      code: true,
+      defining: true,
+      parseDOM: [
+        {
+          tag: 'pre',
+          preserveWhitespace: 'full',
+          getAttrs(dom: HTMLElement) {
+            let lang = dom.getAttribute('lang');
+
+            // if (!lang) {
+            //   for (const className of dom.classList) {
+            //     if (
+            //       className.startsWith('lang-') &&
+            //       langs.indexOf(className.substring('lang-'.length)) > -1
+            //     ) {
+            //       lang = className.substring('lang-'.length);
+            //       break;
+            //     }
+            //   }
+            // }
+
+            return {
+              lang,
+            };
+          },
+        },
+      ],
+      attrs: { lang: { default: null } },
+      toDOM(node) {
+        const { lang } = node.attrs;
+        return ['pre', { lang }, ['code', 0]];
+      },
+    };
+  }
+
+  override getInputRules(type: NodeType): InputRule[] {
+    /// Given a code block node type, returns an input rule that turns a
+    /// textblock starting with three backticks into a code block.
+    return [
+      textblockTypeInputRule(/^```$/, type),
+    ];
+  }
+}

package/src/NodeDefinitionDesc.ts

@@ -0,0 +1,19 @@
+import { NodeSpec } from 'prosemirror-model';
+import { Node } from '@kerebron/editor';
+
+export class NodeDefinitionDesc extends Node {
+  override name = 'dd';
+  requires = ['dl'];
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      content: 'inline*',
+      group: 'block',
+      parseDOM: [{ tag: 'dd' }],
+      defining: true,
+      toDOM() {
+        return ['dd', 0];
+      },
+    };
+  }
+}

package/src/NodeDefinitionList.ts

@@ -0,0 +1,46 @@
+import type { NodeSpec, NodeType } from 'prosemirror-model';
+
+import { type CoreEditor, Node } from '@kerebron/editor';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+import {
+  type InputRule,
+  wrappingInputRule,
+} from '@kerebron/editor/plugins/input-rules';
+
+export class NodeDefinitionList extends Node {
+  override name = 'dl';
+  requires = ['doc'];
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      content: 'dt+|dd+',
+      group: 'block',
+      parseDOM: [{ tag: 'dl' }],
+      toDOM() {
+        return ['dl', 0];
+      },
+    };
+  }
+
+  override getInputRules(type: NodeType): InputRule[] {
+    return [
+      // wrappingInputRule(/^\s*([-+*])\s$/, type),
+    ];
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: NodeType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleDefinitionList': () => editor.commandFactories.wrapInList(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {};
+  }
+}

package/src/NodeDefinitionTerm.ts

@@ -0,0 +1,19 @@
+import { NodeSpec } from 'prosemirror-model';
+import { Node } from '@kerebron/editor';
+
+export class NodeDefinitionTerm extends Node {
+  override name = 'dt';
+  requires = ['dl'];
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      content: 'inline*',
+      group: 'block',
+      parseDOM: [{ tag: 'dt' }],
+      defining: true,
+      toDOM() {
+        return ['dt', 0];
+      },
+    };
+  }
+}

package/src/NodeDocument.ts

@@ -0,0 +1,22 @@
+import { NodeSpec, SchemaSpec } from 'prosemirror-model';
+import { Node } from '@kerebron/editor';
+
+export class NodeDocument extends Node {
+  override name = 'doc';
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      content: 'block+',
+      marks: 'code em strong link bookmark', // TODO: why is it necessary for convertCodeParagraphsToCodeBlocks?
+      EMPTY_DOC: {
+        'type': this.name,
+        'content': [
+          {
+            'type': 'paragraph',
+            'content': [],
+          },
+        ],
+      },
+    };
+  }
+}

package/src/NodeDocumentCode.ts

@@ -0,0 +1,33 @@
+import { NodeSpec } from 'prosemirror-model';
+
+import { Node } from '@kerebron/editor';
+
+export class NodeDocumentCode extends Node {
+  override name = 'doc_code';
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      content: 'code_block',
+      defaultAttrs: {
+        'lang': this.config.lang || null,
+      },
+      EMPTY_DOC: {
+        'type': this.name,
+        'content': [
+          {
+            'type': 'code_block',
+            'attrs': {
+              'lang': this.config.lang || null,
+            },
+            'content': [
+              // {
+              //   "type": "text",
+              // "text": ""
+              // }
+            ],
+          },
+        ],
+      },
+    };
+  }
+}

package/src/NodeFrontmatter.ts

@@ -0,0 +1,19 @@
+import { NodeSpec, NodeType } from 'prosemirror-model';
+import { Node } from '@kerebron/editor';
+
+export class NodeFrontmatter extends Node {
+  override name = 'frontmatter';
+  requires = ['doc'];
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      content: 'inline*',
+      group: 'block',
+      defining: true,
+      parseDOM: [{ tag: 'pre' }],
+      toDOM() {
+        return ['pre', 0];
+      },
+    };
+  }
+}

package/src/NodeHardBreak.ts

@@ -0,0 +1,92 @@
+import type { NodeSpec, NodeType } from 'prosemirror-model';
+import { type CoreEditor, Node } from '@kerebron/editor';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+import { firstCommand } from '@kerebron/editor/commands';
+
+export class NodeHardBreak extends Node {
+  override name = 'br';
+  requires = ['doc'];
+
+  options = {
+    keepMarks: true,
+  };
+
+  override getNodeSpec(): NodeSpec {
+    return {
+      inline: true,
+      group: 'inline',
+      selectable: false,
+      linebreakReplacement: true,
+      parseDOM: [{ tag: 'br' }],
+      toDOM() {
+        return ['br'];
+      },
+    };
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: NodeType,
+  ): Partial<CommandFactories> {
+    // TODO: refactor commands
+    // const comm2: Command = (state: EditorState, dispatch?: (tr: Transaction) => void) => {
+    //   const { selection, storedMarks } = state
+
+    //   if (selection.$from.parent.type.spec.isolating) {
+    //       return false
+    //   }
+
+    //   const { keepMarks } = this.options
+    //   // const { splittableMarks } = editor.extensionManager
+    //   const splittableMarks = [];
+    //   const marks = storedMarks
+    //       || (selection.$to.parentOffset && selection.$from.marks())
+
+    //   return editor.chain()
+    //     .insertContent({ type: this.name })
+    //     .command(({ tr, dispatch }) => {
+    //         if (dispatch && marks && keepMarks) {
+    //           for (const mark of marks) {
+    //             console.log('mteset', mark.type);
+    //           }
+    //             const filteredMarks = marks
+    //                 .filter(mark => splittableMarks.includes(mark.type.name))
+
+    //             tr.ensureMarks(filteredMarks)
+    //         }
+
+    //         return true
+    //     })
+    //     .run();
+    // }
+
+    const setHardBreak = firstCommand(
+      editor.run.exitCode,
+      // comm2
+    );
+
+    return {
+      'setHardBreak': () => setHardBreak,
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    // https://stackoverflow.com/a/73619128
+    const mac = typeof navigator != 'undefined'
+      ? /Mac|iP(hone|[oa]d)/.test(navigator?.platform)
+      : false;
+
+    const shortcuts: Partial<CommandShortcuts> = {
+      'Ctrl-Enter': 'setHardBreak',
+    };
+    if (mac) {
+      shortcuts['Mod-Enter'] = 'setHardBreak';
+      shortcuts['Shift-Enter'] = 'setHardBreak';
+    }
+
+    return shortcuts;
+  }
+}