React package
Hooks
useWorkflow for headless embeds, useWorkflowNode for R3F, and the error codes.
useWorkflow
The headless version of <Workflow> — same options, but you own the DOM:
import { useWorkflow } from "@fluorite/react";
const { state, error, backend, animated, containerRef, canvasRef, refresh } =
useWorkflow(id);
// attach containerRef to a positioned wrapper and canvasRef to a <canvas>It accepts the same options as <Workflow> (play, dpr, maxFps,
forceWebGL, revalidate, revalidateOnFocus, client, callbacks) and
returns:
| Field | Type | Notes |
|---|---|---|
state | WorkflowState | See the state machine below |
error | WorkflowError | null | Set when state is "error" |
backend | "webgpu" | "webgl" | null | The active render backend |
animated | boolean | Whether the graph is time-varying |
containerRef | (el: HTMLElement | null) | Attach to the wrapper element |
canvasRef | (el: HTMLCanvasElement | null) | Attach to a <canvas> |
refresh | () => void | Revalidate the workflow now |
States: idle → fetching → compiling → ready, plus paused (play mode says
not now) and error.
useWorkflowNode
R3F interop — see the guide. Fetches and evaluates the workflow, returning the TSL node instead of rendering it:
const { node, state, error, animated } = useWorkflowNode(id, { client });Error codes
All failures surface as a WorkflowError with a stable code and a
retryable flag. Switch on code, never on the message.
| Code | Meaning |
|---|---|
NOT_FOUND | No workflow with that id |
NETWORK | The fetch failed |
INVALID_GRAPH | The graph could not be evaluated |
UNSUPPORTED_SCHEMA | The payload's schemaVersion is newer than the client |
UNSUPPORTED_DEVICE | Neither WebGPU nor WebGL2 is available |
CONTEXT_LOST | The GPU context was lost |
ASSET_FAILED | A texture asset failed to load |
UNKNOWN | Anything else |