@kerebron/extension-basic-editor 0.4.28 → 0.4.30

package/src/MarkChange.ts

@@ -0,0 +1,17 @@
+import { MarkSpec } from 'prosemirror-model';
+
+import { Mark } from '@kerebron/editor';
+
+export class MarkChange extends Mark {
+  override name = 'change';
+  requires = ['doc'];
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      parseDOM: [],
+      toDOM() {
+        return ['change', 0];
+      },
+    };
+  }
+}

package/src/MarkCode.ts

@@ -0,0 +1,35 @@
+import type { MarkSpec, MarkType } from 'prosemirror-model';
+import { type CoreEditor, Mark } from '@kerebron/editor';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+
+export class MarkCode extends Mark {
+  override name = 'code';
+  requires = ['doc'];
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      parseDOM: [{ tag: 'code' }],
+      toDOM() {
+        return ['code', 0];
+      },
+    };
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: MarkType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleCode': () => editor.commandFactories.toggleMark(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {
+      'Mod-`': 'toggleCode',
+    };
+  }
+}

package/src/MarkHighlight.ts

@@ -0,0 +1,38 @@
+import { type MarkSpec } from 'prosemirror-model';
+import { Mark } from '@kerebron/editor';
+
+/** Mark for text highlight (background color) */
+export class MarkHighlight extends Mark {
+  override name = 'highlight';
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      attrs: {
+        color: { default: null },
+      },
+      parseDOM: [
+        {
+          tag: 'mark',
+          getAttrs(dom: HTMLElement) {
+            const color = dom.style.backgroundColor;
+            return color ? { color } : { color: 'yellow' };
+          },
+        },
+        {
+          tag: 'span[style*="background-color"]',
+          getAttrs(dom: HTMLElement) {
+            const color = dom.style.backgroundColor;
+            return color ? { color } : false;
+          },
+        },
+      ],
+      toDOM(mark) {
+        const { color } = mark.attrs;
+        const bgColor = color || 'yellow';
+        return ['mark', {
+          style: `background-color: ${bgColor}; color: inherit;`,
+        }, 0];
+      },
+    };
+  }
+}

package/src/MarkItalic.ts

@@ -0,0 +1,41 @@
+import { type CoreEditor, Mark } from '@kerebron/editor';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+import type { MarkSpec, MarkType } from 'prosemirror-model';
+
+export class MarkItalic extends Mark {
+  override name = 'em';
+  requires = ['doc'];
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      parseDOM: [
+        { tag: 'i' },
+        { tag: 'em' },
+        { style: 'font-assets=italic' },
+        { style: 'font-assets=normal', clearMark: (m) => m.type.name == 'em' },
+      ],
+      toDOM() {
+        return ['em', 0];
+      },
+    };
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: MarkType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleItalic': () => editor.commandFactories.toggleMark(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {
+      'Mod-i': 'toggleItalic',
+      'Mod-I': 'toggleItalic',
+    };
+  }
+}

package/src/MarkLink.ts

@@ -0,0 +1,32 @@
+import { Mark as PmMark, MarkSpec } from 'prosemirror-model';
+import { Mark } from '@kerebron/editor';
+
+export class MarkLink extends Mark {
+  override name = 'link';
+  requires = ['doc'];
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      attrs: {
+        href: {},
+        title: { default: null },
+      },
+      inclusive: false,
+      parseDOM: [
+        {
+          tag: 'a[href]',
+          getAttrs(dom: HTMLElement) {
+            return {
+              href: dom.getAttribute('href'),
+              title: dom.getAttribute('title'),
+            };
+          },
+        },
+      ],
+      toDOM(node) {
+        const { href, title } = node.attrs;
+        return ['a', { href, title }, 0];
+      },
+    };
+  }
+}

package/src/MarkStrike.ts

@@ -0,0 +1,38 @@
+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 MarkStrike extends Mark {
+  override name = 'strike';
+  requires = ['doc'];
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      parseDOM: [
+        { tag: 'strike' },
+      ],
+      toDOM() {
+        return ['strike', 0];
+      },
+    };
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: MarkType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleStrike': () => editor.commandFactories.toggleMark(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {
+      'Mod-s': 'toggleStrike',
+      'Mod-S': 'toggleStrike',
+    };
+  }
+}

package/src/MarkStrong.ts

@@ -0,0 +1,52 @@
+import { type CoreEditor, Mark } from '@kerebron/editor';
+import {
+  type CommandFactories,
+  type CommandShortcuts,
+} from '@kerebron/editor/commands';
+import { MarkSpec, type MarkType } from 'prosemirror-model';
+
+export class MarkStrong extends Mark {
+  override name = 'strong';
+  requires = ['doc'];
+
+  override getMarkSpec(): MarkSpec {
+    return {
+      parseDOM: [
+        { tag: 'strong' },
+        // This works around a Google Docs misbehavior where
+        // pasted content will be inexplicably wrapped in `<b>`
+        // tags with a font-weight normal.
+        {
+          tag: 'b',
+          getAttrs: (node: HTMLElement) =>
+            node.style.fontWeight != 'normal' && null,
+        },
+        { style: 'font-weight=400', clearMark: (m) => m.type.name == 'strong' },
+        {
+          style: 'font-weight',
+          getAttrs: (value: string) =>
+            /^(bold(er)?|[5-9]\d{2,})$/.test(value) && null,
+        },
+      ],
+      toDOM() {
+        return ['strong', 0];
+      },
+    };
+  }
+
+  override getCommandFactories(
+    editor: CoreEditor,
+    type: MarkType,
+  ): Partial<CommandFactories> {
+    return {
+      'toggleStrong': () => editor.commandFactories.toggleMark(type),
+    };
+  }
+
+  override getKeyboardShortcuts(): Partial<CommandShortcuts> {
+    return {
+      'Mod-b': 'toggleStrong',
+      'Mod-B': 'toggleStrong',
+    };
+  }
+}

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 {};
+  }
+}