storm-react-diagrams

WebJar for storm-react-diagrams

License	MIT
Categories	React User Interface Web Frameworks ORM Data
GroupId	org.webjars.npm
ArtifactId	storm-react-diagrams
Last Version	3.2.0
Release Date	Dec 11, 2017
Type	jar
Description	storm-react-diagrams WebJar for storm-react-diagrams
Project URL	http://webjars.org
Source Code Management	https://github.com/projectstorm/react-diagrams

Download storm-react-diagrams

Filename	Size
storm-react-diagrams-3.2.0.pom
storm-react-diagrams-3.2.0.jar	126 KB
storm-react-diagrams-3.2.0-sources.jar	22 bytes
storm-react-diagrams-3.2.0-javadoc.jar	22 bytes

How to add to project

Apache Maven

<!-- https://jarcasting.com/artifacts/org.webjars.npm/storm-react-diagrams/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>storm-react-diagrams</artifactId>
    <version>3.2.0</version>
</dependency>

Gradle Groovy

// https://jarcasting.com/artifacts/org.webjars.npm/storm-react-diagrams/
implementation 'org.webjars.npm:storm-react-diagrams:3.2.0'

Gradle Kotlin

// https://jarcasting.com/artifacts/org.webjars.npm/storm-react-diagrams/
implementation ("org.webjars.npm:storm-react-diagrams:3.2.0")

Apache Buildr

'org.webjars.npm:storm-react-diagrams:jar:3.2.0'

Apache Ivy

<dependency org="org.webjars.npm" name="storm-react-diagrams" rev="3.2.0">
  <artifact name="storm-react-diagrams" type="jar" />
</dependency>

Groovy Grape

@Grapes(
@Grab(group='org.webjars.npm', module='storm-react-diagrams', version='3.2.0')
)

Scala SBT

libraryDependencies += "org.webjars.npm" % "storm-react-diagrams" % "3.2.0"

Leiningen

[org.webjars.npm/storm-react-diagrams "3.2.0"]

Dependencies

compile (3)

Group / Artifact	Type	Version
org.webjars.npm : closest	jar	[0.0.1,0.0.2)
org.webjars.npm : lodash	jar	[4.17.4,5)
org.webjars.npm : react	jar	[16.1.1,17)

Project Modules

There are no modules declared in this project.

Introduction

pssst! Looking for the old version 5?

DEMO: http://projectstorm.cloud/react-diagrams

DOCS (wip) https://projectstorm.gitbook.io/react-diagrams

Docs are currently being worked on, along with a migration path.

What

A flow & process orientated diagramming library inspired by Blender, Labview and Unreal engine.

• Modern Codebase written entirely in Typescript and React, the library makes use of powerful generics, advanced software engineering principles and is broken up into multiple modules.
• Hackable and extensible the entire library including its core can be extended, rewired and re-assembled into fundamentally different software to suit your own software needs.
• HTML nodes as a first class citizen the library was originally written to represent advanced dynamic nodes, that are difficult to represent as SVG's due to complex input requirements ux requirements.
• Designed for process the library is aimed for software engineers that want to rewire their programs at runtime, and that want to make their software more dynamic.
• Fast diagram editing the defaults provided give the highest priority to editing diagrams as fast as possible.

Gallery

Example implementation using custom models: (Dylan's personal code)

Get started with the default models right out of the box:

Installing

For all the bells and whistles:

yarn add @projectstorm/react-diagrams

This includes all the packages listed below (and works (mostly and conceptually) like it used to in version 5.0)

A more modular approach

This library now has a more modular design and you can import just the core (contains no default factories or routing)

yarn add @projectstorm/react-diagrams-core

this is built ontop of the evolving react-canvas-core library

yarn add @projectstorm/react-canvas-core

which makes use of

yarn add @projectstorm/geometry

and of course, you can add some extras:

yarn add @projectstorm/react-diagrams-defaults
yarn add @projectstorm/react-diagrams-routing

How to use

Before running any of the examples, please run yarn build in the root. This project is a monorepo, and the packages (including the demos) require the packages to first be built.

Take a look at the diagram demos

or

Take a look at the demo project which contains an example for ES6 as well as Typescript

or

Checkout the docs

Run the demos

After running yarn install you must then run: cd packages/diagrams-demo-gallery && yarn run start

Building from source

Simply run yarn then yarn build or yarn build:prod in the root directory and it will spit out the transpiled code and typescript definitions into the dist directory as a single file.

Built with react-diagrams

Do you have an interesting project built with react-diagrams? PR it into this section for others to see.

Storm

Versions

Version
3.2.0 Dec 11, 2017