Presets

A preset is a set of pre-built functionality that typically forms the foundation of an editor but can be replaced with another preset from the same category or a custom one.

Data structures

For example, there is a classic editor preset that provides classes such as Node, Connection, Input, Output, and Socket.

import { ClassicPreset } from 'rete';

const { Node, Connection, Socket, Input, Output, Control } = ClassicPreset

Rendering

In addition, each render plugin has preset for displaying classic nodes based on the data structures mentioned above.

import { ReactPlugin, Presets as ReactPresets } from 'rete-react-plugin'

const reactPlugin = new ReactPlugin<Schemes, AreaExtra>({ createRoot })

reactPlugin.addPreset(ReactPresets.classic.setup())
reactPlugin.addPreset(ReactPresets.contextMenu.setup())

Interaction

rete-connection-plugin comes with presets, one of which replicates the connection interaction functionality from framework v1. Additionally, an alternative preset with a simpler way to interact with connections has been included.

import { ConnectionPlugin, Presets as ConnectionPresets } from 'rete-connection-plugin'

const connection = new ConnectionPlugin<Schemes, AreaExtra>()

connection.addPreset(ConnectionPresets.classic.setup())

Conclusion

In essence, the presets can be used in any scenario that involves the need to implement a particular functionality through the use of one or more alternative approaches.