slate-react 0.72.2 → 0.72.4-2022011114342

package/dist/slate-react.js

@@ -977,13 +977,6 @@
 
 	var IS_READ_ONLY = new WeakMap();
 	var IS_FOCUSED = new WeakMap();
-	var IS_COMPOSING = new WeakMap();
-	var IS_ON_COMPOSITION_END = new WeakMap();
-	/**
-	 * Weak maps for saving text on composition stage.
-	 */
-
-	var EDITOR_ON_COMPOSITION_TEXT = new WeakMap();
 	/**
 	 * Weak map for associating the context `onChange` context with the plugin.
 	 */
@@ -2722,7 +2715,7 @@
 	                distance: currentTextNode.text.length,
 	                reverse: true
 	              });
-	              slate.Transforms.insertText(editor, text);
+	              slate.Editor.insertText(editor, text);
 	            });
 	          }
 	        }
@@ -3275,229 +3268,6 @@
 	  return event.defaultPrevented;
 	};
 
-	/**
-	 * Returns the number of characters that are the same at the beginning of the
-	 * String.
-	 *
-	 * @param prev  the previous text
-	 * @param next  the next text
-	 * @returns the offset of the start of the difference; null if there is no difference
-	 */
-
-	function getDiffStart(prev, next) {
-	  var length = Math.min(prev.length, next.length);
-
-	  for (var i = 0; i < length; i++) {
-	    if (prev.charAt(i) !== next.charAt(i)) return i;
-	  }
-
-	  if (prev.length !== next.length) return length;
-	  return null;
-	}
-	/**
-	 * Returns the number of characters that are the same at the end of the String
-	 * up to `max`. Max prevents double-counting characters when there are
-	 * multiple duplicate characters around the diff area.
-	 *
-	 * @param prev  the previous text
-	 * @param next  the next text
-	 * @param max  the max length to test.
-	 * @returns number of characters that are the same at the end of the string
-	 */
-
-
-	function getDiffEnd(prev, next, max) {
-	  var prevLength = prev.length;
-	  var nextLength = next.length;
-	  var length = Math.min(prevLength, nextLength, max);
-
-	  for (var i = 0; i < length; i++) {
-	    var prevChar = prev.charAt(prevLength - i - 1);
-	    var nextChar = next.charAt(nextLength - i - 1);
-	    if (prevChar !== nextChar) return i;
-	  }
-
-	  if (prev.length !== next.length) return length;
-	  return null;
-	}
-	/**
-	 * Takes two strings and returns an object representing two offsets. The
-	 * first, `start` represents the number of characters that are the same at
-	 * the front of the String. The `end` represents the number of characters
-	 * that are the same at the end of the String.
-	 *
-	 * Returns null if they are identical.
-	 *
-	 * @param prev  the previous text
-	 * @param next  the next text
-	 * @returns the difference text range; null if there are no differences.
-	 */
-
-
-	function getDiffOffsets(prev, next) {
-	  if (prev === next) return null;
-	  var start = getDiffStart(prev, next);
-	  if (start === null) return null;
-	  var maxEnd = Math.min(prev.length - start, next.length - start);
-	  var end = getDiffEnd(prev, next, maxEnd);
-	  if (end === null) return null;
-	  return {
-	    start: start,
-	    end: end
-	  };
-	}
-	/**
-	 * Takes a text string and returns a slice from the string at the given text range
-	 *
-	 * @param text  the text
-	 * @param offsets  the text range
-	 * @returns the text slice at text range
-	 */
-
-
-	function sliceText(text, offsets) {
-	  return text.slice(offsets.start, text.length - offsets.end);
-	}
-	/**
-	 * Takes two strings and returns a smart diff that can be used to describe the
-	 * change in a way that can be used as operations like inserting, removing or
-	 * replacing text.
-	 *
-	 * @param prev the previous text
-	 * @param next the next text
-	 * @returns the text difference
-	 */
-
-
-	function diffText(prev, next) {
-	  if (prev === undefined || next === undefined) return null;
-	  var offsets = getDiffOffsets(prev, next);
-	  if (offsets == null) return null;
-	  var insertText = sliceText(next, offsets);
-	  var removeText = sliceText(prev, offsets);
-	  return {
-	    start: offsets.start,
-	    end: prev.length - offsets.end,
-	    insertText: insertText,
-	    removeText: removeText
-	  };
-	}
-	function combineInsertedText(insertedText) {
-	  return insertedText.reduce(function (acc, _ref) {
-	    var text = _ref.text;
-	    return "".concat(acc).concat(text.insertText);
-	  }, '');
-	}
-	function getTextInsertion(editor, domNode) {
-	  var node = ReactEditor.toSlateNode(editor, domNode);
-
-	  if (!slate.Text.isText(node)) {
-	    return undefined;
-	  }
-
-	  var prevText = node.text;
-	  var nextText = domNode.textContent; // textContent will pad an extra \n when the textContent ends with an \n
-
-	  if (nextText.endsWith('\n')) {
-	    nextText = nextText.slice(0, nextText.length - 1);
-	  } // If the text is no different, there is no diff.
-
-
-	  if (nextText !== prevText) {
-	    var textDiff = diffText(prevText, nextText);
-
-	    if (textDiff !== null) {
-	      var textPath = ReactEditor.findPath(editor, node);
-	      return {
-	        text: textDiff,
-	        path: textPath
-	      };
-	    }
-	  }
-
-	  return undefined;
-	}
-	function normalizeTextInsertionRange(editor, range, _ref2) {
-	  var path = _ref2.path,
-	      text = _ref2.text;
-	  var insertionRange = {
-	    anchor: {
-	      path: path,
-	      offset: text.start
-	    },
-	    focus: {
-	      path: path,
-	      offset: text.end
-	    }
-	  };
-
-	  if (!range || !slate.Range.isCollapsed(range)) {
-	    return insertionRange;
-	  }
-
-	  var insertText = text.insertText,
-	      removeText = text.removeText;
-	  var isSingleCharacterInsertion = insertText.length === 1 || removeText.length === 1;
-	  /**
-	   * This code handles edge cases that arise from text diffing when the
-	   * inserted or removed character is a single character, and the character
-	   * right before or after the anchor is the same as the one being inserted or
-	   * removed.
-	   *
-	   * Take this example: hello|o
-	   *
-	   * If another `o` is inserted at the selection's anchor in the example above,
-	   * it should be inserted at the anchor, but using text diffing, we actually
-	   * detect that the character was inserted after the second `o`:
-	   *
-	   * helloo[o]|
-	   *
-	   * Instead, in these very specific edge cases, we assume that the character
-	   * needs to be inserted after the anchor rather than where the diff was found:
-	   *
-	   * hello[o]|o
-	   */
-
-	  if (isSingleCharacterInsertion && slate.Path.equals(range.anchor.path, path)) {
-	    var _Array$from = Array.from(slate.Editor.nodes(editor, {
-	      at: range,
-	      match: slate.Text.isText
-	    })),
-	        _Array$from2 = _slicedToArray(_Array$from, 1),
-	        _text = _Array$from2[0];
-
-	    if (_text) {
-	      var _text2 = _slicedToArray(_text, 1),
-	          node = _text2[0];
-
-	      var anchor = range.anchor;
-	      var characterBeforeAnchor = node.text[anchor.offset - 1];
-	      var characterAfterAnchor = node.text[anchor.offset];
-
-	      if (insertText.length === 1 && insertText === characterAfterAnchor) {
-	        // Assume text should be inserted at the anchor
-	        return range;
-	      }
-
-	      if (removeText.length === 1 && removeText === characterBeforeAnchor) {
-	        // Assume text should be removed right before the anchor
-	        return {
-	          anchor: {
-	            path: path,
-	            offset: anchor.offset - 1
-	          },
-	          focus: {
-	            path: path,
-	            offset: anchor.offset
-	          }
-	        };
-	      }
-	    }
-	  }
-
-	  return insertionRange;
-	}
-
 	var classCallCheck = createCommonjsModule(function (module) {
 	function _classCallCheck(instance, Constructor) {
 	  if (!(instance instanceof Constructor)) {
@@ -4126,6 +3896,229 @@
 	  }
 	};
 
+	/**
+	 * Returns the number of characters that are the same at the beginning of the
+	 * String.
+	 *
+	 * @param prev  the previous text
+	 * @param next  the next text
+	 * @returns the offset of the start of the difference; null if there is no difference
+	 */
+
+	function getDiffStart(prev, next) {
+	  var length = Math.min(prev.length, next.length);
+
+	  for (var i = 0; i < length; i++) {
+	    if (prev.charAt(i) !== next.charAt(i)) return i;
+	  }
+
+	  if (prev.length !== next.length) return length;
+	  return null;
+	}
+	/**
+	 * Returns the number of characters that are the same at the end of the String
+	 * up to `max`. Max prevents double-counting characters when there are
+	 * multiple duplicate characters around the diff area.
+	 *
+	 * @param prev  the previous text
+	 * @param next  the next text
+	 * @param max  the max length to test.
+	 * @returns number of characters that are the same at the end of the string
+	 */
+
+
+	function getDiffEnd(prev, next, max) {
+	  var prevLength = prev.length;
+	  var nextLength = next.length;
+	  var length = Math.min(prevLength, nextLength, max);
+
+	  for (var i = 0; i < length; i++) {
+	    var prevChar = prev.charAt(prevLength - i - 1);
+	    var nextChar = next.charAt(nextLength - i - 1);
+	    if (prevChar !== nextChar) return i;
+	  }
+
+	  if (prev.length !== next.length) return length;
+	  return null;
+	}
+	/**
+	 * Takes two strings and returns an object representing two offsets. The
+	 * first, `start` represents the number of characters that are the same at
+	 * the front of the String. The `end` represents the number of characters
+	 * that are the same at the end of the String.
+	 *
+	 * Returns null if they are identical.
+	 *
+	 * @param prev  the previous text
+	 * @param next  the next text
+	 * @returns the difference text range; null if there are no differences.
+	 */
+
+
+	function getDiffOffsets(prev, next) {
+	  if (prev === next) return null;
+	  var start = getDiffStart(prev, next);
+	  if (start === null) return null;
+	  var maxEnd = Math.min(prev.length - start, next.length - start);
+	  var end = getDiffEnd(prev, next, maxEnd);
+	  if (end === null) return null;
+	  return {
+	    start: start,
+	    end: end
+	  };
+	}
+	/**
+	 * Takes a text string and returns a slice from the string at the given text range
+	 *
+	 * @param text  the text
+	 * @param offsets  the text range
+	 * @returns the text slice at text range
+	 */
+
+
+	function sliceText(text, offsets) {
+	  return text.slice(offsets.start, text.length - offsets.end);
+	}
+	/**
+	 * Takes two strings and returns a smart diff that can be used to describe the
+	 * change in a way that can be used as operations like inserting, removing or
+	 * replacing text.
+	 *
+	 * @param prev the previous text
+	 * @param next the next text
+	 * @returns the text difference
+	 */
+
+
+	function diffText(prev, next) {
+	  if (prev === undefined || next === undefined) return null;
+	  var offsets = getDiffOffsets(prev, next);
+	  if (offsets == null) return null;
+	  var insertText = sliceText(next, offsets);
+	  var removeText = sliceText(prev, offsets);
+	  return {
+	    start: offsets.start,
+	    end: prev.length - offsets.end,
+	    insertText: insertText,
+	    removeText: removeText
+	  };
+	}
+	function combineInsertedText(insertedText) {
+	  return insertedText.reduce(function (acc, _ref) {
+	    var text = _ref.text;
+	    return "".concat(acc).concat(text.insertText);
+	  }, '');
+	}
+	function getTextInsertion(editor, domNode) {
+	  var node = ReactEditor.toSlateNode(editor, domNode);
+
+	  if (!slate.Text.isText(node)) {
+	    return undefined;
+	  }
+
+	  var prevText = node.text;
+	  var nextText = domNode.textContent; // textContent will pad an extra \n when the textContent ends with an \n
+
+	  if (nextText.endsWith('\n')) {
+	    nextText = nextText.slice(0, nextText.length - 1);
+	  } // If the text is no different, there is no diff.
+
+
+	  if (nextText !== prevText) {
+	    var textDiff = diffText(prevText, nextText);
+
+	    if (textDiff !== null) {
+	      var textPath = ReactEditor.findPath(editor, node);
+	      return {
+	        text: textDiff,
+	        path: textPath
+	      };
+	    }
+	  }
+
+	  return undefined;
+	}
+	function normalizeTextInsertionRange(editor, range, _ref2) {
+	  var path = _ref2.path,
+	      text = _ref2.text;
+	  var insertionRange = {
+	    anchor: {
+	      path: path,
+	      offset: text.start
+	    },
+	    focus: {
+	      path: path,
+	      offset: text.end
+	    }
+	  };
+
+	  if (!range || !slate.Range.isCollapsed(range)) {
+	    return insertionRange;
+	  }
+
+	  var insertText = text.insertText,
+	      removeText = text.removeText;
+	  var isSingleCharacterInsertion = insertText.length === 1 || removeText.length === 1;
+	  /**
+	   * This code handles edge cases that arise from text diffing when the
+	   * inserted or removed character is a single character, and the character
+	   * right before or after the anchor is the same as the one being inserted or
+	   * removed.
+	   *
+	   * Take this example: hello|o
+	   *
+	   * If another `o` is inserted at the selection's anchor in the example above,
+	   * it should be inserted at the anchor, but using text diffing, we actually
+	   * detect that the character was inserted after the second `o`:
+	   *
+	   * helloo[o]|
+	   *
+	   * Instead, in these very specific edge cases, we assume that the character
+	   * needs to be inserted after the anchor rather than where the diff was found:
+	   *
+	   * hello[o]|o
+	   */
+
+	  if (isSingleCharacterInsertion && slate.Path.equals(range.anchor.path, path)) {
+	    var _Array$from = Array.from(slate.Editor.nodes(editor, {
+	      at: range,
+	      match: slate.Text.isText
+	    })),
+	        _Array$from2 = _slicedToArray(_Array$from, 1),
+	        _text = _Array$from2[0];
+
+	    if (_text) {
+	      var _text2 = _slicedToArray(_text, 1),
+	          node = _text2[0];
+
+	      var anchor = range.anchor;
+	      var characterBeforeAnchor = node.text[anchor.offset - 1];
+	      var characterAfterAnchor = node.text[anchor.offset];
+
+	      if (insertText.length === 1 && insertText === characterAfterAnchor) {
+	        // Assume text should be inserted at the anchor
+	        return range;
+	      }
+
+	      if (removeText.length === 1 && removeText === characterBeforeAnchor) {
+	        // Assume text should be removed right before the anchor
+	        return {
+	          anchor: {
+	            path: path,
+	            offset: anchor.offset - 1
+	          },
+	          focus: {
+	            path: path,
+	            offset: anchor.offset
+	          }
+	        };
+	      }
+	    }
+	  }
+
+	  return insertionRange;
+	}
+
 	function gatherMutationData(editor, mutations) {
 	  var addedNodes = [];
 	  var removedNodes = [];
@@ -4338,15 +4331,7 @@
 	  this.insertText = function (insertedText) {
 	    var _this$editor = _this.editor,
 	        selection = _this$editor.selection,
-	        marks = _this$editor.marks; // If it is in composing or after `onCompositionend`, set `EDITOR_ON_COMPOSITION_TEXT` and return.
-	    // Text will be inserted on compositionend event.
-
-	    if (IS_COMPOSING.get(_this.editor) || IS_ON_COMPOSITION_END.get(_this.editor)) {
-	      EDITOR_ON_COMPOSITION_TEXT.set(_this.editor, insertedText);
-	      IS_ON_COMPOSITION_END.set(_this.editor, false);
-	      return;
-	    } // Insert the batched text diffs
-
+	        marks = _this$editor.marks; // Insert the batched text diffs
 
 	    insertedText.forEach(function (insertion) {
 	      var text = insertion.text.insertText;
@@ -4364,9 +4349,8 @@
 	        });
 	        _this.editor.marks = null;
 	      } else {
-	        slate.Transforms.insertText(_this.editor, text, {
-	          at: at
-	        });
+	        slate.Transforms.setSelection(_this.editor, at);
+	        slate.Editor.insertText(_this.editor, text);
 	      }
 	    });
 	  };
@@ -4995,39 +4979,6 @@
 	        setTimeout(function () {
 	          state.isComposing && setIsComposing(false);
 	          state.isComposing = false;
-	          IS_COMPOSING.set(editor, false);
-	          IS_ON_COMPOSITION_END.set(editor, true);
-	          var insertedText = EDITOR_ON_COMPOSITION_TEXT.get(editor) || []; // `insertedText` is set in `MutationObserver` constructor.
-	          // If open phone keyboard association function, `CompositionEvent` will be triggered.
-
-	          if (!insertedText.length) {
-	            return;
-	          }
-
-	          EDITOR_ON_COMPOSITION_TEXT.set(editor, []);
-	          var selection = editor.selection,
-	              marks = editor.marks;
-	          insertedText.forEach(function (insertion) {
-	            var text = insertion.text.insertText;
-	            var at = normalizeTextInsertionRange(editor, selection, insertion);
-
-	            if (marks) {
-	              var node = _objectSpread({
-	                text: text
-	              }, marks);
-
-	              slate.Transforms.insertNodes(editor, node, {
-	                match: slate.Text.isText,
-	                at: at,
-	                select: true
-	              });
-	              editor.marks = null;
-	            } else {
-	              slate.Transforms.insertText(editor, text, {
-	                at: at
-	              });
-	            }
-	          });
 	        }, RESOLVE_DELAY);
 	      }
 	    }, [attributes.onCompositionEnd]),
@@ -5035,14 +4986,12 @@
 	      if (hasEditableTarget(editor, event.target) && !isEventHandled(event, attributes.onCompositionUpdate)) {
 	        !state.isComposing && setIsComposing(true);
 	        state.isComposing = true;
-	        IS_COMPOSING.set(editor, true);
 	      }
 	    }, [attributes.onCompositionUpdate]),
 	    onCompositionStart: React.useCallback(function (event) {
 	      if (hasEditableTarget(editor, event.target) && !isEventHandled(event, attributes.onCompositionStart)) {
 	        !state.isComposing && setIsComposing(true);
 	        state.isComposing = true;
-	        IS_COMPOSING.set(editor, true);
 	      }
 	    }, [attributes.onCompositionStart]),
 	    onPaste: React.useCallback(function (event) {
@@ -5128,7 +5077,9 @@
 	  });
 	  useIsomorphicLayoutEffect(function () {
 	    var fn = function fn() {
-	      return setIsFocused(ReactEditor.isFocused(editor));
+	      setTimeout(function () {
+	        setIsFocused(ReactEditor.isFocused(editor));
+	      }, 0);
 	    };
 
 	    document.addEventListener('focus', fn, true);
@@ -5138,7 +5089,9 @@
 	  }, []);
 	  useIsomorphicLayoutEffect(function () {
 	    var fn = function fn() {
-	      return setIsFocused(ReactEditor.isFocused(editor));
+	      setTimeout(function () {
+	        setIsFocused(ReactEditor.isFocused(editor));
+	      }, 0);
 	    };
 
 	    document.addEventListener('blur', fn, true);