React-diagrams: Question: Can I use this library to work with ReactJS+JSX based project?

[ganesh-sankey]

Thank you for this amazing library.

Can I use this library to implement graph based flow system with ReactJS+JSX. since these library is based on ReactJS+TSX. I want to know whether it will be compatible with above environment setup. I should be able to create/perform/customize all the functionalities provided by this library in ReactJS+JSX. It means can I create customized Link, Node, Anchor and also all the similar functionalities provided in demo project-storybook (simple flow, zoom to fit, smart routing) ? I did try to render simple node using library with ReacJS+JSX. It worked well but I am worried about all customization part. whether It is possible with ReactJS+JSX. or should I create project in React+TSX enviroment. I am kind of new to ReactJS ecosystem.

[silvacpp]

+1

[JokerNN]

Well answer is yes indeed. Just import library classes, like in demos.

[dylanvorster]

Answer is indeed yes. The typescript gets compiled down to ECMA 2015 but you can also choose a different level of ECMAScript through other outlets such as cloning this repo, referencing the typescript src and many others. I would however, strongly encourage you to write your new projects in typescript, once you get a taste of its awesomeness, you will never go back :P

[bknill]

I'm trying to import this into an existing ReactJS project. The existing version I have runs fine using DefaultNodes, but when I try to create my own custom nodes using the Diamond Node example I run into all kinds of problems, i.e.

__WEBPACK_IMPORTED_MODULE_3__DiamondNodeFactory_tsx__.DiamondNodeFactory is not a constructor

When I

 import {DiamondNodeFactory} from './DiamondNodeFactory.tsx'
...........
    this.diagramEngine.registerNodeFactory(new DiamondNodeFactory())

I'm assuming it's running into problems mixing Typescript with Javascript.. have you any ideas why it won't compile?