diff --git a/.storybook/webpack.config.js b/.storybook/webpack.config.js
index 4668400a..52ba54a9 100644
--- a/.storybook/webpack.config.js
+++ b/.storybook/webpack.config.js
@@ -38,6 +38,13 @@ module.exports = ({ config, mode }) => {
     enforce: "pre"
   });
 
+  // transpile @react-spring/* packages
+  config.module.rules.push({
+    test: /\.js$/,
+    include: /node_modules\/@react-spring/,
+    use: ["babel-loader"]
+  });
+
   config.plugins.unshift(
     new ForkTsCheckerWebpackPlugin({
       typescript: {
diff --git a/package.json b/package.json
index 270b723d..f8391bf0 100644
--- a/package.json
+++ b/package.json
@@ -100,7 +100,7 @@
     "rollup-plugin-babel": "^4.4.0",
     "rollup-plugin-cleanup": "^3.1.1",
     "rollup-plugin-commonjs": "^10.1.0",
-    "rollup-plugin-filesize": "^9.0.2",
+    "rollup-plugin-filesize": "^9.1.0",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-sourcemaps": "^0.6.2",
     "rollup-plugin-terser": "^6.1.0",
diff --git a/packages/pebble-shared/package.json b/packages/pebble-shared/package.json
index 25bb9985..d6f5e2bd 100644
--- a/packages/pebble-shared/package.json
+++ b/packages/pebble-shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "pebble-shared",
-  "version": "2.17.0",
+  "version": "2.18.0-alpha.0",
   "license": "MIT",
   "main": "dist/pebble-shared.js",
   "files": [
diff --git a/packages/pebble-web/package.json b/packages/pebble-web/package.json
index 9df03e35..69168250 100644
--- a/packages/pebble-web/package.json
+++ b/packages/pebble-web/package.json
@@ -1,6 +1,6 @@
 {
   "name": "pebble-web",
-  "version": "2.17.0",
+  "version": "2.18.0-alpha.0",
   "author": "ritz078 <rkritesh078@gmail.com>",
   "license": "MIT",
   "main": "dist/pebble-web.js",
@@ -37,14 +37,14 @@
     "react-calendar": "^2.19.2",
     "react-ink": "^6.4.0",
     "react-popper": "^1.3.6",
-    "react-spring": "^8.0.27",
+    "react-spring": "^9.7.4",
     "rheostat": "2.2.0",
     "rifm": "^0.12.0",
     "scroll-into-view-if-needed": "^2.2.25",
     "utility-types": "^3.10.0"
   },
   "devDependencies": {
-    "pebble-shared": "^2.17.0"
+    "pebble-shared": "^2.18.0-alpha.0"
   },
   "greenkeeper": {
     "ignore": [
diff --git a/packages/pebble-web/src/components/DropDown.tsx b/packages/pebble-web/src/components/DropDown.tsx
index deafaefd..c2de3680 100644
--- a/packages/pebble-web/src/components/DropDown.tsx
+++ b/packages/pebble-web/src/components/DropDown.tsx
@@ -4,7 +4,7 @@ import { DropDownButton } from "./Button";
 import { dropDownStyle, wrapperStyle } from "./styles/Dropdown.styles";
 import { cx } from "emotion";
 import OutsideClick from "./OutsideClick";
-import { animated } from "react-spring/renderprops.cjs";
+import { animated } from "react-spring";
 import MountTransition from "./shared/MountTransition";
 import { Manager, Reference, Popper } from "react-popper";
 import { colors } from "pebble-shared";
@@ -103,9 +103,9 @@ class DropDown extends React.PureComponent<DropdownProps, DropdownState> {
                       ...style,
                       ...transitionStyles,
                       backgroundColor: colors.white.base,
-                      transform: `${style.transform || ""} ${
-                        transitionStyles.transform || ""
-                      }`,
+                      transform: transitionStyles.transform.to(
+                        t => `${style.transform || ""} ${t || ""}`
+                      ),
                       transformOrigin: `${arrowProps.style.left || 0}px ${
                         arrowProps.style.top || 0
                       }px`,
@@ -113,7 +113,7 @@ class DropDown extends React.PureComponent<DropdownProps, DropdownState> {
                     };
 
                     return (
-                      <div
+                      <animated.div
                         className={cx(dropDownStyle, dropDownClassName)}
                         ref={ref}
                         style={popperWrapperStyle}
@@ -123,7 +123,7 @@ class DropDown extends React.PureComponent<DropdownProps, DropdownState> {
                           toggle: this.toggleDropdown,
                           isOpen: _isDropDownOpen
                         })}
-                      </div>
+                      </animated.div>
                     );
                   }}
                 </Popper>
diff --git a/packages/pebble-web/src/components/Modal.tsx b/packages/pebble-web/src/components/Modal.tsx
index 6f4d7fff..95d7266f 100644
--- a/packages/pebble-web/src/components/Modal.tsx
+++ b/packages/pebble-web/src/components/Modal.tsx
@@ -1,10 +1,11 @@
 import * as React from "react";
 import { ModalProps } from "./typings/Modal";
 import { modalContainer } from "./styles/Modal.styles";
-import { cx, css } from "emotion";
+import { cx } from "emotion";
 import isBrowser from "is-in-browser";
 import * as ReactDOM from "react-dom";
 import MountTransition from "./shared/MountTransition";
+import { animated } from "react-spring";
 
 class Modal extends React.PureComponent<ModalProps> {
   private node = isBrowser ? document.createElement("div") : null;
@@ -41,23 +42,21 @@ class Modal extends React.PureComponent<ModalProps> {
       // tslint:disable-next-line:jsx-wrap-multiline
       <MountTransition visible={visible}>
         {transitionStyles => (
-          <div
+          <animated.div
             style={{
               opacity: transitionStyles.opacity
             }}
             className={cx(modalContainer, backDropClassName)}
           >
-            <div
-              className={cx(
-                css({
-                  transform: transitionStyles.transform
-                }),
-                modalClassName
-              )}
+            <animated.div
+              style={{
+                transform: transitionStyles.transform
+              }}
+              className={modalClassName}
             >
               {children}
-            </div>
-          </div>
+            </animated.div>
+          </animated.div>
         )}
       </MountTransition>,
       node as NonNullable<typeof node>
diff --git a/packages/pebble-web/src/components/Popper.tsx b/packages/pebble-web/src/components/Popper.tsx
index f3411f06..697c252b 100644
--- a/packages/pebble-web/src/components/Popper.tsx
+++ b/packages/pebble-web/src/components/Popper.tsx
@@ -6,6 +6,7 @@ import { colors } from "pebble-shared";
 import { cx } from "emotion";
 import OutsideClick from "./OutsideClick";
 import MountTransition from "./shared/MountTransition";
+import { animated } from "react-spring";
 
 export default class PebblePopper extends React.PureComponent<
   PopperProps,
@@ -71,16 +72,16 @@ export default class PebblePopper extends React.PureComponent<
                     ...style,
                     ...transitionStyles,
                     backgroundColor: popperBackgroundColor,
-                    transform: `${style.transform || ""} ${
-                      transitionStyles.transform || ""
-                    }`,
+                    transform: transitionStyles.transform.to(
+                      t => `${style.transform || ""} ${t || ""}`
+                    ),
                     transformOrigin: `${arrowProps.style.left || 0}px ${
                       arrowProps.style.top || 0
                     }px`
                   };
 
                   return (
-                    <div
+                    <animated.div
                       className={cx(popperStyle, popperClassName)}
                       ref={ref}
                       style={wrapperStyle}
@@ -101,7 +102,7 @@ export default class PebblePopper extends React.PureComponent<
                       >
                         ▶
                       </div>
-                    </div>
+                    </animated.div>
                   );
                 }}
               </Popper>
diff --git a/packages/pebble-web/src/components/Sidebar.tsx b/packages/pebble-web/src/components/Sidebar.tsx
index 0e383567..f2034b24 100644
--- a/packages/pebble-web/src/components/Sidebar.tsx
+++ b/packages/pebble-web/src/components/Sidebar.tsx
@@ -5,7 +5,7 @@ import {
   sidebarWrapperStyle
 } from "./styles/Sidebar.styles";
 import { SidebarProps } from "./typings/Sidebar";
-import { animated } from "react-spring/renderprops.cjs";
+import { animated } from "react-spring";
 import Ink from "react-ink";
 import { css, cx } from "emotion";
 import { disableScrollY } from "../theme/styles";
diff --git a/packages/pebble-web/src/components/Toast.tsx b/packages/pebble-web/src/components/Toast.tsx
index cb0a7fa2..8902b577 100644
--- a/packages/pebble-web/src/components/Toast.tsx
+++ b/packages/pebble-web/src/components/Toast.tsx
@@ -7,7 +7,7 @@ import {
   ToastType,
   ToastPosition
 } from "./typings/Toast";
-import { Transition, animated } from "react-spring/renderprops.cjs";
+import { Transition, animated } from "react-spring";
 import { cx } from "emotion";
 import mitt from "mitt";
 import { animationConfig } from "../utils/animation";
@@ -188,9 +188,8 @@ class Toast extends React.PureComponent<ToastProps, ToastState> {
         }}
         config={animationConfig.config}
       >
-        {show =>
-          show &&
-          (styles => (
+        {(styles, show) =>
+          show && (
             <animated.div
               className={cx(toastWrapper, this.props.className)}
               style={{
@@ -202,7 +201,7 @@ class Toast extends React.PureComponent<ToastProps, ToastState> {
               <i className={iconClass} />
               {this.state.text}
             </animated.div>
-          ))
+          )
         }
       </Transition>
     );
diff --git a/packages/pebble-web/src/components/TypeAhead.tsx b/packages/pebble-web/src/components/TypeAhead.tsx
index 9ef1fe06..99ef0e9c 100644
--- a/packages/pebble-web/src/components/TypeAhead.tsx
+++ b/packages/pebble-web/src/components/TypeAhead.tsx
@@ -10,7 +10,7 @@ import Input from "./Input";
 import { optionsWrapper, wrapper } from "./styles/TypeAhead.styles";
 import OutsideClick from "./OutsideClick";
 import OptionGroupRadio from "./OptionGroupRadio";
-import { animated } from "react-spring/renderprops.cjs";
+import { animated } from "react-spring";
 import MountTransition from "./shared/MountTransition";
 
 function defaultSearchBox<OptionType>(
@@ -121,7 +121,7 @@ export default class TypeAhead<OptionType> extends React.PureComponent<
           this.props
         )}
 
-        <MountTransition visible={showSuggestions} native>
+        <MountTransition visible={showSuggestions}>
           {transitionStyles => (
             <animated.div
               style={transitionStyles}
diff --git a/packages/pebble-web/src/components/__tests__/__snapshots__/popper.test.tsx.snap b/packages/pebble-web/src/components/__tests__/__snapshots__/popper.test.tsx.snap
index b038d211..7c1b55f8 100644
--- a/packages/pebble-web/src/components/__tests__/__snapshots__/popper.test.tsx.snap
+++ b/packages/pebble-web/src/components/__tests__/__snapshots__/popper.test.tsx.snap
@@ -142,7 +142,7 @@ exports[`Component: Popper snapshot 1`] = `
         "pointerEvents": "none",
         "position": "absolute",
         "top": 0,
-        "transform": " scale(0.95)",
+        "transform": "  scale(0.95)",
         "transformOrigin": "0px 0px",
       }
     }
diff --git a/packages/pebble-web/src/components/shared/MountTransition.tsx b/packages/pebble-web/src/components/shared/MountTransition.tsx
index 44d21e39..e774ef6e 100644
--- a/packages/pebble-web/src/components/shared/MountTransition.tsx
+++ b/packages/pebble-web/src/components/shared/MountTransition.tsx
@@ -1,29 +1,36 @@
 import * as React from "react";
+import { Transition, UseTransitionProps, SpringValues } from "react-spring";
 import {
-  State,
-  Transition,
-  TransitionProps
-} from "react-spring/renderprops.cjs";
-import { animationConfig } from "../../utils/animation";
-import { Omit } from "utility-types";
+  animationConfig,
+  TransitionPhase,
+  AnimationStyle
+} from "../../utils/animation";
 
-interface MountTransitionProps
-  extends Omit<Omit<TransitionProps<boolean>, "items">, "children"> {
+interface MountTransitionProps extends UseTransitionProps<boolean> {
   visible: boolean;
   children: (
-    params: React.CSSProperties,
-    state: State,
+    params: SpringValues<AnimationStyle>,
+    state: TransitionPhase,
     index: number
   ) => React.ReactNode;
 }
 
 const MountTransition: React.FunctionComponent<MountTransitionProps> = props => {
   return (
-    <Transition items={props.visible} {...animationConfig} {...props}>
-      {(show, state, index) =>
-        show &&
-        (styles => props.children(styles as React.CSSProperties, state, index))
-      }
+    <Transition
+      // @ts-expect-error
+      items={props.visible}
+      {...animationConfig}
+      {...props}
+    >
+      {(styles, show, { phase }, index) => {
+        if (!show) return null;
+        return props.children(
+          styles as SpringValues<AnimationStyle>,
+          phase,
+          index
+        );
+      }}
     </Transition>
   );
 };
diff --git a/packages/pebble-web/src/utils/animation.ts b/packages/pebble-web/src/utils/animation.ts
index 72dc8937..8a4a47f5 100644
--- a/packages/pebble-web/src/utils/animation.ts
+++ b/packages/pebble-web/src/utils/animation.ts
@@ -1,9 +1,18 @@
-import { State } from "react-spring";
+import { TransitionState } from "react-spring";
+
+// TransitionPhase enum is not exported by react-spring package
+// so we alias it as a type here
+export type TransitionPhase = TransitionState["phase"];
 
 export const animationConfig = {
   from: { opacity: 0, transform: "scale(0.95)" },
   enter: { opacity: 1, transform: "scale(1)" },
   leave: { opacity: 0, transform: "scale(0.95)", pointerEvents: "none" },
-  config: (_a: boolean, motion: State) =>
-    motion === "leave" ? { duration: 80 } : { duration: 200 }
+  config: (_show: boolean, _index: number, state: TransitionPhase) =>
+    state === "leave" ? { duration: 80 } : { duration: 200 }
+};
+
+export type AnimationStyle = {
+  opacity: number;
+  transform: string;
 };
diff --git a/yarn.lock b/yarn.lock
index 345d1279..929a2901 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1575,6 +1575,46 @@
     "@types/yargs" "^15.0.0"
     chalk "^4.0.0"
 
+"@jridgewell/gen-mapping@^0.3.5":
+  version "0.3.5"
+  resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz#dcce6aff74bdf6dad1a95802b69b04a2fcb1fb36"
+  integrity sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==
+  dependencies:
+    "@jridgewell/set-array" "^1.2.1"
+    "@jridgewell/sourcemap-codec" "^1.4.10"
+    "@jridgewell/trace-mapping" "^0.3.24"
+
+"@jridgewell/resolve-uri@^3.1.0":
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz#7a0ee601f60f99a20c7c7c5ff0c80388c1189bd6"
+  integrity sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==
+
+"@jridgewell/set-array@^1.2.1":
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.2.1.tgz#558fb6472ed16a4c850b889530e6b36438c49280"
+  integrity sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==
+
+"@jridgewell/source-map@^0.3.3":
+  version "0.3.6"
+  resolved "https://registry.yarnpkg.com/@jridgewell/source-map/-/source-map-0.3.6.tgz#9d71ca886e32502eb9362c9a74a46787c36df81a"
+  integrity sha512-1ZJTZebgqllO79ue2bm3rIGud/bOe0pP5BjSRCRxxYkEZS8STV7zN84UBbiYu7jy+eCKSnVIUgoWWE/tt+shMQ==
+  dependencies:
+    "@jridgewell/gen-mapping" "^0.3.5"
+    "@jridgewell/trace-mapping" "^0.3.25"
+
+"@jridgewell/sourcemap-codec@^1.4.10", "@jridgewell/sourcemap-codec@^1.4.14":
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz#3188bcb273a414b0d215fd22a58540b989b9409a"
+  integrity sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==
+
+"@jridgewell/trace-mapping@^0.3.24", "@jridgewell/trace-mapping@^0.3.25":
+  version "0.3.25"
+  resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz#15f190e98895f3fc23276ee14bc76b675c2e50f0"
+  integrity sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==
+  dependencies:
+    "@jridgewell/resolve-uri" "^3.1.0"
+    "@jridgewell/sourcemap-codec" "^1.4.14"
+
 "@lerna/add@3.21.0":
   version "3.21.0"
   resolved "https://registry.yarnpkg.com/@lerna/add/-/add-3.21.0.tgz#27007bde71cc7b0a2969ab3c2f0ae41578b4577b"
@@ -2400,6 +2440,91 @@
     react-lifecycles-compat "^3.0.4"
     warning "^3.0.0"
 
+"@react-spring/animated@~9.7.5":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/animated/-/animated-9.7.5.tgz#eb0373aaf99b879736b380c2829312dae3b05f28"
+  integrity sha512-Tqrwz7pIlsSDITzxoLS3n/v/YCUHQdOIKtOJf4yL6kYVSDTSmVK1LI1Q3M/uu2Sx4X3pIWF3xLUhlsA6SPNTNg==
+  dependencies:
+    "@react-spring/shared" "~9.7.5"
+    "@react-spring/types" "~9.7.5"
+
+"@react-spring/core@~9.7.4", "@react-spring/core@~9.7.5":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/core/-/core-9.7.5.tgz#72159079f52c1c12813d78b52d4f17c0bf6411f7"
+  integrity sha512-rmEqcxRcu7dWh7MnCcMXLvrf6/SDlSokLaLTxiPlAYi11nN3B5oiCUAblO72o+9z/87j2uzxa2Inm8UbLjXA+w==
+  dependencies:
+    "@react-spring/animated" "~9.7.5"
+    "@react-spring/shared" "~9.7.5"
+    "@react-spring/types" "~9.7.5"
+
+"@react-spring/konva@~9.7.4":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/konva/-/konva-9.7.5.tgz#ab6b0d9fcb0941db0f11e2437a002628912d2698"
+  integrity sha512-BelrmyY6w0FGoNSEfSJltjQDUoW0Prxf+FzGjyLuLs+V9M9OM/aHnYqOlvQEfQsZx6C/ZiDOn5BZl8iH8SDf+Q==
+  dependencies:
+    "@react-spring/animated" "~9.7.5"
+    "@react-spring/core" "~9.7.5"
+    "@react-spring/shared" "~9.7.5"
+    "@react-spring/types" "~9.7.5"
+
+"@react-spring/native@~9.7.4":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/native/-/native-9.7.5.tgz#fe48f017ae63472b89ff5f02b2bc075ff8840978"
+  integrity sha512-C1S500BNP1I05MftElyLv2nIqaWQ0MAByOAK/p4vuXcUK3XcjFaAJ385gVLgV2rgKfvkqRoz97PSwbh+ZCETEg==
+  dependencies:
+    "@react-spring/animated" "~9.7.5"
+    "@react-spring/core" "~9.7.5"
+    "@react-spring/shared" "~9.7.5"
+    "@react-spring/types" "~9.7.5"
+
+"@react-spring/rafz@~9.7.5":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/rafz/-/rafz-9.7.5.tgz#ee7959676e7b5d6a3813e8c17d5e50df98b95df9"
+  integrity sha512-5ZenDQMC48wjUzPAm1EtwQ5Ot3bLIAwwqP2w2owG5KoNdNHpEJV263nGhCeKKmuA3vG2zLLOdu3or6kuDjA6Aw==
+
+"@react-spring/shared@~9.7.5":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/shared/-/shared-9.7.5.tgz#6d513622df6ad750bbbd4dedb4ca0a653ec92073"
+  integrity sha512-wdtoJrhUeeyD/PP/zo+np2s1Z820Ohr/BbuVYv+3dVLW7WctoiN7std8rISoYoHpUXtbkpesSKuPIw/6U1w1Pw==
+  dependencies:
+    "@react-spring/rafz" "~9.7.5"
+    "@react-spring/types" "~9.7.5"
+
+"@react-spring/three@~9.7.4":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/three/-/three-9.7.5.tgz#46bcd22354afa873a809f1c6d7e07b59600b4d08"
+  integrity sha512-RxIsCoQfUqOS3POmhVHa1wdWS0wyHAUway73uRLp3GAL5U2iYVNdnzQsep6M2NZ994BlW8TcKuMtQHUqOsy6WA==
+  dependencies:
+    "@react-spring/animated" "~9.7.5"
+    "@react-spring/core" "~9.7.5"
+    "@react-spring/shared" "~9.7.5"
+    "@react-spring/types" "~9.7.5"
+
+"@react-spring/types@~9.7.5":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/types/-/types-9.7.5.tgz#e5dd180f3ed985b44fd2cd2f32aa9203752ef3e8"
+  integrity sha512-HVj7LrZ4ReHWBimBvu2SKND3cDVUPWKLqRTmWe/fNY6o1owGOX0cAHbdPDTMelgBlVbrTKrre6lFkhqGZErK/g==
+
+"@react-spring/web@~9.7.4":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/web/-/web-9.7.5.tgz#7d7782560b3a6fb9066b52824690da738605de80"
+  integrity sha512-lmvqGwpe+CSttsWNZVr+Dg62adtKhauGwLyGE/RRyZ8AAMLgb9x3NDMA5RMElXo+IMyTkPp7nxTB8ZQlmhb6JQ==
+  dependencies:
+    "@react-spring/animated" "~9.7.5"
+    "@react-spring/core" "~9.7.5"
+    "@react-spring/shared" "~9.7.5"
+    "@react-spring/types" "~9.7.5"
+
+"@react-spring/zdog@~9.7.4":
+  version "9.7.5"
+  resolved "https://registry.yarnpkg.com/@react-spring/zdog/-/zdog-9.7.5.tgz#ba11049ecce30d03f92189eefd67ba9a4118149d"
+  integrity sha512-VV7vmb52wGHgDA1ry6hv+QgxTs78fqjKEQnj+M8hiBg+dwOsTtqqM24ADtc4cMAhPW+eZhVps8ZNKtjt8ouHFA==
+  dependencies:
+    "@react-spring/animated" "~9.7.5"
+    "@react-spring/core" "~9.7.5"
+    "@react-spring/shared" "~9.7.5"
+    "@react-spring/types" "~9.7.5"
+
 "@rollup/plugin-replace@^2.3.3":
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/@rollup/plugin-replace/-/plugin-replace-2.3.3.tgz#cd6bae39444de119f5d905322b91ebd4078562e7"
@@ -3670,6 +3795,11 @@ acorn@^7.1.0, acorn@^7.1.1:
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.3.1.tgz#85010754db53c3fbaf3b9ea3e083aa5c5d147ffd"
   integrity sha512-tLc0wSnatxAQHVHUapaHdz72pi9KUyHjq5KyHjGg9Y8Ifdc79pTh2XvI6I1/chZbnM7QtNKzh66ooDogPZSleA==
 
+acorn@^8.8.2:
+  version "8.14.0"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.14.0.tgz#063e2c70cac5fb4f6467f0b11152e04c682795b0"
+  integrity sha512-cl669nCJTZBsL97OF4kUQm5g5hC2uihk0NxY3WENAC0TYdILVkAyHymAntgxGkl7K+t0cXIrH5siy5S4XkFycA==
+
 address@1.1.2, address@^1.0.1:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/address/-/address-1.1.2.tgz#bf1116c9c758c51b7a933d296b72c221ed9428b6"
@@ -14054,13 +14184,17 @@ react-sizeme@^2.5.2, react-sizeme@^2.6.7:
     shallowequal "^1.1.0"
     throttle-debounce "^2.1.0"
 
-react-spring@^8.0.27:
-  version "8.0.27"
-  resolved "https://registry.yarnpkg.com/react-spring/-/react-spring-8.0.27.tgz#97d4dee677f41e0b2adcb696f3839680a3aa356a"
-  integrity sha512-nDpWBe3ZVezukNRandTeLSPcwwTMjNVu1IDq9qA/AMiUqHuRN4BeSWvKr3eIxxg1vtiYiOLy4FqdfCP5IoP77g==
+react-spring@^9.7.4:
+  version "9.7.4"
+  resolved "https://registry.yarnpkg.com/react-spring/-/react-spring-9.7.4.tgz#5a4e99bf121475e1bf714e0b241191cad50c6432"
+  integrity sha512-ypxdsOwmCfbDZGTBRyBo7eLjF55xNFN86e/QkflZ1Rfo8QMzVjCAWocrEEbsuFKkQAg2RRdhNkinWJ6BpCvJoQ==
   dependencies:
-    "@babel/runtime" "^7.3.1"
-    prop-types "^15.5.8"
+    "@react-spring/core" "~9.7.4"
+    "@react-spring/konva" "~9.7.4"
+    "@react-spring/native" "~9.7.4"
+    "@react-spring/three" "~9.7.4"
+    "@react-spring/web" "~9.7.4"
+    "@react-spring/zdog" "~9.7.4"
 
 react-syntax-highlighter@^11.0.2:
   version "11.0.2"
@@ -14712,10 +14846,10 @@ rollup-plugin-commonjs@^10.1.0:
     resolve "^1.11.0"
     rollup-pluginutils "^2.8.1"
 
-rollup-plugin-filesize@^9.0.2:
-  version "9.0.2"
-  resolved "https://registry.yarnpkg.com/rollup-plugin-filesize/-/rollup-plugin-filesize-9.0.2.tgz#1470bb93d40dd0c2a5381cae58b8b7106f13d185"
-  integrity sha512-UB+pMETOAxo79aINL+Lt7NmUJa6x6vJjtlmBco9NhSHhpnYaKdGGSx1QuuUuo5LlBXhQxrUURYJbF/B95Vt6Hg==
+rollup-plugin-filesize@^9.1.0:
+  version "9.1.0"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-filesize/-/rollup-plugin-filesize-9.1.0.tgz#e6032a2975d1c0c8f2c30ecaa73a12bf39406461"
+  integrity sha512-3umx+e2AzYH4lJaBtyeWk2kC7JafzZhy5AJwj2amudWWgqIFpI/QH7s2+9LWBwIvjK5ty6K6eM3i6dw7qF4GrQ==
   dependencies:
     "@babel/runtime" "^7.10.3"
     boxen "^4.2.0"
@@ -14724,7 +14858,7 @@ rollup-plugin-filesize@^9.0.2:
     filesize "^6.1.0"
     gzip-size "^5.1.1"
     pacote "^11.1.10"
-    terser "^4.8.0"
+    terser "^5.5.1"
 
 rollup-plugin-node-resolve@^5.2.0:
   version "5.2.0"
@@ -15337,6 +15471,14 @@ source-map-support@^0.5.3, source-map-support@^0.5.6, source-map-support@~0.5.12
     buffer-from "^1.0.0"
     source-map "^0.6.0"
 
+source-map-support@~0.5.20:
+  version "0.5.21"
+  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.21.tgz#04fe7c7f9e1ed2d662233c28cb2b35b9f63f6e4f"
+  integrity sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==
+  dependencies:
+    buffer-from "^1.0.0"
+    source-map "^0.6.0"
+
 source-map-url@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
@@ -16154,7 +16296,7 @@ terser-webpack-plugin@^2.1.2:
     terser "^4.6.12"
     webpack-sources "^1.4.3"
 
-terser@^4.1.2, terser@^4.3.9, terser@^4.6.12, terser@^4.7.0, terser@^4.8.0:
+terser@^4.1.2, terser@^4.3.9, terser@^4.6.12, terser@^4.7.0:
   version "4.8.0"
   resolved "https://registry.yarnpkg.com/terser/-/terser-4.8.0.tgz#63056343d7c70bb29f3af665865a46fe03a0df17"
   integrity sha512-EAPipTNeWsb/3wLPeup1tVPaXfIaU68xMnVdPafIL1TV05OhASArYyIfFvnvJCNrR2NIOvDVNNTFRa+Re2MWyw==
@@ -16163,6 +16305,16 @@ terser@^4.1.2, terser@^4.3.9, terser@^4.6.12, terser@^4.7.0, terser@^4.8.0:
     source-map "~0.6.1"
     source-map-support "~0.5.12"
 
+terser@^5.5.1:
+  version "5.36.0"
+  resolved "https://registry.yarnpkg.com/terser/-/terser-5.36.0.tgz#8b0dbed459ac40ff7b4c9fd5a3a2029de105180e"
+  integrity sha512-IYV9eNMuFAV4THUspIRXkLakHnV6XO7FEdtKjf/mDyrnqUg9LnlOn6/RwRvM9SZjR4GUq8Nk8zj67FzVARr74w==
+  dependencies:
+    "@jridgewell/source-map" "^0.3.3"
+    acorn "^8.8.2"
+    commander "^2.20.0"
+    source-map-support "~0.5.20"
+
 test-exclude@^6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/test-exclude/-/test-exclude-6.0.0.tgz#04a8698661d805ea6fa293b6cb9e63ac044ef15e"