WeaveProvider | Weave.js

Overview

The WeaveProvider is a core component from the React Helper library that initializes and provides Weave.js context to your React application. It sets up the needed elements for real-time collaboration and canvas rendering:

Store
Nodes
Plugins
Actions
Fonts

By wrapping your app (or part of it) with WeaveProvider, you can make use of the useWeave hook to access the API of the Weave instance.

Nodes, Actions and Plugins by default?

By default this helper doesn’t include any nodes, actions or plugins. You must add your own.

Import

import { WeaveProvider } from "@inditextech/weave-react";

types

export type WeavePerformanceConfig = {
  upscale?: Partial<WeaveUpscaleConfig>;
};

export type WeaveUpscaleConfig = {
  enabled?: boolean;
  multiplier?: number;
  baseWidth?: number;
  baseHeight?: number;
};

Props

Property Type Required Default Description

Property	Type	Required	Default	Description
`getContainer`	`() ⇒ HTMLDivElement`	Required		A function that returns an HTMLDivElement where Weave.js will setup
`store`	`WeaveStore`	Required		Weave.js Store to use to handle the real-time communication
`renderer`	`WeaveRenderer`	Required		Weave.js Renderer to use to handle the real-time reconciliation of the shared state
`children`	`ReactNode`	Required		Child nodes to render
`nodes`	`WeaveNode[]`		`[]`	Array of nodes to register and use by the instance
`plugins`	`WeavePlugin[]`		`[]`	Array of plugins to register and use by the instance
`actions`	`WeaveAction[]`		`[]`	Array of actions to register and use by the instance
`customPlugins`	`WeavePlugin[]`		`[]`	Array of custom plugins to register and use by the instance
`fonts`	`WeaveFont[]`		`[]`	Array that define the fonts to use on the canvas
`logLevel`	`WeaveLogLevel`		`info`	Global log level of Weave.js instance
`logModules`	`WeaveChildLoggerLevel[]`		`[]`	Define a custom log level Weave.js internal modules, nodes, actions and plugins. When defining a custom level, the format is 'moduleName:level'
`performance`	`WeavePerformanceConfig`			Options to fine-tune performance of Weave.js instance

getContainer

() ⇒ HTMLDivElement

Required

A function that returns an HTMLDivElement where Weave.js will setup

store

WeaveStore

Required

Weave.js Store to use to handle the real-time communication

renderer

WeaveRenderer

Required

Weave.js Renderer to use to handle the real-time reconciliation of the shared state

children

ReactNode

Required

Child nodes to render

nodes

WeaveNode[]

[]

Array of nodes to register and use by the instance

plugins

WeavePlugin[]

[]

Array of plugins to register and use by the instance

actions

WeaveAction[]

[]

Array of actions to register and use by the instance

customPlugins

WeavePlugin[]

[]

Array of custom plugins to register and use by the instance

fonts

WeaveFont[]

[]

Array that define the fonts to use on the canvas

logLevel

WeaveLogLevel

info

Global log level of Weave.js instance

logModules

WeaveChildLoggerLevel[]

[]

Define a custom log level Weave.js internal modules, nodes, actions and plugins. When defining a custom level, the format is 'moduleName:level'

performance

WeavePerformanceConfig

Options to fine-tune performance of Weave.js instance