npm install --save @use-gpu/react
yarn add @use-gpu/react
Docs: https://usegpu.live/docs/reference-components-@use-gpu-react
<HTML> (Live → React)Embed React content inside Live, to render HTML. Portal from Live to React.
container: string | HTMLElement - Containing element (or CSS selector) to render into.children: React.ReactNode - React children to renderimport { HTML } from '@use-gpu/react';
// In Live component:
<HTML container={container}>
{children}
</HTML>
<LiveCanvas> (React → Live)Embed Live <canvas> inside React. Portal from React to Live.
children: (canvas: HTMLCanvasElement) => LiveElement - Live children to renderimport { LiveCanvas } from '@use-gpu/react';
import { WebGPU, AutoCanvas } from '@use-gpu/webgpu';
// In React component:
<LiveCanvas>{
(canvas) =>
// Render Live components here, e.g.
<WebGPU>
<AutoCanvas canvas={canvas} />
</WebGPU>
}</LiveCanvas>
<Live> (React → Live)Run bare Live fiber inside React. Portal from React to Live.
children: LiveElement - Live root to renderimport { Live } from '@use-gpu/react';
const Raw = () => {
// ...
};
// In React component:
<Live>
<Raw />
</Live>
Made by Steven Wittens. Part of @use-gpu.