mirror of
https://github.com/rive-app/rive-react.git
synced 2026-03-13 08:22:30 +08:00
Compare commits
18 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
a984e007f4 | ||
|
|
04d8e01f87 | ||
|
|
44e46c5dee | ||
|
|
323e92e636 | ||
|
|
a07fa02ed6 | ||
|
|
d710e1e4b2 | ||
|
|
d35e9b2805 | ||
|
|
cf44463805 | ||
|
|
f59f44692a | ||
|
|
6ba68fab9e | ||
|
|
982addf163 | ||
|
|
dfd89c7691 | ||
|
|
0247a46c47 | ||
|
|
44626c7450 | ||
|
|
c0eb7d689d | ||
|
|
ff7a6aa676 | ||
|
|
dc89439d84 | ||
|
|
7ebc10a4da |
63
CHANGELOG.md
63
CHANGELOG.md
@@ -4,8 +4,71 @@ All notable changes to this project will be documented in this file. Dates are d
|
||||
|
||||
Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
|
||||
|
||||
#### [v4.3.4](https://github.com/rive-app/rive-react/compare/v4.3.3...v4.3.4)
|
||||
|
||||
- patch: bump rive-wasm to 2.4.4 [`04d8e01`](https://github.com/rive-app/rive-react/commit/04d8e01f87f20dc084b3de88c1e66d32cdbadeed)
|
||||
|
||||
#### [v4.3.3](https://github.com/rive-app/rive-react/compare/v4.3.2...v4.3.3)
|
||||
|
||||
> 20 September 2023
|
||||
|
||||
- chore: release 4.3.3 [`44e46c5`](https://github.com/rive-app/rive-react/commit/44e46c5dee31df2f0035f00a58955d3b3a83e223)
|
||||
- chore: bump wasm to 2.4.3 for url sanitization [`323e92e`](https://github.com/rive-app/rive-react/commit/323e92e6361aa68b9a749e8466679760cc4a41a1)
|
||||
|
||||
#### [v4.3.2](https://github.com/rive-app/rive-react/compare/v4.3.1...v4.3.2)
|
||||
|
||||
> 19 September 2023
|
||||
|
||||
- chore: release 4.3.2 [`a07fa02`](https://github.com/rive-app/rive-react/commit/a07fa02ed6cebe2661ccee8bd37fdcef18acc981)
|
||||
- chore: bump rive-wasm to 2.4.2 [`d710e1e`](https://github.com/rive-app/rive-react/commit/d710e1e4b24ad2eda66277eb748bdac7e9e48302)
|
||||
|
||||
#### [v4.3.1](https://github.com/rive-app/rive-react/compare/v4.3.0...v4.3.1)
|
||||
|
||||
> 18 September 2023
|
||||
|
||||
- chore: release 4.3.1 [`d35e9b2`](https://github.com/rive-app/rive-react/commit/d35e9b28051ad28528142dbde1f4c5bd7a9814ab)
|
||||
- chore: bump rive-wasm to 2.4.1 for event updates [`cf44463`](https://github.com/rive-app/rive-react/commit/cf44463805e8117ee6f1ac5025b973f35f307b1c)
|
||||
|
||||
#### [v4.3.0](https://github.com/rive-app/rive-react/compare/v4.2.1...v4.3.0)
|
||||
|
||||
> 13 September 2023
|
||||
|
||||
- feature: Bump WASM dependency to support Rive Events [`6ba68fa`](https://github.com/rive-app/rive-react/commit/6ba68fab9e5482a3ab2a92410ebb1b422db9ff9e)
|
||||
- chore: release 4.3.0 [`f59f446`](https://github.com/rive-app/rive-react/commit/f59f44692a9ca62c9c3f98447087647b125ada5d)
|
||||
|
||||
#### [v4.2.1](https://github.com/rive-app/rive-react/compare/v4.2.0...v4.2.1)
|
||||
|
||||
> 7 September 2023
|
||||
|
||||
- chore: release 4.2.1 [`982addf`](https://github.com/rive-app/rive-react/commit/982addf163ad73a8b077c7a1a27d50bdae402260)
|
||||
- chore: bump rive-wasm to 2.3.1 for mesh fix [`dfd89c7`](https://github.com/rive-app/rive-react/commit/dfd89c769193541192718a68a8035e05caa57f07)
|
||||
|
||||
#### [v4.2.0](https://github.com/rive-app/rive-react/compare/v4.1.6...v4.2.0)
|
||||
|
||||
> 1 September 2023
|
||||
|
||||
- chore: release 4.2.0 [`0247a46`](https://github.com/rive-app/rive-react/commit/0247a46c478f53499826fa40b6e03e25e833d969)
|
||||
- Updating rive wasm [`44626c7`](https://github.com/rive-app/rive-react/commit/44626c7450999abe095609b06aeafe240da8ddd5)
|
||||
|
||||
#### [v4.1.6](https://github.com/rive-app/rive-react/compare/v4.1.5...v4.1.6)
|
||||
|
||||
> 26 August 2023
|
||||
|
||||
- chore: release 4.1.6 [`c0eb7d6`](https://github.com/rive-app/rive-react/commit/c0eb7d689dd96e41c19e3f647f30f8f324cf54a8)
|
||||
- chore: bump rive-wasm for follow up solo fix [`ff7a6aa`](https://github.com/rive-app/rive-react/commit/ff7a6aa6761d95ca5ea41f2d34e82a63b5e0ffee)
|
||||
|
||||
#### [v4.1.5](https://github.com/rive-app/rive-react/compare/v4.1.4...v4.1.5)
|
||||
|
||||
> 25 August 2023
|
||||
|
||||
- chore: release 4.1.5 [`dc89439`](https://github.com/rive-app/rive-react/commit/dc89439d84624e44c5e1218a78bf823ed6928695)
|
||||
- chore: bump rive-wasm for follow path constraints on solos [`7ebc10a`](https://github.com/rive-app/rive-react/commit/7ebc10a4da5515ae1350edfe02ce21430de128e6)
|
||||
|
||||
#### [v4.1.4](https://github.com/rive-app/rive-react/compare/v4.1.3...v4.1.4)
|
||||
|
||||
> 14 August 2023
|
||||
|
||||
- chore: release 4.1.4 [`e8e1a5b`](https://github.com/rive-app/rive-react/commit/e8e1a5bc089bbf14307d83b5ef672d74d0f23eb4)
|
||||
- chore: bump rive-wasm to 2.1.5 for follow path fix [`1bb8885`](https://github.com/rive-app/rive-react/commit/1bb8885f22583cccaa4b3b54fcbdf42c366548d3)
|
||||
|
||||
#### [v4.1.3](https://github.com/rive-app/rive-react/compare/v4.1.2...v4.1.3)
|
||||
|
||||
@@ -1,10 +1,14 @@
|
||||
<!-- RiveTestHook.stories.mdx -->
|
||||
|
||||
import { useState } from 'react';
|
||||
import { useState, useEffect } from 'react';
|
||||
|
||||
import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
|
||||
|
||||
import RiveComponent, { useRive, useStateMachineInput } from '../../src';
|
||||
import RiveComponent, {
|
||||
EventType,
|
||||
useRive,
|
||||
useStateMachineInput,
|
||||
} from '../../src';
|
||||
import { Button } from './components/Button';
|
||||
import './rive-overview.css';
|
||||
|
||||
@@ -160,3 +164,35 @@ Unlike the boolean and number inputs, you invoke the `.fire()` method on a trigg
|
||||
}}
|
||||
</Story>
|
||||
</Canvas>
|
||||
|
||||
## Rive Events
|
||||
|
||||
To listen for Rive Events reported during state machine play, use the `on` API to add an event listener.
|
||||
|
||||
<Canvas withSource="open">
|
||||
<Story name="Rive Events">
|
||||
{() => {
|
||||
const STATE_MACHINE_NAME = 'State Machine 1';
|
||||
const { rive, RiveComponent } = useRive({
|
||||
src: 'rating_animation.riv',
|
||||
stateMachines: STATE_MACHINE_NAME,
|
||||
autoplay: true,
|
||||
automaticallyHandleEvents: true,
|
||||
});
|
||||
useEffect(() => {
|
||||
if (rive) {
|
||||
rive.on(EventType.RiveEvent, onRiveEventReceived);
|
||||
}
|
||||
}, [rive]);
|
||||
const onRiveEventReceived = (riveEvent) => {
|
||||
console.log('Rive Event Fired', riveEvent);
|
||||
};
|
||||
return (
|
||||
<div className="center">
|
||||
<RiveComponent className="base-canvas-size" />
|
||||
<p>Click on the 5 star!</p>
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
</Story>
|
||||
</Canvas>
|
||||
|
||||
BIN
examples/stories/assets/rating_animation.riv
Normal file
BIN
examples/stories/assets/rating_animation.riv
Normal file
Binary file not shown.
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@rive-app/react-canvas",
|
||||
"version": "4.1.4",
|
||||
"version": "4.3.4",
|
||||
"description": "React wrapper around the @rive-app/canvas library",
|
||||
"main": "dist/index.js",
|
||||
"typings": "dist/types/index.d.ts",
|
||||
@@ -18,7 +18,7 @@
|
||||
},
|
||||
"homepage": "https://github.com/rive-app/rive-react#readme",
|
||||
"dependencies": {
|
||||
"@rive-app/canvas": "2.1.5"
|
||||
"@rive-app/canvas": "2.4.4"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@rive-app/react-webgl",
|
||||
"version": "4.1.4",
|
||||
"version": "4.3.4",
|
||||
"description": "React wrapper around the @rive-app/webgl library",
|
||||
"main": "dist/index.js",
|
||||
"typings": "dist/types/index.d.ts",
|
||||
@@ -18,7 +18,7 @@
|
||||
},
|
||||
"homepage": "https://github.com/rive-app/rive-react#readme",
|
||||
"dependencies": {
|
||||
"@rive-app/webgl": "2.1.5"
|
||||
"@rive-app/webgl": "2.4.4"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "rive-react",
|
||||
"version": "4.1.4",
|
||||
"version": "4.3.4",
|
||||
"description": "React wrapper around the rive-js library",
|
||||
"main": "dist/index.js",
|
||||
"typings": "dist/types/index.d.ts",
|
||||
@@ -36,8 +36,8 @@
|
||||
},
|
||||
"homepage": "https://github.com/rive-app/rive-react#readme",
|
||||
"dependencies": {
|
||||
"@rive-app/canvas": "2.1.5",
|
||||
"@rive-app/webgl": "2.1.5"
|
||||
"@rive-app/canvas": "2.4.4",
|
||||
"@rive-app/webgl": "2.4.4"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
|
||||
|
||||
@@ -36,6 +36,18 @@ export interface RiveProps {
|
||||
* Specify whether to resize the canvas to its container automatically
|
||||
*/
|
||||
shouldResizeCanvasToContainer?: boolean;
|
||||
/**
|
||||
* Enable Rive Events to be handled by the runtime. This means any special Rive Event may have
|
||||
* functionality that can be invoked implicitly when detected.
|
||||
*
|
||||
* For example, if during the render loop an OpenUrlEvent is detected, the
|
||||
* browser may try to open the specified URL in the payload.
|
||||
*
|
||||
* This flag is false by default to prevent any unwanted behaviors from taking place.
|
||||
* This means any special Rive Event will have to be handled manually by subscribing to
|
||||
* EventType.RiveEvent
|
||||
*/
|
||||
automaticallyHandleEvents?: boolean;
|
||||
}
|
||||
|
||||
const Rive = ({
|
||||
@@ -47,6 +59,7 @@ const Rive = ({
|
||||
useOffscreenRenderer = true,
|
||||
shouldDisableRiveListeners = false,
|
||||
shouldResizeCanvasToContainer = true,
|
||||
automaticallyHandleEvents = false,
|
||||
children,
|
||||
...rest
|
||||
}: RiveProps & ComponentProps<'canvas'>) => {
|
||||
@@ -58,6 +71,7 @@ const Rive = ({
|
||||
stateMachines,
|
||||
autoplay: true,
|
||||
shouldDisableRiveListeners,
|
||||
automaticallyHandleEvents,
|
||||
};
|
||||
|
||||
const options = {
|
||||
|
||||
Reference in New Issue
Block a user