How to use the @remirror/core.NodeGroup.Block function in @remirror/core

To help you get started, we’ve selected a few @remirror/core examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github ifiokjr / remirror / @remirror / core-extensions / src / nodes / heading-extension.ts View on Github external
get schema(): NodeExtensionSpec {
    return {
      attrs: {
        ...this.extraAttrs(null),
        level: {
          default: this.options.defaultLevel,
        },
      },
      content: 'inline*',
      group: NodeGroup.Block,
      defining: true,
      draggable: false,
      parseDOM: this.options.levels.map(level => ({
        tag: `h${level}`,
        attrs: { level },
      })),
      toDOM: (node: ProsemirrorNode) => {
        if (!this.options.levels.includes(node.attrs.level)) {
          // Use the first level available
          return [`h${this.options.defaultLevel}`, 0];
        }

        return [`h${node.attrs.level as string}`, 0];
      },
    };
  }
github ifiokjr / remirror / @remirror / react-renderer / src / __tests__ / react-serializer.spec.tsx View on Github external
NodeGroup,
  TextExtension,
} from '@remirror/core';
import { BoldExtension, CodeBlockExtension, ParagraphExtension } from '@remirror/core-extensions';
import { createTestManager, simpleJSON, testJSON } from '@remirror/test-fixtures';
import { shallow } from 'enzyme';
import { Node as PMNode } from 'prosemirror-model';
import React from 'react';

import { ReactSerializer } from '../react-serializer';

class FooExtension extends NodeExtension {
  public name = 'foo';
  public schema: NodeExtensionSpec = {
    content: 'block*',
    group: NodeGroup.Block,

    toDOM: () => {
      const attrs = {
        'data-foo-type': 'true',
      };
      return ['div', attrs, ['div', { class: 'inside' }, 0]];
    },
  };
}

const manager = createTestManager([
  { extension: new CodeBlockExtension(), priority: 2 },
  { extension: new FooExtension(), priority: 3 },
]);
const { schema } = manager;
const serializer = ReactSerializer.fromExtensionManager(manager);
github ifiokjr / remirror / @remirror / core-extensions / src / nodes / blockquote-extension.ts View on Github external
get schema(): NodeExtensionSpec {
    return {
      attrs: this.extraAttrs(),
      content: 'block*',
      group: NodeGroup.Block,
      defining: true,
      draggable: false,
      parseDOM: [{ tag: 'blockquote' }],
      toDOM: () => ['blockquote', 0],
    };
  }
github ifiokjr / remirror / @remirror / core-extensions / src / nodes / horizontal-rule-extension.ts View on Github external
get schema(): NodeExtensionSpec {
    return {
      attrs: this.extraAttrs(),
      group: NodeGroup.Block,
      parseDOM: [{ tag: 'hr' }],
      toDOM: () => ['hr'],
    };
  }
github ifiokjr / remirror / @remirror / core-extensions / src / nodes / simple-code-block-extension.ts View on Github external
get schema(): NodeExtensionSpec {
    return {
      attrs: this.extraAttrs(),
      content: 'text*',
      marks: '',
      group: NodeGroup.Block,
      code: true,
      defining: true,
      draggable: false,
      parseDOM: [{ tag: 'pre', preserveWhitespace: 'full' }],
      toDOM: () => ['pre', ['code', 0]],
    };
  }
github ifiokjr / remirror / @remirror / core-extensions / src / nodes / paragraph / paragraph-extension.ts View on Github external
get schema(): NodeExtensionSpec {
    return {
      content: 'inline*',
      group: NodeGroup.Block,
      attrs: {
        ...this.extraAttrs(),
        align: { default: null },
        id: { default: null },
        indent: { default: 0 },
        lineSpacing: { default: null },
      },
      draggable: false,
      parseDOM: [
        {
          tag: 'p',
          getAttrs: node => ({
            ...this.getExtraAttrs(node as HTMLElement),
            ...getAttrs(this.options, node as HTMLElement),
          }),
        },
github ifiokjr / remirror / @remirror / extension-code-block / src / code-block-extension.ts View on Github external
get schema(): NodeExtensionSpec {
    const dataAttribute = 'data-code-block-language';
    return {
      attrs: {
        ...this.extraAttrs(),
        language: { default: this.options.defaultLanguage },
      },
      content: 'text*',
      marks: '',
      group: NodeGroup.Block,
      code: true,
      defining: true,
      isolating: true,
      draggable: false,
      parseDOM: [
        {
          tag: 'pre',
          preserveWhitespace: 'full',
          getAttrs: node => {
            if (!isElementDOMNode(node)) {
              return false;
            }

            const codeElement = node.querySelector('code');

            if (!isElementDOMNode(codeElement)) {
github ifiokjr / remirror / @remirror / core-extensions / src / nodes / bullet-list-extension.ts View on Github external
get schema(): NodeExtensionSpec {
    return {
      attrs: this.extraAttrs(),
      content: 'listItem+',
      group: NodeGroup.Block,
      parseDOM: [{ tag: 'ul' }],
      toDOM: () => ['ul', 0],
    };
  }
github ifiokjr / remirror / @remirror / core-extensions / src / nodes / ordered-list-extension.ts View on Github external
get schema(): NodeExtensionSpec {
    return {
      attrs: {
        order: {
          default: 1,
        },
        ...this.extraAttrs(),
      },
      content: 'listItem+',
      group: NodeGroup.Block,
      parseDOM: [
        {
          tag: 'ol',
          getAttrs: node => {
            if (!isElementDOMNode(node)) {
              return {};
            }

            return {
              order: +(node.getAttribute('start') ?? 1),
            };
          },
        },
      ],
      toDOM: node => (node.attrs.order === 1 ? ['ol', 0] : ['ol', { start: node.attrs.order }, 0]),
    };