Skip to content

Commit e6b18f8

Browse files
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/lists_demo.rev

339 KB
Binary file not shown.

example/assets/lists_demo.riv

324 KB
Binary file not shown.

example/src/pages/DataBindingListExample.tsx

Lines changed: 0 additions & 254 deletions
This file was deleted.

0 commit comments

Comments
 (0)