MrBlenny / react-flow-chart

🌊 A flexible, stateless, declarative flow chart library for react.
https://mrblenny.github.io/react-flow-chart/index.html
MIT License
1.48k stars 306 forks source link

Node and port types #165

Closed LucianoGanga closed 4 years ago

LucianoGanga commented 4 years ago

Hello!

I was wondering if there's a list of all the node types and port types.

For the nodes, I found on the examples some values such as: input-output output-only

I'm not sure they change the behavior at all, and I imagine they're just free fields for me to use as I want (I've checked the code and I couldn't find anything related to that), but I'd like to confirm.

On the other hand, in the ports, I've found that the type (left, right, top, bottom) do change the behavior and act more as a setting.

Does someone have an idea of that?

Thank you! Lucho

kcvin94 commented 4 years ago

I'm using this api with external state, and in my experience the node type does nothing. The port type does indeed affect its position on the node. Since the types are not typed in the types folder, you can figure it out from the source code: https://github.com/MrBlenny/react-flow-chart/blob/master/src/components/Ports/Ports.default.tsx So port types are left, right, top, and bottom. Should probably avoid 'input' and 'output' as it is considered the same as 'top' and 'bottom', respectively, but is not as intuitive, especially in my case where my chart is more horizontal rather than vertical.

LucianoGanga commented 4 years ago

Thank you @kcvin94 !

I ended up forking the repo and making a lot of changes to clarify that on the types file, and to make a solution more understandable for me. Also, I had to do that because I was having problems with the versions of styledComponents.

I will close this issue as it is not useful anymore.

Cheers! Lucho