/baklavajs

Graph / node editor in the browser using VueJS

Primary LanguageTypeScriptMIT LicenseMIT

BaklavaJS

Build Status npm

V2 is now in beta! Check it out

Graph / node editor in the browser using VueJS, less than 60kb gzipped

Online Demo

example

Package Version
baklavajs npm
@baklavajs/core npm (scoped)
@baklavajs/plugin-engine npm (scoped)
@baklavajs/plugin-interface-types npm (scoped)
@baklavajs/plugin-options-vue npm (scoped)
@baklavajs/plugin-renderer-vue npm (scoped)

Introduction

BaklavaJS is a graph/node editor for the web. It provides an easy-to-use editor together with the ability to create custom nodes. Aditionally, it puts a strong emphasis on extensibility, which lead to an versatile plugin system. To guarantee type safety, the entirety of the BaklavaJS ecosystem is written in TypeScript.

The core functionality is shipped in the @baklavajs/core package. Any other functionality can be added a-la-carte by installing the desired plugins:

  • Engine: Provides functions to run calculations with the graph.
  • Interface Types: Adds types to node interfaces and allowing connections only between types that you want to. It can also automatically convert values from one type to another.
  • Vue Renderer: Displays the editor in the browser using VueJS
  • Vue Options: Adds predefined node options in Baklava style

There is also the baklavajs package, which contains the core package as well as all plugins.

Getting Started & Documentation

You can find the documentation here: https://newcat.github.io/baklavajs

Vue 3

BaklavaJS also supports Vue 3. Have a look at this issue for more information.

Sponsors

Top Sponsors

ThePixelDeveloper · Reece Dunham · Adrian Rudnik

Continuous Sponsors

Chris Bolton · LittleMouseGames · Andrei Bosco B. Torres · Tiger Tang