Commit e6b18f8
authored
feat: add useRiveList hook (#90)
## Summary
- Adds `useRiveList` hook for managing list properties, aligned with
rive-react API
- Adds `useViewModelInstance` hook that works with `RiveFile`,
`ViewModel`, and `RiveViewRef`
- Adds `required` option to `useViewModelInstance` for Error Boundary
support
- Adds MenuList example demonstrating list manipulation
### useRiveList API
```tsx
const { length, getInstanceAt, addInstance, addInstanceAt, removeInstance, removeInstanceAt, swap, error } = useRiveList('items', viewModelInstance);
```
### useViewModelInstance API
```tsx
// From RiveFile (get default instance) - recommended
const { riveFile } = useRiveFile(require('./animation.riv'));
const instance = useViewModelInstance(riveFile);
<RiveView file={riveFile} dataBind={instance} ... />
// From RiveViewRef (get auto-bound instance)
const { riveViewRef, setHybridRef } = useRive();
const instance = useViewModelInstance(riveViewRef);
// With required: true (throws if null, use with Error Boundary)
const instance = useViewModelInstance(riveFile, { required: true });
// TypeScript knows instance is non-null
```
### Example Pattern
```tsx
function MenuList({ file }: { file: RiveFile }) {
const instance = useViewModelInstance(file, { required: true });
return <MenuListContent file={file} instance={instance} />;
}
```
## Test plan
- [x] MenuListExample uses `useRiveList` and `useViewModelInstance(file,
{ required: true })`1 parent a4a993a commit e6b18f8
9 files changed
Lines changed: 666 additions & 255 deletions
File tree
- example
- assets
- src/pages
- src
- hooks
Binary file not shown.
Binary file not shown.
This file was deleted.
0 commit comments