Fixes #19

src/editable-text.tsx

@@ -3,10 +3,16 @@ import { Group, Text } from 'react-konva';
 
 import { TextEditor } from './text-editor';
 import Konva from 'konva';
+import { TextConfig } from 'konva/lib/shapes/Text';
 
-export const EditorSt = React.forwardRef(({ text, onChange, ...props }) => {
+interface EditorStProps extends TextConfig {
+  onChange: () => void;
+}
+
+export const EditorSt = React.forwardRef((props: EditorStProps) => {
+  const { text, onChange, ...rest } = props
   const [editorEnabled, setEditorEnabled] = React.useState(false);
-  const textRef = React.useRef<Konva.Text>();
+  const textRef = React.useRef<Konva.Text>(null);
 
   return (
     <Group draggable>
@@ -18,7 +24,7 @@ export const EditorSt = React.forwardRef(({ text, onChange, ...props }) => {
           setEditorEnabled(true);
         }}
         visible={!editorEnabled}
-        {...props}
+        {...rest}
       />
       {editorEnabled && (
         <Group>

src/html.tsx

@@ -99,7 +99,7 @@ export const Html = ({
     root.render(children);
   });
 
-  React.useEffect(() => {
+  React.useLayoutEffect(() => {
     return () => {
       root.unmount();
     };

src/portal.tsx

@@ -24,10 +24,19 @@ export const Portal = ({ selector, enabled, children }) => {
     } else {
       inner.current.moveTo(outer.current);
     }
+
     // manually redraw layers
-    outer.current.getLayer().batchDraw();
+    const outerLayer = outer.current.getLayer();
+
+    if (!outerLayer) return;
+
+    outerLayer.batchDraw();
     if (newContainer) {
-      newContainer.getLayer().batchDraw();
+      const newContainerLayer = newContainer.getLayer()
+
+      if (!newContainerLayer) return
+
+      newContainerLayer.batchDraw();
     }
   }, [selector, shouldMove]);
 

src/text-editor.tsx

@@ -6,7 +6,6 @@ export const TextEditor = ({
   value,
   onBlur,
   onChange,
-  cursorPosition,
 }) => {
   const [style, setStyle] = React.useState<React.CSSProperties>();
   React.useLayoutEffect(() => {