diff --git a/.eslintrc.js b/.eslintrc.js
index eee44828..661b1331 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -3,6 +3,7 @@ const path = require('path');
 module.exports = {
   extends: [
     'plugin:@shopify/typescript',
+    'plugin:@shopify/react',
     'plugin:@shopify/jest',
     'plugin:@shopify/prettier',
   ],
@@ -13,6 +14,9 @@ module.exports = {
   },
   rules: {
     'jest/valid-title': 'off',
+    'react/jsx-uses-react': 'off',
+    'react/react-in-jsx-scope': 'off',
+    'react/jsx-filename-extension': [1, {extensions: ['.jsx', '.tsx']}],
   },
   settings: {
     'import/resolver': {
@@ -24,4 +28,12 @@ module.exports = {
       },
     },
   },
+  overrides: [
+    {
+      files: ['./**/*.test.{jsx,tsx}'],
+      rules: {
+        '@shopify/jsx-no-hardcoded-content': 'off',
+      },
+    },
+  ],
 };
diff --git a/babel.config.js b/babel.config.js
index 20ac2dbe..b6aedf3f 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,4 +1,7 @@
 module.exports = function (api) {
+  const envName = api.env();
+  const development = envName === 'development' || envName === 'test';
+
   api.cache(true);
 
   return {
@@ -8,6 +11,10 @@ module.exports = function (api) {
         {useBuiltIns: 'entry', corejs: '3.0', bugfixes: true},
       ],
       ['@babel/preset-typescript'],
+      [
+        '@babel/preset-react',
+        {development, useBuiltIns: true, runtime: 'automatic'},
+      ],
     ],
     plugins: [['@babel/plugin-proposal-decorators', {version: '2023-05'}]],
     assumptions: {
diff --git a/jest.config.js b/jest.config.js
index 2f2e4d3e..9b8f8c06 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -1,12 +1,14 @@
+const {TextEncoder} = require('util');
+
 module.exports = {
   testEnvironment: 'jsdom',
-  testMatch: ['<rootDir>/src/**/*.test.(js|ts)'],
+  testMatch: ['<rootDir>/src/**/*.test.(js|jsx|ts|tsx)'],
   setupFiles: ['<rootDir>/test/environment.ts'],
   setupFilesAfterEnv: ['<rootDir>/test/setup.ts'],
   transform: {
     '\\.(ts|js)': ['babel-jest'],
   },
-  moduleFileExtensions: ['js', 'ts'],
+  moduleFileExtensions: ['js', 'jsx', 'ts', 'tsx'],
   collectCoverageFrom: [
     'src/**/*.{js,ts}',
     '!src/**/*/index.{js,ts}',
@@ -18,4 +20,7 @@ module.exports = {
   coverageDirectory: './coverage/',
   collectCoverage: true,
   moduleDirectories: ['node_modules', 'src', 'test'],
+  globals: {
+    TextEncoder,
+  },
 };
diff --git a/package.json b/package.json
index 09d6c17a..fd601cfc 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
     "@babel/core": "^7.22.20",
     "@babel/plugin-proposal-decorators": "^7.23.0",
     "@babel/preset-env": "^7.22.20",
+    "@babel/preset-react": "^7.22.15",
     "@babel/preset-typescript": "^7.23.0",
     "@changesets/changelog-github": "^0.4.8",
     "@changesets/cli": "^2.26.2",
@@ -63,6 +64,7 @@
     "@shopify/typescript-configs": "^5.1.0",
     "@types/jest": "^29.5.5",
     "@types/node": "^20.6.3",
+    "@types/react-dom": "^18.2.13",
     "concurrently": "^3.5.1",
     "esdoc": "^1.1.0",
     "esdoc-ecmascript-proposal-plugin": "^1.0.0",
@@ -71,6 +73,8 @@
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "prettier": "^3.0.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "rollup": "^3.29.3",
     "rollup-plugin-cleanup": "^3.2.1",
     "rollup-plugin-includepaths": "^0.2.4",
diff --git a/src/Draggable/Plugins/Focusable/tests/Focusable.test.js b/src/Draggable/Plugins/Focusable/tests/Focusable.test.jsx
similarity index 88%
rename from src/Draggable/Plugins/Focusable/tests/Focusable.test.js
rename to src/Draggable/Plugins/Focusable/tests/Focusable.test.jsx
index 69c6fb25..907d0922 100644
--- a/src/Draggable/Plugins/Focusable/tests/Focusable.test.js
+++ b/src/Draggable/Plugins/Focusable/tests/Focusable.test.jsx
@@ -3,18 +3,20 @@ import {createSandbox, waitForRequestAnimationFrame} from 'helper';
 import Draggable from '../../..';
 import Focusable from '..';
 
-const sampleMarkup = `
-  <ul class="Container">
-    <li>First item</li>
-    <li>Second item</li>
-    <li>Third item</li>
-    <li>Forth item</li>
-    <button>Fifth item</button>
-  </ul>
-  <div class="Container">
-    <div tabindex="1"></div>
-  </div>
-`;
+const sampleMarkup = (
+  <>
+    <ul className="Container">
+      <li>First item</li>
+      <li>Second item</li>
+      <li>Third item</li>
+      <li>Forth item</li>
+      <button type="button">Fifth item</button>
+    </ul>
+    <div className="Container">
+      <div tabIndex="-1" />
+    </div>
+  </>
+);
 
 describe('Focusable', () => {
   let sandbox;
diff --git a/src/Draggable/Plugins/Mirror/tests/Mirror.test.js b/src/Draggable/Plugins/Mirror/tests/Mirror.test.jsx
similarity index 99%
rename from src/Draggable/Plugins/Mirror/tests/Mirror.test.js
rename to src/Draggable/Plugins/Mirror/tests/Mirror.test.jsx
index 63a87f1b..da2e8783 100644
--- a/src/Draggable/Plugins/Mirror/tests/Mirror.test.js
+++ b/src/Draggable/Plugins/Mirror/tests/Mirror.test.jsx
@@ -19,11 +19,11 @@ import {
 } from '../MirrorEvent';
 import Draggable from '../../..';
 
-const sampleMarkup = `
+const sampleMarkup = (
   <ul>
     <li>First item</li>
   </ul>
-`;
+);
 
 describe('Mirror', () => {
   let sandbox;
diff --git a/src/Draggable/Sensors/DragSensor/tests/DragSensor.test.js b/src/Draggable/Sensors/DragSensor/tests/DragSensor.test.jsx
similarity index 97%
rename from src/Draggable/Sensors/DragSensor/tests/DragSensor.test.js
rename to src/Draggable/Sensors/DragSensor/tests/DragSensor.test.jsx
index 675523c3..97fff591 100644
--- a/src/Draggable/Sensors/DragSensor/tests/DragSensor.test.js
+++ b/src/Draggable/Sensors/DragSensor/tests/DragSensor.test.jsx
@@ -11,13 +11,13 @@ import {
 
 import DragSensor from '..';
 
-const sampleMarkup = `
+const sampleMarkup = (
   <ul>
-    <li class="draggable">First item</li>
-    <li class="draggable">Second item</li>
-    <li class="non-draggable">Non draggable item</li>
+    <li className="draggable">First item</li>
+    <li className="draggable">Second item</li>
+    <li className="non-draggable">Non draggable item</li>
   </ul>
-`;
+);
 
 describe('DragSensor', () => {
   let sandbox;
diff --git a/src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.js b/src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.jsx
similarity index 97%
rename from src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.js
rename to src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.jsx
index d9175243..9334b227 100644
--- a/src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.js
+++ b/src/Draggable/Sensors/MouseSensor/tests/MouseSensor.test.jsx
@@ -10,22 +10,22 @@ import {
 
 import MouseSensor from '..';
 
-const sampleMarkup = `
+const sampleMarkup = (
   <ul>
-    <li class="draggable">
-      <div class="handle">First handle</div>
+    <li className="draggable">
+      <div className="handle">First handle</div>
       First item
     </li>
-    <li class="draggable">
-      <div class="handle">Second handle</div>
+    <li className="draggable">
+      <div className="handle">Second handle</div>
       Second item
     </li>
-    <li class="non-draggable">
-      <div class="handle">Non draggable handle</div>
+    <li className="non-draggable">
+      <div className="handle">Non draggable handle</div>
       Non draggable item
     </li>
   </ul>
-`;
+);
 
 describe('MouseSensor', () => {
   let sandbox;
diff --git a/src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.js b/src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.jsx
similarity index 98%
rename from src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.js
rename to src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.jsx
index be291569..8cc7145b 100644
--- a/src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.js
+++ b/src/Draggable/Sensors/TouchSensor/tests/TouchSensor.test.jsx
@@ -10,13 +10,13 @@ import {
 
 import TouchSensor from '..';
 
-const sampleMarkup = `
+const sampleMarkup = (
   <ul>
-    <li class="draggable">First item</li>
-    <li class="draggable">Second item</li>
-    <li class="non-draggable">Non draggable item</li>
+    <li className="draggable">First item</li>
+    <li className="draggable">Second item</li>
+    <li className="non-draggable">Non draggable item</li>
   </ul>
-`;
+);
 
 describe('TouchSensor', () => {
   let sandbox;
diff --git a/src/Draggable/tests/Draggable.test.js b/src/Draggable/tests/Draggable.test.jsx
similarity index 99%
rename from src/Draggable/tests/Draggable.test.js
rename to src/Draggable/tests/Draggable.test.jsx
index 4769176f..083a819e 100644
--- a/src/Draggable/tests/Draggable.test.js
+++ b/src/Draggable/tests/Draggable.test.jsx
@@ -23,16 +23,18 @@ import {
 import {Focusable, Mirror, Scrollable, Announcement} from '../Plugins';
 import {MouseSensor, TouchSensor} from '../Sensors';
 
-const sampleMarkup = `
-  <ul class="Container">
-    <li>First item</li>
-    <li>Second item</li>
-  </ul>
-  <ul class="DynamicContainer">
-    <li>First item</li>
-    <li>Second item</li>
-  </ul>
-`;
+const sampleMarkup = (
+  <>
+    <ul className="Container">
+      <li>First item</li>
+      <li>Second item</li>
+    </ul>
+    <ul className="DynamicContainer">
+      <li>First item</li>
+      <li>Second item</li>
+    </ul>
+  </>
+);
 
 describe('Draggable', () => {
   let sandbox;
diff --git a/src/Droppable/tests/Droppable.test.js b/src/Droppable/tests/Droppable.test.jsx
similarity index 95%
rename from src/Droppable/tests/Droppable.test.js
rename to src/Droppable/tests/Droppable.test.jsx
index 80aecc72..4b58ca04 100644
--- a/src/Droppable/tests/Droppable.test.js
+++ b/src/Droppable/tests/Droppable.test.jsx
@@ -14,18 +14,18 @@ import Droppable, {
   DroppableStopEvent,
 } from '..';
 
-const sampleMarkup = `
-  <div class="Container">
-    <div class="Dropzone isOccupied">
-      <div class="Draggable"></div>
+const sampleMarkup = (
+  <div className="Container">
+    <div className="Dropzone isOccupied">
+      <div className="Draggable" />
     </div>
-    <div class="Dropzone"></div>
-    <div class="Dropzone isOccupied">
-      <div class="Draggable"></div>
+    <div className="Dropzone" />
+    <div className="Dropzone isOccupied">
+      <div className="Draggable" />
     </div>
-    <div class="Draggable"></div>
+    <div className="Draggable" />
   </div>
-`;
+);
 
 describe('Droppable', () => {
   let sandbox;
diff --git a/src/Plugins/ResizeMirror/tests/ResizeMirror.test.ts b/src/Plugins/ResizeMirror/tests/ResizeMirror.test.tsx
similarity index 95%
rename from src/Plugins/ResizeMirror/tests/ResizeMirror.test.ts
rename to src/Plugins/ResizeMirror/tests/ResizeMirror.test.tsx
index 141d2282..051f969a 100644
--- a/src/Plugins/ResizeMirror/tests/ResizeMirror.test.ts
+++ b/src/Plugins/ResizeMirror/tests/ResizeMirror.test.tsx
@@ -17,17 +17,17 @@ import Draggable from '../../../Draggable';
 /* eslint-enable @typescript-eslint/ban-ts-comment */
 import ResizeMirror from '..';
 
-const sampleMarkup = `
-  <ul class="Container">
-    <li>Smaller item</li>
-  </ul>
-  <ul class="Container">
-    <li>Larger item</li>
-  </ul>
-  <ul class="Container">
-    <!-- Empty -->
-  </ul>
-`;
+const sampleMarkup = (
+  <>
+    <ul className="Container">
+      <li>Smaller item</li>
+    </ul>
+    <ul className="Container">
+      <li>Larger item</li>
+    </ul>
+    <ul className="Container">{/* Empty */}</ul>
+  </>
+);
 
 describe('ResizeMirror', () => {
   const smallerDraggableDimensions = {
diff --git a/src/Sortable/tests/Sortable.test.js b/src/Sortable/tests/Sortable.test.jsx
similarity index 96%
rename from src/Sortable/tests/Sortable.test.js
rename to src/Sortable/tests/Sortable.test.jsx
index 33643b94..3e9f30c7 100644
--- a/src/Sortable/tests/Sortable.test.js
+++ b/src/Sortable/tests/Sortable.test.jsx
@@ -9,20 +9,22 @@ import {
 
 import Sortable from '..';
 
-const sampleMarkup = `
-  <ul>
-    <li>First item</li>
-    <li>Second item</li>
-    <li>Third item</li>
-    <li>Forth item</li>
-  </ul>
-  <ul>
-    <li>Fith item</li>
-    <li>Sixth item</li>
-    <li>Seventh item</li>
-    <li>Eighth item</li>
-  </ul>
-`;
+const sampleMarkup = (
+  <>
+    <ul>
+      <li>First item</li>
+      <li>Second item</li>
+      <li>Third item</li>
+      <li>Forth item</li>
+    </ul>
+    <ul>
+      <li>Fith item</li>
+      <li>Sixth item</li>
+      <li>Seventh item</li>
+      <li>Eighth item</li>
+    </ul>
+  </>
+);
 
 describe('Sortable', () => {
   let sandbox;
diff --git a/src/Swappable/tests/Swappable.test.js b/src/Swappable/tests/Swappable.test.jsx
similarity index 95%
rename from src/Swappable/tests/Swappable.test.js
rename to src/Swappable/tests/Swappable.test.jsx
index 1447c0bd..2185d35a 100644
--- a/src/Swappable/tests/Swappable.test.js
+++ b/src/Swappable/tests/Swappable.test.jsx
@@ -9,20 +9,22 @@ import {
 
 import Swappable from '..';
 
-const sampleMarkup = `
-  <ul>
-    <li>First item</li>
-    <li>Second item</li>
-    <li>Third item</li>
-    <li>Forth item</li>
-  </ul>
-  <ul>
-    <li>Fith item</li>
-    <li>Sixth item</li>
-    <li>Seventh item</li>
-    <li>Eighth item</li>
-  </ul>
-`;
+const sampleMarkup = (
+  <>
+    <ul>
+      <li>First item</li>
+      <li>Second item</li>
+      <li>Third item</li>
+      <li>Forth item</li>
+    </ul>
+    <ul>
+      <li>Fith item</li>
+      <li>Sixth item</li>
+      <li>Seventh item</li>
+      <li>Eighth item</li>
+    </ul>
+  </>
+);
 
 describe('Swappable', () => {
   let sandbox;
diff --git a/src/shared/utils/closest/tests/closest.test.ts b/src/shared/utils/closest/tests/closest.test.tsx
similarity index 88%
rename from src/shared/utils/closest/tests/closest.test.ts
rename to src/shared/utils/closest/tests/closest.test.tsx
index f39b3c60..df9c20f3 100644
--- a/src/shared/utils/closest/tests/closest.test.ts
+++ b/src/shared/utils/closest/tests/closest.test.tsx
@@ -2,21 +2,19 @@ import {createSandbox} from 'helper';
 
 import closest from '../closest';
 
-const sampleMarkup = `
-  <div class="tree">
-    <section class="branch">
-      <ul class="twig">
-        <li class="leaf"></li>
-      </ul>
-    </section>
-  </div>
-`;
-
 describe('utils', () => {
   let sandbox: HTMLDivElement;
 
   beforeEach(() => {
-    sandbox = createSandbox(sampleMarkup);
+    sandbox = createSandbox(
+      <div className="tree">
+        <section className="branch">
+          <ul className="twig">
+            <li className="leaf" />
+          </ul>
+        </section>
+      </div>,
+    );
   });
 
   afterEach(() => {
diff --git a/test/helpers/environment.ts b/test/helpers/environment.ts
index ab68056b..c3f89071 100644
--- a/test/helpers/environment.ts
+++ b/test/helpers/environment.ts
@@ -1,8 +1,11 @@
 import {setImmediate} from 'timers';
 
-export function createSandbox(content: string) {
+import type {ReactElement} from 'react';
+import {renderToStaticMarkup} from 'react-dom/server';
+
+export function createSandbox(content: ReactElement) {
   const sandbox = document.createElement('div');
-  sandbox.innerHTML = content;
+  sandbox.innerHTML = renderToStaticMarkup(content);
   document.body.appendChild(sandbox);
 
   return sandbox;
diff --git a/test/setup.ts b/test/setup.ts
index d139f088..1de22888 100644
--- a/test/setup.ts
+++ b/test/setup.ts
@@ -1,3 +1,6 @@
+import 'react';
+import 'react-dom/server';
+
 import './matchers';
 
 /* eslint-disable jest/require-top-level-describe */
diff --git a/tsconfig.json b/tsconfig.json
index 74bba9a2..46028f9b 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -8,6 +8,7 @@
     "strictFunctionTypes": false,
     "emitDecoratorMetadata": false,
     "experimentalDecorators": false,
+    "jsx": "react-jsx",
     "paths": {
       "shared/*": ["./src/shared/*"],
       "helper": ["./test/helper.ts"]
diff --git a/yarn.lock b/yarn.lock
index 2fdd6af9..714a7699 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -771,6 +771,39 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.22.5"
 
+"@babel/plugin-transform-react-display-name@^7.22.5":
+  version "7.22.5"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.22.5.tgz#3c4326f9fce31c7968d6cb9debcaf32d9e279a2b"
+  integrity sha512-PVk3WPYudRF5z4GKMEYUrLjPl38fJSKNaEOkFuoprioowGuWN6w2RKznuFNSlJx7pzzXXStPUnNSOEO0jL5EVw==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.22.5"
+
+"@babel/plugin-transform-react-jsx-development@^7.22.5":
+  version "7.22.5"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.22.5.tgz#e716b6edbef972a92165cd69d92f1255f7e73e87"
+  integrity sha512-bDhuzwWMuInwCYeDeMzyi7TaBgRQei6DqxhbyniL7/VG4RSS7HtSL2QbY4eESy1KJqlWt8g3xeEBGPuo+XqC8A==
+  dependencies:
+    "@babel/plugin-transform-react-jsx" "^7.22.5"
+
+"@babel/plugin-transform-react-jsx@^7.22.15", "@babel/plugin-transform-react-jsx@^7.22.5":
+  version "7.22.15"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.22.15.tgz#7e6266d88705d7c49f11c98db8b9464531289cd6"
+  integrity sha512-oKckg2eZFa8771O/5vi7XeTvmM6+O9cxZu+kanTU7tD4sin5nO/G8jGJhq8Hvt2Z0kUoEDRayuZLaUlYl8QuGA==
+  dependencies:
+    "@babel/helper-annotate-as-pure" "^7.22.5"
+    "@babel/helper-module-imports" "^7.22.15"
+    "@babel/helper-plugin-utils" "^7.22.5"
+    "@babel/plugin-syntax-jsx" "^7.22.5"
+    "@babel/types" "^7.22.15"
+
+"@babel/plugin-transform-react-pure-annotations@^7.22.5":
+  version "7.22.5"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.22.5.tgz#1f58363eef6626d6fa517b95ac66fe94685e32c0"
+  integrity sha512-gP4k85wx09q+brArVinTXhWiyzLl9UpmGva0+mWyKxk6JZequ05x3eUcIUE+FyttPKJFRRVtAvQaJ6YF9h1ZpA==
+  dependencies:
+    "@babel/helper-annotate-as-pure" "^7.22.5"
+    "@babel/helper-plugin-utils" "^7.22.5"
+
 "@babel/plugin-transform-regenerator@^7.22.10":
   version "7.22.10"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.22.10.tgz#8ceef3bd7375c4db7652878b0241b2be5d0c3cca"
@@ -958,6 +991,18 @@
     "@babel/types" "^7.4.4"
     esutils "^2.0.2"
 
+"@babel/preset-react@^7.22.15":
+  version "7.22.15"
+  resolved "https://registry.yarnpkg.com/@babel/preset-react/-/preset-react-7.22.15.tgz#9a776892b648e13cc8ca2edf5ed1264eea6b6afc"
+  integrity sha512-Csy1IJ2uEh/PecCBXXoZGAZBeCATTuePzCSB7dLYWS0vOEj6CNpjxIhW4duWwZodBNueH7QO14WbGn8YyeuN9w==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.22.5"
+    "@babel/helper-validator-option" "^7.22.15"
+    "@babel/plugin-transform-react-display-name" "^7.22.5"
+    "@babel/plugin-transform-react-jsx" "^7.22.15"
+    "@babel/plugin-transform-react-jsx-development" "^7.22.5"
+    "@babel/plugin-transform-react-pure-annotations" "^7.22.5"
+
 "@babel/preset-typescript@^7.23.0":
   version "7.23.0"
   resolved "https://registry.yarnpkg.com/@babel/preset-typescript/-/preset-typescript-7.23.0.tgz#cc6602d13e7e5b2087c811912b87cf937a9129d9"
@@ -1820,11 +1865,37 @@
   resolved "https://registry.yarnpkg.com/@types/normalize-package-data/-/normalize-package-data-2.4.2.tgz#9b0e3e8533fe5024ad32d6637eb9589988b6fdca"
   integrity sha512-lqa4UEhhv/2sjjIQgjX8B+RBjj47eo0mzGasklVJ78UKGQY1r0VpB9XHDaZZO9qzEFDdy4MrXLuEaSmPrPSe/A==
 
+"@types/prop-types@*":
+  version "15.7.8"
+  resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.8.tgz#805eae6e8f41bd19e88917d2ea200dc992f405d3"
+  integrity sha512-kMpQpfZKSCBqltAJwskgePRaYRFukDkm1oItcAbC3gNELR20XIBcN9VRgg4+m8DKsTfkWeA4m4Imp4DDuWy7FQ==
+
+"@types/react-dom@^18.2.13":
+  version "18.2.13"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-18.2.13.tgz#89cd7f9ec8b28c8b6f0392b9591671fb4a9e96b7"
+  integrity sha512-eJIUv7rPP+EC45uNYp/ThhSpE16k22VJUknt5OLoH9tbXoi8bMhwLf5xRuWMywamNbWzhrSmU7IBJfPup1+3fw==
+  dependencies:
+    "@types/react" "*"
+
+"@types/react@*":
+  version "18.2.28"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.28.tgz#86877465c0fcf751659a36c769ecedfcfacee332"
+  integrity sha512-ad4aa/RaaJS3hyGz0BGegdnSRXQBkd1CCYDCdNjBPg90UUpLgo+WlJqb9fMYUxtehmzF3PJaTWqRZjko6BRzBg==
+  dependencies:
+    "@types/prop-types" "*"
+    "@types/scheduler" "*"
+    csstype "^3.0.2"
+
 "@types/resolve@1.20.2":
   version "1.20.2"
   resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-1.20.2.tgz#97d26e00cd4a0423b4af620abecf3e6f442b7975"
   integrity sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q==
 
+"@types/scheduler@*":
+  version "0.16.4"
+  resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.4.tgz#fedc3e5b15c26dc18faae96bf1317487cb3658cf"
+  integrity sha512-2L9ifAGl7wmXwP4v3pN4p2FLhD0O1qsJpvKmNin5VA8+UvNVb447UDaAEV6UdrkA+m/Xs58U1RFps44x6TFsVQ==
+
 "@types/semver@^7.3.12", "@types/semver@^7.5.0":
   version "7.5.3"
   resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.5.3.tgz#9a726e116beb26c24f1ccd6850201e1246122e04"
@@ -2940,6 +3011,11 @@ cssstyle@^2.3.0:
   dependencies:
     cssom "~0.3.6"
 
+csstype@^3.0.2:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.2.tgz#1d4bf9d572f11c14031f0436e1c10bc1f571f50b"
+  integrity sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==
+
 csv-generate@^3.4.3:
   version "3.4.3"
   resolved "https://registry.yarnpkg.com/csv-generate/-/csv-generate-3.4.3.tgz#bc42d943b45aea52afa896874291da4b9108ffff"
@@ -5591,7 +5667,7 @@ lodash@^4.1.0, lodash@^4.15.0, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.5.1:
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
 
-loose-envify@^1.0.0, loose-envify@^1.4.0:
+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
   integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -6325,6 +6401,14 @@ quick-lru@^4.0.1:
   resolved "https://registry.yarnpkg.com/quick-lru/-/quick-lru-4.0.1.tgz#5b8878f113a58217848c6482026c73e1ba57727f"
   integrity sha512-ARhCpm70fzdcvNQfPoy49IaanKkTlRWF2JMzqhcJbhSFRZv7nPTvZJdcY7301IPmvW+/p0RgIWnQDLJxifsQ7g==
 
+react-dom@^18.2.0:
+  version "18.2.0"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.2.0.tgz#22aaf38708db2674ed9ada224ca4aa708d821e3d"
+  integrity sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==
+  dependencies:
+    loose-envify "^1.1.0"
+    scheduler "^0.23.0"
+
 react-is@^16.13.1:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -6335,6 +6419,13 @@ react-is@^18.0.0:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b"
   integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==
 
+react@^18.2.0:
+  version "18.2.0"
+  resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5"
+  integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==
+  dependencies:
+    loose-envify "^1.1.0"
+
 read-pkg-up@^7.0.1:
   version "7.0.1"
   resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-7.0.1.tgz#f3a6135758459733ae2b95638056e1854e7ef507"
@@ -6680,6 +6771,13 @@ saxes@^6.0.0:
   dependencies:
     xmlchars "^2.2.0"
 
+scheduler@^0.23.0:
+  version "0.23.0"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.23.0.tgz#ba8041afc3d30eb206a487b6b384002e4e61fdfe"
+  integrity sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==
+  dependencies:
+    loose-envify "^1.1.0"
+
 "semver@2 || 3 || 4 || 5":
   version "5.7.2"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.2.tgz#48d55db737c3287cd4835e17fa13feace1c41ef8"