slate-react 0.77.4 → 0.79.0-20224219174

package/dist/plugin/react-editor.d.ts

@@ -12,6 +12,10 @@ export interface ReactEditor extends BaseEditor {
     hasRange: (editor: ReactEditor, range: Range) => boolean;
 }
 export declare const ReactEditor: {
+    /**
+     * Check if the user is currently composing inside the editor.
+     */
+    isComposing(editor: ReactEditor): boolean;
     /**
      * Return the host window of the current editor.
      */

package/dist/plugin/react-editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"react-editor.d.ts","sourceRoot":"","sources":["../packages/slate-react/src/plugin/react-editor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAc,UAAU,EAAE,MAAM,OAAO,CAAA;AAEhF,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAA;AAYlC,OAAO,EAEL,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,cAAc,EAKf,MAAM,cAAc,CAAA;AAGrB;;GAEG;AAEH,MAAM,WAAW,WAAY,SAAQ,UAAU;IAC7C,UAAU,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAA;IACxC,kBAAkB,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAA;IACnD,cAAc,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAA;IAC/C,eAAe,EAAE,CACf,IAAI,EAAE,YAAY,EAClB,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,KAAK,KAClC,IAAI,CAAA;IACT,QAAQ,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,KAAK,OAAO,CAAA;CACzD;AAED,eAAO,MAAM,WAAW;IACtB;;OAEG;sBAEe,WAAW,GAAG,MAAM;IAQtC;;OAEG;oBAEa,WAAW,QAAQ,IAAI,GAAG,GAAG;IAW7C;;OAEG;qBAEc,WAAW,QAAQ,IAAI;IA8BxC;;OAEG;qCAE8B,WAAW,GAAG,QAAQ,GAAG,UAAU;IAcpE;;OAEG;sBAEe,WAAW,GAAG,OAAO;IAIvC;;OAEG;uBAEgB,WAAW,GAAG,OAAO;IAIxC;;OAEG;iBAEU,WAAW,GAAG,IAAI;IAU/B;;OAEG;kBAEW,WAAW,GAAG,IAAI;IAUhC;;OAEG;qBAEc,WAAW,GAAG,IAAI;IAenC;;OAEG;uBAGO,WAAW,UACX,OAAO,YACN;QAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAE,GAC9B,OAAO;IAoCV;;OAEG;uBAEgB,WAAW,QAAQ,YAAY,GAAG,IAAI;IAIzD;;OAEG;+BAEwB,WAAW,QAAQ,YAAY,GAAG,OAAO;IAIpE;;OAEG;2BAEoB,WAAW,QAAQ,YAAY,GAAG,OAAO;IAIhE;;OAEG;4BAGO,WAAW,QACb,YAAY,sDAEjB,IAAI;IAIP;;OAEG;sBAEe,WAAW,QAAQ,IAAI,GAAG,WAAW;IAevD;;OAEG;uBAEgB,WAAW,SAAS,KAAK;IAgD5C;;;;;;;OAOG;uBAEgB,WAAW,SAAS,KAAK,GAAG,QAAQ;IA8BvD;;OAEG;wBAEiB,WAAW,WAAW,OAAO,GAAG,IAAI;IAgBxD;;OAEG;2BAEoB,WAAW,SAAS,GAAG,GAAG,KAAK;IAiEtD;;OAEG;4CAGO,WAAW;;;;IAmHrB;;OAEG;8CAGO,WAAW,YACT,QAAQ,GAAG,cAAc,GAAG,YAAY;;;;;;qBAyFnC,WAAW,SAAS,KAAK,GAAG,OAAO;CAMrD,CAAA"}
+{"version":3,"file":"react-editor.d.ts","sourceRoot":"","sources":["../packages/slate-react/src/plugin/react-editor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAc,UAAU,EAAE,MAAM,OAAO,CAAA;AAEhF,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAA;AAalC,OAAO,EAEL,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,cAAc,EAKf,MAAM,cAAc,CAAA;AAGrB;;GAEG;AAEH,MAAM,WAAW,WAAY,SAAQ,UAAU;IAC7C,UAAU,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAA;IACxC,kBAAkB,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAA;IACnD,cAAc,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAA;IAC/C,eAAe,EAAE,CACf,IAAI,EAAE,YAAY,EAClB,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,KAAK,KAClC,IAAI,CAAA;IACT,QAAQ,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,KAAK,OAAO,CAAA;CACzD;AAED,eAAO,MAAM,WAAW;IACtB;;OAEG;wBAEiB,WAAW,GAAG,OAAO;IAIzC;;OAEG;sBAEe,WAAW,GAAG,MAAM;IAQtC;;OAEG;oBAEa,WAAW,QAAQ,IAAI,GAAG,GAAG;IAW7C;;OAEG;qBAEc,WAAW,QAAQ,IAAI;IA8BxC;;OAEG;qCAE8B,WAAW,GAAG,QAAQ,GAAG,UAAU;IAcpE;;OAEG;sBAEe,WAAW,GAAG,OAAO;IAIvC;;OAEG;uBAEgB,WAAW,GAAG,OAAO;IAIxC;;OAEG;iBAEU,WAAW,GAAG,IAAI;IAU/B;;OAEG;kBAEW,WAAW,GAAG,IAAI;IAUhC;;OAEG;qBAEc,WAAW,GAAG,IAAI;IAenC;;OAEG;uBAGO,WAAW,UACX,OAAO,YACN;QAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAE,GAC9B,OAAO;IAoCV;;OAEG;uBAEgB,WAAW,QAAQ,YAAY,GAAG,IAAI;IAIzD;;OAEG;+BAEwB,WAAW,QAAQ,YAAY,GAAG,OAAO;IAIpE;;OAEG;2BAEoB,WAAW,QAAQ,YAAY,GAAG,OAAO;IAIhE;;OAEG;4BAGO,WAAW,QACb,YAAY,sDAEjB,IAAI;IAIP;;OAEG;sBAEe,WAAW,QAAQ,IAAI,GAAG,WAAW;IAevD;;OAEG;uBAEgB,WAAW,SAAS,KAAK;IAgD5C;;;;;;;OAOG;uBAEgB,WAAW,SAAS,KAAK,GAAG,QAAQ;IA8BvD;;OAEG;wBAEiB,WAAW,WAAW,OAAO,GAAG,IAAI;IAgBxD;;OAEG;2BAEoB,WAAW,SAAS,GAAG,GAAG,KAAK;IAiEtD;;OAEG;4CAGO,WAAW;;;;IAmHrB;;OAEG;8CAGO,WAAW,YACT,QAAQ,GAAG,cAAc,GAAG,YAAY;;;;;;qBAyFnC,WAAW,SAAS,KAAK,GAAG,OAAO;CAMrD,CAAA"}

package/dist/slate-react.js

@@ -2189,7 +2189,6 @@
 
 	  var state = React.useMemo(function () {
 	    return {
-	      isComposing: false,
 	      hasInsertPrefixInCompositon: false,
 	      isDraggingInternally: false,
 	      isUpdatingSelection: false,
@@ -2215,7 +2214,7 @@
 	    var root = ReactEditor.findDocumentOrShadowRoot(editor);
 	    var domSelection = root.getSelection();
 
-	    if (state.isComposing || !domSelection || !ReactEditor.isFocused(editor)) {
+	    if (ReactEditor.isComposing(editor) || !domSelection || !ReactEditor.isFocused(editor)) {
 	      return;
 	    }
 
@@ -2299,7 +2298,7 @@
 	  // while a selection is being dragged.
 
 	  var onDOMSelectionChange = React.useCallback(throttle_1(function () {
-	    if (!state.isComposing && !state.isUpdatingSelection && !state.isDraggingInternally) {
+	    if (!ReactEditor.isComposing(editor) && !state.isUpdatingSelection && !state.isDraggingInternally) {
 	      var root = ReactEditor.findDocumentOrShadowRoot(editor);
 	      var activeElement = root.activeElement;
 	      var el = ReactEditor.toDOMNode(editor, editor);
@@ -2551,8 +2550,10 @@
 	              // then we will abort because we're still composing and the selection
 	              // won't be updated properly.
 	              // https://www.w3.org/TR/input-events-2/
-	              state.isComposing && setIsComposing(false);
-	              state.isComposing = false;
+	              if (ReactEditor.isComposing(editor)) {
+	                setIsComposing(false);
+	                IS_COMPOSING.set(editor, false);
+	              }
 	            } // use a weak comparison instead of 'instanceof' to allow
 	            // programmatic access of paste events coming from external windows
 	            // like cypress where cy.window does not work realibly
@@ -2672,7 +2673,7 @@
 	      if (!HAS_BEFORE_INPUT_SUPPORT && !readOnly && !isEventHandled(event, attributes.onBeforeInput) && hasEditableTarget(editor, event.target)) {
 	        event.preventDefault();
 
-	        if (!state.isComposing) {
+	        if (!ReactEditor.isComposing(editor)) {
 	          var text = event.data;
 	          slate.Editor.insertText(editor, text);
 	        }
@@ -2805,12 +2806,15 @@
 	    }, [readOnly, attributes.onClick]),
 	    onCompositionEnd: React.useCallback(function (event) {
 	      if (hasEditableTarget(editor, event.target) && !isEventHandled(event, attributes.onCompositionEnd)) {
-	        state.isComposing && setIsComposing(false);
-	        state.isComposing = false; // COMPAT: In Chrome, `beforeinput` events for compositions
+	        if (ReactEditor.isComposing(editor)) {
+	          setIsComposing(false);
+	          IS_COMPOSING.set(editor, false);
+	        } // COMPAT: In Chrome, `beforeinput` events for compositions
 	        // aren't correct and never fire the "insertFromComposition"
 	        // type that we need. So instead, insert whenever a composition
 	        // ends since it will already have been committed to the DOM.
 
+
 	        if (!IS_SAFARI && !IS_FIREFOX_LEGACY && !IS_IOS && !IS_QQBROWSER && !IS_WECHATBROWSER && !IS_UC_MOBILE && event.data) {
 	          slate.Editor.insertText(editor, event.data);
 	        }
@@ -2836,8 +2840,10 @@
 	    }, [attributes.onCompositionEnd]),
 	    onCompositionUpdate: React.useCallback(function (event) {
 	      if (hasEditableTarget(editor, event.target) && !isEventHandled(event, attributes.onCompositionUpdate)) {
-	        !state.isComposing && setIsComposing(true);
-	        state.isComposing = true;
+	        if (!ReactEditor.isComposing(editor)) {
+	          setIsComposing(true);
+	          IS_COMPOSING.set(editor, true);
+	        }
 	      }
 	    }, [attributes.onCompositionUpdate]),
 	    onCompositionStart: React.useCallback(function (event) {
@@ -2999,8 +3005,20 @@
 	      }
 	    }, [readOnly, attributes.onFocus]),
 	    onKeyDown: React.useCallback(function (event) {
-	      if (!readOnly && hasEditableTarget(editor, event.target) && !isEventHandled(event, attributes.onKeyDown) && !state.isComposing) {
-	        var nativeEvent = event.nativeEvent;
+	      if (!readOnly && hasEditableTarget(editor, event.target)) {
+	        var nativeEvent = event.nativeEvent; // COMPAT: The composition end event isn't fired reliably in all browsers,
+	        // so we sometimes might end up stuck in a composition state even though we
+	        // aren't composing any more.
+
+	        if (ReactEditor.isComposing(editor) && nativeEvent.isComposing === false) {
+	          IS_COMPOSING.set(editor, false);
+	          setIsComposing(false);
+	        }
+
+	        if (isEventHandled(event, attributes.onKeyDown) || ReactEditor.isComposing(editor)) {
+	          return;
+	        }
+
 	        var selection = editor.selection;
 	        var element = editor.children[selection !== null ? selection.focus.path[0] : 0];
 	        var isRTL = direction_1(slate.Node.string(element)) === 'rtl'; // COMPAT: Since we prevent the default behavior on
@@ -3642,6 +3660,13 @@
 	};
 
 	var ReactEditor = {
+	  /**
+	   * Check if the user is currently composing inside the editor.
+	   */
+	  isComposing: function isComposing(editor) {
+	    return !!IS_COMPOSING.get(editor);
+	  },
+
 	  /**
 	   * Return the host window of the current editor.
 	   */
@@ -4415,7 +4440,7 @@
 	    var selection = _this.editor.selection; // 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)) {
+	    if (ReactEditor.isComposing(_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;