Skip to content

feat: add useRiveList hook#90

Merged
mfazekas merged 13 commits into
mainfrom
mfazekas/use-rive-list
Dec 17, 2025
Merged

feat: add useRiveList hook#90
mfazekas merged 13 commits into
mainfrom
mfazekas/use-rive-list

Conversation

@mfazekas
Copy link
Copy Markdown
Collaborator

@mfazekas mfazekas commented Dec 16, 2025

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

const { length, getInstanceAt, addInstance, addInstanceAt, removeInstance, removeInstanceAt, swap, error } = useRiveList('items', viewModelInstance);

useViewModelInstance API

// 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

function MenuList({ file }: { file: RiveFile }) {
  const instance = useViewModelInstance(file, { required: true });
  return <MenuListContent file={file} instance={instance} />;
}

Test plan

  • MenuListExample uses useRiveList and useViewModelInstance(file, { required: true })

@mfazekas mfazekas force-pushed the mfazekas/use-rive-list branch 2 times, most recently from 91988ee to e129473 Compare December 16, 2025 14:22
@mfazekas mfazekas force-pushed the mfazekas/use-rive-list branch from e129473 to 2006ca5 Compare December 16, 2025 14:49
@mfazekas mfazekas force-pushed the mfazekas/use-rive-list branch from 71fd8de to d18b42a Compare December 16, 2025 15:07
@mfazekas mfazekas requested a review from HayesGordon December 16, 2025 15:11
HayesGordon
HayesGordon previously approved these changes Dec 16, 2025
Copy link
Copy Markdown
Contributor

@HayesGordon HayesGordon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

Sync computation with useMemo so required throws immediately if instance unavailable.
Copy link
Copy Markdown
Contributor

@HayesGordon HayesGordon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

@mfazekas mfazekas merged commit e6b18f8 into main Dec 17, 2025
7 checks passed
@mfazekas mfazekas deleted the mfazekas/use-rive-list branch December 17, 2025 13:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants