slate

Patch Changes

• #4500 50bb3d7e Thanks @tubbo! - Upgrade is-plain-object to v5.0.0

Minor Changes

• #4489 1b560de3 Thanks @nemanja-tosic! - Fix paste to empty node losing structure of first block

• #4326 00259003 Thanks @oliger! - Add support for flag, keycap and tag unicode sequences.

• #4276 6f47cbbe Thanks @TheSpyder! - Switched from fast-deep-equal to a custom deep equality check. This restores the ability for text nodes with mark values set to undefined to merge with text nodes missing those keys.

• #4431 55ff8f00 Thanks @TheSpyder! - Fixed regression in #4208 where normalization on empty block nodes could not be overridden

• #3820 c6203a2d Thanks @githoniel! - unwrapNode call liftNode in reverse order to keep nested block

• #4428 b47d3fd1 Thanks @TheSpyder! - Don't set null in set_node's newProperties object when using Transforms.unsetNodes()

Patch Changes

• #4132 48b71294 Thanks @ulion! - Make onDomSelectionChange trigger after onClick.

• #4500 50bb3d7e Thanks @tubbo! - Upgrade is-plain-object to v5.0.0

• #4482 dd752df1 Thanks @Jokcy! - Fix cursor not correct issue after insert multiple nodes with Transform.insertNodes

• #4296 479a7591 Thanks @kellyjosephprice! - Fix mergeNodes moving node into parent sibling

• #4458 95c759a1 Thanks @taj-codaio! - Normalization now removes empty text nodes after nonempty nodes with differing styles, but before inline nodes.

• #4505 269e59c9 Thanks @dylans! - Immer 9 security update, refactor to support immer 9 API changes

Patch Changes

• #4500 50bb3d7e Thanks @tubbo! - Upgrade is-plain-object to v5.0.0

Patch Changes

• #4175 bde6e804 Thanks @gyh9457! - Fixed a bug in the memoization logic for the leaves of text nodes.

• #4394 01889807 Thanks @jaked! - fix bug where decorate is not called on immediate children of editor

• #4049 6c844227 Thanks @ulion! - Fix ios chrome ime double input issue.

• #4427 3f69a9f3 Thanks @ben10code! - Fix crash when unmounting an editor rendered within a React portal. The issue was arising at unmount time, because getRootNode returned the dettached portal node and it is not an instance of Document or ShadowRoot. As a fix, getDocumentOrShadowRoot has been refactored to return a root node instead of throwing. In sum, this patch fixes a regression bug introduced by https://github.com/ianstormtaylor/slate/pull/3749/

• #4369 c217dbb5 Thanks @thesunny! - Scroll when inserting new text will now scroll parent scrollables

• #4333 e0776c5c Thanks @dylans! - Allow setFragmentData to work without copy/paste or DnD data structure

• #4421 237edc6e Thanks @jaked! - fix decorate bug (#4277) without adding extra layers of render tree

• #4347 46c8871c Thanks @aiwenar! - Re-render leaf when new properties were added to it

• #4352 4b373dc2 Thanks @hueyhe! - Do not display placeholder when composing

Patch Changes

• #4430 748bf750 Thanks @TheSpyder! - Removed unnecessary (and outdated) dependency on immer

Patch Changes

• #4253 0214b630 Thanks @TheSpyder! - Fix Transforms.wrapNodes crashing when the match function matched only the editor

• #4049 6c844227 Thanks @ulion! - Fix ios chrome ime double input issue.

• #4421 237edc6e Thanks @jaked! - fix decorate bug (#4277) without adding extra layers of render tree

• #4349 236754c4 Thanks @imdbsd! - Add isElementType utility to Element interface

Patch Changes

• #4331 a3bc97af Thanks @golota60! - Fix deletion of selected inline void nodes in Safari when presssing backspace or delete. This is a bug that was originally fixed only for Google Chrome, but the fix also needs to be applied in Safari.

Patch Changes

• #4324 61171a23 Thanks @clauderic! - Fix backward typing bug in Safari by ensuring the selection is always removed on blur.
  Safari doesn't always remove the selection, even if the contenteditable element no longer has focus.
  In this scenario, we need to forcefully remove the selection on blur.
  Refer to https://stackoverflow.com/questions/12353247/force-contenteditable-div-to-stop-accepting-input-after-it-loses-focus-under-web

Minor Changes

• #4299 2c17e2b7 Thanks @georgberecz! - Allow custom event handlers on Editable component to return boolean flag to specify whether the event can be treated as being handled.

  By default, the Editable component comes with a set of event handlers that handle typical rich-text editing behaviors (for example, it implements its own onCopy, onPaste, onDrop, and onKeyDown handlers).

  In some cases you may want to extend or override Slate's default behavior, which can be done by passing your own event handler(s) to the Editable component.

  Your custom event handler can control whether or not Slate should execute its own event handling for a given event after your handler runs depending on the return value of your event handler as described below.

  import {Editable} from 'slate-react';
  
  function MyEditor() {
    const onClick = event => {
      // Implement custom event logic...
  
      // When no value is returned, Slate will execute its own event handler when
      // neither isDefaultPrevented nor isPropagationStopped was set on the event
    };
  
    const onDrop = event => {
      // Implement custom event logic...
  
      // No matter the state of the event, treat it as being handled by returning
      // true here, Slate will skip its own event handler
      return true;
    };
  
    const onDragStart = event => {
      // Implement custom event logic...
  
      // No matter the status of the event, treat event as *not* being handled by
      // returning false, Slate will exectue its own event handler afterward
      return false;
    };
  
    return (
      <Editable
        onClick={onClick}
        onDrop={onDrop}
        onDragStart={onDragStart}
        {/*...*/}
      />
    )
  }
  

Patch Changes

• #4266 411e5a19 Thanks @TheSpyder! - Removed accidental bundling of slate-history inside slate-react

• #4307 a7e3a181 Thanks @clauderic! - Fix deletion of selected inline void nodes in Chrome. Chrome does not fire a beforeinput event when deleting backwards within an inline void node, so we need to add special logic to handle this edge-case for Chrome only.

• #4272 294d5120 Thanks @clauderic! - Fix errors accessing globalThis in browsers that do not implement it

• #4295 dfc03960 Thanks @dubzzz! - Fix React warnings related to autoCorrect and autoCapitalize attributes being passed as a boolean instead of a string.

• #4271 ff267767 Thanks @omerg! - Fixed typo: Renamed toSlatePoint argument extractMatch to exactMatch

Minor Changes

• #4230 796389c7 Thanks @TheSpyder! - Applying invalid insert_node operations will now throw an exception for all invalid paths, not just invalid parent paths.

Patch Changes

• #4245 b33a531b Thanks @JonasKruckenberg! - Removed lodash dependecy to reduce bundled footprint

• #4208 feb293aa Thanks @TheSpyder! - Fix Error: Cannot get the start point in the node at path [...] because it has no start text node caused by normalizing a document where some elements have no children

• #4230 796389c7 Thanks @TheSpyder! - Exceptions in editor.apply() and Editor.withoutNormalizing() will no longer leave the editor in an invalid state

• #4227 e6413d46 Thanks @ulion! - Fixed a bug that would allow multiple changes to be scheduled at the same time.

Patch Changes

• #4238 c14e1fbc Thanks @clauderic! - Fix duplicated content and other bugs related to drag and drop handling

• #4237 623960a7 Thanks @dylans! - Fixed text insertion logic to prevent crashing in newer Firefox versions.

Patch Changes

• #4118 6a137633 Thanks @kamilkazmierczak! - Improved detection of legacy browsers that don't have proper beforeinput support.

• #4190 ea2eefef Thanks @juliankrispel! - Added a renderPlaceholder prop to the <Editable> component for customizing how placeholders are rendered.

• #4157 de5cc7e5 Thanks @githoniel! - Fixed a bug when syncing the selection for IME-based editing.

• #4158 ea6dc089 Thanks @githoniel! - Fixed a bug that resulted in doubly-input characters when using an IME.

• #4211 1c32b97d Thanks @clauderic! - Collapse expanded selection before handling moveWordBackward (alt + left) and moveWordForward (alt + right) hotkeys.

• #4219 737aaa9c Thanks @juliankrispel! - Fixes error that occurs when Editor is rendered inside iframe

Patch Changes

• #4193 fd70dc0b Thanks @beorn! - Fixed insert and remove text operations to no-op without any text.

• #4078 2dad21d1 Thanks @TheSpyder! - Fixed inversion of set_node operations that delete properties on nodes.

• #4168 95f402c5 Thanks @ridhambhat! - Fixed a bug in splitting and applying overlapping marks to text nodes.

BREAKING CHANGES

• The filterDescendants and findDescendants methods are now depth-first. This shouldn't affect almost anyone, since they are usually not the best things to be using for performance reasons. If you happen to have a very specific use case that needs breadth-first, (or even likely something better), you'll need to implement it yourself.

DEPRECATION CHANGES

• Some Node methods have been deprecated! There were a few methods that had been added over time that were either poorly named that have been deprecated and renamed, and a handful of methods that are no longer useful for the core library that have been deprecated. Here's a full list:
  • areDescendantSorted -> areDescendantsSorted
  • getHighestChild -> getFurthestAncestor
  • getHighestOnlyChildParent -> getFurthestOnlyChildAncestor
  • concatChildren
  • decorateTexts
  • filterDescendantsDeep
  • findDescendantDeep
  • getChildrenBetween
  • getChildrenBetweenIncluding
  • isInlineSplitAtRange

BREAKING CHANGES

• The plugin.render property is now called plugin.renderPortal. This is to make way for the new plugin.render property that offers HOC-like behavior, so that plugins can augment the editor however they choose.

DEPRECATION CHANGES

• Some Selection methods have been deprecated! Previously there were many inconsistencies in the naming and handling of selection changes. This has all been cleaned up, but in the process some methods have been deprecated. Here is a full list of the deprecated methods and their new alternatives:

  • moveToOffsets -> moveOffsetsTo
  • moveForward -> move
  • moveBackward -> move
  • moveAnchorOffset -> moveAnchor
  • moveFocusOffset -> moveFocus
  • moveStartOffset -> moveStart
  • moveEndOffset -> moveEnd
  • extendForward -> extend
  • extendBackward -> extend
  • unset -> deselect

• Some selection transforms have been deprecated! Along with the methods, the selection-based transforms have also been refactored, resulting in deprecations. Here is a full list of the deprecated transforms and their new alternatives:

  • moveTo -> select
  • moveToOffsets -> moveOffsetsTo
  • moveForward -> move
  • moveBackward -> move
  • moveStartOffset -> moveStart
  • moveEndOffset -> moveEnd
  • extendForward -> extend
  • extendBackward -> extend
  • flipSelection -> flip
  • unsetSelection -> deselect
  • unsetMarks

BREAKING CHANGES

• Inline nodes are now always surrounded by text nodes. Previously this behavior only occured for inline nodes with isVoid: true. Now, all inline nodes will always be surrounded by text nodes. If text nodes don't exist, empty ones will be created. This allows for more consistent behavior across Slate, and parity with other editing experiences.

BREAKING CHANGES

• The Raw serializer is no longer terse by default! Previously, the Raw serializer would return a "terse" representation of the document, omitting information that wasn't strictly necessary to deserialize later, like the key of nodes. By default this no longer happens. You have to opt-in to the behavior by passing { terse: true } as the second options argument of the deserialize and serialize methods.

BREAKING CHANGES

• Void components are no longer rendered implicity! Previously, Slate would automatically wrap any node with isVoid: true in a <Void> component. But doing this prevented you from customizing the wrapper, like adding a className or style property. So you must now render the wrapper yourself, and it has been exported as Slate.Void. This, combined with a small change to the <Void> component's structure allows the "selected" state of void nodes to be rendered purely with CSS based on the :focus property of a <Void> element, which previously had to be handled in Javascript. This allows us to streamline selection-handling logic, improving performance and reducing complexity.
• data-offset-key is now <key>-<index> instead of <key>:<start>-<end>. This shouldn't actually affect anyone, unless you were specifically relying on that attribute in the DOM. This change greatly reduces the number of re-renders needed, since previously any additional characters would cause a cascading change in the <start> and <end> offsets of latter text ranges.