From 84d9730767a62c63e743d5a04bba5b3d480ea38d Mon Sep 17 00:00:00 2001
From: Zach Plata <plata.zach@gmail.com>
Date: Wed, 25 May 2022 10:22:04 -0500
Subject: [PATCH] Feat: Add stateMachines param to the default Rive component

---
 README.md               | 3 ++-
 src/components/Rive.tsx | 3 +++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 2d85a5e..aca4915 100644
--- a/README.md
+++ b/README.md
@@ -26,7 +26,7 @@ _Note: This library is using React hooks so the minimum version required for bot
 
 ### Component
 
-Rive React provides a basic component as it's default import for displaying simple animations.
+Rive React provides a basic component as it's default import for displaying simple animations. Note that any animations or state machines instantiated through this component will autoplay.
 
 ```js
 import Rive from 'rive-react';
@@ -43,6 +43,7 @@ export default Example;
 - `src`: File path or URL to the .riv file to display.
 - `artboard`: _(optional)_ Name to display.
 - `animations`: _(optional)_ Name or list of names of animtions to play.
+- `stateMachines`: _(optional)_ Name of state machine to play.
 - `layout`: _(optional)_ Layout object to define how animations are displayed on the canvas. See [Rive.js](https://github.com/rive-app/rive-wasm#layout) for more details.
 - _All attributes and eventHandlers that can be passed to a `canvas` element can also be passed to the `Rive` component and used in the same manner._
 
diff --git a/src/components/Rive.tsx b/src/components/Rive.tsx
index 5991d30..a601524 100644
--- a/src/components/Rive.tsx
+++ b/src/components/Rive.tsx
@@ -6,6 +6,7 @@ export type RiveProps = {
   src: string;
   artboard?: string;
   animations?: string | string[];
+  stateMachines?: string | string[];
   layout?: Layout;
   useOffscreenRenderer?: boolean;
 };
@@ -14,6 +15,7 @@ const Rive = ({
   src,
   artboard,
   animations,
+  stateMachines,
   layout,
   useOffscreenRenderer = true,
   ...rest
@@ -23,6 +25,7 @@ const Rive = ({
     artboard,
     animations,
     layout,
+    stateMachines,
     autoplay: true,
   };