README.md

Example 1

const Canvas = () => <>
    <Rectangle x="100" y="100" width="100" height="100" color="red" />
    <Rectangle x="225" y="125" width="50" height="50" color="red" />
</>;

Example 2

class Canvas extends React.Component {
    constructor(...args) {
        super(...args);
        this.state = { x: 100, t: Date.now() };
        this.animate();
    }

    animate() {
        requestAnimationFrame(() => {
            const d = Math.PI * (Date.now() - this.state.t) / 1000;
            const x = 200 + 100 * Math.sin(d);
            this.setState({ x });
            this.animate();
        });
    }

    render() {
        const x = this.state.x;
        return <Rectangle x={x} y={100} width={100} height={100} color="red" />;
    }
}