github remirror/remirror remirror@1.0.22

2021-09-07

⚠️ Important

This release includes a change that could be breaking for controlled editors, however this is being released as a patch, as the fix is a correction to align with documented behaviour.

Uncontrolled editors will not be affected.

When attempting to synchronously run multiple commands in a controlled editor, each command operates on the current state, not the state as applied by the previous command. As a result, we find ourselves in a situation where the last command wins. i.e. the last state update before the controlled editor can apply the new state is the one that will be used.
-- Controlled editors - Potential pitfalls

Controlled vs uncontrolled

As a reminder, controlled editors use a state prop, whereas uncontrolled use an initialState prop

  • Controlled <Remirror state={state}
  • Uncontrolled <Remirror initialState={state}

Breaking usage

If you're using multiple unchained commands in a controlled editor, then only the last command will applied to state.

import { useCallback } from 'react'; 
import { useCommands } from '@remirror/react';

const { toggleBold, toggleItalic } = useCommands();

const handleAction = useCallback(() => {
  toggleBold();
  toggleItalic(); // Only this will be applied in a controlled editor
}, [toggleBold, toggleItalic]);

Instead you should be using a chained command

import { useCallback } from 'react'; 
import { useChainedCommands } from '@remirror/react'; // Note different import

const chain = useChainedCommands();

const handleAction = useCallback(() => {
  chain
    .toggleBold()
    .toggleItalic()
    .run() // A chain needs to be .run() - both commands will be applied
}, [chain]);

Patch Changes

  • Unchained commands should use a new transaction to prevent leaking of previous command steps
  • Remove react dependency from wysiwyg-preset: An earlier commit upgraded the tables from simple to fancy tables. As a side effect, this had introduced a dependency from wysiwyg to the react-part of remirror. This change removes this dependency again.

  • Updated dependencies []:

    • @remirror/core@1.1.1
    • @remirror/dom@1.0.6
    • @remirror/extension-annotation@1.0.6
    • @remirror/extension-bidi@1.0.4
    • @remirror/extension-blockquote@1.0.5
    • @remirror/extension-bold@1.0.4
    • @remirror/extension-callout@1.0.5
    • @remirror/extension-code@1.0.4
    • @remirror/extension-code-block@1.0.6
    • @remirror/extension-codemirror5@1.0.4
    • @remirror/extension-collaboration@1.0.4
    • @remirror/extension-columns@1.0.4
    • @remirror/extension-diff@1.0.4
    • @remirror/extension-doc@1.0.5
    • @remirror/extension-drop-cursor@1.0.4
    • @remirror/extension-embed@1.1.4
    • @remirror/extension-emoji@1.0.5
    • @remirror/extension-epic-mode@1.0.4
    • @remirror/extension-events@1.0.4
    • @remirror/extension-font-family@1.0.4
    • @remirror/extension-font-size@1.0.4
    • @remirror/extension-gap-cursor@1.0.4
    • @remirror/extension-hard-break@1.0.4
    • @remirror/extension-heading@1.0.4
    • @remirror/extension-history@1.0.4
    • @remirror/extension-horizontal-rule@1.0.4
    • @remirror/extension-image@1.0.7
    • @remirror/extension-italic@1.0.4
    • @remirror/extension-link@1.0.4
    • @remirror/extension-list@1.0.11
    • @remirror/extension-markdown@1.0.4
    • @remirror/extension-mention@1.0.4
    • @remirror/extension-mention-atom@1.0.5
    • @remirror/extension-node-formatting@1.0.7
    • @remirror/extension-paragraph@1.0.4
    • @remirror/extension-placeholder@1.0.5
    • @remirror/extension-positioner@1.1.3
    • @remirror/extension-search@1.0.4
    • @remirror/extension-strike@1.0.4
    • @remirror/extension-sub@1.0.4
    • @remirror/extension-sup@1.0.4
    • @remirror/extension-tables@1.0.5
    • @remirror/extension-text@1.0.4
    • @remirror/extension-text-case@1.0.4
    • @remirror/extension-text-color@1.0.5
    • @remirror/extension-text-highlight@1.0.5
    • @remirror/extension-trailing-node@1.0.4
    • @remirror/extension-underline@1.0.4
    • @remirror/extension-whitespace@1.0.4
    • @remirror/extension-yjs@1.0.6
    • @remirror/preset-core@1.0.6
    • @remirror/preset-formatting@1.0.7
    • @remirror/preset-wysiwyg@1.1.0

Don't miss a new remirror release

NewReleases is sending notifications on new releases.