slate-react 0.76.0 → 0.76.1-2022311131726

package/dist/components/editable.d.ts

@@ -68,10 +68,6 @@ export declare const DefaultPlaceholder: ({ attributes, children, }: RenderPlace
  * A default memoized decorate function.
  */
 export declare const defaultDecorate: (entry: NodeEntry) => Range[];
-/**
- * Check if two DOM range objects are equal.
- */
-export declare const isRangeEqual: (a: DOMRange, b: DOMRange) => boolean;
 /**
  * Check if the target is in the editor.
  */

package/dist/components/editable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editable.d.ts","sourceRoot":"","sources":["../packages/slate-react/src/components/editable.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"editable.d.ts","sourceRoot":"","sources":["../packages/slate-react/src/components/editable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAChF,OAAO,EAEL,OAAO,EACP,SAAS,EAET,KAAK,EACL,IAAI,EAIL,MAAM,OAAO,CAAA;AAoBd,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAA;AAKhC,OAAO,EAEL,OAAO,EACP,QAAQ,EAKT,MAAM,cAAc,CAAA;AAoBrB;;GAEG;AAEH,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,GAAG,CAAA;IACb,OAAO,EAAE,OAAO,CAAA;IAChB,UAAU,EAAE;QACV,iBAAiB,EAAE,SAAS,CAAA;QAC5B,mBAAmB,CAAC,EAAE,IAAI,CAAA;QAC1B,iBAAiB,CAAC,EAAE,IAAI,CAAA;QACxB,GAAG,CAAC,EAAE,KAAK,CAAA;QACX,GAAG,EAAE,GAAG,CAAA;KACT,CAAA;CACF;AAED;;GAEG;AAEH,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,GAAG,CAAA;IACb,IAAI,EAAE,IAAI,CAAA;IACV,IAAI,EAAE,IAAI,CAAA;IACV,UAAU,EAAE;QACV,iBAAiB,EAAE,IAAI,CAAA;KACxB,CAAA;CACF;AAED;;GAEG;AAEH,oBAAY,aAAa,GAAG;IAC1B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,KAAK,EAAE,CAAA;IACxC,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,GAAG,CAAC,OAAO,CAAA;IAC1D,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,GAAG,CAAC,OAAO,CAAA;IACpD,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,GAAG,CAAC,OAAO,CAAA;IAClE,uBAAuB,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAA;IAC3E,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CACvB,GAAG,KAAK,CAAC,sBAAsB,CAAC,cAAc,CAAC,CAAA;AAEhD;;GAEG;AAEH,eAAO,MAAM,QAAQ,UAAW,aAAa,gBAguC5C,CAAA;AAED;;GAEG;AACH,oBAAY,sBAAsB,GAAG;IACnC,QAAQ,EAAE,GAAG,CAAA;IACb,UAAU,EAAE;QACV,wBAAwB,EAAE,OAAO,CAAA;QACjC,GAAG,CAAC,EAAE,KAAK,CAAA;QACX,eAAe,EAAE,OAAO,CAAA;QACxB,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,CAAA;QACzB,KAAK,EAAE,KAAK,CAAC,aAAa,CAAA;KAC3B,CAAA;CACF,CAAA;AAED;;GAEG;AAEH,eAAO,MAAM,kBAAkB,8BAG5B,sBAAsB,gBAA4C,CAAA;AAErE;;GAEG;AAEH,eAAO,MAAM,eAAe,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,KAAK,EAAa,CAAA;AAyBtE;;GAEG;AAEH,eAAO,MAAM,SAAS,WACZ,WAAW,UACX,WAAW,GAAG,IAAI,sBAG3B,CAAA;AAED;;GAEG;AAEH,eAAO,MAAM,iBAAiB,WACpB,WAAW,UACX,WAAW,GAAG,IAAI,sBAM3B,CAAA;AAED;;GAEG;AAEH,eAAO,MAAM,6BAA6B,WAChC,WAAW,UACX,WAAW,GAAG,IAAI,KACzB,OAMF,CAAA;AAED;;GAEG;AAEH,eAAO,MAAM,cAAc,gHAIO,IAAI,GAAG,OAAO,yBAc/C,CAAA;AAED;;GAEG;AAEH,eAAO,MAAM,iBAAiB,uDAEJ,IAAI,GAAG,OAAO,yBAevC,CAAA"}

package/dist/components/slate.d.ts

@@ -9,6 +9,6 @@ export declare const Slate: (props: {
     editor: ReactEditor;
     value: Descendant[];
     children: React.ReactNode;
-    onChange: (value: Descendant[]) => void;
+    onChange?: ((value: Descendant[]) => void) | undefined;
 }) => JSX.Element;
 //# sourceMappingURL=slate.d.ts.map

package/dist/components/slate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"slate.d.ts","sourceRoot":"","sources":["../packages/slate-react/src/components/slate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAChF,OAAO,EAAyB,UAAU,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAWpD;;;GAGG;AAEH,eAAO,MAAM,KAAK;YACR,WAAW;WACZ,UAAU,EAAE;cACT,KAAK,CAAC,SAAS;sBACP,UAAU,EAAE,KAAK,IAAI;iBA0ExC,CAAA"}
+{"version":3,"file":"slate.d.ts","sourceRoot":"","sources":["../packages/slate-react/src/components/slate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAChF,OAAO,EAAyB,UAAU,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAYpD;;;GAGG;AAEH,eAAO,MAAM,KAAK;YACR,WAAW;WACZ,UAAU,EAAE;cACT,KAAK,CAAC,SAAS;wBACN,UAAU,EAAE,KAAK,IAAI;iBAoFzC,CAAA"}

package/dist/index.es.js

@@ -56,6 +56,7 @@ function _objectWithoutProperties(source, excluded) {
   return target;
 }
 
+var IS_REACT_VERSION_17_OR_ABOVE = parseInt(React.version.split('.')[0], 10) >= 17;
 var IS_IOS = typeof navigator !== 'undefined' && typeof window !== 'undefined' && /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
 var IS_APPLE = typeof navigator !== 'undefined' && /Mac OS X/.test(navigator.userAgent);
 var IS_ANDROID = typeof navigator !== 'undefined' && /Android/.test(navigator.userAgent);
@@ -231,6 +232,7 @@ var IS_READ_ONLY = new WeakMap();
 var IS_FOCUSED = new WeakMap();
 var IS_COMPOSING = new WeakMap();
 var IS_ON_COMPOSITION_END = new WeakMap();
+var EDITOR_TO_USER_SELECTION = new WeakMap();
 /**
  * Weak maps for saving text on composition stage.
  */
@@ -1004,6 +1006,8 @@ var getClipboardData = dataTransfer => {
   return dataTransfer;
 };
 
+var TRIPLE_CLICK = 3;
+
 var _excluded$2 = ["autoFocus", "decorate", "onDOMBeforeInput", "placeholder", "readOnly", "renderElement", "renderLeaf", "renderPlaceholder", "scrollSelectionIntoView", "style", "as"];
 
 function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
@@ -1194,6 +1198,8 @@ var Editable$1 = props => {
 
   var onDOMBeforeInput = useCallback(event => {
     if (!readOnly && hasEditableTarget(editor, event.target) && !isDOMEventHandled(event, propsOnDOMBeforeInput)) {
+      var _EDITOR_TO_USER_SELEC;
+
       // Some IMEs/Chrome extensions like e.g. Grammarly set the selection immediately before
       // triggering a `beforeinput` expecting the change to be applied to the immediately before
       // set selection.
@@ -1265,7 +1271,12 @@ var Editable$1 = props => {
           });
 
           if (!selection || !Range.equals(selection, range)) {
+            var selectionRef = editor.selection && Editor.rangeRef(editor, editor.selection);
             Transforms.select(editor, range);
+
+            if (selectionRef) {
+              EDITOR_TO_USER_SELECTION.set(editor, selectionRef);
+            }
           }
         }
       } // COMPAT: If the selection is expanded, even if the command seems like
@@ -1415,6 +1426,14 @@ var Editable$1 = props => {
 
             break;
           }
+      } // Restore the actual user section if nothing manually set it.
+
+
+      var toRestore = (_EDITOR_TO_USER_SELEC = EDITOR_TO_USER_SELECTION.get(editor)) === null || _EDITOR_TO_USER_SELEC === void 0 ? void 0 : _EDITOR_TO_USER_SELEC.unref();
+      EDITOR_TO_USER_SELECTION.delete(editor);
+
+      if (toRestore && (!editor.selection || !Range.equals(editor.selection, toRestore))) {
+        Transforms.select(editor, toRestore);
       }
     }
   }, [readOnly, propsOnDOMBeforeInput]); // Attach a native DOM event handler for `beforeinput` events, because React's
@@ -1575,30 +1594,46 @@ var Editable$1 = props => {
       IS_FOCUSED.delete(editor);
     }, [readOnly, attributes.onBlur]),
     onClick: useCallback(event => {
-      if (!readOnly && hasTarget(editor, event.target) && !isEventHandled(event, attributes.onClick) && isDOMNode(event.target)) {
+      if (hasTarget(editor, event.target) && !isEventHandled(event, attributes.onClick) && isDOMNode(event.target)) {
         var node = ReactEditor.toSlateNode(editor, event.target);
-        var path = ReactEditor.findPath(editor, node); // At this time, the Slate document may be arbitrarily different,
+        var path = ReactEditor.findPath(editor, node);
+
+        if (event.detail === TRIPLE_CLICK) {
+          var _start = Editor.start(editor, [path[0]]);
+
+          var end = Editor.end(editor, [path[0]]);
+          var range = Editor.range(editor, _start, end);
+          Transforms.select(editor, range);
+          return;
+        }
+
+        if (readOnly) {
+          return;
+        } // At this time, the Slate document may be arbitrarily different,
         // because onClick handlers can change the document before we get here.
         // Therefore we must check that this path actually exists,
         // and that it still refers to the same node.
 
+
         if (Editor.hasPath(editor, path)) {
           var lookupNode = Node.get(editor, path);
 
           if (lookupNode === node) {
-            var _start = Editor.start(editor, path);
+            var _start2 = Editor.start(editor, path);
+
+            var _end = Editor.end(editor, path);
 
-            var end = Editor.end(editor, path);
             var startVoid = Editor.void(editor, {
-              at: _start
+              at: _start2
             });
             var endVoid = Editor.void(editor, {
-              at: end
+              at: _end
             });
 
             if (startVoid && endVoid && Path.equals(startVoid[1], endVoid[1])) {
-              var range = Editor.range(editor, _start);
-              Transforms.select(editor, range);
+              var _range = Editor.range(editor, _start2);
+
+              Transforms.select(editor, _range);
             }
           }
         }
@@ -1801,7 +1836,7 @@ var Editable$1 = props => {
       }
     }, [readOnly, attributes.onFocus]),
     onKeyDown: useCallback(event => {
-      if (!readOnly && !state.isComposing && hasEditableTarget(editor, event.target) && !isEventHandled(event, attributes.onKeyDown)) {
+      if (!readOnly && hasEditableTarget(editor, event.target) && !isEventHandled(event, attributes.onKeyDown) && !state.isComposing) {
         var {
           nativeEvent
         } = event;
@@ -2135,6 +2170,7 @@ var defaultScrollSelectionIntoView = (editor, domRange) => {
  * Check if the target is in the editor.
  */
 
+
 var hasTarget = (editor, target) => {
   return isDOMNode(target) && ReactEditor.hasDOMNode(editor, target);
 };
@@ -4057,7 +4093,10 @@ var Slate = props => {
     onChange: handleSelectorChange
   } = getSelectorContext(editor);
   var onContextChange = useCallback(() => {
-    onChange(editor.children);
+    if (onChange) {
+      onChange(editor.children);
+    }
+
     setContext([editor]);
     handleSelectorChange(editor);
   }, [onChange]);
@@ -4075,17 +4114,24 @@ var Slate = props => {
   useIsomorphicLayoutEffect(() => {
     var fn = () => setIsFocused(ReactEditor.isFocused(editor));
 
-    document.addEventListener('focus', fn, true);
-    return () => document.removeEventListener('focus', fn, true);
-  }, []);
-  useIsomorphicLayoutEffect(() => {
-    var fn = () => setIsFocused(ReactEditor.isFocused(editor));
-
-    document.addEventListener('blur', fn, true);
-    return () => {
-      document.removeEventListener('focus', fn, true);
-      document.removeEventListener('blur', fn, true);
-    };
+    if (IS_REACT_VERSION_17_OR_ABOVE) {
+      // In React >= 17 onFocus and onBlur listen to the focusin and focusout events during the bubbling phase.
+      // Therefore in order for <Editable />'s handlers to run first, which is necessary for ReactEditor.isFocused(editor)
+      // to return the correct value, we have to listen to the focusin and focusout events without useCapture here.
+      document.addEventListener('focusin', fn);
+      document.addEventListener('focusout', fn);
+      return () => {
+        document.removeEventListener('focusin', fn);
+        document.removeEventListener('focusout', fn);
+      };
+    } else {
+      document.addEventListener('focus', fn, true);
+      document.addEventListener('blur', fn, true);
+      return () => {
+        document.removeEventListener('focus', fn, true);
+        document.removeEventListener('blur', fn, true);
+      };
+    }
   }, []);
   return /*#__PURE__*/React.createElement(SlateSelectorContext.Provider, {
     value: selectorContext
@@ -4227,6 +4273,16 @@ var withReact = editor => {
           break;
         }
 
+      case 'set_selection':
+        {
+          var _EDITOR_TO_USER_SELEC;
+
+          // Selection was manually set, don't restore the user selection after the change.
+          (_EDITOR_TO_USER_SELEC = EDITOR_TO_USER_SELECTION.get(editor)) === null || _EDITOR_TO_USER_SELEC === void 0 ? void 0 : _EDITOR_TO_USER_SELEC.unref();
+          EDITOR_TO_USER_SELECTION.delete(editor);
+          break;
+        }
+
       case 'insert_node':
       case 'remove_node':
         {