unofficial solidjs wrapper around the rive-js library
npm install @aerofoil/rive-solid-canvas

This is an unofficial wrapper of the Rive Canvas Runtime for SolidJS. Syntactically it is designed to be similar to the official Rive Runtime for React; that being said it is not a 1 to 1 match. See the comparison section for more details.
1. Getting Started
2. Advanced Usage
3. Documentation
4. Comparison
1. Install the dependency.
``bash`
npm install @aerofoil/rive-solid-canvas
2. Render a Rive component.
Rive-Solid-Canvas provides a basic component just like the official Rive React library. Just like the official library this is designed to be a simple usecase for simple animations.
`tsx
import Rive from "@aerofoil/rive-solid-canvas";
export default function Simple() {
return
}
`
More advanced cases should use createRive to create a custom component. This allows for more control over the animation, canvas, and underlying rive object.
`tsx
import { createRive } from "@aerofoil/rive-solid-canvas";
export default function Advanced() {
const { rive, RiveComponent } = createRive(() => ({
src: "https://cdn.rive.app/animations/vehicles.riv",
autoplay: false,
}));
return (
Just like the official Rive React library, the
createRive function will run once the dom is rendered as the the underlying