slate-react 0.82.1 → 0.82.2-2022864247

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

@@ -1 +1 @@
-{"version":3,"file":"element.d.ts","sourceRoot":"","sources":["../packages/slate-react/src/components/element.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAA;AAE/C,OAAO,EAAgB,KAAK,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,OAAO,CAAA;AAcpE,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACvB,MAAM,YAAY,CAAA;AAGnB;;GAEG;AAEH,QAAA,MAAM,OAAO;iBACE,KAAK,EAAE;aACX,YAAY;6BACG,kBAAkB,KAAK,WAAW;+BAC/B,sBAAsB,KAAK,WAAW;0BAC5C,eAAe,KAAK,WAAW;eACzC,KAAK,GAAG,IAAI;iBAsGxB,CAAA;AAED,QAAA,MAAM,eAAe;iBA7GN,KAAK,EAAE;aACX,YAAY;6BACG,kBAAkB,KAAK,WAAW;+BAC/B,sBAAsB,KAAK,WAAW;0BAC5C,eAAe,KAAK,WAAW;eACzC,KAAK,GAAG,IAAI;kBAmHvB,CAAA;AAEF;;GAEG;AAEH,eAAO,MAAM,cAAc,UAAW,kBAAkB,gBASvD,CAAA;AAED,eAAe,eAAe,CAAA"}
+{"version":3,"file":"element.d.ts","sourceRoot":"","sources":["../packages/slate-react/src/components/element.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAE1C,OAAO,EAAgB,KAAK,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,OAAO,CAAA;AAapE,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACvB,MAAM,YAAY,CAAA;AAEnB;;GAEG;AAEH,QAAA,MAAM,OAAO;iBACE,KAAK,EAAE;aACX,YAAY;6BACG,kBAAkB,KAAK,WAAW;+BAC/B,sBAAsB,KAAK,WAAW;0BAC5C,eAAe,KAAK,WAAW;eACzC,KAAK,GAAG,IAAI;iBAuGxB,CAAA;AAED,QAAA,MAAM,eAAe;iBA9GN,KAAK,EAAE;aACX,YAAY;6BACG,kBAAkB,KAAK,WAAW;+BAC/B,sBAAsB,KAAK,WAAW;0BAC5C,eAAe,KAAK,WAAW;eACzC,KAAK,GAAG,IAAI;kBAoHvB,CAAA;AAEF;;GAEG;AAEH,eAAO,MAAM,cAAc,UAAW,kBAAkB,gBASvD,CAAA;AAED,eAAe,eAAe,CAAA"}

package/dist/index.es.js

@@ -1,7 +1,7 @@
 import getDirection from 'direction';
 import debounce from 'lodash/debounce';
 import throttle from 'lodash/throttle';
-import React, { useLayoutEffect, useEffect, useRef, createContext, useContext, Component, useState, useCallback, useReducer, useMemo } from 'react';
+import React, { useLayoutEffect, useEffect, useRef, createContext, useContext, useCallback, Component, useState, useReducer, useMemo } from 'react';
 import scrollIntoView from 'scroll-into-view-if-needed';
 import { Editor, Scrubber, Transforms, Range, Path, Node, Text as Text$1, Element as Element$1, Point } from 'slate';
 import { isKeyHotkey } from 'is-hotkey';
@@ -1360,11 +1360,23 @@ var Element = props => {
     renderLeaf,
     selection
   } = props;
-  var ref = useRef(null);
   var editor = useSlateStatic();
   var readOnly = useReadOnly();
   var isInline = editor.isInline(element);
   var key = ReactEditor.findKey(editor, element);
+  var ref = useCallback(ref => {
+    // Update element-related weak maps with the DOM element ref.
+    var KEY_TO_ELEMENT = EDITOR_TO_KEY_TO_ELEMENT.get(editor);
+
+    if (ref) {
+      KEY_TO_ELEMENT === null || KEY_TO_ELEMENT === void 0 ? void 0 : KEY_TO_ELEMENT.set(key, ref);
+      NODE_TO_ELEMENT.set(element, ref);
+      ELEMENT_TO_NODE.set(ref, element);
+    } else {
+      KEY_TO_ELEMENT === null || KEY_TO_ELEMENT === void 0 ? void 0 : KEY_TO_ELEMENT.delete(key);
+      NODE_TO_ELEMENT.delete(element);
+    }
+  }, [editor, key, element]);
   var children = useChildren({
     decorations,
     node: element,
@@ -1422,21 +1434,8 @@ var Element = props => {
     }));
     NODE_TO_INDEX.set(_text, 0);
     NODE_TO_PARENT.set(_text, element);
-  } // Update element-related weak maps with the DOM element ref.
-
-
-  useIsomorphicLayoutEffect(() => {
-    var KEY_TO_ELEMENT = EDITOR_TO_KEY_TO_ELEMENT.get(editor);
+  }
 
-    if (ref.current) {
-      KEY_TO_ELEMENT === null || KEY_TO_ELEMENT === void 0 ? void 0 : KEY_TO_ELEMENT.set(key, ref.current);
-      NODE_TO_ELEMENT.set(element, ref.current);
-      ELEMENT_TO_NODE.set(ref.current, element);
-    } else {
-      KEY_TO_ELEMENT === null || KEY_TO_ELEMENT === void 0 ? void 0 : KEY_TO_ELEMENT.delete(key);
-      NODE_TO_ELEMENT.delete(element);
-    }
-  });
   return renderElement({
     attributes,
     children,