Platforms
Vanilla mount
Draw into any canvas with one function call, without a framework.
mount(canvas, options) draws a visual into a canvas you own and returns a handle: update() to change any option, pause() / resume(), and destroy() to stop. It's the layer the React component and the custom element are built on.
import { mount } from "@sinua/web";
import voiceOrb from "../spec/voice-orb.fxspec.json";
// Any <canvas>: mount() sizes it to its CSS box and runs the render loop.
const canvas = document.querySelector<HTMLCanvasElement>("#orb")!;
const fx = mount(canvas, { spec: voiceOrb, state: "idle" });
// Change it later: only what you pass changes.
fx.update({ state: "listening", inputs: { micMuted: 0 } });
// Stop the loop and release the canvas when the view goes away.
fx.destroy();
Typed components take the same props on every platform: pattern (or spec), values, style, state, voice, theme, paused, reducedMotion, maxFps, lowPower and an accessibility label. The catalog lists every prop per pattern.