A color wheel selector for use with our data flow system

Color Picker

GitHub

Svelvet

Build and interact with node-based user interfaces using Svelte

Introduction

New features, bug fixes, and improvements organized by release

Changelog

Priorities and future ideas for iteration

Roadmap

Work in progress enumeration of changes to Svelvet 7 from previous versions

Upgrading

Add Svelvet to a Svelte project in seconds.

Installation

Recommended patterns for styling Graphs, Nodes, Edges and Anchors

Styling

Primary canvas component configurable via props. Enables zoom, pan and translation of the canvas.

Primary canvas element. Configurable via props or by passing a custom node as children

Node

Point of connection from an Edge to a Node

Anchor

Optional component for customizing Edges and Edge labels

Edge

Optional component offering drag and drop functionality of Default Nodes and Custom Nodes which are configurable via props

Drawer

A Group of Nodes represented by a bounding box

Group

Resizer

Plugin component that displays a map of all nodes on the canvas

Minimap

Optional component offering zoom, fit-in-view, lock and unhide functionality. Configurable via props or by passing your own custom buttons as children

Controls

Optional component for configuring the background beyond the default themes

Background

Optional component offering ability to dynamically toggle between themes

Theme Toggle

Overview

A flexible slider component for use with our data flow system

Slider

A flexible knob component for use with our data flow system

Knob

A flexible radio group selector for use with our data flow system

Overview

Getting Started

Styling

Components

Data Flow

Examples

Color Picker

Description

Props

Overview

Getting Started

Styling

Components

Data Flow

Examples

​Description

​Props

Description

Props