diff --git a/.changeset/eleven-days-thank.md b/.changeset/eleven-days-thank.md new file mode 100644 index 000000000..332f800f5 --- /dev/null +++ b/.changeset/eleven-days-thank.md @@ -0,0 +1,5 @@ +--- +'slate': patch +--- + +Fix: `editor.selection` is sometimes replaced with a new object even if the selection did not change diff --git a/packages/slate-react/CHANGELOG.md b/packages/slate-react/CHANGELOG.md index ad802beb8..d226c98e3 100644 --- a/packages/slate-react/CHANGELOG.md +++ b/packages/slate-react/CHANGELOG.md @@ -17,6 +17,10 @@ - If this change impacts you, consider changing your `decorate` function to work on the node's parent instead. - For example, if your `decorate` function decorates a `code-line` based on the parent `code-block`'s language, decorate the `code-block` instead. - This is unlikely to result in any performance detriment, since in previous versions of `slate-react`, the decorations of all siblings were recomputed when one sibling was modified. + - **BREAKING CHANGE:** Elements no longer re-render due to selection changes. + - To re-render whenever an element becomes selected or deselected, subscribe to `useSelected`. + - To re-render whenever the selection changes anywhere in the editor, subscribe to `useSlateSelection`. + - To re-render whenever the intersection of the selection with an element changes (the previous behaviour), use `useSlateSelector` to compute this intersection using `Range.intersection`. Ensure you provide a suitable equality function using `Range.equals`. - Increase minimum `slate-dom` version to `0.116.0`. - Deprecate the `useSlateWithV` hook - PERF: Use subscribable pattern for `useSlate`, `useSelected` and decorations to reduce re-renders. diff --git a/packages/slate/src/interfaces/transforms/general.ts b/packages/slate/src/interfaces/transforms/general.ts index ad0fea4ee..825d3d79c 100644 --- a/packages/slate/src/interfaces/transforms/general.ts +++ b/packages/slate/src/interfaces/transforms/general.ts @@ -265,7 +265,9 @@ export const GeneralTransforms: GeneralTransforms = { } } - editor.selection = selection + if (!selection || !Range.equals(selection, editor.selection)) { + editor.selection = selection + } } break @@ -422,7 +424,9 @@ export const GeneralTransforms: GeneralTransforms = { selection[key] = Point.transform(point, op)! } - editor.selection = selection + if (!Range.equals(selection, editor.selection)) { + editor.selection = selection + } } }, }