_rete.createEditor is not a function, where is the problem in my code?

Question

I try to implement rete.js visual programming framework in my codesandbox and used the following code in my canvas.js file:

import "../../styles.css";
import { createEditor } from "../../rete";

function Canvas() {
  return (
    <div className="App">
      <div
        style={{ width: "100vw", height: "100vh" }}
        ref={ref => ref && createEditor(ref)}/>
    </div>
  );
}

export default Canvas;

The browser displays the following error message:

rete.createEditor is not a function
ref
/src/components/layout/Canvas.js:10:40

   7 |     <div className="App">
   8 |       <div
   9 |         style={{ width: "100vw", height: "100vh" }}
> 10 |         ref={ref => ref && createEditor(ref)}/>
     |                                        ^
  11 |     </div>
  12 |   );
  13 | }

Can you identify my mistake here?

Answer 1

Go a check react documentation about Ref in functional components https://reactjs.org/docs/refs-and-the-dom.html#refs-and-function-components