How to use @remirror/core - 10 common examples

test('ReactSerializer.fromExtensionManager', () => {
  expect(serializer).toBeInstanceOf(ReactSerializer);
  expect(serializer.nodes.paragraph).toBeFunction();
  expect(serializer.marks.bold).toBeFunction();

  // fills in for a missing text
  const altExtensions = [
    { extension: new DocExtension(), priority: 2 },
    { extension: new ParagraphExtension(), priority: 2 },
    { extension: new TextExtension(), priority: 2 },
    { extension: new BoldExtension(), priority: 2 },
    { extension: new CodeBlockExtension(), priority: 2 },
  ];
  const altManager = ExtensionManager.create(altExtensions);
  expect(ReactSerializer.fromExtensionManager(altManager).nodes.text).toBeFunction();
});

test('ReactSerializer.fromExtensionManager', () => {
  expect(serializer).toBeInstanceOf(ReactSerializer);
  expect(serializer.nodes.paragraph).toBeFunction();
  expect(serializer.marks.bold).toBeFunction();

  // fills in for a missing text
  const altExtensions = [
    { extension: new DocExtension(), priority: 2 },
    { extension: new ParagraphExtension(), priority: 2 },
    { extension: new TextExtension(), priority: 2 },
    { extension: new BoldExtension(), priority: 2 },
    { extension: new CodeBlockExtension(), priority: 2 },
  ];
  const altManager = ExtensionManager.create(altExtensions);
  expect(ReactSerializer.fromExtensionManager(altManager).nodes.text).toBeFunction();
});

test('ReactSerializer.fromExtensionManager', () => {
  expect(serializer).toBeInstanceOf(ReactSerializer);
  expect(serializer.nodes.paragraph).toBeFunction();
  expect(serializer.marks.bold).toBeFunction();

  // fills in for a missing text
  const altExtensions = [
    { extension: new DocExtension(), priority: 2 },
    { extension: new ParagraphExtension(), priority: 2 },
    { extension: new TextExtension(), priority: 2 },
    { extension: new BoldExtension(), priority: 2 },
    { extension: new CodeBlockExtension(), priority: 2 },
  ];
  const altManager = ExtensionManager.create(altExtensions);
  expect(ReactSerializer.fromExtensionManager(altManager).nodes.text).toBeFunction();
});

export const findPosition = ({ text, regexp, $pos, char, name }: FindMentionPositionParams) => {
  let position: SuggestionStateField | undefined;

  findMatches(text, regexp).forEach(match => {
    // Check the character before the current match to check if it is supported
    const matchPrefix = match.input.slice(Math.max(0, match.index - 1), match.index);

    // ? Can this be switched for NOT `supportedCharacters` - TEST once refactored
    if (/^[\s\0]?$/.test(matchPrefix)) {
      // The absolute position of the match wrapper node
      const from = match.index + $pos.start();
      const to = from + match[0].length;

      // If the $position is located within the matched substring, return that range
      if (from < $pos.pos && to >= $pos.pos) {
        position = {
          name,
          char,
          range: {
            from,

): SuggestionsPluginState | undefined => {
  // Matching expressions used for later
  const escapedChar = `\\${char}`;
  const supported =
    typeof supportedCharacters === 'string' ? supportedCharacters : supportedCharacters.source;
  // const suffix = new RegExp(`\\s${escapedChar}$`);
  const prefix = startOfLine ? '^' : '';
  const regexp = new RegExp(`${prefix}${escapedChar}${supported}`, 'gm');

  // Lookup the boundaries of the current node
  const textFrom = $pos.before();
  const textTo = $pos.end();
  const text = $pos.doc.textBetween(textFrom, textTo, '\0', '\0');

  let position: SuggestionsPluginState | undefined;
  findMatches(text, regexp).forEach(match => {
    // JavaScript doesn't have lookbehinds; this hacks a check that first character is " "
    // or the line beginning
    const matchPrefix = match.input.slice(Math.max(0, match.index - 1), match.index);

    if (/^[\s\0]?$/.test(matchPrefix)) {
      // The absolute position of the match in the document
      const from = match.index + $pos.start();
      const to = from + match[0].length;

      // Edge case handling; if spaces are allowed and we're directly in between
      // two triggers
      // if (allowSpaces && suffix.test(text.slice(to - 1, to + 1))) {
      //   match[0] += ' ';
      //   to += 1;
      // }

leafChar,
          );
          findMatches(prevSearchText, extractUrl).forEach(match => {
            const startIndex = match.index;
            const url = match[1];
            const start = $pos.start() + startIndex;
            const end = $pos.start() + startIndex + match[0].length;

            collectedParams.push({ state, url, from: start, to: end, type });
          });

          tr.removeMark($pos.start(), $pos.end(), type);
        }

        // Finds matches within the current node when in the middle of a node
        findMatches(searchText, extractUrl).forEach(match => {
          const startIndex = match.index;
          const url = match[1];
          const start = $from.start() + startIndex;
          const end = $from.start() + startIndex + match[0].length;
          // The text directly before the match
          const textBefore = doc.textBetween(start - 1, start, LEAF_NODE_REPLACING_CHARACTER, leafChar);

          if (!/[\w\d]/.test(textBefore)) {
            collectedParams.push({ state, url, from: start, to: end, type });
          }
        });

        // Remove all marks within the current block
        tr.removeMark($from.start(), $from.end(), type);

        // Add all marks again for the nodes

const onCompositionStart = ({ state, dispatch, extension }: CompositionParams) => {
  const { empty } = getPluginState(extension.pluginKey, state);

  if (empty) {
    // remove placeholder, since document definitely contains text
    dispatch(setPluginMeta(extension.pluginKey, state.tr, { removePlaceholder: true }));
  }

  return false;
};

update(view, prevState: EditorState) {
          const prev = getPluginState(plugin, prevState);
          const next = getPluginState(plugin, view.state);

          // See how the state changed
          const moved =
            prev.active && next.active && prev.range && next.range && prev.range.from !== next.range.from;
          const started = !prev.active && next.active;
          const stopped = prev.active && !next.active;
          const changed = !started && !stopped && prev.query !== next.query;
          const handleStart = started || moved;
          const handleChange = changed && !moved;
          const handleExit = stopped || moved;

          // Cancel when suggestion isn't active
          if (!handleStart && !handleChange && !handleExit) {
            return;
          }

}) => {
  if (json.type === 'text' && json.text && (!json.marks || !json.marks.length)) {
    return {json.text}; // For some reason FunctionalComponent don't allow returning react-nodes
  }

  const rest = { markMap, typeMap, skipUnknownMarks, skipUnknownTypes };

  const TypeHandler = typeMap[json.type];
  if (!TypeHandler) {
    if (!skipUnknownTypes) {
      throw new Error(`No handler for node type \`${json.type}\` registered`);
    }
    return null;
  }

  const props = isString(TypeHandler) ? json.attrs ?? Object.create(null) : { ...rest, node: json };
  const { content } = json;
  if (!content || !content.length) {
    return ;
  }

  const children = content.map((child, ii) => {
    return ;
  });

  return {children};
};

historyActions.redo;
// @dts-jest:pass:snap
historyActions.undo;
// @dts-jest:fail:snap
historyActions.undo({});

type PositionTrackerExtensionHelpers = HelpersFromExtensions;
const trackerHelpers: PositionTrackerExtensionHelpers = Object.create(null);

// @dts-jest:pass:snap
trackerHelpers.addPositionTracker({ id: 'yo' });
// @dts-jest:pass:snap
trackerHelpers.clearPositionTrackers();

// @dts-jest:pass:snap
ExtensionManager.create([
  new HistoryExtension(),
  new ParagraphExtension(),
  new BoldExtension(),
  new CodeBlockExtension(),
  new PositionTrackerExtension(),
  { priority: 1, extension: new TextExtension() },
  { priority: 0, extension: new DocExtension() },
]);

const manager1 = ExtensionManager.create([
  new HistoryExtension(),
  new ParagraphExtension(),
  new BoldExtension(),
  new CodeBlockExtension(),
  new PositionTrackerExtension(),
  { priority: 1, extension: new TextExtension() },