diff --git a/examples/basic-with-hook/package.json b/examples/basic-with-hook/package.json index e8e3c53..91b1ce1 100644 --- a/examples/basic-with-hook/package.json +++ b/examples/basic-with-hook/package.json @@ -6,10 +6,10 @@ "@testing-library/jest-dom": "^5.13.0", "@testing-library/react": "^11.2.7", "@testing-library/user-event": "^12.8.3", - "react": "^17.0.2", + "react": "file:../../node_modules/react", "react-dom": "^17.0.2", "react-scripts": "4.0.3", - "rive-react": "latest", + "rive-react": "file:../..", "web-vitals": "^1.1.2" }, "scripts": { diff --git a/examples/basic-with-hook/public/magic-ball.riv b/examples/basic-with-hook/public/magic-ball.riv new file mode 100644 index 0000000..f4cce41 Binary files /dev/null and b/examples/basic-with-hook/public/magic-ball.riv differ diff --git a/examples/basic-with-hook/src/App.js b/examples/basic-with-hook/src/App.js index 970a370..8ab6816 100644 --- a/examples/basic-with-hook/src/App.js +++ b/examples/basic-with-hook/src/App.js @@ -6,13 +6,23 @@ function App() { autoplay: true, }; - const { RiveComponent } = useRive(params); + const { RiveComponent: RiveComponentBasic } = useRive(params); + + const { RiveComponent: RiveComponentTouch } = useRive({ + src: 'magic-ball.riv', + autoplay: true, + stateMachines: "Main State Machine", + }); return ( - // The animation will fit to the parent element. -
- -
+ <> +
+ +
+
+ +
+ ); } diff --git a/package.json b/package.json index 99083d4..cfdc1ba 100644 --- a/package.json +++ b/package.json @@ -27,8 +27,8 @@ }, "homepage": "https://github.com/rive-app/rive-react#readme", "dependencies": { - "@rive-app/canvas": "1.0.59", - "@rive-app/webgl": "1.0.56" + "@rive-app/canvas": "1.0.60", + "@rive-app/webgl": "1.0.57" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0"