APERVEIL / DOCS / REACT
Props — React
Every editor control is a typed React prop, and changing one updates the running shader. Plus the props every component shares.
03
Props
Every control in the editor is a typed prop; your editor reads their types and descriptions. Leave one out and the shader keeps its own value; change one and the running shader updates without restarting. Each shader's page lists all of its props with ranges and defaults.
Every component also takes className, style, paused, fallback, onReady, onError:
| Prop | Type | What it does |
|---|---|---|
| className | string | Size and place the surface. The canvas fills this box, so give it a width and a height. |
| style | CSSProperties | Inline styles for the surface box. |
| paused | boolean | Holds the current frame. Use it for a pause control or for sections scrolled out of view. |
| fallback | ReactNode | Shown instead of the canvas without WebGPU. Also shown if rendering fails. A poster image or a CSS gradient works well. |
| onReady | () => void | The first frame has been drawn. |
| onError | (error: unknown) => void | Rendering failed; the fallback is shown. |
Color Looks, browser support, performance and access are the same on every platform: see the overview.