Merge pull request ueberdosis#1452 from YousefED/patch-2

use forwardRef for react wrappers
trybaseplate · Jun 14, 2021 · 50ffb43 · 50ffb43
2 parents d93695a + 8b1c610
commit 50ffb43
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 28 deletions.
diff --git a/src/NodeViewContent.tsx b/src/NodeViewContent.tsx
@@ -5,17 +5,20 @@ export interface NodeViewContentProps {
   as?: React.ElementType,
 }
 
-export const NodeViewContent: React.FC<NodeViewContentProps> = props => {
-  const Tag = props.as || 'div'
+export const NodeViewContent: React.FC<NodeViewContentProps> =
+  React.forwardRef((props, ref) => {
+    const Tag = props.as || 'div'
 
-  return (
-    <Tag
-      {...props}
-      data-node-view-content=""
-      style={{
-        ...props.style,
-        whiteSpace: 'pre-wrap',
-      }}
-    />
-  )
-}
+    return (
+      <Tag
+        {...props}
+        ref={ref}
+        data-node-view-content=""
+        style={{
+          ...props.style,
+          whiteSpace: 'pre-wrap',
+        }}
+      />
+    )
+  })
+
diff --git a/src/NodeViewWrapper.tsx b/src/NodeViewWrapper.tsx
@@ -6,19 +6,21 @@ export interface NodeViewWrapperProps {
   as?: React.ElementType,
 }
 
-export const NodeViewWrapper: React.FC<NodeViewWrapperProps> = props => {
-  const { onDragStart } = useReactNodeView()
-  const Tag = props.as || 'div'
+export const NodeViewWrapper: React.FC<NodeViewWrapperProps> =
+  React.forwardRef((props, ref) => {
+    const { onDragStart } = useReactNodeView()
+    const Tag = props.as || 'div'
 
-  return (
-    <Tag
-      {...props}
-      data-node-view-wrapper=""
-      onDragStart={onDragStart}
-      style={{
-        ...props.style,
-        whiteSpace: 'normal',
-      }}
-    />
-  )
-}
+    return (
+      <Tag
+        {...props}
+        ref={ref}
+        data-node-view-wrapper=""
+        onDragStart={onDragStart}
+        style={{
+          ...props.style,
+          whiteSpace: 'normal',
+        }}
+      />
+    )
+  })