remirror/remirror @remirror/react@1.0.38

on GitHub

2022-05-24

Patch Changes

• Add a built in extension allowing external code to subscribe to document changes.

  manager.getExtension(DocChangedExtension).addHandler('docChanged', mock);

• Add a hook, and 2 React components to simplify subscribing to document changes.

  Adds a useDocChanged hook, which when given a handler function, calls it with the transactions and state when document is changed.

  import { useCallback } from 'react';
  import { useDocChanged } from '@remirror/react';
  
  useDocChanged(
    useCallback(({ tr, transactions, state }) => {
      console.log('Transaction', tr);
      console.log('Transactions', transactions);
      console.log('EditorState', state);
    }, []),
  );

  Also adds two React components, OnChangeJSON and OnChangeHTML which accept a handler function, which is called with the JSON or HTML serialisation of doc state, whenever the document is changed.

  import { useCallback } from 'react';
  import { OnChangeJSON, OnChangeHTML } from '@remirror/react';
  
  const handleChangeJSON = useCallback((json) => {
    console.log('JSON serialised state', json);
  }, []);
  
  const handleChangeHTML = useCallback((html) => {
    console.log('HTML serialised state', html);
  }, []);
  
  return (
    <Remirror manager={manager} autoRender>
      <OnChangeJSON onChange={handleChangeJSON} />
      <OnChangeHTML onChange={handleChangeHTML} />
    </Remirror>
  );

• Updated dependencies []:

  • @remirror/extension-placeholder@1.0.25
  • @remirror/extension-positioner@1.2.6
  • @remirror/extension-react-component@1.1.13
  • @remirror/extension-react-ssr@1.0.25
  • @remirror/extension-react-tables@1.0.38
  • @remirror/preset-react@1.0.27
  • @remirror/react-components@1.0.35
  • @remirror/react-core@1.2.2
  • @remirror/react-hooks@1.0.35
  • @remirror/react-renderer@1.0.25
  • @remirror/react-ssr@1.0.25