How to use @remirror/core-constants - 10 common examples

protected getExtraAttrs(domNode: Node) {
    if (this.type === ExtensionType.Plain) {
      throw new Error('Invalid use of extraAttrs within a plain extension.');
    }

    const extraAttrs = (this.options.extraAttrs as ExtraAttrs[] | undefined) ?? [];
    const attrs: Attrs = Object.create(null);

    for (const item of extraAttrs) {
      if (Array.isArray(item)) {
        // Use the default
        const [name, , attributeName] = item;
        attrs[name] = attributeName ? (domNode as Element).getAttribute(attributeName) : undefined;
      } else if (isString(item)) {
        // Assume the name is the same
        attrs[item] = (domNode as Element).getAttribute(item);
      } else {
        const { name, getAttrs, default: fallback } = item;

get schema(): NodeExtensionSpec {
    return {
      content: 'inline*',
      group: NodeGroup.Block,
      attrs: this.extraAttrs(),
      draggable: false,
      parseDOM: [
        {
          tag: 'p',
          getAttrs: node => this.getExtraAttrs(node as Element),
        },
      ],
      toDOM: () => ['p', 0],
    };
  }
}

export const helpers = {
  getState: Cast(jest.fn(() => state)),
  portalContainer: new PortalContainer(),
  getTheme: () => defaultRemirrorThemeValue,
};

const innerMock = jest.fn();
const mock = jest.fn((_: Attrs) => innerMock);
const getInformation = jest.fn(() => 'information');

const SSRComponent: FC = () =&gt; <div>;

class DummyExtension extends Extension {
  public name = 'dummy';
  public tags = ['simple', Tags.LastNodeCompatible];
  public commands() {
    return { dummy: mock };
  }

  public helpers() {
    return {
      getInformation,
    };
  }

  public attributes() {
    return {
      class: 'custom',
    };
  }
}</div>

[Tags.FormattingNode]: [],
    [Tags.LastNodeCompatible]: [],
    [Tags.NodeCursor]: [],
  };

  const mark: MarkExtensionTags = {
    [MarkGroup.Alignment]: [],
    [MarkGroup.Behavior]: [],
    [MarkGroup.Color]: [],
    [MarkGroup.FontStyle]: [],
    [MarkGroup.Indentation]: [],
    [MarkGroup.Link]: [],
    [MarkGroup.Code]: [],
  };

  const node: NodeExtensionTags = { [NodeGroup.Block]: [], [NodeGroup.Inline]: [] };

  for (const extension of extensions) {
    if (isNodeExtension(extension)) {
      const group = extension.schema.group as NodeGroup;
      node[group] = isUndefined(node[group])
        ? [extension.name as GNodes]
        : [...node[group], extension.name as GNodes];
    } else if (isMarkExtension(extension)) {
      const group = extension.schema.group as MarkGroup;
      mark[group] = isUndefined(mark[group])
        ? [extension.name as GMarks]
        : [...mark[group], extension.name as GMarks];
    }

    (extension.tags as Tags[]).forEach(tag => {
      general[tag] = isUndefined(general[tag])

group: 'inline',
  atom: true,
  selectable: true,
  parseDOM: [
    {
      tag: 'span[data-node-type="atomInline"]',
    },
  ],
  toDOM: () => {
    return ['span', { 'data-node-type': 'atomInline' }];
  },
};

const atomBlock: NodeSpec = {
  inline: false,
  group: NodeGroup.Block,
  atom: true,
  selectable: true,
  parseDOM: [
    {
      tag: 'div[data-node-type="atomBlock"]',
    },
  ],
  toDOM: () => {
    return ['div', { 'data-node-type': 'atomBlock' }];
  },
};

const atomContainer: NodeSpec = {
  inline: false,
  group: NodeGroup.Block,
  content: 'atomBlock+',

group: NodeGroup.Block,
  atom: true,
  selectable: true,
  parseDOM: [
    {
      tag: 'div[data-node-type="atomBlock"]',
    },
  ],
  toDOM: () => {
    return ['div', { 'data-node-type': 'atomBlock' }];
  },
};

const atomContainer: NodeSpec = {
  inline: false,
  group: NodeGroup.Block,
  content: 'atomBlock+',
  parseDOM: [
    {
      tag: 'div[data-node-type="atomBlockContainer"]',
    },
  ],
  toDOM: () => {
    return ['div', { 'data-node-type': 'atomBlockContainer' }];
  },
};

const containerWithRestrictedContent: NodeSpec = {
  inline: false,
  group: NodeGroup.Block,
  content: 'paragraph+',
  parseDOM: [

export const isMarkExtension = (extension: unknown): extension is MarkExtension =>
  isExtension(extension) && extension.type === ExtensionType.Mark;

get type(): ExtensionType.Mark {
    return ExtensionType.Mark;
  }

get type(): ExtensionType.Node {
    return ExtensionType.Node;
  }

export const isNodeExtension = (extension: unknown): extension is NodeExtension =>
  isExtension(extension) && extension.type === ExtensionType.Node;