diff --git a/.github/workflows/acceptance.yml b/.github/workflows/acceptance.yml
index e6b4989a24..7f3e04d035 100644
--- a/.github/workflows/acceptance.yml
+++ b/.github/workflows/acceptance.yml
@@ -11,7 +11,7 @@ jobs:
       matrix:
         node-version: [18.x, 20.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
@@ -32,7 +32,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -42,7 +42,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -95,11 +95,11 @@ jobs:
       matrix:
         node-version: [18.x, 20.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -114,7 +114,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -124,7 +124,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -177,11 +177,11 @@ jobs:
       matrix:
         node-version: [18.x, 20.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -196,7 +196,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -206,7 +206,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -259,11 +259,11 @@ jobs:
       matrix:
         node-version: [18.x, 20.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -278,7 +278,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -288,7 +288,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -341,11 +341,11 @@ jobs:
       matrix:
         node-version: [18.x, 20.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -360,7 +360,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -370,7 +370,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -423,11 +423,11 @@ jobs:
       matrix:
         node-version: [18.x, 20.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -442,7 +442,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -452,7 +452,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -504,11 +504,11 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -523,7 +523,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -533,7 +533,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -586,11 +586,11 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -605,7 +605,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -615,7 +615,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -668,11 +668,11 @@ jobs:
   #     matrix:
   #       node-version: [18.x]
   #   steps:
-  #     - uses: actions/checkout@v3
+  #     - uses: actions/checkout@v4
 
   #     # node setup
   #     - name: Use Node.js ${{ matrix.node-version }}
-  #       uses: actions/setup-node@v3
+  #       uses: actions/setup-node@v4
   #       with:
   #         node-version: ${{ matrix.node-version }}
 
@@ -687,7 +687,7 @@ jobs:
   #       run: |
   #         echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-  #     - uses: actions/cache@v3
+  #     - uses: actions/cache@v4
   #       name: Setup pnpm cache
   #       with:
   #         path: ${{ env.STORE_PATH }}
@@ -739,11 +739,11 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -758,7 +758,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -768,7 +768,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -822,11 +822,11 @@ jobs:
         node-version: [18.x]
         # python-version: [3.7]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -841,7 +841,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -851,7 +851,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -932,11 +932,11 @@ jobs:
       project-directory: ./my-volto-app
 
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -951,7 +951,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -961,7 +961,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -1069,11 +1069,11 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -1088,7 +1088,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -1098,7 +1098,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
@@ -1140,7 +1140,7 @@ jobs:
       - uses: actions/upload-artifact@v1
         if: failure()
         with:
-          name: cypress-videos
+          name: cypress-videos-seamless
           path: packages/volto/cypress/videos
 
   multilingualseamless:
@@ -1153,11 +1153,11 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -1172,7 +1172,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -1182,7 +1182,7 @@ jobs:
 
       - name: Cache Cypress Binary
         id: cache-cypress-binary
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: ~/.cache/Cypress
           key: binary-${{ matrix.node-version }}-${{ hashFiles('package-lock.json') }}
diff --git a/.github/workflows/changelog.yml b/.github/workflows/changelog.yml
index c6a16acd47..04b8739752 100644
--- a/.github/workflows/changelog.yml
+++ b/.github/workflows/changelog.yml
@@ -12,7 +12,7 @@ jobs:
   towncrier:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         with:
           # Fetch all history
           fetch-depth: '0'
diff --git a/.github/workflows/code-analysis.yml b/.github/workflows/code-analysis.yml
index cdba0307d1..592bd0cb3e 100644
--- a/.github/workflows/code-analysis.yml
+++ b/.github/workflows/code-analysis.yml
@@ -10,11 +10,11 @@ jobs:
     name: Prettier
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ env.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.node-version }}
 
@@ -29,7 +29,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -47,11 +47,11 @@ jobs:
     name: ESlint
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ env.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.node-version }}
 
@@ -66,7 +66,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -87,11 +87,11 @@ jobs:
     name: Stylelint
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ env.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.node-version }}
 
@@ -106,7 +106,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -127,11 +127,11 @@ jobs:
     name: i18n
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ env.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.node-version }}
 
@@ -146,7 +146,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
diff --git a/.github/workflows/docs.yml b/.github/workflows/docs.yml
index 08763d2f3a..987ac42c7c 100644
--- a/.github/workflows/docs.yml
+++ b/.github/workflows/docs.yml
@@ -19,7 +19,7 @@ jobs:
       matrix:
         python-version: ['3.10']
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       - name: Set up Python ${{ matrix.python-version }}
         uses: actions/setup-python@v4
diff --git a/.github/workflows/unit.yml b/.github/workflows/unit.yml
index 9f2ec8ec26..a9cb936cdc 100644
--- a/.github/workflows/unit.yml
+++ b/.github/workflows/unit.yml
@@ -14,11 +14,11 @@ jobs:
       matrix:
         node-version: [18.x, 20.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -33,7 +33,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -64,11 +64,11 @@ jobs:
       matrix:
         node-version: [18.x, 20.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -83,7 +83,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -105,11 +105,11 @@ jobs:
       matrix:
         node-version: [18.x, 20.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       # node setup
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 
@@ -124,7 +124,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
@@ -141,10 +141,10 @@ jobs:
     name: '@plone/client'
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       - name: Use Node.js ${{ env.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.node-version }}
 
@@ -159,7 +159,7 @@ jobs:
         run: |
           echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
 
-      - uses: actions/cache@v3
+      - uses: actions/cache@v4
         name: Setup pnpm cache
         with:
           path: ${{ env.STORE_PATH }}
diff --git a/docs/source/upgrade-guide/index.md b/docs/source/upgrade-guide/index.md
index a89577132b..06427363f5 100644
--- a/docs/source/upgrade-guide/index.md
+++ b/docs/source/upgrade-guide/index.md
@@ -28,6 +28,27 @@ Thus it is safe to run it on top of your project and answer the prompts.
 
 ## Upgrading to Volto 18.x.x
 
+### Volto runs now on React 18.2.0
+
+We have updated Volto to use React 18.
+This has been the latest published stable version since June 2022.
+This aligns Volto with the latests developments in the React ecosystem and opens the door to up to date software and React features, like client side `Suspense` and others:
+
+- Concurrent rendering in client (Suspense)
+- Automatic batching updates
+- Transitions
+- New hooks `useId`, `useTransition`, `useDeferredValue`, `useSyncExternalStore`, and other hooks
+
+### `react-portal` dependency removed
+
+`react-portal` is deprecated and it was removed from Volto.
+The Volto code that relied on it was mainly CMS UI components.
+If your project relies on it, either in your code or the shadowed components you may have, you should update to use the standard React API, `createPortal`.
+You can update your shadows taking the modified components as templates.
+As a last resort, you can install `react-portal` as a dependency of your project.
+However, this is discouraged, because the React 18 rendering could have unexpected side effects.
+It is recommended that you use the React API instead.
+
 ### ESlint project configuration update
 
 `@plone/registry` and [other packages on which Volto depends](https://github.com/plone/volto/tree/main/packages) are now stand-alone releases in the monorepo structure released in 18.0.0-alpha.4.
diff --git a/packages/coresandbox/package.json b/packages/coresandbox/package.json
index e90e2e480c..aaf007882e 100644
--- a/packages/coresandbox/package.json
+++ b/packages/coresandbox/package.json
@@ -26,17 +26,17 @@
     "react"
   ],
   "peerDependencies": {
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
     "react-intl": "3.8.0",
     "react-redux": "7.2.4",
     "semantic-ui-react": "2.0.3"
   },
   "devDependencies": {
     "@plone/types": "workspace:*",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
     "@plone/registry": "workspace:*",
-    "@types/react": "^17.0.52",
-    "@types/react-dom": "^17",
     "@types/react-redux": "^7.1.33"
   }
 }
diff --git a/packages/registry/news/3221.feature b/packages/registry/news/3221.feature
new file mode 100644
index 0000000000..3260496e2f
--- /dev/null
+++ b/packages/registry/news/3221.feature
@@ -0,0 +1 @@
+Upgrade Volto core to use React 18.2.0 @sneridagh
diff --git a/packages/registry/package.json b/packages/registry/package.json
index f25299a8aa..d728d06749 100644
--- a/packages/registry/package.json
+++ b/packages/registry/package.json
@@ -76,9 +76,11 @@
     "@parcel/packager-ts": "2.10.2",
     "@parcel/transformer-typescript-types": "2.10.2",
     "@plone/types": "workspace:*",
-    "@types/react": "^17.0.52",
-    "@types/react-dom": "^17",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
     "parcel": "2.10.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "release-it": "16.2.1",
     "tsconfig": "workspace:*",
     "typescript": "5.2.2",
diff --git a/packages/types/news/3221.feature b/packages/types/news/3221.feature
new file mode 100644
index 0000000000..3260496e2f
--- /dev/null
+++ b/packages/types/news/3221.feature
@@ -0,0 +1 @@
+Upgrade Volto core to use React 18.2.0 @sneridagh
diff --git a/packages/types/package.json b/packages/types/package.json
index 7520438490..7f0eb8bcec 100644
--- a/packages/types/package.json
+++ b/packages/types/package.json
@@ -50,10 +50,12 @@
   "devDependencies": {
     "@parcel/packager-ts": "2.10.2",
     "@parcel/transformer-typescript-types": "2.10.2",
-    "@types/react": "^17.0.52",
-    "@types/react-dom": "^17",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
     "history": "^5.3.0",
     "parcel": "2.10.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "react-intl": "3.8.0",
     "release-it": "16.2.1",
     "tsconfig": "workspace:*",
diff --git a/packages/volto-slate/news/3221.feature b/packages/volto-slate/news/3221.feature
new file mode 100644
index 0000000000..3260496e2f
--- /dev/null
+++ b/packages/volto-slate/news/3221.feature
@@ -0,0 +1 @@
+Upgrade Volto core to use React 18.2.0 @sneridagh
diff --git a/packages/volto-slate/package.json b/packages/volto-slate/package.json
index 8eadc11fee..512bc8818b 100644
--- a/packages/volto-slate/package.json
+++ b/packages/volto-slate/package.json
@@ -21,9 +21,9 @@
     "image-extensions": "1.1.0",
     "is-url": "1.2.4",
     "jsdom": "^16.6.0",
-    "react": "17.0.2",
+    "react": "18.2.0",
     "react-intersection-observer": "9.1.0",
-    "react-dom": "17.0.2",
+    "react-dom": "18.2.0",
     "slate": "0.100.0",
     "slate-history": "0.100.0",
     "slate-hyperscript": "0.100.0",
diff --git a/packages/volto-slate/src/blocks/Text/PluginSidebar.jsx b/packages/volto-slate/src/blocks/Text/PluginSidebar.jsx
index 3858e9448f..a5a3185a05 100644
--- a/packages/volto-slate/src/blocks/Text/PluginSidebar.jsx
+++ b/packages/volto-slate/src/blocks/Text/PluginSidebar.jsx
@@ -1,16 +1,15 @@
 import React from 'react';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 
 const PluginSidebar = ({ children, selected }) => {
   return (
     <>
-      {selected && (
-        <Portal
-          node={__CLIENT__ && document.getElementById('slate-plugin-sidebar')}
-        >
-          {children}
-        </Portal>
-      )}
+      {selected &&
+        __CLIENT__ &&
+        createPortal(
+          <>{children}</>,
+          document.getElementById('slate-plugin-sidebar'),
+        )}
     </>
   );
 };
diff --git a/packages/volto-slate/src/blocks/Text/extensions/breakList.js b/packages/volto-slate/src/blocks/Text/extensions/breakList.js
index c02e74ec13..b4117a0d8b 100644
--- a/packages/volto-slate/src/blocks/Text/extensions/breakList.js
+++ b/packages/volto-slate/src/blocks/Text/extensions/breakList.js
@@ -77,8 +77,8 @@ export const breakList = (editor) => {
     Editor.deleteBackward(editor, { unit: 'line' });
     // also account for empty nodes [{text: ''}]
     if (Editor.isEmpty(editor, parent)) {
-      Transforms.removeNodes(editor, { at: ref.current });
       createAndSelectNewBlockAfter(editor, [createEmptyParagraph()]);
+      Transforms.removeNodes(editor, { at: ref.current });
       return true;
     }
 
diff --git a/packages/volto-slate/src/blocks/Text/extensions/insertBreak.js b/packages/volto-slate/src/blocks/Text/extensions/insertBreak.js
index 258aa7d382..d767c30ab6 100644
--- a/packages/volto-slate/src/blocks/Text/extensions/insertBreak.js
+++ b/packages/volto-slate/src/blocks/Text/extensions/insertBreak.js
@@ -42,9 +42,9 @@ export const withSplitBlocksOnBreak = (editor) => {
         // deconstructToVoltoBlocks
         ReactDOM.unstable_batchedUpdates(() => {
           const [top, bottom] = splitEditorInTwoFragments(editor);
-          setEditorContent(editor, top);
           // ReactEditor.blur(editor);
           createAndSelectNewBlockAfter(editor, bottom);
+          setEditorContent(editor, top);
         });
       }
       return;
diff --git a/packages/volto-slate/src/editor/SlateEditor.jsx b/packages/volto-slate/src/editor/SlateEditor.jsx
index d59e8b3f4a..fe8457b191 100644
--- a/packages/volto-slate/src/editor/SlateEditor.jsx
+++ b/packages/volto-slate/src/editor/SlateEditor.jsx
@@ -166,7 +166,14 @@ class SlateEditor extends Component {
         ReactEditor.focus(editor);
         Transforms.select(editor, selection);
       } else {
-        Transforms.select(editor, Editor.end(editor, []));
+        try {
+          Transforms.select(editor, Editor.end(editor, []));
+        } catch (error) {
+          // Weird error only happening in Cypress
+          // Adding a try/catch
+          // eslint-disable-next-line no-console
+          console.log(error);
+        }
       }
 
       this.setState({
diff --git a/packages/volto-slate/src/editor/ui/PositionedToolbar.jsx b/packages/volto-slate/src/editor/ui/PositionedToolbar.jsx
index 93ab6d27d2..1ea7ab68ce 100644
--- a/packages/volto-slate/src/editor/ui/PositionedToolbar.jsx
+++ b/packages/volto-slate/src/editor/ui/PositionedToolbar.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 
 import BasicToolbar from './BasicToolbar';
 
@@ -20,12 +20,11 @@ const PositionedToolbar = ({ toggleButton, className, children, position }) => {
     el.style.left = left;
   });
 
-  return (
-    <Portal>
-      <BasicToolbar className={`slate-inline-toolbar ${className}`} ref={ref}>
-        {children}
-      </BasicToolbar>
-    </Portal>
+  return createPortal(
+    <BasicToolbar className={`slate-inline-toolbar ${className}`} ref={ref}>
+      {children}
+    </BasicToolbar>,
+    document.body,
   );
 };
 
diff --git a/packages/volto-slate/src/editor/ui/Toolbar.jsx b/packages/volto-slate/src/editor/ui/Toolbar.jsx
index 2d7406e12f..4e7afc51de 100644
--- a/packages/volto-slate/src/editor/ui/Toolbar.jsx
+++ b/packages/volto-slate/src/editor/ui/Toolbar.jsx
@@ -1,11 +1,11 @@
 import cx from 'classnames';
 import React, { useRef, useEffect } from 'react';
-import { Portal } from 'react-portal';
 import { useSlate } from 'slate-react';
 import Separator from './Separator';
 import BasicToolbar from './BasicToolbar';
 import { Editor, Node } from 'slate';
 import { ReactEditor } from 'slate-react';
+import { createPortal } from 'react-dom';
 
 const Toolbar = ({
   elementType,
@@ -82,21 +82,20 @@ const Toolbar = ({
     )}px`;
   });
 
-  return (
-    <Portal>
-      <BasicToolbar
-        className={cx('slate-inline-toolbar', { [className]: className })}
-        ref={ref}
-      >
-        {children}
-        {enableExpando && toggleButton && (
-          <>
-            <Separator />
-            {toggleButton}
-          </>
-        )}
-      </BasicToolbar>
-    </Portal>
+  return createPortal(
+    <BasicToolbar
+      className={cx('slate-inline-toolbar', { [className]: className })}
+      ref={ref}
+    >
+      {children}
+      {enableExpando && toggleButton && (
+        <>
+          <Separator />
+          {toggleButton}
+        </>
+      )}
+    </BasicToolbar>,
+    document.body,
   );
 };
 
diff --git a/packages/volto/cypress/tests/core/basic/folder-contents.js b/packages/volto/cypress/tests/core/basic/folder-contents.js
index 71dcaf9306..6efb50fe7e 100644
--- a/packages/volto/cypress/tests/core/basic/folder-contents.js
+++ b/packages/volto/cypress/tests/core/basic/folder-contents.js
@@ -130,25 +130,23 @@ describe('Folder Contents Tests', () => {
   });
 
   it('Move items to top of folder and bottom of folder', () => {
+    cy.intercept('GET', `/**/@search*`).as('search');
+    cy.intercept('PATCH', `/**/my-folder`).as('reorder');
     // creating a Document
-    cy.createContent({
-      contentType: 'Document',
-      contentId: 'child',
-      contentTitle: 'My Child',
-      path: 'my-folder',
-    });
-
-    // doing copy paste for dummy data
-    cy.get('svg[class="icon unchecked"]').click();
-    cy.get('svg[class="icon copy"]').click();
     var genArr = Array.from({ length: 56 }, (v, k) => k + 1);
-    cy.wrap(genArr).each((index) => {
-      cy.get('svg[class="icon paste"]').click({ force: true });
+    genArr.forEach((item) => {
+      cy.createContent({
+        contentType: 'Document',
+        contentTitle: 'My Child',
+        path: 'my-folder',
+      });
     });
-    cy.wait(2000); // just for clearing of toast
 
     // after adding 56 page I need to add a final page to move around.
     // when I add a page
+    cy.visit('/my-folder');
+    cy.wait('@content');
+
     cy.get('#toolbar-add').click();
     cy.get('#toolbar-add-document').click();
     cy.getSlateTitle()
@@ -159,6 +157,7 @@ describe('Folder Contents Tests', () => {
 
     // then a new page has been created
     cy.get('#toolbar-save').click();
+    cy.wait('@content');
     cy.url().should(
       'eq',
       Cypress.config().baseUrl + '/my-folder/last-and-first-page',
@@ -171,7 +170,7 @@ describe('Folder Contents Tests', () => {
     ).click();
     cy.findByText('Move to top of folder').click();
     cy.url().should('eq', Cypress.config().baseUrl + '/my-folder/contents');
-    cy.wait(1000); // waiting for settling of odering or search return
+    cy.wait('@reorder');
 
     // Checking if move to top of folder works or not.
     cy.get('table tbody tr:first-child a span').findByText(
@@ -181,6 +180,7 @@ describe('Folder Contents Tests', () => {
       'tr[aria-label="/my-folder/last-and-first-page"] svg[class="icon dropdown-popup-trigger"]',
     ).click();
     cy.findByText('Move to bottom of folder').click();
+    cy.wait('@reorder');
 
     // Checking whether moving to bottom of folder works or not.
     cy.get('.contents-pagination .menu').findByText('2').click();
@@ -195,7 +195,8 @@ describe('Folder Contents Tests', () => {
     cy.get(
       'tr[aria-label="/my-folder/last-and-first-page"] svg[class="icon dropdown-popup-trigger"]',
     ).click();
-    // cy.intercept('GET', '/plone/++api++/my-folder/@search').as('getSearch'); // I don't know proper way to wait
+    cy.wait('@search');
+
     cy.findByText('Move to top of folder').click();
     cy.get('.search.item button').click();
 
@@ -207,6 +208,8 @@ describe('Folder Contents Tests', () => {
       'tr[aria-label="/my-folder/last-and-first-page"] svg[class="icon dropdown-popup-trigger"]',
     ).click();
     cy.findByText('Move to bottom of folder').click();
+    cy.wait('@reorder');
+
     cy.get('.contents-pagination .menu').findByText('2').click();
 
     // Checking whether moving to bottom of folder works or not.
diff --git a/packages/volto/cypress/tests/core/blocks/blocks-autofocus.js b/packages/volto/cypress/tests/core/blocks/blocks-autofocus.js
index fed851ad51..ef48d8f8bb 100644
--- a/packages/volto/cypress/tests/core/blocks/blocks-autofocus.js
+++ b/packages/volto/cypress/tests/core/blocks/blocks-autofocus.js
@@ -1,7 +1,7 @@
 describe('New Block Auto Focus Tests', () => {
   beforeEach(() => {
-    cy.intercept('GET', `/**/*?expand*`).as('content');
     cy.intercept('GET', '/**/my-page').as('content');
+    cy.intercept('GET', '/**/Document').as('schema');
     cy.intercept('PATCH', '*').as('save');
 
     // given a logged in editor and a page in edit mode
@@ -15,12 +15,17 @@ describe('New Block Auto Focus Tests', () => {
     cy.visit('/my-page');
     cy.wait('@content');
 
+    cy.wait(500);
+
     cy.navigate('/my-page/edit');
+    cy.wait('@schema');
   });
 
   it('Press Enter on a description block adds new autofocused default block', () => {
     cy.addNewBlock('description');
     cy.get('.documentDescription').first().click().type('{enter}');
+    cy.get('.block-editor-description + .block-editor-slate');
+    cy.wait(500);
     cy.get('*[class^="block-editor"]')
       .eq(2)
       .within(() => {
@@ -34,6 +39,8 @@ describe('New Block Auto Focus Tests', () => {
     cy.get('.blocks-chooser .title').contains('Text').click({ force: true });
     cy.get('.blocks-chooser .text').contains('Text').click({ force: true });
     cy.get('.text-slate-editor-inner').first().click().type('{enter}');
+    cy.wait(500);
+    cy.get('.block-editor-slate + .block-editor-slate');
     cy.get('*[class^="block-editor"]')
       .eq(2)
       .within(() => {
@@ -43,7 +50,15 @@ describe('New Block Auto Focus Tests', () => {
 
   it('Press Enter on a image block adds new autofocused default block', () => {
     cy.addNewBlock('image');
-    cy.get('.block-editor-image').first().click().type('{enter}');
+    // Timing issues ahead :(
+    cy.get('.block-editor-image .no-image-wrapper img')
+      .should('be.visible')
+      .and(($img) => {
+        // "naturalWidth" and "naturalHeight" are set when the image loads
+        expect($img[0].naturalWidth).to.be.greaterThan(0);
+      });
+    cy.get('.block-editor-image').wait(500).click('topLeft').type('{enter}');
+    cy.wait(500);
     cy.get('*[class^="block-editor"]')
       .eq(2)
       .within(() => {
@@ -53,7 +68,15 @@ describe('New Block Auto Focus Tests', () => {
 
   it('Press Enter on a video block adds new autofocused default block', () => {
     cy.addNewBlock('video');
+    cy.get('.block-editor-video .message img')
+      .should('be.visible')
+      .and(($img) => {
+        // "naturalWidth" and "naturalHeight" are set when the image loads
+        expect($img[0].naturalWidth).to.be.greaterThan(0);
+      });
     cy.get('.block-editor-video').first().click().type('{enter}');
+    cy.get('.block-editor-slate + .block-editor-slate');
+    cy.wait(500);
     cy.get('*[class^="block-editor"]')
       .eq(2)
       .within(() => {
@@ -64,6 +87,7 @@ describe('New Block Auto Focus Tests', () => {
   it('Press Enter on a listing block adds new autofocused default block', () => {
     cy.addNewBlock('listing');
     cy.get('.block-editor-listing').first().click().type('{enter}');
+    cy.wait(500);
     cy.get('*[class^="block-editor"]')
       .eq(2)
       .within(() => {
@@ -74,6 +98,7 @@ describe('New Block Auto Focus Tests', () => {
   it('Press Enter on a table of contents block adds new autofocused default block', () => {
     cy.addNewBlock('contents');
     cy.get('.block-editor-toc').first().click().type('{enter}');
+    cy.wait(500);
     cy.get('*[class^="block-editor"]')
       .eq(2)
       .within(() => {
@@ -83,7 +108,14 @@ describe('New Block Auto Focus Tests', () => {
 
   it('Press Enter on a maps block adds new autofocused default block', () => {
     cy.addNewBlock('maps');
+    cy.get('.block-editor-maps .message img')
+      .should('be.visible')
+      .and(($img) => {
+        // "naturalWidth" and "naturalHeight" are set when the image loads
+        expect($img[0].naturalWidth).to.be.greaterThan(0);
+      });
     cy.get('.block-editor-maps').first().click().type('{enter}');
+    cy.wait(500);
     cy.get('*[class^="block-editor"]')
       .eq(2)
       .within(() => {
@@ -94,6 +126,7 @@ describe('New Block Auto Focus Tests', () => {
   it('Press Enter on a html block adds new autofocused default block', () => {
     cy.addNewBlock('html');
     cy.get('.block-editor-html').first().click().type('{enter}');
+    cy.wait(500);
     cy.get('*[class^="block-editor"]')
       .eq(2)
       .within(() => {
@@ -104,6 +137,7 @@ describe('New Block Auto Focus Tests', () => {
   it('Press Enter on a search block adds new autofocused default block', () => {
     cy.addNewBlock('search');
     cy.get('.block-editor-search').first().click().type('{enter}');
+    cy.wait(500);
     cy.get('*[class^="block-editor"]')
       .eq(2)
       .within(() => {
diff --git a/packages/volto/cypress/tests/core/blocks/blocks-image.js b/packages/volto/cypress/tests/core/blocks/blocks-image.js
index e96bb1dd21..9b76682372 100644
--- a/packages/volto/cypress/tests/core/blocks/blocks-image.js
+++ b/packages/volto/cypress/tests/core/blocks/blocks-image.js
@@ -15,6 +15,8 @@ describe('Blocks Tests', () => {
     cy.visit('/my-page');
     cy.wait('@content');
 
+    cy.wait(500);
+
     cy.navigate('/my-page/edit');
     cy.wait('@schema');
   });
@@ -156,7 +158,7 @@ describe('Blocks Tests', () => {
       });
   });
 
-  it('Create an image block and initially alt attr is empty', () => {
+  it.only('Create an image block and initially alt attr is empty', () => {
     // when I add an image block via upload
     cy.get('.content-area .slate-editor [contenteditable=true]', {
       timeout: 10000,
diff --git a/packages/volto/cypress/tests/core/blocks/listing/blocks-listing.js b/packages/volto/cypress/tests/core/blocks/listing/blocks-listing.js
index cc4f5e13d8..ab7c82bfcf 100644
--- a/packages/volto/cypress/tests/core/blocks/listing/blocks-listing.js
+++ b/packages/volto/cypress/tests/core/blocks/listing/blocks-listing.js
@@ -445,7 +445,9 @@ describe('Listing Block Tests', () => {
 
     //add listing block
     cy.scrollTo('bottom');
-    cy.addNewBlock('listing', true);
+    cy.getSlate().click();
+    cy.get('.ui.basic.icon.button.block-add-button').click();
+    cy.get('.ui.basic.icon.button.listing').contains('Listing').click();
 
     //********  add Page Type criteria filter
     cy.configureListingWith('Page');
diff --git a/packages/volto/cypress/tests/core/controlpanels/dexterity-controlpanel-layout.js b/packages/volto/cypress/tests/core/controlpanels/dexterity-controlpanel-layout.js
index 35a24d1b65..20b1a097e6 100644
--- a/packages/volto/cypress/tests/core/controlpanels/dexterity-controlpanel-layout.js
+++ b/packages/volto/cypress/tests/core/controlpanels/dexterity-controlpanel-layout.js
@@ -21,7 +21,7 @@ describe('ControlPanel: Dexterity Content-Types Layout', () => {
       'Book',
     );
 
-    cy.visit('/controlpanel/dexterity-types/book/layout');
+    cy.navigate('/controlpanel/dexterity-types/book/layout');
     cy.get('#page-controlpanel-layout').contains(
       'Can not edit Layout for Book',
     );
diff --git a/packages/volto/jest-setup-afterenv.js b/packages/volto/jest-setup-afterenv.js
new file mode 100644
index 0000000000..8c79262657
--- /dev/null
+++ b/packages/volto/jest-setup-afterenv.js
@@ -0,0 +1,2 @@
+// Jest-crap setup after env T_T
+import '@testing-library/jest-dom';
diff --git a/packages/volto/news/3221.breaking b/packages/volto/news/3221.breaking
new file mode 100644
index 0000000000..3260496e2f
--- /dev/null
+++ b/packages/volto/news/3221.breaking
@@ -0,0 +1 @@
+Upgrade Volto core to use React 18.2.0 @sneridagh
diff --git a/packages/volto/package.json b/packages/volto/package.json
index 582e195212..8529184635 100644
--- a/packages/volto/package.json
+++ b/packages/volto/package.json
@@ -110,6 +110,9 @@
       "./test-setup-config.js"
     ],
     "globalSetup": "./global-test-setup.js",
+    "setupFilesAfterEnv": [
+      "<rootDir>/jest-setup-afterenv.js"
+    ],
     "globals": {
       "__DEV__": true
     },
@@ -276,7 +279,7 @@
     "razzle-dev-utils": "4.2.18",
     "razzle-plugin-scss": "4.2.18",
     "rc-time-picker": "3.7.3",
-    "react": "17.0.2",
+    "react": "18.2.0",
     "react-anchor-link-smooth-scroll": "1.0.12",
     "react-animate-height": "2.0.17",
     "react-beautiful-dnd": "13.0.0",
@@ -285,17 +288,16 @@
     "react-detect-click-outside": "1.1.1",
     "react-dnd": "5.0.0",
     "react-dnd-html5-backend": "5.0.1",
-    "react-dom": "17.0.2",
+    "react-dom": "18.2.0",
     "react-dropzone": "11.1.0",
     "react-fast-compare": "2.0.4",
     "react-image-gallery": "1.2.7",
     "react-intersection-observer": "9.1.0",
     "react-intl": "3.8.0",
-    "react-intl-redux": "2.2.0",
+    "react-intl-redux": "2.3.0",
     "react-medium-image-zoom": "3.0.15",
     "react-popper": "^2.3.0",
-    "react-portal": "4.2.1",
-    "react-redux": "7.2.4",
+    "react-redux": "8.1.2",
     "react-router": "5.2.0",
     "react-router-config": "5.1.1",
     "react-router-dom": "5.2.0",
@@ -303,21 +305,21 @@
     "react-select": "4.3.1",
     "react-select-async-paginate": "0.5.3",
     "react-share": "2.3.1",
-    "react-side-effect": "2.1.0",
+    "react-side-effect": "2.1.2",
     "react-simple-code-editor": "0.7.1",
     "react-sortable-hoc": "2.0.0",
-    "react-test-renderer": "17.0.2",
+    "react-test-renderer": "18.2.0",
     "react-toastify": "5.4.1",
     "react-transition-group": "4.4.5",
     "react-virtualized": "9.22.3",
     "redraft": "0.10.2",
-    "redux": "4.1.0",
-    "redux-actions": "2.6.5",
+    "redux": "4.2.1",
+    "redux-actions": "3.0.0",
     "redux-connect": "10.0.0",
-    "redux-devtools-extension": "2.13.8",
-    "redux-localstorage-simple": "2.3.1",
+    "redux-devtools-extension": "2.13.9",
+    "redux-localstorage-simple": "2.5.1",
     "redux-mock-store": "1.5.4",
-    "redux-thunk": "2.3.0",
+    "redux-thunk": "2.4.2",
     "rrule": "2.7.1",
     "semantic-ui-less": "2.4.1",
     "semantic-ui-react": "2.1.5",
@@ -362,13 +364,15 @@
     "@storybook/manager-webpack5": "^6.5.15",
     "@storybook/react": "^6.5.15",
     "@testing-library/cypress": "9.0.0",
-    "@testing-library/jest-dom": "5.16.4",
-    "@testing-library/react": "12.1.5",
+    "@testing-library/jest-dom": "6.4.1",
+    "@testing-library/react": "14.2.0",
     "@testing-library/react-hooks": "8.0.1",
     "@types/jest": "^29.5.8",
     "@types/lodash": "^4.14.201",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
     "@types/react-router-dom": "^5.3.3",
-    "@types/react-test-renderer": "18.0.1",
+    "@types/react-test-renderer": "18.0.7",
     "@types/uuid": "^9.0.2",
     "@typescript-eslint/eslint-plugin": "6.7.0",
     "@typescript-eslint/parser": "6.7.0",
@@ -385,7 +389,7 @@
     "jsonwebtoken": "9.0.0",
     "react-docgen-typescript-plugin": "^1.0.5",
     "react-error-overlay": "6.0.9",
-    "react-is": "^16.13.1",
+    "react-is": "^18.2.0",
     "release-it": "^16.2.1",
     "semver": "^7.5.4",
     "tmp": "0.2.1",
diff --git a/packages/volto/src/components/manage/Add/Add.jsx b/packages/volto/src/components/manage/Add/Add.jsx
index d1c14bee17..c16b41e2d7 100644
--- a/packages/volto/src/components/manage/Add/Add.jsx
+++ b/packages/volto/src/components/manage/Add/Add.jsx
@@ -11,7 +11,7 @@ import { compose } from 'redux';
 import { keys, isEmpty } from 'lodash';
 import { defineMessages, injectIntl } from 'react-intl';
 import { Button, Grid, Menu } from 'semantic-ui-react';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { v4 as uuid } from 'uuid';
 import qs from 'query-string';
 import { toast } from 'react-toastify';
@@ -366,8 +366,8 @@ class Add extends Component {
             }}
             global
           />
-          {this.state.isClient && (
-            <Portal node={document.getElementById('toolbar')}>
+          {this.state.isClient &&
+            createPortal(
               <Toolbar
                 pathname={this.props.pathname}
                 hideDefaultViewButtons
@@ -400,14 +400,12 @@ class Add extends Component {
                     </Button>
                   </>
                 }
-              />
-            </Portal>
-          )}
-          {visual && this.state.isClient && (
-            <Portal node={document.getElementById('sidebar')}>
-              <Sidebar />
-            </Portal>
-          )}
+              />,
+              document.getElementById('toolbar'),
+            )}
+          {visual &&
+            this.state.isClient &&
+            createPortal(<Sidebar />, document.getElementById('sidebar'))}
         </div>
       );
 
diff --git a/packages/volto/src/components/manage/Add/Add.test.jsx b/packages/volto/src/components/manage/Add/Add.test.jsx
index 2a1ee56192..4d6500e885 100644
--- a/packages/volto/src/components/manage/Add/Add.test.jsx
+++ b/packages/volto/src/components/manage/Add/Add.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import config from '@plone/volto/registry';
@@ -16,9 +16,8 @@ beforeAll(() => {
   config.settings.loadables = {};
 });
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../Form/Form', () => jest.fn(() => <div className="Form" />));
 
 describe('Add', () => {
@@ -39,13 +38,12 @@ describe('Add', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <Add location={{ pathname: '/blog', search: { type: 'Document' } }} />
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+    expect(container).toMatchSnapshot();
   });
 
   it('renders an add component', () => {
@@ -67,13 +65,13 @@ describe('Add', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <Add location={{ pathname: '/blog', search: { type: 'Document' } }} />
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders an add component with schema', () => {
@@ -106,12 +104,12 @@ describe('Add', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <Add location={{ pathname: '/blog', search: { type: 'Document' } }} />
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Add/__snapshots__/Add.test.jsx.snap b/packages/volto/src/components/manage/Add/__snapshots__/Add.test.jsx.snap
index 00ad89f369..e0b4e6d306 100644
--- a/packages/volto/src/components/manage/Add/__snapshots__/Add.test.jsx.snap
+++ b/packages/volto/src/components/manage/Add/__snapshots__/Add.test.jsx.snap
@@ -1,7 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Add renders an add component 1`] = `<div />`;
+exports[`Add renders an add component 1`] = `
+<div>
+  <div />
+</div>
+`;
 
-exports[`Add renders an add component with schema 1`] = `<div />`;
+exports[`Add renders an add component with schema 1`] = `
+<div>
+  <div />
+</div>
+`;
 
-exports[`Add renders an empty add component 1`] = `<div />`;
+exports[`Add renders an empty add component 1`] = `
+<div>
+  <div />
+</div>
+`;
diff --git a/packages/volto/src/components/manage/Aliases/Aliases.jsx b/packages/volto/src/components/manage/Aliases/Aliases.jsx
index 7554a9f20f..15af7a0326 100644
--- a/packages/volto/src/components/manage/Aliases/Aliases.jsx
+++ b/packages/volto/src/components/manage/Aliases/Aliases.jsx
@@ -8,7 +8,7 @@ import { Helmet } from '@plone/volto/helpers';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Button,
   Checkbox,
@@ -317,8 +317,8 @@ class Aliases extends Component {
             </Segment>
           </Form>
         </Segment.Group>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -335,9 +335,9 @@ class Aliases extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Aliases/Aliases.test.jsx b/packages/volto/src/components/manage/Aliases/Aliases.test.jsx
index 31350c8d94..3ded78f739 100644
--- a/packages/volto/src/components/manage/Aliases/Aliases.test.jsx
+++ b/packages/volto/src/components/manage/Aliases/Aliases.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
@@ -9,9 +9,8 @@ import Aliases from './Aliases';
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../Toolbar/More', () => jest.fn(() => <div className="More" />));
 
 describe('Aliases', () => {
@@ -45,12 +44,13 @@ describe('Aliases', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <Aliases location={{ pathname: '/blog/aliases' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Aliases/__snapshots__/Aliases.test.jsx.snap b/packages/volto/src/components/manage/Aliases/__snapshots__/Aliases.test.jsx.snap
index 85b8d5c307..5bfa3e94a7 100644
--- a/packages/volto/src/components/manage/Aliases/__snapshots__/Aliases.test.jsx.snap
+++ b/packages/volto/src/components/manage/Aliases/__snapshots__/Aliases.test.jsx.snap
@@ -1,96 +1,97 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Aliases renders aliases object control 1`] = `
-<div
-  className="ui container"
-  id="aliases"
->
+<div>
   <div
-    className="ui raised segments"
+    class="ui container"
+    id="aliases"
   >
     <div
-      className="ui segment primary"
-    >
-      URL Management for 
-      <q>
-        Blog
-      </q>
-    </div>
-    <div
-      className="ui secondary segment"
-    >
-      Using this form, you can manage alternative urls for an item. This is an easy way to make an item available under two different URLs.
-    </div>
-    <form
-      className="ui form"
-      onSubmit={[Function]}
+      class="ui raised segments"
     >
       <div
-        className="ui segment"
+        class="ui segment primary"
+      >
+        URL Management for 
+        <q>
+          Blog
+        </q>
+      </div>
+      <div
+        class="ui secondary segment"
+      >
+        Using this form, you can manage alternative urls for an item. This is an easy way to make an item available under two different URLs.
+      </div>
+      <form
+        class="ui form"
       >
         <div
-          className="ui medium header"
-        >
-          Add a new alternative url
-        </div>
-        <p
-          className="help"
-        >
-          Enter the absolute path where the alternative url should exist. The path must start with '/'. Only urls that result in a 404 not found page will result in a redirect occurring.
-        </p>
-        <div
-          className="field"
+          class="ui segment"
         >
           <div
-            className="ui input"
+            class="ui medium header"
           >
-            <input
-              id="alternative-url-input"
-              name="alternative-url"
-              onChange={[Function]}
-              placeholder="/example"
-              type="text"
-              value=""
-            />
+            Add a new alternative url
           </div>
+          <p
+            class="help"
+          >
+            Enter the absolute path where the alternative url should exist. The path must start with '/'. Only urls that result in a 404 not found page will result in a redirect occurring.
+          </p>
+          <div
+            class="field"
+          >
+            <div
+              class="ui input"
+            >
+              <input
+                id="alternative-url-input"
+                name="alternative-url"
+                placeholder="/example"
+                type="text"
+                value=""
+              />
+            </div>
+          </div>
+          <button
+            class="ui primary disabled button"
+            disabled=""
+            id="submit-alias"
+            tabindex="-1"
+          >
+            Add
+          </button>
         </div>
-        <button
-          className="ui primary disabled button"
-          disabled={true}
-          id="submit-alias"
-          onClick={[Function]}
-          tabIndex={-1}
-        >
-          Add
-        </button>
-      </div>
-    </form>
-    <form
-      className="ui form"
-      onSubmit={[Function]}
-    >
-      <div
-        className="ui segment"
+      </form>
+      <form
+        class="ui form"
       >
         <div
-          className="ui medium header"
+          class="ui segment"
         >
-          Existing alternative urls for this item
+          <div
+            class="ui medium header"
+          >
+            Existing alternative urls for this item
+          </div>
+          <button
+            class="ui primary disabled button"
+            disabled=""
+            id="remove-alias"
+            tabindex="-1"
+          >
+            Remove
+          </button>
         </div>
-        <button
-          className="ui primary disabled button"
-          disabled={true}
-          id="remove-alias"
-          onClick={[Function]}
-          tabIndex={-1}
-        >
-          Remove
-        </button>
-      </div>
-    </form>
+      </form>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/BlockChooser/BlockChooser.test.jsx b/packages/volto/src/components/manage/BlockChooser/BlockChooser.test.jsx
index 22fd5b5f48..447c20f61d 100644
--- a/packages/volto/src/components/manage/BlockChooser/BlockChooser.test.jsx
+++ b/packages/volto/src/components/manage/BlockChooser/BlockChooser.test.jsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import '@testing-library/jest-dom/extend-expect';
 import { render, screen } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureStore from 'redux-mock-store';
diff --git a/packages/volto/src/components/manage/BlockChooser/BlockChooserButton.jsx b/packages/volto/src/components/manage/BlockChooser/BlockChooserButton.jsx
index d52389492d..136b413b70 100644
--- a/packages/volto/src/components/manage/BlockChooser/BlockChooserButton.jsx
+++ b/packages/volto/src/components/manage/BlockChooser/BlockChooserButton.jsx
@@ -7,7 +7,7 @@ import config from '@plone/volto/registry';
 import { Button, Ref } from 'semantic-ui-react';
 import { defineMessages, useIntl } from 'react-intl';
 import { usePopper } from 'react-popper';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 
 const messages = defineMessages({
   addBlock: {
@@ -115,8 +115,8 @@ const BlockChooserButton = (props) => {
             />
           </Ref>
         )}
-      {addNewBlockOpened && (
-        <Portal node={document.getElementById('body')}>
+      {addNewBlockOpened &&
+        createPortal(
           <div
             ref={setPopperElement}
             style={styles.popper}
@@ -148,9 +148,9 @@ const BlockChooserButton = (props) => {
               navRoot={navRoot}
               contentType={contentType}
             />
-          </div>
-        </Portal>
-      )}
+          </div>,
+          document.body,
+        )}
     </>
   );
 };
diff --git a/packages/volto/src/components/manage/BlockChooser/BlockChooserSearch.test.jsx b/packages/volto/src/components/manage/BlockChooser/BlockChooserSearch.test.jsx
index 7176bdda06..2bc70ced70 100644
--- a/packages/volto/src/components/manage/BlockChooser/BlockChooserSearch.test.jsx
+++ b/packages/volto/src/components/manage/BlockChooser/BlockChooserSearch.test.jsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import '@testing-library/jest-dom/extend-expect';
 import { render } from '@testing-library/react';
 import BlockChooserSearch from './BlockChooserSearch';
 import { Provider } from 'react-intl-redux';
diff --git a/packages/volto/src/components/manage/BlockChooser/__snapshots__/BlockChooser.test.jsx.snap b/packages/volto/src/components/manage/BlockChooser/__snapshots__/BlockChooser.test.jsx.snap
index d61323c068..b0f6bc9a54 100644
--- a/packages/volto/src/components/manage/BlockChooser/__snapshots__/BlockChooser.test.jsx.snap
+++ b/packages/volto/src/components/manage/BlockChooser/__snapshots__/BlockChooser.test.jsx.snap
@@ -26,7 +26,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
             value=""
           />
         </div>
-        
       </div>
     </form>
     <div
@@ -70,7 +69,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Image
-                
               </button>
             </div>
             <div
@@ -84,7 +82,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Listing
-                
               </button>
             </div>
             <div
@@ -98,7 +95,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Video
-                
               </button>
             </div>
           </div>
@@ -142,7 +138,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Text
-                
               </button>
             </div>
           </div>
@@ -186,7 +181,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Image
-                
               </button>
             </div>
             <div
@@ -200,7 +194,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Lead Image Field
-                
               </button>
             </div>
             <div
@@ -214,7 +207,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Video
-                
               </button>
             </div>
           </div>
@@ -258,7 +250,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Listing
-                
               </button>
             </div>
             <div
@@ -272,7 +263,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Table of Contents
-                
               </button>
             </div>
             <div
@@ -286,7 +276,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Hero
-                
               </button>
             </div>
             <div
@@ -300,7 +289,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Maps
-                
               </button>
             </div>
             <div
@@ -314,7 +302,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 HTML
-                
               </button>
             </div>
             <div
@@ -328,7 +315,6 @@ exports[`BlocksChooser Fallback BlockChooser component onMutateBlock 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Table
-                
               </button>
             </div>
           </div>
@@ -365,7 +351,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
             value=""
           />
         </div>
-        
       </div>
     </form>
     <div
@@ -409,7 +394,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Image
-                
               </button>
             </div>
             <div
@@ -423,7 +407,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Listing
-                
               </button>
             </div>
             <div
@@ -437,7 +420,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Video
-                
               </button>
             </div>
           </div>
@@ -481,7 +463,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Text
-                
               </button>
             </div>
           </div>
@@ -525,7 +506,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Image
-                
               </button>
             </div>
             <div
@@ -539,7 +519,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Lead Image Field
-                
               </button>
             </div>
             <div
@@ -553,7 +532,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Video
-                
               </button>
             </div>
           </div>
@@ -597,7 +575,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Listing
-                
               </button>
             </div>
             <div
@@ -611,7 +588,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Table of Contents
-                
               </button>
             </div>
             <div
@@ -625,7 +601,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Hero
-                
               </button>
             </div>
             <div
@@ -639,7 +614,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Maps
-                
               </button>
             </div>
             <div
@@ -653,7 +627,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 HTML
-                
               </button>
             </div>
             <div
@@ -667,7 +640,6 @@ exports[`BlocksChooser renders a BlockChooser component 1`] = `
                   style="height: 36px; width: auto; fill: currentColor;"
                 />
                 Table
-                
               </button>
             </div>
           </div>
diff --git a/packages/volto/src/components/manage/Blocks/Block/Settings.test.jsx b/packages/volto/src/components/manage/Blocks/Block/Settings.test.jsx
index 57b7ea90ca..8cc2a7f301 100644
--- a/packages/volto/src/components/manage/Blocks/Block/Settings.test.jsx
+++ b/packages/volto/src/components/manage/Blocks/Block/Settings.test.jsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import Settings from './Settings';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
 import configureStore from 'redux-mock-store';
 import config from '@plone/volto/registry';
 import { Provider } from 'react-intl-redux';
diff --git a/packages/volto/src/components/manage/Blocks/Container/NewBlockAddButton.jsx b/packages/volto/src/components/manage/Blocks/Container/NewBlockAddButton.jsx
index 89076a0560..713f518e22 100644
--- a/packages/volto/src/components/manage/Blocks/Container/NewBlockAddButton.jsx
+++ b/packages/volto/src/components/manage/Blocks/Container/NewBlockAddButton.jsx
@@ -5,7 +5,7 @@ import { BlockChooser, Icon } from '@plone/volto/components';
 import { useDetectClickOutside } from '@plone/volto/helpers';
 import addSVG from '@plone/volto/icons/add.svg';
 import { usePopper } from 'react-popper';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 
 const messages = defineMessages({
   addBlock: {
@@ -59,24 +59,25 @@ const NewBlockAddButton = (props) => {
           <Icon name={addSVG} className="circled" size="24px" />
         </Button>
       </Ref>
-      {isOpenMenu ? (
-        <Portal node={document.getElementById('body')}>
-          <div
-            ref={setPopperElement}
-            style={styles.popper}
-            {...attributes.popper}
-            className="container-chooser-wrapper"
-          >
-            <BlockChooser
-              onMutateBlock={onMutateBlock}
-              currentBlock={block}
-              showRestricted
-              blocksConfig={blocksConfig}
-              ref={blockChooserRef}
-            />
-          </div>
-        </Portal>
-      ) : null}
+      {isOpenMenu
+        ? createPortal(
+            <div
+              ref={setPopperElement}
+              style={styles.popper}
+              {...attributes.popper}
+              className="container-chooser-wrapper"
+            >
+              <BlockChooser
+                onMutateBlock={onMutateBlock}
+                currentBlock={block}
+                showRestricted
+                blocksConfig={blocksConfig}
+                ref={blockChooserRef}
+              />
+            </div>,
+            document.body,
+          )
+        : null}
     </>
   );
 };
diff --git a/packages/volto/src/components/manage/Blocks/Image/View.test.jsx b/packages/volto/src/components/manage/Blocks/Image/View.test.jsx
index fb073c2f21..81aac59bfd 100644
--- a/packages/volto/src/components/manage/Blocks/Image/View.test.jsx
+++ b/packages/volto/src/components/manage/Blocks/Image/View.test.jsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import '@testing-library/jest-dom/extend-expect';
 import { render } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import { Provider } from 'react-intl-redux';
diff --git a/packages/volto/src/components/manage/Blocks/Table/Edit.jsx b/packages/volto/src/components/manage/Blocks/Table/Edit.jsx
index dee0234118..2f00b4ba77 100644
--- a/packages/volto/src/components/manage/Blocks/Table/Edit.jsx
+++ b/packages/volto/src/components/manage/Blocks/Table/Edit.jsx
@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import { compose } from 'redux';
 import { map, remove } from 'lodash';
 import { Button, Segment, Table, Form } from 'semantic-ui-react';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import cx from 'classnames';
 import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
 
@@ -670,8 +670,9 @@ class Edit extends Component {
             </Table.Body>
           </Table>
         )}
-        {this.props.selected && this.state.isClient && (
-          <Portal node={document.getElementById('sidebar-properties')}>
+        {this.props.selected &&
+          this.state.isClient &&
+          createPortal(
             <Form
               method="post"
               onSubmit={(event) => {
@@ -736,9 +737,9 @@ class Edit extends Component {
                   onChange={this.toggleCellType}
                 />
               </Segment>
-            </Form>
-          </Portal>
-        )}
+            </Form>,
+            document.getElementById('sidebar-properties'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Blocks/ToC/variations/__snapshots__/DefaultTocRenderer.test.jsx.snap b/packages/volto/src/components/manage/Blocks/ToC/variations/__snapshots__/DefaultTocRenderer.test.jsx.snap
index 59f2bde9df..b1037d169f 100644
--- a/packages/volto/src/components/manage/Blocks/ToC/variations/__snapshots__/DefaultTocRenderer.test.jsx.snap
+++ b/packages/volto/src/components/manage/Blocks/ToC/variations/__snapshots__/DefaultTocRenderer.test.jsx.snap
@@ -1,47 +1,44 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders a default toc renderer component 1`] = `
-Array [
-  "",
-  <ul
-    className="ui bulleted list"
-    role="list"
+<ul
+  className="ui bulleted list"
+  role="list"
+>
+  <li
+    className="item headline-2"
+    onClick={[Function]}
+    role="listitem"
   >
-    <li
-      className="item headline-2"
+    <a
+      className={null}
+      href="/#hello-this-is-a-sample-page"
       onClick={[Function]}
-      role="listitem"
+      target={null}
+      title={null}
     >
-      <a
-        className={null}
-        href="/#hello-this-is-a-sample-page"
+      Hello this is a sample page
+    </a>
+    <ul
+      className="ui bulleted list"
+      role="list"
+    >
+      <li
+        className="item headline-3"
         onClick={[Function]}
-        target={null}
-        title={null}
-      >
-        Hello this is a sample page
-      </a>
-      <ul
-        className="ui bulleted list"
-        role="list"
+        role="listitem"
       >
-        <li
-          className="item headline-3"
+        <a
+          className={null}
+          href="/#test-level-3"
           onClick={[Function]}
-          role="listitem"
+          target={null}
+          title={null}
         >
-          <a
-            className={null}
-            href="/#test-level-3"
-            onClick={[Function]}
-            target={null}
-            title={null}
-          >
-            Test level 3
-          </a>
-        </li>
-      </ul>
-    </li>
-  </ul>,
-]
+          Test level 3
+        </a>
+      </li>
+    </ul>
+  </li>
+</ul>
 `;
diff --git a/packages/volto/src/components/manage/Contents/Contents.jsx b/packages/volto/src/components/manage/Contents/Contents.jsx
index c462592977..66805cabdb 100644
--- a/packages/volto/src/components/manage/Contents/Contents.jsx
+++ b/packages/volto/src/components/manage/Contents/Contents.jsx
@@ -7,7 +7,7 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Link } from 'react-router-dom';
 import {
   Button,
@@ -2159,8 +2159,8 @@ class Contents extends Component {
                   </section>
                 </article>
               </div>
-              {this.state.isClient && (
-                <Portal node={document.getElementById('toolbar')}>
+              {this.state.isClient &&
+                createPortal(
                   <Toolbar
                     pathname={this.props.pathname}
                     inner={
@@ -2178,9 +2178,9 @@ class Contents extends Component {
                         />
                       </Link>
                     }
-                  />
-                </Portal>
-              )}
+                  />,
+                  document.getElementById('toolbar'),
+                )}
             </Dimmer.Dimmable>
           </Container>
         ) : (
diff --git a/packages/volto/src/components/manage/Contents/Contents.test.jsx b/packages/volto/src/components/manage/Contents/Contents.test.jsx
index 48f01c1562..87982d36d4 100644
--- a/packages/volto/src/components/manage/Contents/Contents.test.jsx
+++ b/packages/volto/src/components/manage/Contents/Contents.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter } from 'react-router-dom';
@@ -14,9 +14,8 @@ beforeAll(
     await require('@plone/volto/helpers/Loadable/Loadable').__setLoadables(),
 );
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../../theme/Pagination/Pagination', () =>
   jest.fn(() => <div className="Pagination" />),
 );
@@ -91,14 +90,15 @@ describe('Contents', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <Contents location={{ pathname: '/blog' }} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Contents/ContentsPropertiesModal.test.jsx b/packages/volto/src/components/manage/Contents/ContentsPropertiesModal.test.jsx
index dd4a2b65bf..126e695026 100644
--- a/packages/volto/src/components/manage/Contents/ContentsPropertiesModal.test.jsx
+++ b/packages/volto/src/components/manage/Contents/ContentsPropertiesModal.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
@@ -23,7 +23,7 @@ describe('ContentsPropertiesModal', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <ContentsPropertiesModal
           open
@@ -33,7 +33,7 @@ describe('ContentsPropertiesModal', () => {
         />
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Contents/__snapshots__/Contents.test.jsx.snap b/packages/volto/src/components/manage/Contents/__snapshots__/Contents.test.jsx.snap
index a348d4c3db..2c6dd5c65f 100644
--- a/packages/volto/src/components/manage/Contents/__snapshots__/Contents.test.jsx.snap
+++ b/packages/volto/src/components/manage/Contents/__snapshots__/Contents.test.jsx.snap
@@ -1,1067 +1,600 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Contents renders a folder contents view component 1`] = `
-<div
-  aria-live="polite"
-  className="ui container folder-contents"
-  id="page-contents"
->
+<div>
   <div
-    className="blurring dimmable"
+    aria-live="polite"
+    class="ui container folder-contents"
+    id="page-contents"
   >
     <div
-      className="ui inverted dimmer"
-      onClick={[Function]}
+      class="blurring dimmable"
     >
       <div
-        className="content"
+        class="ui inverted dimmer"
       >
         <div
-          className="ui massive indeterminate text loader"
+          class="content"
         >
-          Loading
+          <div
+            class="ui massive indeterminate text loader"
+          >
+            Loading
+          </div>
         </div>
       </div>
-    </div>
-    <div
-      className="container"
-    >
-      <article
-        id="content"
+      <div
+        class="container"
       >
-        <div
-          className="UploadModal"
-        />
-        <section
-          id="content-core"
+        <article
+          id="content"
         >
           <div
-            className="ui raised segments"
+            class="UploadModal"
+          />
+          <section
+            id="content-core"
           >
             <div
-              className="ui secondary attached top-menu menu"
+              class="ui raised segments"
             >
               <div
-                className="menu top-menu-menu"
-              >
-                <button
-                  aria-label="Upload"
-                  className="ui button icon item upload"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <svg
-                    className="icon upload"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "#007eb1",
-                        "height": "24px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-              </div>
-              <div
-                className="menu top-menu-menu"
-              >
-                <button
-                  aria-label="Rename"
-                  className="ui button disabled icon item"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <svg
-                    className="icon rename"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "grey",
-                        "height": "24px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-                <button
-                  aria-label="State"
-                  className="ui button disabled icon item"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <svg
-                    className="icon semaphore"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "grey",
-                        "height": "24px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-                <button
-                  aria-label="Tags"
-                  className="ui button disabled icon item"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <svg
-                    className="icon tag"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "grey",
-                        "height": "24px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-                <button
-                  aria-label="Properties"
-                  className="ui button disabled icon item"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <svg
-                    className="icon properties"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "grey",
-                        "height": "24px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-              </div>
-              <div
-                className="menu top-menu-menu"
-              >
-                <button
-                  aria-label="Cut"
-                  className="ui button disabled icon item"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <svg
-                    className="icon cut"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "grey",
-                        "height": "24px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-                <button
-                  aria-label="Copy"
-                  className="ui button disabled icon item"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <svg
-                    className="icon copy"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "grey",
-                        "height": "24px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-                <button
-                  aria-label="Paste"
-                  className="ui button icon item"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <svg
-                    className="icon paste"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "grey",
-                        "height": "24px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-                <button
-                  aria-label="Delete"
-                  className="ui button disabled icon item"
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onMouseEnter={[Function]}
-                  onMouseLeave={[Function]}
-                >
-                  <svg
-                    className="icon delete"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "grey",
-                        "height": "24px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-              </div>
-              <div
-                className="right menu top-menu-searchbox"
+                class="ui secondary attached top-menu menu"
               >
                 <div
-                  className="ui right aligned category search item"
+                  class="menu top-menu-menu"
                 >
-                  <div
-                    className="ui small transparent input"
+                  <button
+                    aria-label="Upload"
+                    class="ui button icon item upload"
                   >
-                    <input
-                      onChange={[Function]}
-                      placeholder="Filter…"
-                      type="text"
-                      value=""
+                    <svg
+                      class="icon upload"
+                      style="height: 24px; width: auto; fill: #007eb1;"
+                      viewBox=""
+                      xmlns=""
                     />
-                  </div>
-                  
-                  <svg
-                    className="icon zoom"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "#007eb1",
-                        "flexShrink": "0",
-                        "height": "30px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="results"
-                  />
+                  </button>
                 </div>
-              </div>
-            </div>
-            <div
-              className="ui secondary attached segment contents-breadcrumbs"
-            >
-              <div
-                className="ui breadcrumb"
-              >
-                <a
-                  className="section"
-                  href="/contents"
-                  onClick={[Function]}
-                  title="Home"
+                <div
+                  class="menu top-menu-menu"
                 >
-                  Home
-                </a>
+                  <button
+                    aria-label="Rename"
+                    class="ui button disabled icon item"
+                  >
+                    <svg
+                      class="icon rename"
+                      style="height: 24px; width: auto; fill: grey;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
+                  <button
+                    aria-label="State"
+                    class="ui button disabled icon item"
+                  >
+                    <svg
+                      class="icon semaphore"
+                      style="height: 24px; width: auto; fill: grey;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
+                  <button
+                    aria-label="Tags"
+                    class="ui button disabled icon item"
+                  >
+                    <svg
+                      class="icon tag"
+                      style="height: 24px; width: auto; fill: grey;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
+                  <button
+                    aria-label="Properties"
+                    class="ui button disabled icon item"
+                  >
+                    <svg
+                      class="icon properties"
+                      style="height: 24px; width: auto; fill: grey;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
+                </div>
                 <div
-                  className="divider"
+                  class="menu top-menu-menu"
                 >
-                  /
+                  <button
+                    aria-label="Cut"
+                    class="ui button disabled icon item"
+                  >
+                    <svg
+                      class="icon cut"
+                      style="height: 24px; width: auto; fill: grey;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
+                  <button
+                    aria-label="Copy"
+                    class="ui button disabled icon item"
+                  >
+                    <svg
+                      class="icon copy"
+                      style="height: 24px; width: auto; fill: grey;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
+                  <button
+                    aria-label="Paste"
+                    class="ui button icon item"
+                  >
+                    <svg
+                      class="icon paste"
+                      style="height: 24px; width: auto; fill: grey;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
+                  <button
+                    aria-label="Delete"
+                    class="ui button disabled icon item"
+                  >
+                    <svg
+                      class="icon delete"
+                      style="height: 24px; width: auto; fill: grey;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
                 </div>
                 <div
-                  className="active section"
-                  onClick={[Function]}
+                  class="right menu top-menu-searchbox"
                 >
-                  Blog
+                  <div
+                    class="ui right aligned category search item"
+                  >
+                    <div
+                      class="ui small transparent input"
+                    >
+                      <input
+                        placeholder="Filter…"
+                        type="text"
+                        value=""
+                      />
+                    </div>
+                    <svg
+                      class="icon zoom"
+                      style="height: 30px; width: auto; fill: #007eb1; flex-shrink: 0;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="results"
+                    />
+                  </div>
                 </div>
               </div>
               <div
-                aria-expanded={false}
-                className="ui item dropdown right floating selectIndex"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onClick={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onMouseDown={[Function]}
-                role="listbox"
-                tabIndex={0}
+                class="ui secondary attached segment contents-breadcrumbs"
               >
-                <svg
-                  className="icon"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={[Function]}
-                  style={
-                    Object {
-                      "fill": "#826a6a",
-                      "height": "24px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
                 <div
-                  className="menu transition left"
+                  class="ui breadcrumb"
                 >
+                  <a
+                    class="section"
+                    href="/contents"
+                    title="Home"
+                  >
+                    Home
+                  </a>
                   <div
-                    className="header"
+                    class="divider"
                   >
-                    Select columns to show
+                    /
                   </div>
                   <div
-                    className="scrolling menu transition"
+                    class="active section"
+                  >
+                    Blog
+                  </div>
+                </div>
+                <div
+                  aria-expanded="false"
+                  class="ui item dropdown right floating selectIndex"
+                  role="listbox"
+                  tabindex="0"
+                >
+                  <svg
+                    class="icon"
+                    style="height: 24px; width: auto; fill: #826a6a;"
+                    viewBox=""
+                    xmlns=""
+                  />
+                  <div
+                    class="menu transition left"
                   >
                     <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Review state"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "#007eb1",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Review state
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Last modified"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "#007eb1",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Last modified
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Publication date"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "#007eb1",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Publication date
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon ID"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        ID
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Expiration date"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Expiration date
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Created on"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Created on
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Tags"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Tags
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Type"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Type
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Folder"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Folder
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Excluded from navigation"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Excluded from navigation
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Object Size"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Object Size
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Last comment date"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Last comment date
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Total comments"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Total comments
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon End Date"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        End Date
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Description"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Description
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Creator"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Creator
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Location"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Location
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
+                      class="header"
                     >
-                      <svg
-                        className="icon UID"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        UID
-                      </span>
+                      Select columns to show
                     </div>
                     <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
+                      class="scrolling menu transition"
                     >
-                      <svg
-                        className="icon Start Date"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Start Date
-                      </span>
-                    </div>
-                    <div
-                      className="item iconAlign"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon Type"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      <span>
-                         
-                        Type
-                      </span>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Review state"
+                          style="height: 24px; width: auto; fill: #007eb1;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Review state
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Last modified"
+                          style="height: 24px; width: auto; fill: #007eb1;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Last modified
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Publication date"
+                          style="height: 24px; width: auto; fill: #007eb1;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Publication date
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon ID"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          ID
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Expiration date"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Expiration date
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Created on"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Created on
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Tags"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Tags
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Type"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Type
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Folder"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Folder
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Excluded from navigation"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Excluded from navigation
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Object Size"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Object Size
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Last comment date"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Last comment date
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Total comments"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Total comments
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon End Date"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          End Date
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Description"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Description
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Creator"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Creator
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Location"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Location
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon UID"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          UID
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Start Date"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Start Date
+                        </span>
+                      </div>
+                      <div
+                        class="item iconAlign"
+                        role="option"
+                      >
+                        <svg
+                          class="icon Type"
+                          style="height: 24px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        <span>
+                           
+                          Type
+                        </span>
+                      </div>
                     </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="contents-table-wrapper"
-            >
-              <table
-                className="ui selectable single line attached compact table"
+              <div
+                class="contents-table-wrapper"
               >
-                <thead
-                  className=""
+                <table
+                  class="ui selectable single line attached compact table"
                 >
-                  <tr
-                    className=""
+                  <thead
+                    class=""
                   >
-                    <th
-                      className=""
+                    <tr
+                      class=""
                     >
-                      <svg
-                        className="icon dropdown-popup-trigger configuration-svg"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={[Function]}
-                        style={
-                          Object {
-                            "fill": "#826a6a",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                    </th>
-                    <th
-                      className=""
-                    >
-                      <svg
-                        className="icon dropdown-popup-trigger"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={[Function]}
-                        style={
-                          Object {
-                            "fill": "#826a6a",
-                            "height": "24px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                    </th>
-                    <th
-                      className="four wide"
-                    >
-                      Title
-                    </th>
-                    <th
-                      className="right aligned"
-                    >
-                      Actions
-                    </th>
-                  </tr>
-                </thead>
-                <tbody
-                  className=""
-                />
-              </table>
-            </div>
-            <div
-              className="contents-pagination"
-            >
+                      <th
+                        class=""
+                      >
+                        <svg
+                          class="icon dropdown-popup-trigger configuration-svg"
+                          style="height: 24px; width: auto; fill: #826a6a;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                      </th>
+                      <th
+                        class=""
+                      >
+                        <svg
+                          class="icon dropdown-popup-trigger"
+                          style="height: 24px; width: auto; fill: #826a6a;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                      </th>
+                      <th
+                        class="four wide"
+                      >
+                        Title
+                      </th>
+                      <th
+                        class="right aligned"
+                      >
+                        Actions
+                      </th>
+                    </tr>
+                  </thead>
+                  <tbody
+                    class=""
+                  />
+                </table>
+              </div>
               <div
-                className="Pagination"
-              />
+                class="contents-pagination"
+              >
+                <div
+                  class="Pagination"
+                />
+              </div>
             </div>
-          </div>
-        </section>
-      </article>
+          </section>
+        </article>
+      </div>
     </div>
+  </div>
+  <div
+    id="toolbar"
+  >
     <div
       id="Portal"
     />
diff --git a/packages/volto/src/components/manage/Contents/__snapshots__/ContentsPropertiesModal.test.jsx.snap b/packages/volto/src/components/manage/Contents/__snapshots__/ContentsPropertiesModal.test.jsx.snap
index 3c382ace86..c460a95329 100644
--- a/packages/volto/src/components/manage/Contents/__snapshots__/ContentsPropertiesModal.test.jsx.snap
+++ b/packages/volto/src/components/manage/Contents/__snapshots__/ContentsPropertiesModal.test.jsx.snap
@@ -1,7 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ContentsPropertiesModal renders a contents properties modal component 1`] = `
-<div
-  id="modalform"
-/>
+<div>
+  <div
+    id="modalform"
+  />
+</div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/AddonsControlpanel.jsx b/packages/volto/src/components/manage/Controlpanels/AddonsControlpanel.jsx
index 1248c90cbf..66e1bc7a06 100644
--- a/packages/volto/src/components/manage/Controlpanels/AddonsControlpanel.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/AddonsControlpanel.jsx
@@ -7,7 +7,7 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Accordion,
   Button,
@@ -550,8 +550,8 @@ class AddonsControlpanel extends Component {
           )}
         </Segment.Group>
 
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -568,9 +568,9 @@ class AddonsControlpanel extends Component {
                   </Link>
                 </>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/AddonsControlpanel.test.jsx b/packages/volto/src/components/manage/Controlpanels/AddonsControlpanel.test.jsx
index 460b69f85e..67ce84f2ac 100644
--- a/packages/volto/src/components/manage/Controlpanels/AddonsControlpanel.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/AddonsControlpanel.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
@@ -7,9 +7,7 @@ import AddonsControlpanel from './AddonsControlpanel';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 describe('AddonsControlpanel', () => {
   it('renders an addon control component', () => {
@@ -57,12 +55,13 @@ describe('AddonsControlpanel', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <AddonsControlpanel location={{ pathname: '/blog' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Aliases.jsx b/packages/volto/src/components/manage/Controlpanels/Aliases.jsx
index 6a927d7ae5..6b985ea3d3 100644
--- a/packages/volto/src/components/manage/Controlpanels/Aliases.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Aliases.jsx
@@ -10,7 +10,7 @@ import { compose } from 'redux';
 import { Link } from 'react-router-dom';
 import { getBaseUrl, getParentUrl, Helmet } from '@plone/volto/helpers';
 import { removeAliases, addAliases, getAliases } from '@plone/volto/actions';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Container,
   Button,
@@ -652,8 +652,8 @@ class Aliases extends Component {
             </Segment.Group>
           </article>
         </Container>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -667,9 +667,9 @@ class Aliases extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/Aliases.test.jsx b/packages/volto/src/components/manage/Controlpanels/Aliases.test.jsx
index 661611753f..c6a9a18010 100644
--- a/packages/volto/src/components/manage/Controlpanels/Aliases.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Aliases.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
 import { Provider } from 'react-intl-redux';
@@ -10,9 +10,7 @@ import { MemoryRouter } from 'react-router';
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 describe('Aliases', () => {
   it('renders an aliases control component', () => {
@@ -59,14 +57,15 @@ describe('Aliases', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <Aliases location={{ pathname: '/blog' }} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/ContentType.jsx b/packages/volto/src/components/manage/Controlpanels/ContentType.jsx
index 097dd488ff..6b8edbb9e6 100644
--- a/packages/volto/src/components/manage/Controlpanels/ContentType.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/ContentType.jsx
@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { getParentUrl } from '@plone/volto/helpers';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Button, Header } from 'semantic-ui-react';
 import { defineMessages, injectIntl } from 'react-intl';
 import { toast } from 'react-toastify';
@@ -210,8 +210,8 @@ class ContentType extends Component {
             hideActions
             loading={this.props.cpanelRequest.update.loading}
           />
-          {this.state.isClient && (
-            <Portal node={document.getElementById('toolbar')}>
+          {this.state.isClient &&
+            createPortal(
               <Toolbar
                 pathname={this.props.pathname}
                 hideDefaultViewButtons
@@ -248,9 +248,9 @@ class ContentType extends Component {
                     </Button>
                   </>
                 }
-              />
-            </Portal>
-          )}
+              />,
+              document.getElementById('toolbar'),
+            )}
         </div>
       );
     }
diff --git a/packages/volto/src/components/manage/Controlpanels/ContentType.test.jsx b/packages/volto/src/components/manage/Controlpanels/ContentType.test.jsx
index 63aa9fcd68..159c303936 100644
--- a/packages/volto/src/components/manage/Controlpanels/ContentType.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/ContentType.test.jsx
@@ -1,16 +1,14 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter, Route } from 'react-router-dom';
+import { render } from '@testing-library/react';
 
 import ContentType from './ContentType';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 jest.mock('../Form/Form', () => jest.fn(() => <div id="form" />));
 
 describe('ContentType', () => {
@@ -35,7 +33,8 @@ describe('ContentType', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter
           initialEntries={['/controlpanel/dexterity-types/Document']}
@@ -44,10 +43,11 @@ describe('ContentType', () => {
             path={'/controlpanel/dexterity-types/:id'}
             component={ContentType}
           />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/ContentTypeLayout.jsx b/packages/volto/src/components/manage/Controlpanels/ContentTypeLayout.jsx
index b2754d90ba..3e5cd1a388 100644
--- a/packages/volto/src/components/manage/Controlpanels/ContentTypeLayout.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/ContentTypeLayout.jsx
@@ -14,7 +14,7 @@ import {
   getBlocksFieldname,
   getBlocksLayoutFieldname,
 } from '@plone/volto/helpers';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Button, Segment } from 'semantic-ui-react';
 import { toast } from 'react-toastify';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
@@ -343,26 +343,30 @@ class ContentTypeLayout extends Component {
               content={this.props.intl.formatMessage(messages.enable)}
             />
           </Segment>
-          <Portal
-            node={this.state.isClient && document.getElementById('toolbar')}
-          >
-            <Toolbar
-              pathname={this.props.pathname}
-              hideDefaultViewButtons
-              inner={
-                <>
-                  <Link className="item" to="#" onClick={() => this.onCancel()}>
-                    <Icon
-                      name={backSVG}
-                      size="30px"
-                      className="contents circled"
-                      title={this.props.intl.formatMessage(messages.back)}
-                    />
-                  </Link>
-                </>
-              }
-            />
-          </Portal>
+          {this.state.isClient &&
+            createPortal(
+              <Toolbar
+                pathname={this.props.pathname}
+                hideDefaultViewButtons
+                inner={
+                  <>
+                    <Link
+                      className="item"
+                      to="#"
+                      onClick={() => this.onCancel()}
+                    >
+                      <Icon
+                        name={backSVG}
+                        size="30px"
+                        className="contents circled"
+                        title={this.props.intl.formatMessage(messages.back)}
+                      />
+                    </Link>
+                  </>
+                }
+              />,
+              document.getElementById('toolbar'),
+            )}
         </>
       );
     }
@@ -392,26 +396,30 @@ class ContentTypeLayout extends Component {
               content={this.props.intl.formatMessage(messages.enable)}
             />
           </Segment>
-          <Portal
-            node={this.state.isClient && document.getElementById('toolbar')}
-          >
-            <Toolbar
-              pathname={this.props.pathname}
-              hideDefaultViewButtons
-              inner={
-                <>
-                  <Link className="item" to="#" onClick={() => this.onCancel()}>
-                    <Icon
-                      name={backSVG}
-                      size="30px"
-                      className="contents circled"
-                      title={this.props.intl.formatMessage(messages.back)}
-                    />
-                  </Link>
-                </>
-              }
-            />
-          </Portal>
+          {this.state.isClient &&
+            createPortal(
+              <Toolbar
+                pathname={this.props.pathname}
+                hideDefaultViewButtons
+                inner={
+                  <>
+                    <Link
+                      className="item"
+                      to="#"
+                      onClick={() => this.onCancel()}
+                    >
+                      <Icon
+                        name={backSVG}
+                        size="30px"
+                        className="contents circled"
+                        title={this.props.intl.formatMessage(messages.back)}
+                      />
+                    </Link>
+                  </>
+                }
+              />,
+              document.getElementById('toolbar'),
+            )}
         </>
       );
     }
@@ -449,50 +457,50 @@ class ContentTypeLayout extends Component {
           visual={this.state.visual}
           hideActions
         />
-        <Portal
-          node={this.state.isClient && document.getElementById('sidebar')}
-        >
-          <Sidebar settingsTab={true} documentTab={false} />
-        </Portal>
-        <Portal
-          node={this.state.isClient && document.getElementById('toolbar')}
-        >
-          <Toolbar
-            pathname={this.props.pathname}
-            hideDefaultViewButtons
-            inner={
-              <>
-                <Button
-                  id="toolbar-save"
-                  className="save"
-                  aria-label={this.props.intl.formatMessage(messages.save)}
-                  onClick={() => this.form.current.onSubmit()}
-                  disabled={this.props.schemaRequest.update.loading}
-                  loading={this.props.schemaRequest.update.loading}
-                >
-                  <Icon
-                    name={saveSVG}
-                    className="circled"
-                    size="30px"
-                    title={this.props.intl.formatMessage(messages.save)}
-                  />
-                </Button>
-                <Button
-                  className="cancel"
-                  aria-label={this.props.intl.formatMessage(messages.cancel)}
-                  onClick={() => this.onCancel()}
-                >
-                  <Icon
-                    name={clearSVG}
-                    className="circled"
-                    size="30px"
-                    title={this.props.intl.formatMessage(messages.cancel)}
-                  />
-                </Button>
-              </>
-            }
-          />
-        </Portal>
+        {this.state.isClient &&
+          createPortal(
+            <Sidebar settingsTab={true} documentTab={false} />,
+            document.getElementById('sidebar'),
+          )}
+        {this.state.isClient &&
+          createPortal(
+            <Toolbar
+              pathname={this.props.pathname}
+              hideDefaultViewButtons
+              inner={
+                <>
+                  <Button
+                    id="toolbar-save"
+                    className="save"
+                    aria-label={this.props.intl.formatMessage(messages.save)}
+                    onClick={() => this.form.current.onSubmit()}
+                    disabled={this.props.schemaRequest.update.loading}
+                    loading={this.props.schemaRequest.update.loading}
+                  >
+                    <Icon
+                      name={saveSVG}
+                      className="circled"
+                      size="30px"
+                      title={this.props.intl.formatMessage(messages.save)}
+                    />
+                  </Button>
+                  <Button
+                    className="cancel"
+                    aria-label={this.props.intl.formatMessage(messages.cancel)}
+                    onClick={() => this.onCancel()}
+                  >
+                    <Icon
+                      name={clearSVG}
+                      className="circled"
+                      size="30px"
+                      title={this.props.intl.formatMessage(messages.cancel)}
+                    />
+                  </Button>
+                </>
+              }
+            />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/ContentTypeLayout.test.jsx b/packages/volto/src/components/manage/Controlpanels/ContentTypeLayout.test.jsx
index 70127b8477..aee7d78ec6 100644
--- a/packages/volto/src/components/manage/Controlpanels/ContentTypeLayout.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/ContentTypeLayout.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter, Route } from 'react-router-dom';
@@ -8,9 +8,8 @@ import ContentTypeLayout from './ContentTypeLayout';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../Form/Form', () => jest.fn(() => <div id="form" />));
 
 describe('ContentTypeLayout', () => {
@@ -38,7 +37,7 @@ describe('ContentTypeLayout', () => {
         schema: null,
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter
           initialEntries={['/controlpanel/dexterity-types/Document/layout']}
@@ -47,10 +46,11 @@ describe('ContentTypeLayout', () => {
             path={'/controlpanel/dexterity-types/:id/layout'}
             component={ContentTypeLayout}
           />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/ContentTypeSchema.jsx b/packages/volto/src/components/manage/Controlpanels/ContentTypeSchema.jsx
index b8ebf1dea0..ab6888140b 100644
--- a/packages/volto/src/components/manage/Controlpanels/ContentTypeSchema.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/ContentTypeSchema.jsx
@@ -12,7 +12,7 @@ import saveSVG from '@plone/volto/icons/save.svg';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { connect } from 'react-redux';
 import { toast } from 'react-toastify';
 import { compose } from 'redux';
@@ -283,8 +283,8 @@ class ContentTypeSchema extends Component {
             onCancel={this.onCancel}
             hideActions
           />
-          {this.state.isClient && (
-            <Portal node={document.getElementById('toolbar')}>
+          {this.state.isClient &&
+            createPortal(
               <Toolbar
                 pathname={this.props.pathname}
                 hideDefaultViewButtons
@@ -321,9 +321,9 @@ class ContentTypeSchema extends Component {
                     </Button>
                   </>
                 }
-              />
-            </Portal>
-          )}
+              />,
+              document.getElementById('toolbar'),
+            )}
         </div>
       );
     }
diff --git a/packages/volto/src/components/manage/Controlpanels/ContentTypes.jsx b/packages/volto/src/components/manage/Controlpanels/ContentTypes.jsx
index 4c386c4bce..4759ed6fb2 100644
--- a/packages/volto/src/components/manage/Controlpanels/ContentTypes.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/ContentTypes.jsx
@@ -9,7 +9,7 @@ import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
 import { getParentUrl } from '@plone/volto/helpers';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { last } from 'lodash';
 import { Confirm, Container, Table, Button, Header } from 'semantic-ui-react';
 import { toast } from 'react-toastify';
@@ -457,8 +457,8 @@ class ContentTypes extends Component {
             </section>
           </article>
         </Container>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -490,9 +490,9 @@ class ContentTypes extends Component {
                   </Button>
                 </>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/ContentTypes.test.jsx b/packages/volto/src/components/manage/Controlpanels/ContentTypes.test.jsx
index 876aed77df..5289835b93 100644
--- a/packages/volto/src/components/manage/Controlpanels/ContentTypes.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/ContentTypes.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter, Route } from 'react-router-dom';
@@ -8,9 +8,8 @@ import ContentTypes from './ContentTypes';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../Form/Form', () => jest.fn(() => <div id="form" />));
 
 describe('ContentTypes', () => {
@@ -60,14 +59,15 @@ describe('ContentTypes', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter initialEntries={['/controlpanel/dexterity-types']}>
           <Route path={'/controlpanel/:id'} component={ContentTypes} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Controlpanel.jsx b/packages/volto/src/components/manage/Controlpanels/Controlpanel.jsx
index a6fc83740f..a55477d787 100644
--- a/packages/volto/src/components/manage/Controlpanels/Controlpanel.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Controlpanel.jsx
@@ -9,7 +9,7 @@ import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { withRouter } from 'react-router-dom';
 import { Helmet } from '@plone/volto/helpers';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Button, Container } from 'semantic-ui-react';
 import { defineMessages, injectIntl } from 'react-intl';
 import { toast } from 'react-toastify';
@@ -167,8 +167,8 @@ class Controlpanel extends Component {
               loading={this.props.updateRequest.loading}
             />
           </Container>
-          {this.state.isClient && (
-            <Portal node={document.getElementById('toolbar')}>
+          {this.state.isClient &&
+            createPortal(
               <Toolbar
                 pathname={this.props.pathname}
                 hideDefaultViewButtons
@@ -205,9 +205,9 @@ class Controlpanel extends Component {
                     </Button>
                   </>
                 }
-              />
-            </Portal>
-          )}
+              />,
+              document.getElementById('toolbar'),
+            )}
         </div>
       );
     }
diff --git a/packages/volto/src/components/manage/Controlpanels/Controlpanel.test.jsx b/packages/volto/src/components/manage/Controlpanels/Controlpanel.test.jsx
index d03d87e2d6..1ee6a98c11 100644
--- a/packages/volto/src/components/manage/Controlpanels/Controlpanel.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Controlpanel.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter, Route } from 'react-router-dom';
@@ -8,9 +8,8 @@ import Controlpanel from './Controlpanel';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../Form/Form', () => jest.fn(() => <div id="form" />));
 
 describe('Controlpanel', () => {
@@ -36,14 +35,15 @@ describe('Controlpanel', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter initialEntries={['/controlpanel/date-and-time']}>
           <Route path={'/controlpanel/:id'} component={Controlpanel} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Controlpanels.jsx b/packages/volto/src/components/manage/Controlpanels/Controlpanels.jsx
index 263be3b02f..d2751c0142 100644
--- a/packages/volto/src/components/manage/Controlpanels/Controlpanels.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Controlpanels.jsx
@@ -8,7 +8,7 @@ import { concat, filter, last, map, sortBy, uniqBy } from 'lodash';
 import PropTypes from 'prop-types';
 import { useEffect, useState } from 'react';
 import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { connect } from 'react-redux';
 import { Link } from 'react-router-dom';
 import { compose } from 'redux';
@@ -260,8 +260,8 @@ function Controlpanels({
           </Segment>
         </Segment.Group>
       </Container>
-      {isClient && (
-        <Portal node={document.getElementById('toolbar')}>
+      {isClient &&
+        createPortal(
           <Toolbar
             pathname={pathname}
             hideDefaultViewButtons
@@ -275,9 +275,9 @@ function Controlpanels({
                 />
               </Link>
             }
-          />
-        </Portal>
-      )}
+          />,
+          document.getElementById('toolbar'),
+        )}
     </div>
   );
 }
diff --git a/packages/volto/src/components/manage/Controlpanels/Controlpanels.test.jsx b/packages/volto/src/components/manage/Controlpanels/Controlpanels.test.jsx
index 23c9d83392..10ce403043 100644
--- a/packages/volto/src/components/manage/Controlpanels/Controlpanels.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Controlpanels.test.jsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter } from 'react-router-dom';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 
 import config from '@plone/volto/registry';
@@ -9,9 +9,7 @@ import Controlpanels from './Controlpanels';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 jest.mock('./VersionOverview', () =>
   jest.fn(() => <div className="VersionOverview" />),
@@ -73,15 +71,16 @@ describe('Controlpanels', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <Controlpanels location={{ pathname: '/blog' }} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders an additional control panel', () => {
@@ -127,14 +126,15 @@ describe('Controlpanels', () => {
         component: FooComponent,
       },
     ];
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <Controlpanels location={{ pathname: '/blog' }} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/DatabaseInformation.jsx b/packages/volto/src/components/manage/Controlpanels/DatabaseInformation.jsx
index ec17c9b8ce..04b29655ad 100644
--- a/packages/volto/src/components/manage/Controlpanels/DatabaseInformation.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/DatabaseInformation.jsx
@@ -7,7 +7,7 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Container, Divider, Message, Segment, Table } from 'semantic-ui-react';
 import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
 
@@ -216,8 +216,8 @@ class DatabaseInformation extends Component {
           </Segment>
         </Segment.Group>
 
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -234,9 +234,9 @@ class DatabaseInformation extends Component {
                   </Link>
                 </>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     ) : null;
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/Groups/GroupsControlpanel.jsx b/packages/volto/src/components/manage/Controlpanels/Groups/GroupsControlpanel.jsx
index 95505c9030..42bffa4768 100644
--- a/packages/volto/src/components/manage/Controlpanels/Groups/GroupsControlpanel.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Groups/GroupsControlpanel.jsx
@@ -30,7 +30,7 @@ import { find, map, pull } from 'lodash';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { FormattedMessage, injectIntl } from 'react-intl';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { connect } from 'react-redux';
 
 import { toast } from 'react-toastify';
@@ -575,8 +575,8 @@ class GroupsControlpanel extends Component {
             </div>
           </Form>
         </Segment.Group>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -628,9 +628,9 @@ class GroupsControlpanel extends Component {
                   </Button>
                 </>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/Groups/GroupsControlpanel.test.jsx b/packages/volto/src/components/manage/Controlpanels/Groups/GroupsControlpanel.test.jsx
index f6bf548d90..561aab0507 100644
--- a/packages/volto/src/components/manage/Controlpanels/Groups/GroupsControlpanel.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Groups/GroupsControlpanel.test.jsx
@@ -1,14 +1,13 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
 import GroupsControlpanel from './GroupsControlpanel';
 
 const mockStore = configureStore();
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 describe('UsersControlpanel', () => {
   it('renders a user control component', () => {
     const store = mockStore({
@@ -25,12 +24,13 @@ describe('UsersControlpanel', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <GroupsControlpanel location={{ pathname: '/blog' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Groups/__snapshots__/GroupsControlpanel.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/Groups/__snapshots__/GroupsControlpanel.test.jsx.snap
index 6a7e41b64b..36ba594690 100644
--- a/packages/volto/src/components/manage/Controlpanels/Groups/__snapshots__/GroupsControlpanel.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/Groups/__snapshots__/GroupsControlpanel.test.jsx.snap
@@ -1,128 +1,121 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`UsersControlpanel renders a user control component 1`] = `
-<div
-  className="ui container users-control-panel"
->
+<div>
   <div
-    className="container"
-  />
-  <div
-    className="ui raised segments"
+    class="ui container users-control-panel"
   >
     <div
-      className="ui segment primary"
-    >
-      Groups
-    </div>
-    <div
-      className="ui secondary segment"
-    >
-      Groups are logical collections of users, such as departments and business units. Groups are not directly related to permissions on a global level, you normally use Roles for that - and let certain Groups have a particular role. The symbol
-      <svg
-        className="icon"
-        dangerouslySetInnerHTML={
-          Object {
-            "__html": "<title>plone-svg</title>undefined",
-          }
-        }
-        onClick={null}
-        style={
-          Object {
-            "fill": "#007EB1",
-            "height": "20px",
-            "width": "auto",
-          }
-        }
-        viewBox=""
-        xmlns=""
-      />
-      indicates a role inherited from membership in another group.
-    </div>
+      class="container"
+    />
     <div
-      className="ui segment"
+      class="ui raised segments"
     >
-      <form
-        className="ui form"
-        onSubmit={[Function]}
+      <div
+        class="ui segment primary"
       >
-        <div
-          className="field"
+        Groups
+      </div>
+      <div
+        class="ui secondary segment"
+      >
+        Groups are logical collections of users, such as departments and business units. Groups are not directly related to permissions on a global level, you normally use Roles for that - and let certain Groups have a particular role. The symbol
+        <svg
+          class="icon"
+          style="height: 20px; width: auto; fill: #007EB1;"
+          viewBox=""
+          xmlns=""
+        >
+          <title>
+            plone-svg
+          </title>
+          undefined
+        </svg>
+        indicates a role inherited from membership in another group.
+      </div>
+      <div
+        class="ui segment"
+      >
+        <form
+          class="ui form"
         >
           <div
-            className="ui action input"
+            class="field"
           >
-            <input
-              id="group-search-input"
-              name="SearchableText"
-              onChange={[Function]}
-              placeholder="Search group…"
-              type="text"
-            />
-            <button
-              className="ui icon button"
-              onClick={[Function]}
+            <div
+              class="ui action input"
             >
-              <i
-                aria-hidden="true"
-                className="search icon"
-                onClick={[Function]}
+              <input
+                id="group-search-input"
+                name="SearchableText"
+                placeholder="Search group…"
+                type="text"
               />
-            </button>
+              <button
+                class="ui icon button"
+              >
+                <i
+                  aria-hidden="true"
+                  class="search icon"
+                />
+              </button>
+            </div>
           </div>
-        </div>
-      </form>
-    </div>
-    <form
-      className="ui form"
-      onSubmit={[Function]}
-    >
-      <div
-        className="table"
+        </form>
+      </div>
+      <form
+        class="ui form"
       >
-        <table
-          className="ui striped unstackable attached padded table"
+        <div
+          class="table"
         >
-          <thead
-            className=""
+          <table
+            class="ui striped unstackable attached padded table"
           >
-            <tr
-              className=""
+            <thead
+              class=""
             >
-              <th
-                className=""
+              <tr
+                class=""
               >
-                Groupname
-              </th>
-              <th
-                className=""
-              >
-                Actions
-              </th>
-            </tr>
-          </thead>
-          <tbody
-            className=""
-            data-group="groups"
-          />
-        </table>
-        
-      </div>
-      <div
-        className="contents-pagination"
-      >
+                <th
+                  class=""
+                >
+                  Groupname
+                </th>
+                <th
+                  class=""
+                >
+                  Actions
+                </th>
+              </tr>
+            </thead>
+            <tbody
+              class=""
+              data-group="groups"
+            />
+          </table>
+        </div>
         <div
-          className="ui secondary attached menu"
+          class="contents-pagination"
         >
           <div
-            className="menu"
-          />
+            class="ui secondary attached menu"
+          >
+            <div
+              class="menu"
+            />
+          </div>
         </div>
-      </div>
-    </form>
+      </form>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/ModerateComments.jsx b/packages/volto/src/components/manage/Controlpanels/ModerateComments.jsx
index 182ce40ae0..d5036a50d2 100644
--- a/packages/volto/src/components/manage/Controlpanels/ModerateComments.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/ModerateComments.jsx
@@ -9,7 +9,7 @@ import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
 import { getParentUrl, Helmet } from '@plone/volto/helpers';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Container, Button, Table } from 'semantic-ui-react';
 import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
 
@@ -267,8 +267,8 @@ class ModerateComments extends Component {
             </section>
           </article>
         </Container>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -282,9 +282,9 @@ class ModerateComments extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/ModerateComments.test.jsx b/packages/volto/src/components/manage/Controlpanels/ModerateComments.test.jsx
index ff5f785dcd..d5c79af439 100644
--- a/packages/volto/src/components/manage/Controlpanels/ModerateComments.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/ModerateComments.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
@@ -7,9 +7,8 @@ import ModerateComments from './ModerateComments';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../../theme/Comments/CommentEditModal', () =>
   jest.fn(() => <div id="modal" />),
 );
@@ -31,12 +30,13 @@ describe('ModerateComments', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <ModerateComments location={{ pathname: '/blog' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Relations/Relations.jsx b/packages/volto/src/components/manage/Controlpanels/Relations/Relations.jsx
index f71caa058d..73c56efa41 100644
--- a/packages/volto/src/components/manage/Controlpanels/Relations/Relations.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Relations/Relations.jsx
@@ -1,10 +1,10 @@
 /**
  * Relations Control Panel
  */
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import { find } from 'lodash';
 import { useSelector } from 'react-redux';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { useHistory } from 'react-router';
 import { Link, useLocation } from 'react-router-dom';
 import { FormattedMessage, useIntl } from 'react-intl';
@@ -23,6 +23,12 @@ const RelationsControlPanel = () => {
   const location = useLocation();
   const dispatch = useDispatch();
 
+  const [isClient, setIsClient] = useState(false);
+
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
+
   const brokenRelations = useSelector(
     (state) => state.relations?.stats?.data?.broken,
   );
@@ -88,8 +94,8 @@ const RelationsControlPanel = () => {
         )}
       </div>
 
-      {__CLIENT__ && (
-        <Portal node={document.getElementById('toolbar')}>
+      {isClient &&
+        createPortal(
           <Toolbar
             pathname={location.pathname}
             hideDefaultViewButtons
@@ -104,9 +110,9 @@ const RelationsControlPanel = () => {
                 <Icon name={backSVG} className="contents circled" size="30px" />
               </Link>
             }
-          />
-        </Portal>
-      )}
+          />,
+          document.getElementById('toolbar'),
+        )}
     </>
   );
 };
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/AddRule.jsx b/packages/volto/src/components/manage/Controlpanels/Rules/AddRule.jsx
index 31df68dbc0..85aba340be 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/AddRule.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/AddRule.jsx
@@ -9,7 +9,7 @@ import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
 import { getBaseUrl, getParentUrl, Helmet } from '@plone/volto/helpers';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Button,
   Checkbox,
@@ -331,8 +331,8 @@ class AddRule extends Component {
             </Segment.Group>
           </article>
         </Container>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -346,9 +346,9 @@ class AddRule extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/AddRule.test.jsx b/packages/volto/src/components/manage/Controlpanels/Rules/AddRule.test.jsx
index 982d8798f6..5f83ebaef8 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/AddRule.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/AddRule.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
@@ -9,9 +9,7 @@ import AddRule from './AddRule';
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../Toolbar/Toolbar', () => jest.fn(() => <div id="Toolbar" />));
 
 describe('AddRule', () => {
   it('renders rules add interface', () => {
@@ -21,12 +19,13 @@ describe('AddRule', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <AddRule location={{ pathname: '/controlpanel/rules/add' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/ConfigureRule.jsx b/packages/volto/src/components/manage/Controlpanels/Rules/ConfigureRule.jsx
index 4f92673898..65887da7f3 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/ConfigureRule.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/ConfigureRule.jsx
@@ -9,7 +9,7 @@ import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
 import { getBaseUrl, getParentUrl, Helmet } from '@plone/volto/helpers';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Button,
   Card,
@@ -847,8 +847,8 @@ class ConfigureRule extends Component {
             action="edit"
           />
         )}
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -862,9 +862,9 @@ class ConfigureRule extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/ConfigureRule.test.jsx b/packages/volto/src/components/manage/Controlpanels/Rules/ConfigureRule.test.jsx
index ed9babcd14..9516fcc64b 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/ConfigureRule.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/ConfigureRule.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
@@ -9,9 +9,7 @@ import ConfigureRule from './ConfigureRule';
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 describe('ConfigureRule', () => {
   it('renders rules configure interface', () => {
@@ -21,14 +19,15 @@ describe('ConfigureRule', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <ConfigureRule
           location={{ pathname: '/controlpanel/rules/:id/configure' }}
         />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/EditRule.jsx b/packages/volto/src/components/manage/Controlpanels/Rules/EditRule.jsx
index 025e53993d..b8cd8a9124 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/EditRule.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/EditRule.jsx
@@ -9,7 +9,7 @@ import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
 import { getParentUrl, Helmet, getBaseUrl } from '@plone/volto/helpers';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Button,
   Checkbox,
@@ -367,8 +367,8 @@ class EditRule extends Component {
             </Segment.Group>
           </article>
         </Container>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -382,9 +382,9 @@ class EditRule extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/EditRule.test.jsx b/packages/volto/src/components/manage/Controlpanels/Rules/EditRule.test.jsx
index b62949c0bc..100aa9a64b 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/EditRule.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/EditRule.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
@@ -9,9 +9,7 @@ import EditRule from './EditRule';
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 describe('EditRule', () => {
   it('renders rules edit interface', () => {
@@ -21,12 +19,13 @@ describe('EditRule', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <EditRule location={{ pathname: '/controlpanel/rules/:id/edit' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/Rules.jsx b/packages/volto/src/components/manage/Controlpanels/Rules/Rules.jsx
index f8060a4ca1..0f3545d919 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/Rules.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/Rules.jsx
@@ -9,7 +9,7 @@ import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
 import { getBaseUrl, getParentUrl, Helmet } from '@plone/volto/helpers';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Button,
   Checkbox,
@@ -420,8 +420,8 @@ class Rules extends Component {
             </Segment.Group>
           </article>
         </Container>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -435,9 +435,9 @@ class Rules extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/Rules.test.jsx b/packages/volto/src/components/manage/Controlpanels/Rules/Rules.test.jsx
index fe86ede91e..2a2813b7c6 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/Rules.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/Rules.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
@@ -9,9 +9,7 @@ import Rules from './Rules';
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 describe('Rules', () => {
   it('renders rules control panel control', () => {
@@ -64,12 +62,13 @@ describe('Rules', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <Rules location={{ pathname: '/controlpanel/rules' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/AddRule.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/AddRule.test.jsx.snap
index be2bd126a8..b85d427f10 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/AddRule.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/AddRule.test.jsx.snap
@@ -1,242 +1,197 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`AddRule renders rules add interface 1`] = `
-<div
-  id="page-rule-add"
->
+<div>
   <div
-    className="ui container"
+    id="page-rule-add"
   >
-    <article
-      id="content"
+    <div
+      class="ui container"
     >
-      <div
-        className="ui raised segments"
+      <article
+        id="content"
       >
         <div
-          className="ui segment primary"
+          class="ui raised segments"
         >
-          Add Rule
-        </div>
-        <div
-          className="ui segment secondary"
-        >
-          Use the form below to define the new content rule
-        </div>
-        <div
-          className="ui segment"
-        >
-          <form
-            className="ui form"
-            onSubmit={[Function]}
+          <div
+            class="ui segment primary"
           >
-            <div
-              className="ui grid"
+            Add Rule
+          </div>
+          <div
+            class="ui segment secondary"
+          >
+            Use the form below to define the new content rule
+          </div>
+          <div
+            class="ui segment"
+          >
+            <form
+              class="ui form"
             >
               <div
-                className="stretched row"
+                class="ui grid"
               >
                 <div
-                  className="column"
+                  class="stretched row"
                 >
                   <div
-                    className="mocked-default-widget"
-                    id="mocked-field-undefined"
+                    class="column"
                   >
-                    Title
-                     - 
-                    Please set a descriptive title for the rule.
+                    <div
+                      class="mocked-default-widget"
+                      id="mocked-field-undefined"
+                    >
+                      Title
+                       - 
+                      Please set a descriptive title for the rule.
+                    </div>
                   </div>
                 </div>
-              </div>
-              <div
-                className="stretched row"
-              >
                 <div
-                  className="column"
+                  class="stretched row"
                 >
                   <div
-                    className="mocked-default-widget"
-                    id="mocked-field-undefined"
+                    class="column"
                   >
-                    Description
-                     - 
-                    Enter a short description of the rule and its purpose.
+                    <div
+                      class="mocked-default-widget"
+                      id="mocked-field-undefined"
+                    >
+                      Description
+                       - 
+                      Enter a short description of the rule and its purpose.
+                    </div>
                   </div>
                 </div>
-              </div>
-              <div
-                className="stretched row"
-              >
                 <div
-                  className="column"
+                  class="stretched row"
                 >
                   <div
-                    className="mocked-default-widget"
-                    id="mocked-field-undefined"
+                    class="column"
                   >
-                    Triggering event
-                     - 
-                    The rule will execute when the following event occurs.
+                    <div
+                      class="mocked-default-widget"
+                      id="mocked-field-undefined"
+                    >
+                      Triggering event
+                       - 
+                      The rule will execute when the following event occurs.
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-          </form>
-        </div>
-        <div
-          className="ui segment"
-        >
+            </form>
+          </div>
           <div
-            style={
-              Object {
-                "display": "flex",
-                "flexDirection": "column",
-              }
-            }
+            class="ui segment"
           >
             <div
-              className="ui checkbox"
-              onChange={[Function]}
-              onClick={[Function]}
-              onMouseDown={[Function]}
-              onMouseUp={[Function]}
+              style="display: flex; flex-direction: column;"
             >
-              <input
-                checked={false}
-                className="hidden"
-                readOnly={true}
-                tabIndex={0}
-                type="checkbox"
-              />
-              <label>
-                Enabled
-              </label>
+              <div
+                class="ui checkbox"
+              >
+                <input
+                  class="hidden"
+                  readonly=""
+                  tabindex="0"
+                  type="checkbox"
+                  value=""
+                />
+                <label>
+                  Enabled
+                </label>
+              </div>
+              <p
+                style="color: rgb(135, 143, 147); padding-top: 0.7rem; padding-bottom: 0.7rem; font-size: 0.9rem;"
+              >
+                Whether or not the rule is currently enabled
+              </p>
             </div>
-            <p
-              style={
-                Object {
-                  "color": "#878f93",
-                  "fontSize": "0.9rem",
-                  "paddingBottom": "0.7rem",
-                  "paddingTop": "0.7rem",
-                }
-              }
-            >
-              Whether or not the rule is currently enabled
-            </p>
           </div>
-        </div>
-        <div
-          className="ui segment"
-        >
           <div
-            style={
-              Object {
-                "display": "flex",
-                "flexDirection": "column",
-              }
-            }
+            class="ui segment"
           >
             <div
-              className="ui checkbox"
-              onChange={[Function]}
-              onClick={[Function]}
-              onMouseDown={[Function]}
-              onMouseUp={[Function]}
+              style="display: flex; flex-direction: column;"
             >
-              <input
-                checked={false}
-                className="hidden"
-                readOnly={true}
-                tabIndex={0}
-                type="checkbox"
-              />
-              <label>
-                Stop Executing rules
-              </label>
+              <div
+                class="ui checkbox"
+              >
+                <input
+                  class="hidden"
+                  readonly=""
+                  tabindex="0"
+                  type="checkbox"
+                  value=""
+                />
+                <label>
+                  Stop Executing rules
+                </label>
+              </div>
+              <p
+                style="color: rgb(135, 143, 147); padding-top: 0.7rem; padding-bottom: 0.7rem; font-size: 0.9rem;"
+              >
+                Whether or not execution of further rules should stop after this rule is executed
+              </p>
             </div>
-            <p
-              style={
-                Object {
-                  "color": "#878f93",
-                  "fontSize": "0.9rem",
-                  "paddingBottom": "0.7rem",
-                  "paddingTop": "0.7rem",
-                }
-              }
-            >
-              Whether or not execution of further rules should stop after this rule is executed
-            </p>
           </div>
-        </div>
-        <div
-          className="ui segment"
-        >
           <div
-            style={
-              Object {
-                "display": "flex",
-                "flexDirection": "column",
-              }
-            }
+            class="ui segment"
           >
             <div
-              className="ui checkbox"
-              onChange={[Function]}
-              onClick={[Function]}
-              onMouseDown={[Function]}
-              onMouseUp={[Function]}
+              style="display: flex; flex-direction: column;"
             >
-              <input
-                checked={false}
-                className="hidden"
-                readOnly={true}
-                tabIndex={0}
-                type="checkbox"
-              />
-              <label>
-                Cascading rule
-              </label>
+              <div
+                class="ui checkbox"
+              >
+                <input
+                  class="hidden"
+                  readonly=""
+                  tabindex="0"
+                  type="checkbox"
+                  value=""
+                />
+                <label>
+                  Cascading rule
+                </label>
+              </div>
+              <p
+                style="color: rgb(135, 143, 147); padding-top: 0.7rem; padding-bottom: 0.7rem; font-size: 0.9rem;"
+              >
+                Whether or not other rules should be triggered by the actions launched by this rule. Activate this only if you are sure this won't create infinite loops
+              </p>
             </div>
-            <p
-              style={
-                Object {
-                  "color": "#878f93",
-                  "fontSize": "0.9rem",
-                  "paddingBottom": "0.7rem",
-                  "paddingTop": "0.7rem",
-                }
-              }
-            >
-              Whether or not other rules should be triggered by the actions launched by this rule. Activate this only if you are sure this won't create infinite loops
-            </p>
           </div>
-        </div>
-        <div
-          className="ui segment"
-        >
-          <button
-            className="ui primary button"
-            onClick={[Function]}
-          >
-            Save
-          </button>
-          <button
-            className="ui secondary button"
-            onClick={[Function]}
+          <div
+            class="ui segment"
           >
-            Cancel
-          </button>
+            <button
+              class="ui primary button"
+            >
+              Save
+            </button>
+            <button
+              class="ui secondary button"
+            >
+              Cancel
+            </button>
+          </div>
+          <div
+            class="ui segment"
+          />
         </div>
-        <div
-          className="ui segment"
-        />
-      </div>
-    </article>
+      </article>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Toolbar"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/ConfigureRule.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/ConfigureRule.test.jsx.snap
index f2a98c51aa..25bbc75cdb 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/ConfigureRule.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/ConfigureRule.test.jsx.snap
@@ -1,184 +1,152 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ConfigureRule renders rules configure interface 1`] = `
-<div
-  id="page-rule-configure"
->
+<div>
   <div
-    className="ui container"
+    id="page-rule-configure"
   >
-    <article
-      id="content"
+    <div
+      class="ui container"
     >
-      <div
-        className="ui raised segments"
+      <article
+        id="content"
       >
         <div
-          className="ui segment primary"
-        >
-          Configure Content Rule: 
-          <q>
-            
-          </q>
-        </div>
-        <div
-          className="ui segment secondary"
-        >
-          Rules execute when a triggering event occurs. Rule actions will only be invoked if all the rule's conditions are met. You can add new actions and conditions using the buttons below.
-        </div>
-        <div
-          className="ui segment"
+          class="ui raised segments"
         >
           <div
-            className="ui grid"
+            class="ui segment primary"
+          >
+            Configure Content Rule: 
+            <q />
+          </div>
+          <div
+            class="ui segment secondary"
+          >
+            Rules execute when a triggering event occurs. Rule actions will only be invoked if all the rule's conditions are met. You can add new actions and conditions using the buttons below.
+          </div>
+          <div
+            class="ui segment"
           >
             <div
-              className="row"
+              class="ui grid"
             >
               <div
-                className="six wide computer six wide large screen sixteen wide mobile sixteen wide tablet column"
+                class="row"
               >
-                <h4>
-                  If all of the following conditions are met:
-                </h4>
                 <div
-                  className="row"
+                  class="six wide computer six wide large screen sixteen wide mobile sixteen wide tablet column"
                 >
-                  <h4
-                    style={
-                      Object {
-                        "marginTop": "15px",
-                      }
-                    }
-                  >
-                    Condition: 
+                  <h4>
+                    If all of the following conditions are met:
                   </h4>
                   <div
-                    aria-expanded={false}
-                    className="ui fluid selection dropdown"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onClick={[Function]}
-                    onFocus={[Function]}
-                    onKeyDown={[Function]}
-                    onMouseDown={[Function]}
-                    role="listbox"
-                    style={
-                      Object {
-                        "margin": "5px 0",
-                      }
-                    }
-                    tabIndex={0}
+                    class="row"
                   >
+                    <h4
+                      style="margin-top: 15px;"
+                    >
+                      Condition: 
+                    </h4>
                     <div
-                      aria-atomic={true}
-                      aria-live="polite"
-                      className="divider default text"
-                      role="alert"
+                      aria-expanded="false"
+                      class="ui fluid selection dropdown"
+                      role="listbox"
+                      style="margin: 5px 0px;"
+                      tabindex="0"
                     >
-                      Select condition
+                      <div
+                        aria-atomic="true"
+                        aria-live="polite"
+                        class="divider default text"
+                        role="alert"
+                      >
+                        Select condition
+                      </div>
+                      <i
+                        aria-hidden="true"
+                        class="dropdown icon"
+                      />
+                      <div
+                        class="menu transition"
+                      />
                     </div>
-                    <i
-                      aria-hidden="true"
-                      className="dropdown icon"
-                      onClick={[Function]}
-                    />
-                    <div
-                      className="menu transition"
-                    />
+                    <button
+                      class="ui compact primary button"
+                    >
+                      Add
+                    </button>
                   </div>
-                  <button
-                    className="ui compact primary button"
-                    onClick={[Function]}
-                  >
-                    Add
-                  </button>
                 </div>
-              </div>
-              <div
-                className="six wide computer six wide large screen sixteen wide mobile sixteen wide tablet column"
-              >
-                <h4>
-                  Perform the following actions:
-                </h4>
                 <div
-                  className="row"
+                  class="six wide computer six wide large screen sixteen wide mobile sixteen wide tablet column"
                 >
-                  <h4
-                    style={
-                      Object {
-                        "marginTop": "15px",
-                      }
-                    }
-                  >
-                    Action: 
+                  <h4>
+                    Perform the following actions:
                   </h4>
                   <div
-                    aria-expanded={false}
-                    className="ui fluid selection dropdown"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onClick={[Function]}
-                    onFocus={[Function]}
-                    onKeyDown={[Function]}
-                    onMouseDown={[Function]}
-                    role="listbox"
-                    style={
-                      Object {
-                        "margin": "5px 0",
-                      }
-                    }
-                    tabIndex={0}
+                    class="row"
                   >
+                    <h4
+                      style="margin-top: 15px;"
+                    >
+                      Action: 
+                    </h4>
                     <div
-                      aria-atomic={true}
-                      aria-live="polite"
-                      className="divider default text"
-                      role="alert"
+                      aria-expanded="false"
+                      class="ui fluid selection dropdown"
+                      role="listbox"
+                      style="margin: 5px 0px;"
+                      tabindex="0"
                     >
-                      Select action
+                      <div
+                        aria-atomic="true"
+                        aria-live="polite"
+                        class="divider default text"
+                        role="alert"
+                      >
+                        Select action
+                      </div>
+                      <i
+                        aria-hidden="true"
+                        class="dropdown icon"
+                      />
+                      <div
+                        class="menu transition"
+                      />
                     </div>
-                    <i
-                      aria-hidden="true"
-                      className="dropdown icon"
-                      onClick={[Function]}
-                    />
-                    <div
-                      className="menu transition"
-                    />
+                    <button
+                      class="ui compact primary button"
+                    >
+                      Add
+                    </button>
                   </div>
-                  <button
-                    className="ui compact primary button"
-                    onClick={[Function]}
-                  >
-                    Add
-                  </button>
                 </div>
               </div>
-            </div>
-            <div
-              className="stretched row"
-            >
               <div
-                className="column"
+                class="stretched row"
               >
-                <h4>
-                  Assignments
-                </h4>
-                This rule is assigned to the following locations:
+                <div
+                  class="column"
+                >
+                  <h4>
+                    Assignments
+                  </h4>
+                  This rule is assigned to the following locations:
+                </div>
               </div>
             </div>
           </div>
         </div>
-      </div>
-    </article>
+      </article>
+    </div>
   </div>
-  
-  
-  
-  
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/EditRule.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/EditRule.test.jsx.snap
index 4920f93180..931b391418 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/EditRule.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/EditRule.test.jsx.snap
@@ -1,242 +1,197 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`EditRule renders rules edit interface 1`] = `
-<div
-  id="page-rule-edit"
->
+<div>
   <div
-    className="ui container"
+    id="page-rule-edit"
   >
-    <article
-      id="content"
+    <div
+      class="ui container"
     >
-      <div
-        className="ui raised segments"
+      <article
+        id="content"
       >
         <div
-          className="ui segment primary"
+          class="ui raised segments"
         >
-          Edit Rule
-        </div>
-        <div
-          className="ui segment secondary"
-        >
-          Use the form below to define the new content rule
-        </div>
-        <div
-          className="ui segment"
-        >
-          <form
-            className="ui form"
-            onSubmit={[Function]}
+          <div
+            class="ui segment primary"
           >
-            <div
-              className="ui grid"
+            Edit Rule
+          </div>
+          <div
+            class="ui segment secondary"
+          >
+            Use the form below to define the new content rule
+          </div>
+          <div
+            class="ui segment"
+          >
+            <form
+              class="ui form"
             >
               <div
-                className="stretched row"
+                class="ui grid"
               >
                 <div
-                  className="column"
+                  class="stretched row"
                 >
                   <div
-                    className="mocked-default-widget"
-                    id="mocked-field-undefined"
+                    class="column"
                   >
-                    Title
-                     - 
-                    Please set a descriptive title for the rule.
+                    <div
+                      class="mocked-default-widget"
+                      id="mocked-field-undefined"
+                    >
+                      Title
+                       - 
+                      Please set a descriptive title for the rule.
+                    </div>
                   </div>
                 </div>
-              </div>
-              <div
-                className="stretched row"
-              >
                 <div
-                  className="column"
+                  class="stretched row"
                 >
                   <div
-                    className="mocked-default-widget"
-                    id="mocked-field-undefined"
+                    class="column"
                   >
-                    Description
-                     - 
-                    Enter a short description of the rule and its purpose.
+                    <div
+                      class="mocked-default-widget"
+                      id="mocked-field-undefined"
+                    >
+                      Description
+                       - 
+                      Enter a short description of the rule and its purpose.
+                    </div>
                   </div>
                 </div>
-              </div>
-              <div
-                className="stretched row"
-              >
                 <div
-                  className="column"
+                  class="stretched row"
                 >
                   <div
-                    className="mocked-default-widget"
-                    id="mocked-field-undefined"
+                    class="column"
                   >
-                    Triggering event
-                     - 
-                    The rule will execute when the following event occurs.
+                    <div
+                      class="mocked-default-widget"
+                      id="mocked-field-undefined"
+                    >
+                      Triggering event
+                       - 
+                      The rule will execute when the following event occurs.
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-          </form>
-        </div>
-        <div
-          className="ui segment"
-        >
+            </form>
+          </div>
           <div
-            style={
-              Object {
-                "display": "flex",
-                "flexDirection": "column",
-              }
-            }
+            class="ui segment"
           >
             <div
-              className="ui checkbox"
-              onChange={[Function]}
-              onClick={[Function]}
-              onMouseDown={[Function]}
-              onMouseUp={[Function]}
+              style="display: flex; flex-direction: column;"
             >
-              <input
-                checked={false}
-                className="hidden"
-                readOnly={true}
-                tabIndex={0}
-                type="checkbox"
-              />
-              <label>
-                Enabled
-              </label>
+              <div
+                class="ui checkbox"
+              >
+                <input
+                  class="hidden"
+                  readonly=""
+                  tabindex="0"
+                  type="checkbox"
+                  value=""
+                />
+                <label>
+                  Enabled
+                </label>
+              </div>
+              <p
+                style="color: rgb(135, 143, 147); padding-top: 0.7rem; padding-bottom: 0.7rem; font-size: 0.9rem;"
+              >
+                Whether or not the rule is currently enabled
+              </p>
             </div>
-            <p
-              style={
-                Object {
-                  "color": "#878f93",
-                  "fontSize": "0.9rem",
-                  "paddingBottom": "0.7rem",
-                  "paddingTop": "0.7rem",
-                }
-              }
-            >
-              Whether or not the rule is currently enabled
-            </p>
           </div>
-        </div>
-        <div
-          className="ui segment"
-        >
           <div
-            style={
-              Object {
-                "display": "flex",
-                "flexDirection": "column",
-              }
-            }
+            class="ui segment"
           >
             <div
-              className="ui checkbox"
-              onChange={[Function]}
-              onClick={[Function]}
-              onMouseDown={[Function]}
-              onMouseUp={[Function]}
+              style="display: flex; flex-direction: column;"
             >
-              <input
-                checked={false}
-                className="hidden"
-                readOnly={true}
-                tabIndex={0}
-                type="checkbox"
-              />
-              <label>
-                Stop Executing rules
-              </label>
+              <div
+                class="ui checkbox"
+              >
+                <input
+                  class="hidden"
+                  readonly=""
+                  tabindex="0"
+                  type="checkbox"
+                  value=""
+                />
+                <label>
+                  Stop Executing rules
+                </label>
+              </div>
+              <p
+                style="color: rgb(135, 143, 147); padding-top: 0.7rem; padding-bottom: 0.7rem; font-size: 0.9rem;"
+              >
+                Whether or not execution of further rules should stop after this rule is executed
+              </p>
             </div>
-            <p
-              style={
-                Object {
-                  "color": "#878f93",
-                  "fontSize": "0.9rem",
-                  "paddingBottom": "0.7rem",
-                  "paddingTop": "0.7rem",
-                }
-              }
-            >
-              Whether or not execution of further rules should stop after this rule is executed
-            </p>
           </div>
-        </div>
-        <div
-          className="ui segment"
-        >
           <div
-            style={
-              Object {
-                "display": "flex",
-                "flexDirection": "column",
-              }
-            }
+            class="ui segment"
           >
             <div
-              className="ui checkbox"
-              onChange={[Function]}
-              onClick={[Function]}
-              onMouseDown={[Function]}
-              onMouseUp={[Function]}
+              style="display: flex; flex-direction: column;"
             >
-              <input
-                checked={false}
-                className="hidden"
-                readOnly={true}
-                tabIndex={0}
-                type="checkbox"
-              />
-              <label>
-                Cascading rule
-              </label>
+              <div
+                class="ui checkbox"
+              >
+                <input
+                  class="hidden"
+                  readonly=""
+                  tabindex="0"
+                  type="checkbox"
+                  value=""
+                />
+                <label>
+                  Cascading rule
+                </label>
+              </div>
+              <p
+                style="color: rgb(135, 143, 147); padding-top: 0.7rem; padding-bottom: 0.7rem; font-size: 0.9rem;"
+              >
+                Whether or not other rules should be triggered by the actions launched by this rule. Activate this only if you are sure this won't create infinite loops
+              </p>
             </div>
-            <p
-              style={
-                Object {
-                  "color": "#878f93",
-                  "fontSize": "0.9rem",
-                  "paddingBottom": "0.7rem",
-                  "paddingTop": "0.7rem",
-                }
-              }
-            >
-              Whether or not other rules should be triggered by the actions launched by this rule. Activate this only if you are sure this won't create infinite loops
-            </p>
           </div>
-        </div>
-        <div
-          className="ui segment"
-        >
-          <button
-            className="ui primary button"
-            onClick={[Function]}
-          >
-            Save
-          </button>
-          <button
-            className="ui secondary button"
-            onClick={[Function]}
+          <div
+            class="ui segment"
           >
-            Cancel
-          </button>
+            <button
+              class="ui primary button"
+            >
+              Save
+            </button>
+            <button
+              class="ui secondary button"
+            >
+              Cancel
+            </button>
+          </div>
+          <div
+            class="ui segment"
+          />
         </div>
-        <div
-          className="ui segment"
-        />
-      </div>
-    </article>
+      </article>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/Rules.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/Rules.test.jsx.snap
index 6badfd410f..dbdbfaefb5 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/Rules.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/__snapshots__/Rules.test.jsx.snap
@@ -1,93 +1,92 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Rules renders rules control panel control 1`] = `
-<div
-  id="page-rules"
->
+<div>
   <div
-    className="ui container"
+    id="page-rules"
   >
-    <article
-      id="content"
+    <div
+      class="ui container"
     >
-      <div
-        className="ui raised segments"
+      <article
+        id="content"
       >
         <div
-          className="ui segment primary"
-        >
-          Content Rules
-        </div>
-        <div
-          className="ui segment secondary"
-        >
-          Use the form below to define, change or remove content rules. Rules will automatically perform actions on content when certain triggers take place. After defining rules, you may want to go to a folder to assign them, using the 'rules' item in the actions menu.
-        </div>
-        <div
-          className="ui segment"
+          class="ui raised segments"
         >
           <div
-            className="ui small header"
+            class="ui segment primary"
           >
-            Filter Rules:
+            Content Rules
           </div>
-          <form
-            className="ui form"
-            onSubmit={[Function]}
+          <div
+            class="ui segment secondary"
           >
-            <div
-              style={
-                Object {
-                  "display": "flex",
-                  "flexWrap": "wrap",
-                }
-              }
-            />
-          </form>
-          <table
-            className="ui table"
+            Use the form below to define, change or remove content rules. Rules will automatically perform actions on content when certain triggers take place. After defining rules, you may want to go to a folder to assign them, using the 'rules' item in the actions menu.
+          </div>
+          <div
+            class="ui segment"
           >
-            <tbody
-              className=""
+            <div
+              class="ui small header"
             >
-              <tr
-                className=""
+              Filter Rules:
+            </div>
+            <form
+              class="ui form"
+            >
+              <div
+                style="display: flex; flex-wrap: wrap;"
+              />
+            </form>
+            <table
+              class="ui table"
+            >
+              <tbody
+                class=""
               >
-                <th
-                  className=""
-                >
-                  Content Rule
-                </th>
-                <th
-                  className=""
-                >
-                  Event
-                </th>
-                <th
-                  className=""
-                >
-                  Status
-                </th>
-                <th
-                  className=""
+                <tr
+                  class=""
                 >
-                  Actions
-                </th>
-              </tr>
-            </tbody>
-          </table>
-          <button
-            className="ui primary button"
-            onClick={[Function]}
-          >
-            Add content rule
-          </button>
+                  <th
+                    class=""
+                  >
+                    Content Rule
+                  </th>
+                  <th
+                    class=""
+                  >
+                    Event
+                  </th>
+                  <th
+                    class=""
+                  >
+                    Status
+                  </th>
+                  <th
+                    class=""
+                  >
+                    Actions
+                  </th>
+                </tr>
+              </tbody>
+            </table>
+            <button
+              class="ui primary button"
+            >
+              Add content rule
+            </button>
+          </div>
         </div>
-      </div>
-    </article>
+      </article>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/components/VariableModal.test.jsx b/packages/volto/src/components/manage/Controlpanels/Rules/components/VariableModal.test.jsx.removed
similarity index 71%
rename from packages/volto/src/components/manage/Controlpanels/Rules/components/VariableModal.test.jsx
rename to packages/volto/src/components/manage/Controlpanels/Rules/components/VariableModal.test.jsx.removed
index 4d6bb73ab2..3d7220e637 100644
--- a/packages/volto/src/components/manage/Controlpanels/Rules/components/VariableModal.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Rules/components/VariableModal.test.jsx.removed
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
@@ -9,9 +9,8 @@ import VariableModal from './VariableModal';
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 
 describe('VariableModal', () => {
   it('renders rules add interface', () => {
@@ -21,12 +20,12 @@ describe('VariableModal', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <VariableModal location={{ pathname: '/controlpanel/rules' }} />
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Rules/components/__snapshots__/VariableModal.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/Rules/components/__snapshots__/VariableModal.test.jsx.snap
deleted file mode 100644
index 45338eec4d..0000000000
--- a/packages/volto/src/components/manage/Controlpanels/Rules/components/__snapshots__/VariableModal.test.jsx.snap
+++ /dev/null
@@ -1,8 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`VariableModal renders rules add interface 1`] = `
-<div>
-  
-  
-</div>
-`;
diff --git a/packages/volto/src/components/manage/Controlpanels/UndoControlpanel.jsx b/packages/volto/src/components/manage/Controlpanels/UndoControlpanel.jsx
index 62bbef85e3..3b95e2dd4a 100644
--- a/packages/volto/src/components/manage/Controlpanels/UndoControlpanel.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/UndoControlpanel.jsx
@@ -7,7 +7,7 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Container, Segment, Table, Menu, Input } from 'semantic-ui-react';
 import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
 import { Icon, Toolbar, Form, Toast } from '@plone/volto/components';
@@ -702,8 +702,8 @@ class UndoControlpanel extends Component {
             )}
           </Segment.Group>
         </Segment.Group>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -720,9 +720,9 @@ class UndoControlpanel extends Component {
                   </Link>
                 </>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/UndoControlpanel.test.jsx b/packages/volto/src/components/manage/Controlpanels/UndoControlpanel.test.jsx
index 61d65fcc2c..ba7261c78e 100644
--- a/packages/volto/src/components/manage/Controlpanels/UndoControlpanel.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/UndoControlpanel.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
@@ -7,9 +7,8 @@ import UndoControlpanel from './UndoControlpanel';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../Form/Form', () => jest.fn(() => <div id="form" />));
 
 describe('UndoControlpanel', () => {
@@ -84,12 +83,13 @@ describe('UndoControlpanel', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <UndoControlpanel location={{ pathname: '/blog' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/UpgradeControlPanel.jsx b/packages/volto/src/components/manage/Controlpanels/UpgradeControlPanel.jsx
index b415db3597..fe1efd6c55 100644
--- a/packages/volto/src/components/manage/Controlpanels/UpgradeControlPanel.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/UpgradeControlPanel.jsx
@@ -7,7 +7,7 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Button,
   Container,
@@ -311,8 +311,8 @@ class UpgradeControlPanel extends Component {
             ) : null}
           </Segment>
         </Segment.Group>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -329,9 +329,9 @@ class UpgradeControlPanel extends Component {
                   </Link>
                 </>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     ) : null;
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/Users/UserGroupMembershipControlPanel.jsx b/packages/volto/src/components/manage/Controlpanels/Users/UserGroupMembershipControlPanel.jsx
index 6195610e7f..0acb553959 100644
--- a/packages/volto/src/components/manage/Controlpanels/Users/UserGroupMembershipControlPanel.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Users/UserGroupMembershipControlPanel.jsx
@@ -2,9 +2,9 @@
  * User Control Panel [user group membership management]
  * TODO Enrich with features of user control panel. Then replace user control panel.
  */
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import { find } from 'lodash';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { useHistory } from 'react-router';
 import { Link, useLocation } from 'react-router-dom';
 import { FormattedMessage, useIntl } from 'react-intl';
@@ -45,6 +45,12 @@ const UserGroupMembershipPanel = () => {
     id: 'plone_setup',
   });
 
+  const [isClient, setIsClient] = useState(false);
+
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
+
   useEffect(() => {
     dispatch(listActions('/'));
   }, [dispatch]);
@@ -57,7 +63,7 @@ const UserGroupMembershipPanel = () => {
     dispatch(getSystemInformation());
   }, [dispatch]);
 
-  if (__CLIENT__ && !ploneSetupAction) {
+  if (isClient && !ploneSetupAction) {
     return <Unauthorized />;
   }
 
@@ -108,8 +114,8 @@ const UserGroupMembershipPanel = () => {
         </Segment.Group>
       </div>
 
-      {__CLIENT__ && (
-        <Portal node={document.getElementById('toolbar')}>
+      {isClient &&
+        createPortal(
           <Toolbar
             pathname={pathname}
             hideDefaultViewButtons
@@ -139,9 +145,9 @@ const UserGroupMembershipPanel = () => {
                 </Link>
               </>
             }
-          />
-        </Portal>
-      )}
+          />,
+          document.getElementById('toolbar'),
+        )}
     </>
   );
 };
diff --git a/packages/volto/src/components/manage/Controlpanels/Users/UserGroupMembershipControlPanel.test.jsx b/packages/volto/src/components/manage/Controlpanels/Users/UserGroupMembershipControlPanel.test.jsx
index 2d9a74030d..26343e85fb 100644
--- a/packages/volto/src/components/manage/Controlpanels/Users/UserGroupMembershipControlPanel.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Users/UserGroupMembershipControlPanel.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter } from 'react-router-dom';
@@ -7,9 +7,8 @@ import { MemoryRouter } from 'react-router-dom';
 import UserGroupMembershipControlPanel from './UserGroupMembershipControlPanel';
 
 const mockStore = configureStore();
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 describe('UserGroupMembershipControlPanel', () => {
   it('renders a user group membership control component', () => {
     const store = mockStore({
@@ -49,14 +48,15 @@ describe('UserGroupMembershipControlPanel', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <UserGroupMembershipControlPanel />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Users/UsersControlpanel.jsx b/packages/volto/src/components/manage/Controlpanels/Users/UsersControlpanel.jsx
index a8f8e6687b..f76fba2b80 100644
--- a/packages/volto/src/components/manage/Controlpanels/Users/UsersControlpanel.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Users/UsersControlpanel.jsx
@@ -32,7 +32,7 @@ import { find, map, pull, difference } from 'lodash';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { FormattedMessage, injectIntl } from 'react-intl';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { connect } from 'react-redux';
 import { toast } from 'react-toastify';
 import { bindActionCreators, compose } from 'redux';
@@ -619,8 +619,8 @@ class UsersControlpanel extends Component {
             </div>
           </Form>
         </Segment.Group>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -672,9 +672,9 @@ class UsersControlpanel extends Component {
                   </Button>
                 </>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Controlpanels/Users/UsersControlpanel.test.jsx b/packages/volto/src/components/manage/Controlpanels/Users/UsersControlpanel.test.jsx
index 49286f9c15..eca583e177 100644
--- a/packages/volto/src/components/manage/Controlpanels/Users/UsersControlpanel.test.jsx
+++ b/packages/volto/src/components/manage/Controlpanels/Users/UsersControlpanel.test.jsx
@@ -1,14 +1,13 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
 import UsersControlpanel from './UsersControlpanel';
 
 const mockStore = configureStore();
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 describe('UsersControlpanel', () => {
   it('renders a user control component', () => {
     const store = mockStore({
@@ -29,12 +28,13 @@ describe('UsersControlpanel', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <UsersControlpanel location={{ pathname: '/blog' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Controlpanels/Users/__snapshots__/UserGroupMembershipControlPanel.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/Users/__snapshots__/UserGroupMembershipControlPanel.test.jsx.snap
index 383fc4159d..3da50c6b65 100644
--- a/packages/volto/src/components/manage/Controlpanels/Users/__snapshots__/UserGroupMembershipControlPanel.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/Users/__snapshots__/UserGroupMembershipControlPanel.test.jsx.snap
@@ -1,37 +1,40 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`UserGroupMembershipControlPanel renders a user group membership control component 1`] = `
-<div
-  className="ui container view-wrapper"
->
-  <h1>
-    Unauthorized
-  </h1>
-  <h3 />
-  <p
-    className="description"
+<div>
+  <div
+    class="ui container view-wrapper"
   >
-    You are trying to access a protected resource, please 
-    <a
-      href="/login"
-      onClick={[Function]}
+    <h1>
+      Unauthorized
+    </h1>
+    <h3 />
+    <p
+      class="description"
     >
-      log in
-    </a>
-     first.
-  </p>
-  <p>
-    If you are certain you have the correct web address but are encountering an error, please contact the 
-    <a
-      href="/contact-form"
-      onClick={[Function]}
-    >
-      Site Administration
-    </a>
-    .
-  </p>
-  <p>
-    Thank you.
-  </p>
+      You are trying to access a protected resource, please 
+      <a
+        href="/login"
+      >
+        log in
+      </a>
+       first.
+    </p>
+    <p>
+      If you are certain you have the correct web address but are encountering an error, please contact the 
+      <a
+        href="/contact-form"
+      >
+        Site Administration
+      </a>
+      .
+    </p>
+    <p>
+      Thank you.
+    </p>
+  </div>
+  <div
+    id="toolbar"
+  />
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/Users/__snapshots__/UsersControlpanel.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/Users/__snapshots__/UsersControlpanel.test.jsx.snap
index 5e68f9ca78..3e42328f02 100644
--- a/packages/volto/src/components/manage/Controlpanels/Users/__snapshots__/UsersControlpanel.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/Users/__snapshots__/UsersControlpanel.test.jsx.snap
@@ -1,124 +1,117 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`UsersControlpanel renders a user control component 1`] = `
-<div
-  className="ui container users-control-panel"
->
+<div>
   <div
-    className="container"
-  />
-  <div
-    className="ui raised segments"
+    class="ui container users-control-panel"
   >
     <div
-      className="ui segment primary"
-    >
-      Users
-    </div>
-    <div
-      className="ui secondary segment"
-    >
-      Note that roles set here apply directly to a user. The symbol
-      <svg
-        className="icon"
-        dangerouslySetInnerHTML={
-          Object {
-            "__html": "<title>plone-svg</title>undefined",
-          }
-        }
-        onClick={null}
-        style={
-          Object {
-            "fill": "#007EB1",
-            "height": "20px",
-            "width": "auto",
-          }
-        }
-        viewBox=""
-        xmlns=""
-      />
-      indicates a role inherited from membership in a group.
-    </div>
+      class="container"
+    />
     <div
-      className="ui segment"
+      class="ui raised segments"
     >
-      <form
-        className="ui form"
-        onSubmit={[Function]}
+      <div
+        class="ui segment primary"
       >
-        <div
-          className="field"
+        Users
+      </div>
+      <div
+        class="ui secondary segment"
+      >
+        Note that roles set here apply directly to a user. The symbol
+        <svg
+          class="icon"
+          style="height: 20px; width: auto; fill: #007EB1;"
+          viewBox=""
+          xmlns=""
+        >
+          <title>
+            plone-svg
+          </title>
+          undefined
+        </svg>
+        indicates a role inherited from membership in a group.
+      </div>
+      <div
+        class="ui segment"
+      >
+        <form
+          class="ui form"
         >
           <div
-            className="ui action input"
+            class="field"
           >
-            <input
-              id="user-search-input"
-              name="SearchableText"
-              onChange={[Function]}
-              placeholder="Search users…"
-              type="text"
-            />
-            <button
-              className="ui icon button"
-              onClick={[Function]}
+            <div
+              class="ui action input"
             >
-              <i
-                aria-hidden="true"
-                className="search icon"
-                onClick={[Function]}
+              <input
+                id="user-search-input"
+                name="SearchableText"
+                placeholder="Search users…"
+                type="text"
               />
-            </button>
+              <button
+                class="ui icon button"
+              >
+                <i
+                  aria-hidden="true"
+                  class="search icon"
+                />
+              </button>
+            </div>
           </div>
-        </div>
-      </form>
-    </div>
-    <form
-      className="ui form"
-      onSubmit={[Function]}
-    >
-      <table
-        className="ui striped unstackable attached padded table"
+        </form>
+      </div>
+      <form
+        class="ui form"
       >
-        <thead
-          className=""
+        <table
+          class="ui striped unstackable attached padded table"
         >
-          <tr
-            className=""
+          <thead
+            class=""
           >
-            <th
-              className=""
-            >
-              User name
-            </th>
-            <th
-              className=""
+            <tr
+              class=""
             >
-              Actions
-            </th>
-          </tr>
-        </thead>
-        <tbody
-          className=""
-          data-user="users"
-        />
-      </table>
-      
-      <div
-        className="contents-pagination"
-      >
+              <th
+                class=""
+              >
+                User name
+              </th>
+              <th
+                class=""
+              >
+                Actions
+              </th>
+            </tr>
+          </thead>
+          <tbody
+            class=""
+            data-user="users"
+          />
+        </table>
         <div
-          className="ui secondary attached menu"
+          class="contents-pagination"
         >
           <div
-            className="menu"
-          />
+            class="ui secondary attached menu"
+          >
+            <div
+              class="menu"
+            />
+          </div>
         </div>
-      </div>
-    </form>
+      </form>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/__snapshots__/AddonsControlpanel.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/__snapshots__/AddonsControlpanel.test.jsx.snap
index 78ea65bb56..5e191feca7 100644
--- a/packages/volto/src/components/manage/Controlpanels/__snapshots__/AddonsControlpanel.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/__snapshots__/AddonsControlpanel.test.jsx.snap
@@ -1,221 +1,195 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`AddonsControlpanel renders an addon control component 1`] = `
-<div
-  className="ui container controlpanel-addons"
-  id="page-addons"
->
+<div>
   <div
-    className="ui raised segments"
+    class="ui container controlpanel-addons"
+    id="page-addons"
   >
     <div
-      className="ui segment primary"
-    >
-      Add-ons Settings
-    </div>
-    <div
-      className="ui attached message"
+      class="ui raised segments"
     >
       <div
-        className="header"
+        class="ui segment primary"
       >
-        Updates available
+        Add-ons Settings
       </div>
-      Update installed addons
-    </div>
-    <div
-      className="ui segment"
-    >
-      <h3
-        className="ui header"
+      <div
+        class="ui attached message"
       >
-        Activate and deactivate add-ons in the lists below.
-      </h3>
-      To make new add-ons show up here, add them to your configuration, build, and restart the server process. For detailed instructions see
-       
-      <a
-        href="https://6.docs.plone.org/install/"
-        rel="noopener noreferrer"
-        target="_blank"
+        <div
+          class="header"
+        >
+          Updates available
+        </div>
+        Update installed addons
+      </div>
+      <div
+        class="ui segment"
       >
-        Installing a third party add-on
-      </a>
-      .
-    </div>
-    <div
-      className="ui secondary segment"
-    >
-      Available
-      :
+        <h3
+          class="ui header"
+        >
+          Activate and deactivate add-ons in the lists below.
+        </h3>
+        To make new add-ons show up here, add them to your configuration, build, and restart the server process. For detailed instructions see
+         
+        <a
+          href="https://6.docs.plone.org/install/"
+          rel="noopener noreferrer"
+          target="_blank"
+        >
+          Installing a third party add-on
+        </a>
+        .
+      </div>
       <div
-        className="ui circular label"
-        onClick={[Function]}
+        class="ui secondary segment"
       >
-        1
+        Available
+        :
+        <div
+          class="ui circular label"
+        >
+          1
+        </div>
       </div>
-    </div>
-    <div
-      className="ui attached segment"
-    >
       <div
-        className="accordion ui"
+        class="ui attached segment"
       >
         <div
-          className="ui divider"
-        />
-        <div>
-          <div
-            className="title"
-            onClick={[Function]}
-          >
-            Something Else
-            <svg
-              className="icon accordionToggle Something Else"
-              dangerouslySetInnerHTML={
-                Object {
-                  "__html": undefined,
-                }
-              }
-              onClick={null}
-              style={
-                Object {
-                  "fill": "currentColor",
-                  "height": "23px",
-                  "width": "auto",
-                }
-              }
-              viewBox=""
-              xmlns=""
-            />
-          </div>
+          class="accordion ui"
+        >
           <div
-            className="content"
-          >
+            class="ui divider"
+          />
+          <div>
             <div
-              className="description"
+              class="title"
             >
-              Does other things…
+              Something Else
+              <svg
+                class="icon accordionToggle Something Else"
+                style="height: 23px; width: auto; fill: currentColor;"
+                viewBox=""
+                xmlns=""
+              />
             </div>
             <div
-              className="ui right floated buttons"
+              class="content"
             >
-              <button
-                className="ui primary button installAction"
-                onClick={[Function]}
-                value="plone.app.somethingelse"
+              <div
+                class="description"
+              >
+                Does other things…
+              </div>
+              <div
+                class="ui right floated buttons"
               >
-                Install
-              </button>
+                <button
+                  class="ui primary button installAction"
+                  value="plone.app.somethingelse"
+                >
+                  Install
+                </button>
+              </div>
+              <div
+                class="version"
+              >
+                Latest version
+                :  
+                1.0.0
+              </div>
             </div>
             <div
-              className="version"
-            >
-              Latest version
-              :  
-              1.0.0
-            </div>
+              class="ui divider"
+            />
           </div>
-          <div
-            className="ui divider"
-          />
         </div>
       </div>
-    </div>
-    <div
-      className="ui secondary segment"
-    >
-      Installed
-      :
       <div
-        className="ui circular label"
-        onClick={[Function]}
+        class="ui secondary segment"
       >
-        1
+        Installed
+        :
+        <div
+          class="ui circular label"
+        >
+          1
+        </div>
       </div>
-    </div>
-    <div
-      className="ui attached segment"
-    >
       <div
-        className="accordion ui"
+        class="ui attached segment"
       >
         <div
-          className="ui divider"
-        />
-        <div>
-          <div
-            className="title updateAvailable"
-            onClick={[Function]}
-          >
-            Whatever
-            <div
-              className="ui label"
-              onClick={[Function]}
-            >
-              Update
-            </div>
-            <svg
-              className="icon accordionToggle Whatever"
-              dangerouslySetInnerHTML={
-                Object {
-                  "__html": undefined,
-                }
-              }
-              onClick={null}
-              style={
-                Object {
-                  "fill": "#878f93",
-                  "height": "24px",
-                  "width": "auto",
-                }
-              }
-              viewBox=""
-              xmlns=""
-            />
-          </div>
+          class="accordion ui"
+        >
           <div
-            className="content"
-          >
+            class="ui divider"
+          />
+          <div>
             <div
-              className="description"
+              class="title updateAvailable"
             >
-              Does stuff and junk…
+              Whatever
+              <div
+                class="ui label"
+              >
+                Update
+              </div>
+              <svg
+                class="icon accordionToggle Whatever"
+                style="height: 24px; width: auto; fill: #878f93;"
+                viewBox=""
+                xmlns=""
+              />
             </div>
             <div
-              className="ui right floated buttons"
+              class="content"
             >
-              <button
-                className="ui primary button"
-                onClick={[Function]}
-                value="plone.app.whatever"
+              <div
+                class="description"
+              >
+                Does stuff and junk…
+              </div>
+              <div
+                class="ui right floated buttons"
               >
-                Update from version  to 
-              </button>
-              <button
-                className="ui negative button uninstallAction"
-                onClick={[Function]}
-                value="plone.app.whatever"
+                <button
+                  class="ui primary button"
+                  value="plone.app.whatever"
+                >
+                  Update from version  to 
+                </button>
+                <button
+                  class="ui negative button uninstallAction"
+                  value="plone.app.whatever"
+                >
+                  Uninstall
+                </button>
+              </div>
+              <div
+                class="version"
               >
-                Uninstall
-              </button>
+                Installed version
+                :   
+                1.0.0
+              </div>
             </div>
             <div
-              className="version"
-            >
-              Installed version
-              :   
-              1.0.0
-            </div>
+              class="ui divider"
+            />
           </div>
-          <div
-            className="ui divider"
-          />
         </div>
       </div>
     </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/__snapshots__/Aliases.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/__snapshots__/Aliases.test.jsx.snap
index 3faa80d47e..79e00ac7e7 100644
--- a/packages/volto/src/components/manage/Controlpanels/__snapshots__/Aliases.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/__snapshots__/Aliases.test.jsx.snap
@@ -1,518 +1,440 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Aliases renders an aliases control component 1`] = `
-<div
-  id="page-aliases"
->
+<div>
   <div
-    className="ui container"
+    id="page-aliases"
   >
-    <article
-      id="content"
+    <div
+      class="ui container"
     >
-      <div
-        className="ui raised segments"
+      <article
+        id="content"
       >
         <div
-          className="ui segment primary"
-        >
-          URL Management
-        </div>
-        <form
-          className="ui form"
-          onSubmit={[Function]}
+          class="ui raised segments"
         >
           <div
-            className="ui segment"
+            class="ui segment primary"
+          >
+            URL Management
+          </div>
+          <form
+            class="ui form"
           >
             <div
-              className="ui medium header"
-            >
-              Alternative url path (Required)
-            </div>
-            <p
-              className="help"
-            >
-              Enter the absolute path where the alternative url should exist. The path must start with '/'. Only urls that result in a 404 not found page will result in a redirect occurring.
-            </p>
-            <div
-              className="field"
+              class="ui segment"
             >
               <div
-                className="ui input"
+                class="ui medium header"
               >
-                <input
-                  id="alternative-url-input"
-                  name="alternative-url-path"
-                  onChange={[Function]}
-                  placeholder="/example"
-                  type="text"
-                  value=""
-                />
+                Alternative url path (Required)
+              </div>
+              <p
+                class="help"
+              >
+                Enter the absolute path where the alternative url should exist. The path must start with '/'. Only urls that result in a 404 not found page will result in a redirect occurring.
+              </p>
+              <div
+                class="field"
+              >
+                <div
+                  class="ui input"
+                >
+                  <input
+                    id="alternative-url-input"
+                    name="alternative-url-path"
+                    placeholder="/example"
+                    type="text"
+                    value=""
+                  />
+                </div>
               </div>
-            </div>
-            <div
-              className="ui medium header"
-            >
-              Target Path (Required)
-            </div>
-            <p
-              className="help"
-            >
-              Enter the absolute path of the target. The path must start with '/'. Target must exist or be an existing alternative url path to the target.
-            </p>
-            <div
-              className="field"
-            >
               <div
-                className="ui input"
+                class="ui medium header"
               >
-                <input
-                  id="target-url-input"
-                  name="target-url-path"
-                  onChange={[Function]}
-                  placeholder="/example"
-                  type="text"
-                  value=""
-                />
+                Target Path (Required)
               </div>
+              <p
+                class="help"
+              >
+                Enter the absolute path of the target. The path must start with '/'. Target must exist or be an existing alternative url path to the target.
+              </p>
+              <div
+                class="field"
+              >
+                <div
+                  class="ui input"
+                >
+                  <input
+                    id="target-url-input"
+                    name="target-url-path"
+                    placeholder="/example"
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+              <button
+                class="ui primary disabled button"
+                disabled=""
+                id="submit-alias"
+                tabindex="-1"
+              >
+                Add
+              </button>
             </div>
-            <button
-              className="ui primary disabled button"
-              disabled={true}
-              id="submit-alias"
-              onClick={[Function]}
-              tabIndex={-1}
-            >
-              Add
-            </button>
-            
-          </div>
-        </form>
-        <form
-          className="ui form"
-          onSubmit={[Function]}
-        >
-          <div
-            className="ui segment primary"
+          </form>
+          <form
+            class="ui form"
           >
             <div
-              className="ui medium header"
-            >
-              All existing alternative urls for this site
-            </div>
-            <div
-              className="ui small header"
-            >
-              Filter by prefix
-            </div>
-            <div
-              className="field"
+              class="ui segment primary"
             >
               <div
-                className="ui input"
+                class="ui medium header"
               >
-                <input
-                  name="filter"
-                  onChange={[Function]}
-                  placeholder="/example"
-                  type="text"
-                  value=""
-                />
+                All existing alternative urls for this site
               </div>
-            </div>
-            <div
-              className="ui small header"
-            >
-              Manually or automatically added?
-            </div>
-            <div
-              className="field"
-            >
               <div
-                className="ui checked radio checkbox"
-                onChange={[Function]}
-                onClick={[Function]}
-                onMouseDown={[Function]}
-                onMouseUp={[Function]}
+                class="ui small header"
               >
-                <input
-                  checked={true}
-                  className="hidden"
-                  name="radioGroup"
-                  readOnly={true}
-                  tabIndex={0}
-                  type="radio"
-                  value=""
-                />
-                <label>
-                  Both
-                </label>
+                Filter by prefix
               </div>
-            </div>
-            <div
-              className="field"
-            >
               <div
-                className="ui radio checkbox"
-                onChange={[Function]}
-                onClick={[Function]}
-                onMouseDown={[Function]}
-                onMouseUp={[Function]}
+                class="field"
               >
-                <input
-                  checked={false}
-                  className="hidden"
-                  name="radioGroup"
-                  readOnly={true}
-                  tabIndex={0}
-                  type="radio"
-                  value="no"
-                />
-                <label>
-                  Automatically
-                </label>
+                <div
+                  class="ui input"
+                >
+                  <input
+                    name="filter"
+                    placeholder="/example"
+                    type="text"
+                    value=""
+                  />
+                </div>
               </div>
-            </div>
-            <div
-              className="field"
-            >
               <div
-                className="ui radio checkbox"
-                onChange={[Function]}
-                onClick={[Function]}
-                onMouseDown={[Function]}
-                onMouseUp={[Function]}
+                class="ui small header"
               >
-                <input
-                  checked={false}
-                  className="hidden"
-                  name="radioGroup"
-                  readOnly={true}
-                  tabIndex={0}
-                  type="radio"
-                  value="yes"
-                />
-                <label>
-                  Manually
-                </label>
+                Manually or automatically added?
               </div>
-            </div>
-            <div
-              className="field"
-            />
-            <button
-              className="ui primary button"
-              onClick={[Function]}
-            >
-              Filter
-            </button>
-            <div
-              className="ui small header"
-            >
-              Alternative url path → target url path (date and time of creation, manually created yes/no)
-            </div>
-            <table
-              className="ui table"
-            >
-              <tbody
-                className=""
+              <div
+                class="field"
               >
-                <tr
-                  className=""
+                <div
+                  class="ui checked radio checkbox"
                 >
-                  <th
-                    className=""
-                  >
-                    Select
-                  </th>
-                  <th
-                    className=""
-                  >
-                    Alias
-                  </th>
-                  <th
-                    className=""
-                  >
-                    Target
-                  </th>
-                  <th
-                    className=""
-                  >
-                    Date
-                  </th>
-                  <th
-                    className=""
-                  >
-                    Manual
-                  </th>
-                </tr>
-                <tr
-                  className=""
+                  <input
+                    checked=""
+                    class="hidden"
+                    name="radioGroup"
+                    readonly=""
+                    tabindex="0"
+                    type="radio"
+                    value=""
+                  />
+                  <label>
+                    Both
+                  </label>
+                </div>
+              </div>
+              <div
+                class="field"
+              >
+                <div
+                  class="ui radio checkbox"
                 >
-                  <td
-                    className=""
-                  >
-                    <div
-                      className="ui fitted checkbox"
-                      onChange={[Function]}
-                      onClick={[Function]}
-                      onMouseDown={[Function]}
-                      onMouseUp={[Function]}
-                    >
-                      <input
-                        checked={false}
-                        className="hidden"
-                        readOnly={true}
-                        tabIndex={0}
-                        type="checkbox"
-                        value="/eventsalias"
-                      />
-                      <label />
-                    </div>
-                  </td>
-                  <td
-                    className=""
-                  >
-                    <p>
-                      /eventsalias
-                    </p>
-                  </td>
-                  <td
-                    className=""
-                  >
-                    <p>
-                      /events
-                    </p>
-                  </td>
-                  <td
-                    className=""
-                  >
-                    <p>
-                      2022-05-16T11:52:35+00:00
-                    </p>
-                  </td>
-                  <td
-                    className=""
-                  >
-                    <p>
-                      true
-                    </p>
-                  </td>
-                </tr>
-                <tr
-                  className=""
+                  <input
+                    class="hidden"
+                    name="radioGroup"
+                    readonly=""
+                    tabindex="0"
+                    type="radio"
+                    value="no"
+                  />
+                  <label>
+                    Automatically
+                  </label>
+                </div>
+              </div>
+              <div
+                class="field"
+              >
+                <div
+                  class="ui radio checkbox"
                 >
-                  <td
-                    className=""
+                  <input
+                    class="hidden"
+                    name="radioGroup"
+                    readonly=""
+                    tabindex="0"
+                    type="radio"
+                    value="yes"
+                  />
+                  <label>
+                    Manually
+                  </label>
+                </div>
+              </div>
+              <div
+                class="field"
+              />
+              <button
+                class="ui primary button"
+              >
+                Filter
+              </button>
+              <div
+                class="ui small header"
+              >
+                Alternative url path → target url path (date and time of creation, manually created yes/no)
+              </div>
+              <table
+                class="ui table"
+              >
+                <tbody
+                  class=""
+                >
+                  <tr
+                    class=""
                   >
-                    <div
-                      className="ui fitted checkbox"
-                      onChange={[Function]}
-                      onClick={[Function]}
-                      onMouseDown={[Function]}
-                      onMouseUp={[Function]}
+                    <th
+                      class=""
                     >
-                      <input
-                        checked={false}
-                        className="hidden"
-                        readOnly={true}
-                        tabIndex={0}
-                        type="checkbox"
-                        value="/eventsgreatalias"
-                      />
-                      <label />
-                    </div>
-                  </td>
-                  <td
-                    className=""
-                  >
-                    <p>
-                      /eventsgreatalias
-                    </p>
-                  </td>
-                  <td
-                    className=""
+                      Select
+                    </th>
+                    <th
+                      class=""
+                    >
+                      Alias
+                    </th>
+                    <th
+                      class=""
+                    >
+                      Target
+                    </th>
+                    <th
+                      class=""
+                    >
+                      Date
+                    </th>
+                    <th
+                      class=""
+                    >
+                      Manual
+                    </th>
+                  </tr>
+                  <tr
+                    class=""
                   >
-                    <p>
-                      /events
-                    </p>
-                  </td>
-                  <td
-                    className=""
+                    <td
+                      class=""
+                    >
+                      <div
+                        class="ui fitted checkbox"
+                      >
+                        <input
+                          class="hidden"
+                          readonly=""
+                          tabindex="0"
+                          type="checkbox"
+                          value="/eventsalias"
+                        />
+                        <label />
+                      </div>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        /eventsalias
+                      </p>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        /events
+                      </p>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        2022-05-16T11:52:35+00:00
+                      </p>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        true
+                      </p>
+                    </td>
+                  </tr>
+                  <tr
+                    class=""
                   >
-                    <p>
-                      2022-05-17T09:38:19+00:00
-                    </p>
-                  </td>
-                  <td
-                    className=""
+                    <td
+                      class=""
+                    >
+                      <div
+                        class="ui fitted checkbox"
+                      >
+                        <input
+                          class="hidden"
+                          readonly=""
+                          tabindex="0"
+                          type="checkbox"
+                          value="/eventsgreatalias"
+                        />
+                        <label />
+                      </div>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        /eventsgreatalias
+                      </p>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        /events
+                      </p>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        2022-05-17T09:38:19+00:00
+                      </p>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        true
+                      </p>
+                    </td>
+                  </tr>
+                  <tr
+                    class=""
                   >
-                    <p>
-                      true
-                    </p>
-                  </td>
-                </tr>
-                <tr
-                  className=""
+                    <td
+                      class=""
+                    >
+                      <div
+                        class="ui fitted checkbox"
+                      >
+                        <input
+                          class="hidden"
+                          readonly=""
+                          tabindex="0"
+                          type="checkbox"
+                          value="/eventsincredible"
+                        />
+                        <label />
+                      </div>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        /eventsincredible
+                      </p>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        /events
+                      </p>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        2022-05-17T09:38:35+00:00
+                      </p>
+                    </td>
+                    <td
+                      class=""
+                    >
+                      <p>
+                        true
+                      </p>
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+              <div
+                style="display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 20px;"
+              >
+                <div
+                  class="right menu"
+                  style="display: flex; margin-left: auto;"
                 >
-                  <td
-                    className=""
+                  <div
+                    class="item"
+                    style="color: grey;"
                   >
-                    <div
-                      className="ui fitted checkbox"
-                      onChange={[Function]}
-                      onClick={[Function]}
-                      onMouseDown={[Function]}
-                      onMouseUp={[Function]}
-                    >
-                      <input
-                        checked={false}
-                        className="hidden"
-                        readOnly={true}
-                        tabIndex={0}
-                        type="checkbox"
-                        value="/eventsincredible"
-                      />
-                      <label />
-                    </div>
-                  </td>
-                  <td
-                    className=""
+                    Show
+                    :
+                  </div>
+                  <a
+                    class="active item"
+                    style="padding: 0px 0.4em; margin: 0em 0.357em; cursor: pointer;"
+                    value="10"
                   >
-                    <p>
-                      /eventsincredible
-                    </p>
-                  </td>
-                  <td
-                    className=""
+                    10
+                  </a>
+                  <a
+                    class="item"
+                    style="padding: 0px 0.4em; margin: 0em 0.357em; cursor: pointer;"
+                    value="25"
                   >
-                    <p>
-                      /events
-                    </p>
-                  </td>
-                  <td
-                    className=""
+                    25
+                  </a>
+                  <a
+                    class="item"
+                    style="padding: 0px 0.4em; margin: 0em 0.357em; cursor: pointer;"
+                    value="50"
                   >
-                    <p>
-                      2022-05-17T09:38:35+00:00
-                    </p>
-                  </td>
-                  <td
-                    className=""
+                    50
+                  </a>
+                  <a
+                    class="item"
+                    style="padding: 0px 0.4em; margin: 0em 0.357em; cursor: pointer;"
+                    value="All"
                   >
-                    <p>
-                      true
-                    </p>
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-            <div
-              style={
-                Object {
-                  "alignItems": "center",
-                  "display": "flex",
-                  "flexWrap": "wrap",
-                  "marginBottom": "20px",
-                }
-              }
-            >
-              
-              <div
-                className="right menu"
-                style={
-                  Object {
-                    "display": "flex",
-                    "marginLeft": "auto",
-                  }
-                }
-              >
-                <div
-                  className="item"
-                  onClick={[Function]}
-                  style={
-                    Object {
-                      "color": "grey",
-                    }
-                  }
-                >
-                  Show
-                  :
+                    All
+                  </a>
                 </div>
-                <a
-                  className="active item"
-                  onClick={[Function]}
-                  style={
-                    Object {
-                      "cursor": "pointer",
-                      "margin": "0em 0.357em",
-                      "padding": "0 0.4em",
-                    }
-                  }
-                  value={10}
-                >
-                  10
-                </a>
-                <a
-                  className="item"
-                  onClick={[Function]}
-                  style={
-                    Object {
-                      "cursor": "pointer",
-                      "margin": "0em 0.357em",
-                      "padding": "0 0.4em",
-                    }
-                  }
-                  value={25}
-                >
-                  25
-                </a>
-                <a
-                  className="item"
-                  onClick={[Function]}
-                  style={
-                    Object {
-                      "cursor": "pointer",
-                      "margin": "0em 0.357em",
-                      "padding": "0 0.4em",
-                    }
-                  }
-                  value={50}
-                >
-                  50
-                </a>
-                <a
-                  className="item"
-                  onClick={[Function]}
-                  style={
-                    Object {
-                      "cursor": "pointer",
-                      "margin": "0em 0.357em",
-                      "padding": "0 0.4em",
-                    }
-                  }
-                  value="All"
-                >
-                  All
-                </a>
               </div>
+              <button
+                class="ui primary disabled button"
+                disabled=""
+                tabindex="-1"
+              >
+                Remove selected
+              </button>
             </div>
-            <button
-              className="ui primary disabled button"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex={-1}
-            >
-              Remove selected
-            </button>
-          </div>
-        </form>
-      </div>
-    </article>
+          </form>
+        </div>
+      </article>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentType.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentType.test.jsx.snap
index ec12264619..4f14e1a276 100644
--- a/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentType.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentType.test.jsx.snap
@@ -1,20 +1,26 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ContentType renders dexterity content-type component 1`] = `
-<div
-  className="ui container"
-  id="page-controlpanel"
->
+<div>
   <div
-    className="ui disabled header"
+    class="ui container"
+    id="page-controlpanel"
   >
-    Page Content Type
+    <div
+      class="ui disabled header"
+    >
+      Page Content Type
+    </div>
+    <div
+      id="form"
+    />
   </div>
   <div
-    id="form"
-  />
-  <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentTypeLayout.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentTypeLayout.test.jsx.snap
index 05ca0ff67e..e4adb1612b 100644
--- a/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentTypeLayout.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentTypeLayout.test.jsx.snap
@@ -1,3 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`ContentTypeLayout renders dexterity content-type layout component 1`] = `<div />`;
+exports[`ContentTypeLayout renders dexterity content-type layout component 1`] = `
+<div>
+  <div />
+  <div
+    id="toolbar"
+  />
+</div>
+`;
diff --git a/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentTypes.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentTypes.test.jsx.snap
index e1b6dced61..1a4e81fdba 100644
--- a/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentTypes.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/__snapshots__/ContentTypes.test.jsx.snap
@@ -1,367 +1,249 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ContentTypes renders dexterity content-types controlpanel component 1`] = `
-<div
-  className="ui container types-control-panel"
->
+<div>
   <div
-    className="container"
-  />
-  <div
-    className="ui container"
+    class="ui container types-control-panel"
   >
-    <article
-      id="content"
+    <div
+      class="container"
+    />
+    <div
+      class="ui container"
     >
-      <div
-        className="ui disabled header"
-      >
-        Dexterity Content Types
-      </div>
-      <section
-        id="content-core"
+      <article
+        id="content"
       >
-        <table
-          className="ui single line striped compact table"
+        <div
+          class="ui disabled header"
+        >
+          Dexterity Content Types
+        </div>
+        <section
+          id="content-core"
         >
-          <thead
-            className=""
+          <table
+            class="ui single line striped compact table"
           >
-            <tr
-              className=""
+            <thead
+              class=""
             >
-              <th
-                className=""
-              >
-                Type
-              </th>
-              <th
-                className=""
-              >
-                Description
-              </th>
-              <th
-                className=""
-              >
-                Items
-              </th>
-              <th
-                className="right aligned"
+              <tr
+                class=""
               >
-                Actions
-              </th>
-            </tr>
-          </thead>
-          <tbody
-            className=""
-          >
-            <tr
-              className=""
+                <th
+                  class=""
+                >
+                  Type
+                </th>
+                <th
+                  class=""
+                >
+                  Description
+                </th>
+                <th
+                  class=""
+                >
+                  Items
+                </th>
+                <th
+                  class="right aligned"
+                >
+                  Actions
+                </th>
+              </tr>
+            </thead>
+            <tbody
+              class=""
             >
-              <td
-                className=""
+              <tr
+                class=""
               >
-                <a
-                  href="/controlpanel/dexterity-types/Document"
-                  onClick={[Function]}
+                <td
+                  class=""
                 >
-                  Page
-                </a>
-              </td>
-              <td
-                className=""
-              >
-                
-              </td>
-              <td
-                className=""
-              >
-                0
-              </td>
-              <td
-                className="right aligned"
-              >
-                <div
-                  aria-expanded={false}
-                  className="ui dropdown actions-Document"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onMouseDown={[Function]}
-                  role="listbox"
-                  tabIndex={0}
+                  <a
+                    href="/controlpanel/dexterity-types/Document"
+                  >
+                    Page
+                  </a>
+                </td>
+                <td
+                  class=""
+                />
+                <td
+                  class=""
+                >
+                  0
+                </td>
+                <td
+                  class="right aligned"
                 >
-                  <i
-                    aria-hidden="true"
-                    className="ellipsis horizontal icon"
-                    onClick={[Function]}
-                  />
                   <div
-                    className="menu transition left"
+                    aria-expanded="false"
+                    class="ui dropdown actions-Document"
+                    role="listbox"
+                    tabindex="0"
                   >
+                    <i
+                      aria-hidden="true"
+                      class="ellipsis horizontal icon"
+                    />
                     <div
-                      className="item edit-Document"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "15px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      Edit
-                    </div>
-                    <div
-                      className="item"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "15px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      Schema
-                    </div>
-                    <div
-                      className="item layout-Document"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "15px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      Layout
-                    </div>
-                    <div
-                      className="item delete-Document"
-                      onClick={[Function]}
-                      role="option"
+                      class="menu transition left"
                     >
-                      <svg
-                        className="icon"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "15px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      Delete
+                      <div
+                        class="item edit-Document"
+                        role="option"
+                      >
+                        <svg
+                          class="icon"
+                          style="height: 15px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        Edit
+                      </div>
+                      <div
+                        class="item"
+                        role="option"
+                      >
+                        <svg
+                          class="icon"
+                          style="height: 15px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        Schema
+                      </div>
+                      <div
+                        class="item layout-Document"
+                        role="option"
+                      >
+                        <svg
+                          class="icon"
+                          style="height: 15px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        Layout
+                      </div>
+                      <div
+                        class="item delete-Document"
+                        role="option"
+                      >
+                        <svg
+                          class="icon"
+                          style="height: 15px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        Delete
+                      </div>
                     </div>
                   </div>
-                </div>
-              </td>
-            </tr>
-            <tr
-              className=""
-            >
-              <td
-                className=""
+                </td>
+              </tr>
+              <tr
+                class=""
               >
-                <a
-                  href="/controlpanel/dexterity-types/Folder"
-                  onClick={[Function]}
+                <td
+                  class=""
                 >
-                  Folder
-                </a>
-              </td>
-              <td
-                className=""
-              >
-                
-              </td>
-              <td
-                className=""
-              >
-                0
-              </td>
-              <td
-                className="right aligned"
-              >
-                <div
-                  aria-expanded={false}
-                  className="ui dropdown actions-Folder"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onMouseDown={[Function]}
-                  role="listbox"
-                  tabIndex={0}
+                  <a
+                    href="/controlpanel/dexterity-types/Folder"
+                  >
+                    Folder
+                  </a>
+                </td>
+                <td
+                  class=""
+                />
+                <td
+                  class=""
+                >
+                  0
+                </td>
+                <td
+                  class="right aligned"
                 >
-                  <i
-                    aria-hidden="true"
-                    className="ellipsis horizontal icon"
-                    onClick={[Function]}
-                  />
                   <div
-                    className="menu transition left"
+                    aria-expanded="false"
+                    class="ui dropdown actions-Folder"
+                    role="listbox"
+                    tabindex="0"
                   >
+                    <i
+                      aria-hidden="true"
+                      class="ellipsis horizontal icon"
+                    />
                     <div
-                      className="item edit-Folder"
-                      onClick={[Function]}
-                      role="option"
+                      class="menu transition left"
                     >
-                      <svg
-                        className="icon"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "15px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      Edit
-                    </div>
-                    <div
-                      className="item"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "15px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      Schema
-                    </div>
-                    <div
-                      className="item layout-Folder"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "15px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      Layout
-                    </div>
-                    <div
-                      className="item delete-Folder"
-                      onClick={[Function]}
-                      role="option"
-                    >
-                      <svg
-                        className="icon"
-                        dangerouslySetInnerHTML={
-                          Object {
-                            "__html": undefined,
-                          }
-                        }
-                        onClick={null}
-                        style={
-                          Object {
-                            "fill": "currentColor",
-                            "height": "15px",
-                            "width": "auto",
-                          }
-                        }
-                        viewBox=""
-                        xmlns=""
-                      />
-                      Delete
+                      <div
+                        class="item edit-Folder"
+                        role="option"
+                      >
+                        <svg
+                          class="icon"
+                          style="height: 15px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        Edit
+                      </div>
+                      <div
+                        class="item"
+                        role="option"
+                      >
+                        <svg
+                          class="icon"
+                          style="height: 15px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        Schema
+                      </div>
+                      <div
+                        class="item layout-Folder"
+                        role="option"
+                      >
+                        <svg
+                          class="icon"
+                          style="height: 15px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        Layout
+                      </div>
+                      <div
+                        class="item delete-Folder"
+                        role="option"
+                      >
+                        <svg
+                          class="icon"
+                          style="height: 15px; width: auto; fill: currentColor;"
+                          viewBox=""
+                          xmlns=""
+                        />
+                        Delete
+                      </div>
                     </div>
                   </div>
-                </div>
-              </td>
-            </tr>
-          </tbody>
-        </table>
-      </section>
-    </article>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </section>
+      </article>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/__snapshots__/Controlpanel.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/__snapshots__/Controlpanel.test.jsx.snap
index 8d62cd5bef..c496e9059b 100644
--- a/packages/volto/src/components/manage/Controlpanels/__snapshots__/Controlpanel.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/__snapshots__/Controlpanel.test.jsx.snap
@@ -1,18 +1,24 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Controlpanel renders a controlpanel component 1`] = `
-<div
-  id="page-controlpanel"
->
+<div>
   <div
-    className="ui container"
+    id="page-controlpanel"
   >
     <div
-      id="form"
-    />
+      class="ui container"
+    >
+      <div
+        id="form"
+      />
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/__snapshots__/Controlpanels.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/__snapshots__/Controlpanels.test.jsx.snap
index de99eecd17..7c585afada 100644
--- a/packages/volto/src/components/manage/Controlpanels/__snapshots__/Controlpanels.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/__snapshots__/Controlpanels.test.jsx.snap
@@ -1,1157 +1,834 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Controlpanels renders a controlpanels component 1`] = `
-<div
-  className="view-wrapper"
->
+<div>
   <div
-    className="ui container controlpanel"
+    class="view-wrapper"
   >
     <div
-      className="ui raised segments"
+      class="ui container controlpanel"
     >
       <div
-        className="ui segment primary"
-      >
-        Site Setup
-      </div>
-      <div
-        className="ui secondary segment"
-      >
-        General
-      </div>
-      <div
-        className="ui attached segment"
+        class="ui raised segments"
       >
         <div
-          className="ui doubling six column grid"
+          class="ui segment primary"
+        >
+          Site Setup
+        </div>
+        <div
+          class="ui secondary segment"
+        >
+          General
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="row"
+            class="ui doubling six column grid"
           >
             <div
-              className="column"
+              class="row"
             >
-              <a
-                href="/controlpanel/addons"
-                onClick={[Function]}
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/addons"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Add-Ons
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/database"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Add-Ons
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/database"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Database
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/date-and-time"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Database
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/date-and-time"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Date and Time
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/lang"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Date and Time
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/lang"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Language
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/aliases"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Language
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/aliases"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    URL Management
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/undo"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      URL Management
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/undo"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Undo
-                  </div>
-                </h3>
-              </a>
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Undo
+                    </div>
+                  </h3>
+                </a>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="ui secondary segment"
-      >
-        Content
-      </div>
-      <div
-        className="ui attached segment"
-      >
         <div
-          className="ui doubling six column grid"
+          class="ui secondary segment"
+        >
+          Content
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="row"
+            class="ui doubling six column grid"
           >
             <div
-              className="column"
+              class="row"
             >
-              <a
-                href="/controlpanel/rules"
-                onClick={[Function]}
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/rules"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Content Rules
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/editing"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Content Rules
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/editing"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Editing
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/moderate-comments"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Editing
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/moderate-comments"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Moderate Comments
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/relations"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Moderate Comments
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/relations"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Relations
-                  </div>
-                </h3>
-              </a>
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Relations
+                    </div>
+                  </h3>
+                </a>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="ui secondary segment"
-      >
-        Security
-      </div>
-      <div
-        className="ui attached segment"
-      >
         <div
-          className="ui doubling six column grid"
+          class="ui secondary segment"
+        >
+          Security
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="row"
+            class="ui doubling six column grid"
           >
             <div
-              className="column"
+              class="row"
             >
-              <a
-                href="/controlpanel/security"
-                onClick={[Function]}
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/security"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    test
-                  </div>
-                </h3>
-              </a>
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      test
+                    </div>
+                  </h3>
+                </a>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="ui secondary segment"
-      >
-        Users
-      </div>
-      <div
-        className="ui attached segment"
-      >
         <div
-          className="ui doubling six column grid"
+          class="ui secondary segment"
+        >
+          Users
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="row"
+            class="ui doubling six column grid"
           >
             <div
-              className="column"
+              class="row"
             >
-              <a
-                href="/controlpanel/groups"
-                onClick={[Function]}
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/groups"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Groups
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/usergroupmembership"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Groups
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/usergroupmembership"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    User Group Membership
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/users"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      User Group Membership
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/users"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Users
-                  </div>
-                </h3>
-              </a>
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Users
+                    </div>
+                  </h3>
+                </a>
+              </div>
             </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      className="ui raised segments"
-    >
       <div
-        className="ui segment primary"
+        class="ui raised segments"
       >
-        Version Overview
+        <div
+          class="ui segment primary"
+        >
+          Version Overview
+        </div>
+        <div
+          class="ui attached segment"
+        />
       </div>
-      <div
-        className="ui attached segment"
-      />
     </div>
   </div>
+  <div
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
 
 exports[`Controlpanels renders an additional control panel 1`] = `
-<div
-  className="view-wrapper"
->
+<div>
   <div
-    className="ui container controlpanel"
+    class="view-wrapper"
   >
     <div
-      className="ui raised segments"
+      class="ui container controlpanel"
     >
       <div
-        className="ui segment primary"
-      >
-        Site Setup
-      </div>
-      <div
-        className="ui secondary segment"
-      >
-        Security
-      </div>
-      <div
-        className="ui attached segment"
+        class="ui raised segments"
       >
         <div
-          className="ui doubling six column grid"
+          class="ui segment primary"
+        >
+          Site Setup
+        </div>
+        <div
+          class="ui secondary segment"
+        >
+          Security
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="row"
+            class="ui doubling six column grid"
           >
             <div
-              className="column"
+              class="row"
             >
-              <a
-                href="/controlpanel/security"
-                onClick={[Function]}
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/security"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    test
-                  </div>
-                </h3>
-              </a>
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      test
+                    </div>
+                  </h3>
+                </a>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="ui secondary segment"
-      >
-        Add-on Configuration
-      </div>
-      <div
-        className="ui attached segment"
-      >
         <div
-          className="ui doubling six column grid"
+          class="ui secondary segment"
+        >
+          Add-on Configuration
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="row"
+            class="ui doubling six column grid"
           >
             <div
-              className="column"
+              class="row"
             >
-              <a
-                href="/controlpanel/manage-myaddon-foo"
-                onClick={[Function]}
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/manage-myaddon-foo"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Foo Management
-                  </div>
-                </h3>
-              </a>
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Foo Management
+                    </div>
+                  </h3>
+                </a>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="ui secondary segment"
-      >
-        General
-      </div>
-      <div
-        className="ui attached segment"
-      >
         <div
-          className="ui doubling six column grid"
+          class="ui secondary segment"
+        >
+          General
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="row"
+            class="ui doubling six column grid"
           >
             <div
-              className="column"
+              class="row"
             >
-              <a
-                href="/controlpanel/addons"
-                onClick={[Function]}
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/addons"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Add-Ons
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/database"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Add-Ons
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/database"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Database
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/aliases"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Database
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/aliases"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    URL Management
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/undo"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      URL Management
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/undo"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Undo
-                  </div>
-                </h3>
-              </a>
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Undo
+                    </div>
+                  </h3>
+                </a>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="ui secondary segment"
-      >
-        Content
-      </div>
-      <div
-        className="ui attached segment"
-      >
         <div
-          className="ui doubling six column grid"
+          class="ui secondary segment"
+        >
+          Content
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="row"
+            class="ui doubling six column grid"
           >
             <div
-              className="column"
+              class="row"
             >
-              <a
-                href="/controlpanel/rules"
-                onClick={[Function]}
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/rules"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Content Rules
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/moderate-comments"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Content Rules
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/moderate-comments"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Moderate Comments
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/relations"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Moderate Comments
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/relations"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Relations
-                  </div>
-                </h3>
-              </a>
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Relations
+                    </div>
+                  </h3>
+                </a>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="ui secondary segment"
-      >
-        Users
-      </div>
-      <div
-        className="ui attached segment"
-      >
         <div
-          className="ui doubling six column grid"
+          class="ui secondary segment"
+        >
+          Users
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="row"
+            class="ui doubling six column grid"
           >
             <div
-              className="column"
+              class="row"
             >
-              <a
-                href="/controlpanel/groups"
-                onClick={[Function]}
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/groups"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Groups
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/usergroupmembership"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Groups
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/usergroupmembership"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    User Group Membership
-                  </div>
-                </h3>
-              </a>
-            </div>
-            <div
-              className="column"
-            >
-              <a
-                href="/controlpanel/users"
-                onClick={[Function]}
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      User Group Membership
+                    </div>
+                  </h3>
+                </a>
+              </div>
+              <div
+                class="column"
               >
-                <h3
-                  className="ui icon center aligned header"
+                <a
+                  href="/controlpanel/users"
                 >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "48px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                  <div
-                    className="content"
+                  <h3
+                    class="ui icon center aligned header"
                   >
-                    Users
-                  </div>
-                </h3>
-              </a>
+                    <svg
+                      class="icon"
+                      style="height: 48px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                    <div
+                      class="content"
+                    >
+                      Users
+                    </div>
+                  </h3>
+                </a>
+              </div>
             </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      className="ui raised segments"
-    >
       <div
-        className="ui segment primary"
+        class="ui raised segments"
       >
-        Version Overview
+        <div
+          class="ui segment primary"
+        >
+          Version Overview
+        </div>
+        <div
+          class="ui attached segment"
+        />
       </div>
-      <div
-        className="ui attached segment"
-      />
     </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/__snapshots__/ModerateComments.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/__snapshots__/ModerateComments.test.jsx.snap
index 2c3c5473a4..41a8a9da88 100644
--- a/packages/volto/src/components/manage/Controlpanels/__snapshots__/ModerateComments.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/__snapshots__/ModerateComments.test.jsx.snap
@@ -1,68 +1,74 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ModerateComments renders a moderate comments component 1`] = `
-<div
-  id="page-moderate-comments"
->
+<div>
   <div
-    id="modal"
-  />
-  <div
-    className="ui container"
+    id="page-moderate-comments"
   >
-    <article
-      id="content"
+    <div
+      id="modal"
+    />
+    <div
+      class="ui container"
     >
-      <header>
-        <h1
-          className="documentFirstHeading"
-        >
-          Moderate comments
-        </h1>
-      </header>
-      <section
-        id="content-core"
+      <article
+        id="content"
       >
-        <table
-          className="ui single line striped compact table"
+        <header>
+          <h1
+            class="documentFirstHeading"
+          >
+            Moderate comments
+          </h1>
+        </header>
+        <section
+          id="content-core"
         >
-          <thead
-            className=""
+          <table
+            class="ui single line striped compact table"
           >
-            <tr
-              className=""
+            <thead
+              class=""
             >
-              <th
-                className=""
-              >
-                Commenter
-              </th>
-              <th
-                className=""
+              <tr
+                class=""
               >
-                Date
-              </th>
-              <th
-                className=""
-              >
-                Comment
-              </th>
-              <th
-                className=""
-              >
-                Action
-              </th>
-            </tr>
-          </thead>
-          <tbody
-            className=""
-          />
-        </table>
-      </section>
-    </article>
+                <th
+                  class=""
+                >
+                  Commenter
+                </th>
+                <th
+                  class=""
+                >
+                  Date
+                </th>
+                <th
+                  class=""
+                >
+                  Comment
+                </th>
+                <th
+                  class=""
+                >
+                  Action
+                </th>
+              </tr>
+            </thead>
+            <tbody
+              class=""
+            />
+          </table>
+        </section>
+      </article>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Controlpanels/__snapshots__/UndoControlpanel.test.jsx.snap b/packages/volto/src/components/manage/Controlpanels/__snapshots__/UndoControlpanel.test.jsx.snap
index 5f3f74bc51..44d370a5b8 100644
--- a/packages/volto/src/components/manage/Controlpanels/__snapshots__/UndoControlpanel.test.jsx.snap
+++ b/packages/volto/src/components/manage/Controlpanels/__snapshots__/UndoControlpanel.test.jsx.snap
@@ -1,452 +1,414 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`UndoControlpanel renders undo controlpanel component 1`] = `
-<div
-  className="ui container controlpanel-undo"
-  id="page-undo"
->
+<div>
   <div
-    className="ui raised segments"
+    class="ui container controlpanel-undo"
+    id="page-undo"
   >
     <div
-      className="ui segment primary"
-    >
-      Undo Controlpanel
-    </div>
-    <div
-      className="ui segment"
+      class="ui raised segments"
     >
       <div
-        id="form"
-      />
-    </div>
-    <div
-      className="ui raised segments"
-    >
+        class="ui segment primary"
+      >
+        Undo Controlpanel
+      </div>
       <div
-        className="ui segment primary"
+        class="ui segment"
       >
-        Transactions
+        <div
+          id="form"
+        />
       </div>
-      <table
-        className="ui celled fixed selectable single line attached compact table"
+      <div
+        class="ui raised segments"
       >
-        <thead
-          className=""
+        <div
+          class="ui segment primary"
         >
-          <tr
-            className=""
-          >
-            <th
-              className="one wide"
-            >
-              #
-            </th>
-            <th
-              className="three wide"
-            >
-              What
-            </th>
-            <th
-              className="three wide"
-            >
-              Who
-            </th>
-            <th
-              className="three wide"
-            >
-              When
-            </th>
-            <th
-              className="three wide"
-            >
-              Note
-            </th>
-            <th
-              className=""
-            />
-          </tr>
-        </thead>
-        <tbody
-          className=""
+          Transactions
+        </div>
+        <table
+          class="ui celled fixed selectable single line attached compact table"
         >
-          <tr
-            className=""
-            id="QStrR0RRc0M5TjA9"
-          >
-            <td
-              className="one wide"
-            >
-              <div
-                className="ui input transactions-checkboxes"
-              >
-                <input
-                  onChange={[Function]}
-                  type="checkbox"
-                />
-              </div>
-            </td>
-            <td
-              className="three wide"
-              title="Added default view for root object"
-            >
-              Added default view for root object
-            </td>
-            <td
-              className="three wide"
-            >
-              Zope
-            </td>
-            <td
-              className="three wide"
-            >
-              2022-06-19T22:15:02
-            </td>
-            <td
-              className="three wide"
-            >
-              
-            </td>
-          </tr>
-          <tr
-            className=""
-            id="QStrR0RRcTVrbFU9"
-          >
-            <td
-              className="one wide"
-            >
-              <div
-                className="ui input transactions-checkboxes"
-              >
-                <input
-                  onChange={[Function]}
-                  type="checkbox"
-                />
-              </div>
-            </td>
-            <td
-              className="three wide"
-              title="Added virtual_hosting"
-            >
-              Added virtual_hosting
-            </td>
-            <td
-              className="three wide"
-            >
-              Zope
-            </td>
-            <td
-              className="three wide"
-            >
-              2022-06-19T22:15:02
-            </td>
-            <td
-              className="three wide"
-            >
-              
-            </td>
-          </tr>
-          <tr
-            className=""
-            id="QStrR0RRcVh4cGs9"
-          >
-            <td
-              className="one wide"
-            >
-              <div
-                className="ui input transactions-checkboxes"
-              >
-                <input
-                  onChange={[Function]}
-                  type="checkbox"
-                />
-              </div>
-            </td>
-            <td
-              className="three wide"
-              title="Added site error_log at /error_log"
-            >
-              Added site error_log at /error_log
-            </td>
-            <td
-              className="three wide"
-            >
-              Zope
-            </td>
-            <td
-              className="three wide"
-            >
-              2022-06-19T22:15:02
-            </td>
-            <td
-              className="three wide"
-            >
-              
-            </td>
-          </tr>
-          <tr
-            className=""
-            id="QStrR0RRcDlFaUk9"
+          <thead
+            class=""
           >
-            <td
-              className="one wide"
-            >
-              <div
-                className="ui input transactions-checkboxes"
-              >
-                <input
-                  onChange={[Function]}
-                  type="checkbox"
-                />
-              </div>
-            </td>
-            <td
-              className="three wide"
-              title="Added session_data_manager"
-            >
-              Added session_data_manager
-            </td>
-            <td
-              className="three wide"
-            >
-              Zope
-            </td>
-            <td
-              className="three wide"
-            >
-              2022-06-19T22:15:02
-            </td>
-            <td
-              className="three wide"
-            >
-              
-            </td>
-          </tr>
-          <tr
-            className=""
-            id="QStrR0RRcFU2KzQ9"
-          >
-            <td
-              className="one wide"
-            >
-              <div
-                className="ui input transactions-checkboxes"
-              >
-                <input
-                  onChange={[Function]}
-                  type="checkbox"
-                />
-              </div>
-            </td>
-            <td
-              className="three wide"
-              title="Added browser_id_manager"
-            >
-              Added browser_id_manager
-            </td>
-            <td
-              className="three wide"
-            >
-              Zope
-            </td>
-            <td
-              className="three wide"
-            >
-              2022-06-19T22:15:02
-            </td>
-            <td
-              className="three wide"
-            >
-              
-            </td>
-          </tr>
-          <tr
-            className=""
-            id="QStrR0RRbUkzKzQ9"
-          >
-            <td
-              className="one wide"
-            >
-              <div
-                className="ui input transactions-checkboxes"
-              >
-                <input
-                  onChange={[Function]}
-                  type="checkbox"
-                />
-              </div>
-            </td>
-            <td
-              className="three wide"
-              title="Created initial user"
-            >
-              Created initial user
-            </td>
-            <td
-              className="three wide"
-            >
-              Zope
-            </td>
-            <td
-              className="three wide"
-            >
-              2022-06-19T22:15:02
-            </td>
-            <td
-              className="three wide"
-            >
-              
-            </td>
-          </tr>
-          <tr
-            className=""
-            id="QStrR0RRbEVVa1E9"
-          >
-            <td
-              className="one wide"
-            >
-              <div
-                className="ui input transactions-checkboxes"
-              >
-                <input
-                  onChange={[Function]}
-                  type="checkbox"
-                />
-              </div>
-            </td>
-            <td
-              className="three wide"
-              title=""
-            >
-              
-            </td>
-            <td
-              className="three wide"
-            >
-              Zope
-            </td>
-            <td
-              className="three wide"
-            >
-              2022-06-19T22:15:02
-            </td>
-            <td
-              className="three wide"
-            >
-              
-            </td>
-          </tr>
-          <tr
-            className=""
-            id="QStrR0ROWlo5YW89"
-          >
-            <td
-              className="one wide"
-            >
-              <div
-                className="ui input transactions-checkboxes"
-              >
-                <input
-                  onChange={[Function]}
-                  type="checkbox"
-                />
-              </div>
-            </td>
-            <td
-              className="three wide"
-              title="initial database creation"
+            <tr
+              class=""
             >
-              initial database creation
-            </td>
-            <td
-              className="three wide"
-            >
-              Zope
-            </td>
-            <td
-              className="three wide"
-            >
-              2022-06-19T22:14:50
-            </td>
-            <td
-              className="three wide"
-            >
-              
-            </td>
-          </tr>
-        </tbody>
-        <tfoot
-          className=""
-        >
-          <tr
-            className=""
+              <th
+                class="one wide"
+              >
+                #
+              </th>
+              <th
+                class="three wide"
+              >
+                What
+              </th>
+              <th
+                class="three wide"
+              >
+                Who
+              </th>
+              <th
+                class="three wide"
+              >
+                When
+              </th>
+              <th
+                class="three wide"
+              >
+                Note
+              </th>
+              <th
+                class=""
+              />
+            </tr>
+          </thead>
+          <tbody
+            class=""
           >
-            <th
-              className="center aligned"
-              colSpan="6"
+            <tr
+              class=""
+              id="QStrR0RRc0M5TjA9"
             >
-              <div
-                className="ui pagination menu"
+              <td
+                class="one wide"
               >
-                <a
-                  className="icon item"
-                  id="prev-button"
-                  onClick={[Function]}
+                <div
+                  class="ui input transactions-checkboxes"
                 >
-                  <div
-                    style={
-                      Object {
-                        "width": "36px",
-                      }
-                    }
+                  <input
+                    type="checkbox"
                   />
-                </a>
-                <a
-                  className="icon item"
-                  onClick={[Function]}
+                </div>
+              </td>
+              <td
+                class="three wide"
+                title="Added default view for root object"
+              >
+                Added default view for root object
+              </td>
+              <td
+                class="three wide"
+              >
+                Zope
+              </td>
+              <td
+                class="three wide"
+              >
+                2022-06-19T22:15:02
+              </td>
+              <td
+                class="three wide"
+              />
+            </tr>
+            <tr
+              class=""
+              id="QStrR0RRcTVrbFU9"
+            >
+              <td
+                class="one wide"
+              >
+                <div
+                  class="ui input transactions-checkboxes"
                 >
-                  <svg
-                    className="icon circled"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": "<title>Undo</title>undefined",
-                      }
-                    }
-                    id="undo-button"
-                    onClick={[Function]}
-                    style={
-                      Object {
-                        "fill": "currentColor",
-                        "height": "30px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
+                  <input
+                    type="checkbox"
                   />
-                </a>
-                <a
-                  className="icon item"
-                  id="next-button"
-                  onClick={[Function]}
+                </div>
+              </td>
+              <td
+                class="three wide"
+                title="Added virtual_hosting"
+              >
+                Added virtual_hosting
+              </td>
+              <td
+                class="three wide"
+              >
+                Zope
+              </td>
+              <td
+                class="three wide"
+              >
+                2022-06-19T22:15:02
+              </td>
+              <td
+                class="three wide"
+              />
+            </tr>
+            <tr
+              class=""
+              id="QStrR0RRcVh4cGs9"
+            >
+              <td
+                class="one wide"
+              >
+                <div
+                  class="ui input transactions-checkboxes"
+                >
+                  <input
+                    type="checkbox"
+                  />
+                </div>
+              </td>
+              <td
+                class="three wide"
+                title="Added site error_log at /error_log"
+              >
+                Added site error_log at /error_log
+              </td>
+              <td
+                class="three wide"
+              >
+                Zope
+              </td>
+              <td
+                class="three wide"
+              >
+                2022-06-19T22:15:02
+              </td>
+              <td
+                class="three wide"
+              />
+            </tr>
+            <tr
+              class=""
+              id="QStrR0RRcDlFaUk9"
+            >
+              <td
+                class="one wide"
+              >
+                <div
+                  class="ui input transactions-checkboxes"
+                >
+                  <input
+                    type="checkbox"
+                  />
+                </div>
+              </td>
+              <td
+                class="three wide"
+                title="Added session_data_manager"
+              >
+                Added session_data_manager
+              </td>
+              <td
+                class="three wide"
+              >
+                Zope
+              </td>
+              <td
+                class="three wide"
+              >
+                2022-06-19T22:15:02
+              </td>
+              <td
+                class="three wide"
+              />
+            </tr>
+            <tr
+              class=""
+              id="QStrR0RRcFU2KzQ9"
+            >
+              <td
+                class="one wide"
+              >
+                <div
+                  class="ui input transactions-checkboxes"
                 >
-                  <div
-                    style={
-                      Object {
-                        "width": "36px",
-                      }
-                    }
+                  <input
+                    type="checkbox"
                   />
-                </a>
-              </div>
-            </th>
-          </tr>
-        </tfoot>
-      </table>
+                </div>
+              </td>
+              <td
+                class="three wide"
+                title="Added browser_id_manager"
+              >
+                Added browser_id_manager
+              </td>
+              <td
+                class="three wide"
+              >
+                Zope
+              </td>
+              <td
+                class="three wide"
+              >
+                2022-06-19T22:15:02
+              </td>
+              <td
+                class="three wide"
+              />
+            </tr>
+            <tr
+              class=""
+              id="QStrR0RRbUkzKzQ9"
+            >
+              <td
+                class="one wide"
+              >
+                <div
+                  class="ui input transactions-checkboxes"
+                >
+                  <input
+                    type="checkbox"
+                  />
+                </div>
+              </td>
+              <td
+                class="three wide"
+                title="Created initial user"
+              >
+                Created initial user
+              </td>
+              <td
+                class="three wide"
+              >
+                Zope
+              </td>
+              <td
+                class="three wide"
+              >
+                2022-06-19T22:15:02
+              </td>
+              <td
+                class="three wide"
+              />
+            </tr>
+            <tr
+              class=""
+              id="QStrR0RRbEVVa1E9"
+            >
+              <td
+                class="one wide"
+              >
+                <div
+                  class="ui input transactions-checkboxes"
+                >
+                  <input
+                    type="checkbox"
+                  />
+                </div>
+              </td>
+              <td
+                class="three wide"
+                title=""
+              />
+              <td
+                class="three wide"
+              >
+                Zope
+              </td>
+              <td
+                class="three wide"
+              >
+                2022-06-19T22:15:02
+              </td>
+              <td
+                class="three wide"
+              />
+            </tr>
+            <tr
+              class=""
+              id="QStrR0ROWlo5YW89"
+            >
+              <td
+                class="one wide"
+              >
+                <div
+                  class="ui input transactions-checkboxes"
+                >
+                  <input
+                    type="checkbox"
+                  />
+                </div>
+              </td>
+              <td
+                class="three wide"
+                title="initial database creation"
+              >
+                initial database creation
+              </td>
+              <td
+                class="three wide"
+              >
+                Zope
+              </td>
+              <td
+                class="three wide"
+              >
+                2022-06-19T22:14:50
+              </td>
+              <td
+                class="three wide"
+              />
+            </tr>
+          </tbody>
+          <tfoot
+            class=""
+          >
+            <tr
+              class=""
+            >
+              <th
+                class="center aligned"
+                colspan="6"
+              >
+                <div
+                  class="ui pagination menu"
+                >
+                  <a
+                    class="icon item"
+                    id="prev-button"
+                  >
+                    <div
+                      style="width: 36px;"
+                    />
+                  </a>
+                  <a
+                    class="icon item"
+                  >
+                    <svg
+                      class="icon circled"
+                      id="undo-button"
+                      style="height: 30px; width: auto; fill: currentColor;"
+                      viewBox=""
+                      xmlns=""
+                    >
+                      <title>
+                        Undo
+                      </title>
+                      undefined
+                    </svg>
+                  </a>
+                  <a
+                    class="icon item"
+                    id="next-button"
+                  >
+                    <div
+                      style="width: 36px;"
+                    />
+                  </a>
+                </div>
+              </th>
+            </tr>
+          </tfoot>
+        </table>
+      </div>
     </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Delete/Delete.jsx b/packages/volto/src/components/manage/Delete/Delete.jsx
index 805c6ac0a8..50da8f9b2e 100644
--- a/packages/volto/src/components/manage/Delete/Delete.jsx
+++ b/packages/volto/src/components/manage/Delete/Delete.jsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
 import { useDispatch, useSelector, shallowEqual } from 'react-redux';
 import { useHistory, useLocation } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Button, Container, List, Segment } from 'semantic-ui-react';
 import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
 import qs from 'query-string';
@@ -110,15 +110,15 @@ const Delete = () => {
             </Segment>
           </Segment.Group>
         </Container>
-        {isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {isClient &&
+          createPortal(
             <Toolbar
               pathname={pathname}
               hideDefaultViewButtons
               inner={<span />}
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Delete/Delete.test.jsx b/packages/volto/src/components/manage/Delete/Delete.test.jsx
index 7069d32a4e..cd1376c2c5 100644
--- a/packages/volto/src/components/manage/Delete/Delete.test.jsx
+++ b/packages/volto/src/components/manage/Delete/Delete.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter } from 'react-router-dom';
@@ -8,9 +8,7 @@ import Delete from './Delete';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 describe('Delete', () => {
   it('renders an empty delete component', () => {
@@ -27,15 +25,16 @@ describe('Delete', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <Delete location={{ pathname: '/blog', search: {} }} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders a delete component', () => {
@@ -54,14 +53,15 @@ describe('Delete', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <Delete location={{ pathname: '/blog', search: {} }} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Delete/__snapshots__/Delete.test.jsx.snap b/packages/volto/src/components/manage/Delete/__snapshots__/Delete.test.jsx.snap
index 737742ef56..0d903b147c 100644
--- a/packages/volto/src/components/manage/Delete/__snapshots__/Delete.test.jsx.snap
+++ b/packages/volto/src/components/manage/Delete/__snapshots__/Delete.test.jsx.snap
@@ -1,70 +1,78 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Delete renders a delete component 1`] = `
-<div
-  id="page-delete"
->
+<div>
   <div
-    className="ui container"
+    id="page-delete"
   >
     <div
-      className="ui raised segments"
+      class="ui container"
     >
       <div
-        className="ui segment primary"
-      >
-        Do you really want to delete this item?
-      </div>
-      <div
-        className="ui attached segment"
+        class="ui raised segments"
       >
         <div
-          className="ui bulleted list"
-          role="list"
+          class="ui segment primary"
+        >
+          Do you really want to delete this item?
+        </div>
+        <div
+          class="ui attached segment"
         >
           <div
-            className="item"
-            onClick={[Function]}
-            role="listitem"
+            class="ui bulleted list"
+            role="list"
           >
-            Blog
+            <div
+              class="item"
+              role="listitem"
+            >
+              Blog
+            </div>
           </div>
         </div>
-      </div>
-      <div
-        className="ui clearing segment actions"
-      >
-        <button
-          aria-label="Ok"
-          className="ui big basic circular icon primary right floated button"
-          onClick={[Function]}
-          title="Ok"
-        >
-          <i
-            aria-hidden="true"
-            className="arrow right icon"
-            onClick={[Function]}
-          />
-        </button>
-        <button
-          aria-label="Cancel"
-          className="ui big basic circular icon secondary right floated button"
-          onClick={[Function]}
-          title="Cancel"
+        <div
+          class="ui clearing segment actions"
         >
-          <i
-            aria-hidden="true"
-            className="remove icon"
-            onClick={[Function]}
-          />
-        </button>
+          <button
+            aria-label="Ok"
+            class="ui big basic circular icon primary right floated button"
+            title="Ok"
+          >
+            <i
+              aria-hidden="true"
+              class="arrow right icon"
+            />
+          </button>
+          <button
+            aria-label="Cancel"
+            class="ui big basic circular icon secondary right floated button"
+            title="Cancel"
+          >
+            <i
+              aria-hidden="true"
+              class="remove icon"
+            />
+          </button>
+        </div>
       </div>
     </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
 
-exports[`Delete renders an empty delete component 1`] = `<div />`;
+exports[`Delete renders an empty delete component 1`] = `
+<div>
+  <div />
+  <div
+    id="toolbar"
+  />
+</div>
+`;
diff --git a/packages/volto/src/components/manage/Diff/Diff.jsx b/packages/volto/src/components/manage/Diff/Diff.jsx
index c7302970cf..6b5b1caf21 100644
--- a/packages/volto/src/components/manage/Diff/Diff.jsx
+++ b/packages/volto/src/components/manage/Diff/Diff.jsx
@@ -11,7 +11,7 @@ import { compose } from 'redux';
 import { filter, isEqual, map } from 'lodash';
 import { Container, Button, Dropdown, Grid, Table } from 'semantic-ui-react';
 import { Link, withRouter } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
 import qs from 'query-string';
 
@@ -333,8 +333,8 @@ class Diff extends Component {
               view={this.props.view}
             />
           )}
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -351,9 +351,9 @@ class Diff extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Diff/Diff.test.jsx b/packages/volto/src/components/manage/Diff/Diff.test.jsx
index 9da87ed980..c0a890a19d 100644
--- a/packages/volto/src/components/manage/Diff/Diff.test.jsx
+++ b/packages/volto/src/components/manage/Diff/Diff.test.jsx
@@ -8,9 +8,7 @@ import Diff from './Diff';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 jest.mock('@plone/volto/helpers/Loadable/Loadable');
 beforeAll(
@@ -75,6 +73,7 @@ describe('Diff', () => {
       <Provider store={store}>
         <MemoryRouter initialEntries={['/blog?one=0&two=1']}>
           <Diff />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
diff --git a/packages/volto/src/components/manage/Diff/__snapshots__/Diff.test.jsx.snap b/packages/volto/src/components/manage/Diff/__snapshots__/Diff.test.jsx.snap
index 65383def7a..8512803d3c 100644
--- a/packages/volto/src/components/manage/Diff/__snapshots__/Diff.test.jsx.snap
+++ b/packages/volto/src/components/manage/Diff/__snapshots__/Diff.test.jsx.snap
@@ -269,6 +269,10 @@ exports[`Diff renders a diff component 1`] = `
         </div>
       </div>
     </div>
+  </div>
+  <div
+    id="toolbar"
+  >
     <div
       id="Portal"
     />
diff --git a/packages/volto/src/components/manage/Edit/Edit.jsx b/packages/volto/src/components/manage/Edit/Edit.jsx
index c8fbb89761..54f1fd1b48 100644
--- a/packages/volto/src/components/manage/Edit/Edit.jsx
+++ b/packages/volto/src/components/manage/Edit/Edit.jsx
@@ -11,7 +11,7 @@ import { compose } from 'redux';
 import { asyncConnect, hasApiExpander } from '@plone/volto/helpers';
 import { defineMessages, injectIntl } from 'react-intl';
 import { Button, Grid, Menu } from 'semantic-ui-react';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import qs from 'query-string';
 import { find } from 'lodash';
 import { toast } from 'react-toastify';
@@ -375,11 +375,10 @@ class Edit extends Component {
               </>
             )}
 
-            {editPermission && this.state.visual && this.state.isClient && (
-              <Portal node={document.getElementById('sidebar')}>
-                <Sidebar />
-              </Portal>
-            )}
+            {editPermission &&
+              this.state.visual &&
+              this.state.isClient &&
+              createPortal(<Sidebar />, document.getElementById('sidebar'))}
           </>
         )}
         {!editPermission && (
@@ -397,8 +396,8 @@ class Edit extends Component {
             )}
           </>
         )}
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -446,9 +445,9 @@ class Edit extends Component {
                   )}
                 </>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/manage/Edit/Edit.test.jsx b/packages/volto/src/components/manage/Edit/Edit.test.jsx
index 5e28911e95..28eff96b95 100644
--- a/packages/volto/src/components/manage/Edit/Edit.test.jsx
+++ b/packages/volto/src/components/manage/Edit/Edit.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import jwt from 'jsonwebtoken';
@@ -8,9 +8,9 @@ import { __test__ as Edit } from './Edit';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+jest.mock('../Sidebar/Sidebar', () => jest.fn(() => <div id="Sidebar" />));
+
 jest.mock('../Form/Form', () => jest.fn(() => <div className="Form" />));
 
 describe('Edit', () => {
@@ -50,13 +50,15 @@ describe('Edit', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
+        <div id="toolbar"></div>
         <Edit location={{ pathname: '/blog', search: {} }} />
+        <div id="sidebar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders an edit component', () => {
@@ -97,12 +99,14 @@ describe('Edit', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
+        <div id="toolbar"></div>
         <Edit location={{ pathname: '/blog', search: {} }} />
+        <div id="sidebar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Edit/__snapshots__/Edit.test.jsx.snap b/packages/volto/src/components/manage/Edit/__snapshots__/Edit.test.jsx.snap
index e8df203414..67d8997fd5 100644
--- a/packages/volto/src/components/manage/Edit/__snapshots__/Edit.test.jsx.snap
+++ b/packages/volto/src/components/manage/Edit/__snapshots__/Edit.test.jsx.snap
@@ -1,33 +1,53 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Edit renders an edit component 1`] = `
-<div
-  id="page-edit"
->
+<div>
   <div
-    className="Form"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
   <div
-    id="Portal"
-  />
+    id="page-edit"
+  >
+    <div
+      class="Form"
+    />
+  </div>
   <div
-    id="Portal"
-  />
+    id="sidebar"
+  >
+    <div
+      id="Sidebar"
+    />
+  </div>
 </div>
 `;
 
 exports[`Edit renders an empty edit component 1`] = `
-<div
-  id="page-edit"
->
+<div>
   <div
-    className="Form"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
   <div
-    id="Portal"
-  />
+    id="page-edit"
+  >
+    <div
+      class="Form"
+    />
+  </div>
   <div
-    id="Portal"
-  />
+    id="sidebar"
+  >
+    <div
+      id="Sidebar"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Form/BlockDataForm.test.jsx b/packages/volto/src/components/manage/Form/BlockDataForm.test.jsx
index 6c77dc20f7..e0abf26532 100644
--- a/packages/volto/src/components/manage/Form/BlockDataForm.test.jsx
+++ b/packages/volto/src/components/manage/Form/BlockDataForm.test.jsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import BlockDataForm from './BlockDataForm';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
 import configureStore from 'redux-mock-store';
 import config from '@plone/volto/registry';
 import { Provider } from 'react-intl-redux';
diff --git a/packages/volto/src/components/manage/Form/Form.jsx b/packages/volto/src/components/manage/Form/Form.jsx
index 6ffc4020b0..40b8ae599a 100644
--- a/packages/volto/src/components/manage/Form/Form.jsx
+++ b/packages/volto/src/components/manage/Form/Form.jsx
@@ -31,7 +31,7 @@ import isBoolean from 'lodash/isBoolean';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { injectIntl } from 'react-intl';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { connect } from 'react-redux';
 import {
   Accordion,
@@ -238,6 +238,7 @@ class Form extends Component {
       isClient: false,
       // Ensure focus remain in field after change
       inFocus: {},
+      sidebarMetadataIsAvailable: false,
     };
     this.onChangeField = this.onChangeField.bind(this);
     this.onSelectBlock = this.onSelectBlock.bind(this);
@@ -313,6 +314,13 @@ class Form extends Component {
       // Reset focus field
       this.props.resetMetadataFocus();
     }
+
+    if (
+      !this.state.sidebarMetadataIsAvailable &&
+      document.getElementById('sidebar-metadata')
+    ) {
+      this.setState(() => ({ sidebarMetadataIsAvailable: true }));
+    }
   }
 
   /**
@@ -712,10 +720,10 @@ class Form extends Component {
               editable={this.props.editable}
               isMainForm={this.props.editable}
             />
-            {this.state.isClient && this.props.editable && (
-              <Portal
-                node={__CLIENT__ && document.getElementById('sidebar-metadata')}
-              >
+            {this.state.isClient &&
+              this.state.sidebarMetadataIsAvailable &&
+              this.props.editable &&
+              createPortal(
                 <UiForm
                   method="post"
                   onSubmit={this.onSubmit}
@@ -772,9 +780,9 @@ class Form extends Component {
                         </div>
                       </Accordion>
                     ))}
-                </UiForm>
-              </Portal>
-            )}
+                </UiForm>,
+                document.getElementById('sidebar-metadata'),
+              )}
 
             <SlotRenderer
               name="belowContent"
diff --git a/packages/volto/src/components/manage/Form/ModalForm.test.jsx b/packages/volto/src/components/manage/Form/ModalForm.test.jsx
index 6e491ee79a..f6eb4e368d 100644
--- a/packages/volto/src/components/manage/Form/ModalForm.test.jsx
+++ b/packages/volto/src/components/manage/Form/ModalForm.test.jsx
@@ -3,7 +3,6 @@ import renderer from 'react-test-renderer';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
 
 import ModalForm from './ModalForm';
 
diff --git a/packages/volto/src/components/manage/History/History.jsx b/packages/volto/src/components/manage/History/History.jsx
index 5fa61001a4..f3694e5275 100644
--- a/packages/volto/src/components/manage/History/History.jsx
+++ b/packages/volto/src/components/manage/History/History.jsx
@@ -17,7 +17,7 @@ import {
   Table,
 } from 'semantic-ui-react';
 import { concat, map, reverse, find } from 'lodash';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
 import { asyncConnect } from '@plone/volto/helpers';
 
@@ -314,8 +314,8 @@ class History extends Component {
             </Table.Body>
           </Table>
         </Segment.Group>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -332,9 +332,9 @@ class History extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/History/History.test.jsx b/packages/volto/src/components/manage/History/History.test.jsx
index c0ddab5703..164e699399 100644
--- a/packages/volto/src/components/manage/History/History.test.jsx
+++ b/packages/volto/src/components/manage/History/History.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { StaticRouter } from 'react-router-dom';
 import { Provider } from 'react-intl-redux';
@@ -9,9 +9,7 @@ import FakeTimers from '@sinonjs/fake-timers';
 import History from './History';
 
 const mockStore = configureStore();
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 const FIXED_SYSTEM_TIME = '2017-04-23T15:38:00.000Z';
 
@@ -87,13 +85,14 @@ describe('History', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <History location={{ pathname: '/blog' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('redirects if unassigned', () => {
@@ -153,13 +152,14 @@ describe('History', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <History location={{ pathname: '/blog' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('redirects if unassigned, no token gives unauthorized', () => {
@@ -217,14 +217,15 @@ describe('History', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <StaticRouter context={{}} location={'/blog'}>
           <History location={{ pathname: '/blog' }} />
+          <div id="toolbar"></div>
         </StaticRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/History/__snapshots__/History.test.jsx.snap b/packages/volto/src/components/manage/History/__snapshots__/History.test.jsx.snap
index af2888cab6..975b25879e 100644
--- a/packages/volto/src/components/manage/History/__snapshots__/History.test.jsx.snap
+++ b/packages/volto/src/components/manage/History/__snapshots__/History.test.jsx.snap
@@ -1,265 +1,268 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`History redirects if unassigned 1`] = `
-<div
-  className="ui container view-wrapper"
->
-  <h1>
-    Forbidden
-  </h1>
-  <p
-    className="description"
+<div>
+  <div
+    class="ui container view-wrapper"
   >
-    We apologize for the inconvenience, but you don't have permissions on this resource.
-  </p>
+    <h1>
+      Forbidden
+    </h1>
+    <p
+      class="description"
+    >
+      We apologize for the inconvenience, but you don't have permissions on this resource.
+    </p>
+  </div>
+  <div
+    id="toolbar"
+  />
 </div>
 `;
 
 exports[`History redirects if unassigned, no token gives unauthorized 1`] = `
-<div
-  className="ui container view-wrapper"
->
-  <h1>
-    Unauthorized
-  </h1>
-  <h3 />
-  <p
-    className="description"
+<div>
+  <div
+    class="ui container view-wrapper"
   >
-    You are trying to access a protected resource, please 
-    <a
-      href="/blog/login"
-      onClick={[Function]}
+    <h1>
+      Unauthorized
+    </h1>
+    <h3 />
+    <p
+      class="description"
     >
-      log in
-    </a>
-     first.
-  </p>
-  <p>
-    If you are certain you have the correct web address but are encountering an error, please contact the 
-    <a
-      href="/contact-form"
-      onClick={[Function]}
-    >
-      Site Administration
-    </a>
-    .
-  </p>
-  <p>
-    Thank you.
-  </p>
+      You are trying to access a protected resource, please 
+      <a
+        href="/blog/login"
+      >
+        log in
+      </a>
+       first.
+    </p>
+    <p>
+      If you are certain you have the correct web address but are encountering an error, please contact the 
+      <a
+        href="/contact-form"
+      >
+        Site Administration
+      </a>
+      .
+    </p>
+    <p>
+      Thank you.
+    </p>
+  </div>
+  <div
+    id="toolbar"
+  />
 </div>
 `;
 
 exports[`History renders a history component 1`] = `
-<div
-  className="ui container"
-  id="page-history"
->
+<div>
   <div
-    className="ui raised segments"
+    class="ui container"
+    id="page-history"
   >
     <div
-      className="ui segment primary"
-    >
-      History of 
-      <q>
-        Blog
-      </q>
-    </div>
-    <div
-      className="ui secondary segment"
+      class="ui raised segments"
     >
-      You can view the history of your item below.
-    </div>
-    <table
-      className="ui selectable single line attached compact table"
-    >
-      <thead
-        className=""
+      <div
+        class="ui segment primary"
       >
-        <tr
-          className=""
-        >
-          <th
-            className="one wide"
-          >
-            #
-          </th>
-          <th
-            className="four wide"
-          >
-            What
-          </th>
-          <th
-            className="four wide"
-          >
-            Who
-          </th>
-          <th
-            className="four wide"
-          >
-            When
-          </th>
-          <th
-            className="four wide"
-          >
-            Change Note
-          </th>
-          <th
-            className=""
-          />
-        </tr>
-      </thead>
-      <tbody
-        className=""
+        History of 
+        <q>
+          Blog
+        </q>
+      </div>
+      <div
+        class="ui secondary segment"
+      >
+        You can view the history of your item below.
+      </div>
+      <table
+        class="ui selectable single line attached compact table"
       >
-        <tr
-          className=""
+        <thead
+          class=""
         >
-          <td
-            className=""
-          >
-            <span />
-          </td>
-          <td
-            className=""
-          >
-            <span>
-              Publish
-               (Private → Published)
-            </span>
-          </td>
-          <td
-            className=""
+          <tr
+            class=""
           >
-            Web Admin
-          </td>
-          <td
-            className=""
-          >
-            <time
-              dateTime="2017-04-19T14:09:36+02:00"
-              title="Wednesday, April 19, 2017 at 12:09 PM"
+            <th
+              class="one wide"
             >
-              4/19/2017
-            </time>
-          </td>
-          <td
-            className=""
-          >
-            
-          </td>
-          <td
-            className=""
-          />
-        </tr>
-        <tr
-          className=""
+              #
+            </th>
+            <th
+              class="four wide"
+            >
+              What
+            </th>
+            <th
+              class="four wide"
+            >
+              Who
+            </th>
+            <th
+              class="four wide"
+            >
+              When
+            </th>
+            <th
+              class="four wide"
+            >
+              Change Note
+            </th>
+            <th
+              class=""
+            />
+          </tr>
+        </thead>
+        <tbody
+          class=""
         >
-          <td
-            className=""
-          >
-            <span />
-          </td>
-          <td
-            className=""
+          <tr
+            class=""
           >
-            <span>
-              Edited
-            </span>
-          </td>
-          <td
-            className=""
-          >
-            Web Admin
-          </td>
-          <td
-            className=""
-          >
-            <time
-              dateTime="2017-04-19T14:09:35+02:00"
-              title="Wednesday, April 19, 2017 at 12:09 PM"
+            <td
+              class=""
             >
-              4/19/2017
-            </time>
-          </td>
-          <td
-            className=""
-          >
-            Changed text
-          </td>
-          <td
-            className=""
+              <span />
+            </td>
+            <td
+              class=""
+            >
+              <span>
+                Publish
+                 (Private → Published)
+              </span>
+            </td>
+            <td
+              class=""
+            >
+              Web Admin
+            </td>
+            <td
+              class=""
+            >
+              <time
+                datetime="2017-04-19T14:09:36+02:00"
+                title="Wednesday, April 19, 2017 at 12:09 PM"
+              >
+                4/19/2017
+              </time>
+            </td>
+            <td
+              class=""
+            />
+            <td
+              class=""
+            />
+          </tr>
+          <tr
+            class=""
           >
-            <div
-              aria-expanded={false}
-              className="ui dropdown"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onClick={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onMouseDown={[Function]}
-              role="listbox"
-              tabIndex={0}
+            <td
+              class=""
+            >
+              <span />
+            </td>
+            <td
+              class=""
+            >
+              <span>
+                Edited
+              </span>
+            </td>
+            <td
+              class=""
+            >
+              Web Admin
+            </td>
+            <td
+              class=""
+            >
+              <time
+                datetime="2017-04-19T14:09:35+02:00"
+                title="Wednesday, April 19, 2017 at 12:09 PM"
+              >
+                4/19/2017
+              </time>
+            </td>
+            <td
+              class=""
+            >
+              Changed text
+            </td>
+            <td
+              class=""
             >
-              <i
-                aria-hidden="true"
-                className="ellipsis horizontal icon"
-                onClick={[Function]}
-              />
               <div
-                className="menu transition left"
-              />
-            </div>
-          </td>
-        </tr>
-        <tr
-          className=""
-        >
-          <td
-            className=""
-          >
-            <span />
-          </td>
-          <td
-            className=""
-          >
-            <span>
-              Create
-               (Private)
-            </span>
-          </td>
-          <td
-            className=""
+                aria-expanded="false"
+                class="ui dropdown"
+                role="listbox"
+                tabindex="0"
+              >
+                <i
+                  aria-hidden="true"
+                  class="ellipsis horizontal icon"
+                />
+                <div
+                  class="menu transition left"
+                />
+              </div>
+            </td>
+          </tr>
+          <tr
+            class=""
           >
-            Web Admin
-          </td>
-          <td
-            className=""
-          >
-            <time
-              dateTime="2017-04-19T14:09:34+02:00"
-              title="Wednesday, April 19, 2017 at 12:09 PM"
+            <td
+              class=""
             >
-              4/19/2017
-            </time>
-          </td>
-          <td
-            className=""
-          >
-            
-          </td>
-          <td
-            className=""
-          />
-        </tr>
-      </tbody>
-    </table>
+              <span />
+            </td>
+            <td
+              class=""
+            >
+              <span>
+                Create
+                 (Private)
+              </span>
+            </td>
+            <td
+              class=""
+            >
+              Web Admin
+            </td>
+            <td
+              class=""
+            >
+              <time
+                datetime="2017-04-19T14:09:34+02:00"
+                title="Wednesday, April 19, 2017 at 12:09 PM"
+              >
+                4/19/2017
+              </time>
+            </td>
+            <td
+              class=""
+            />
+            <td
+              class=""
+            />
+          </tr>
+        </tbody>
+      </table>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/LinksToItem/LinksToItem.jsx b/packages/volto/src/components/manage/LinksToItem/LinksToItem.jsx
index bc93a24055..a8ad6915cd 100644
--- a/packages/volto/src/components/manage/LinksToItem/LinksToItem.jsx
+++ b/packages/volto/src/components/manage/LinksToItem/LinksToItem.jsx
@@ -2,11 +2,11 @@
  * LinksToItem component
  * @module components/manage/LinksToItem/LinksToItem
  */
-import { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import { find } from 'lodash';
 import { Helmet } from '@plone/volto/helpers';
 import { Link } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Container, Segment, Table } from 'semantic-ui-react';
 import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
 import { useDispatch, useSelector } from 'react-redux';
@@ -19,7 +19,6 @@ import {
   UniversalLink,
   Unauthorized,
 } from '@plone/volto/components';
-import { compose } from 'redux';
 
 import { getBaseUrl } from '@plone/volto/helpers';
 import backSVG from '@plone/volto/icons/back.svg';
@@ -57,6 +56,12 @@ const LinksToItem = (props) => {
     id: 'plone_setup',
   });
 
+  const [isClient, setIsClient] = useState(false);
+
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
+
   useEffect(() => {
     dispatch(queryRelations(null, false, itempath, null, [itempath]));
   }, [dispatch, itempath]);
@@ -101,41 +106,46 @@ const LinksToItem = (props) => {
           <Table selectable compact singleLine attached>
             {
               <Table.Body>
-                {Object.keys(links_ordered).map((relationtype) => {
+                {Object.keys(links_ordered).map((relationtype, index) => {
+                  // TODO: keys driven by links_ordered[relationtype][index]['@id'])
                   return [].concat(
                     [
-                      <Table.Row>
-                        <Table.HeaderCell>
-                          {relationtype === 'isReferencing' ? (
-                            <FormattedMessage
-                              id="Linking this item with hyperlink in text"
-                              defaultMessage="Linking this item with hyperlink in text"
-                            />
-                          ) : relationtype === 'relatedItems' ? (
-                            <FormattedMessage
-                              id="Referencing this item as related item"
-                              defaultMessage="Referencing this item as related item"
-                            />
-                          ) : (
-                            <>
+                      <React.Fragment key={index}>
+                        <Table.Row>
+                          <Table.HeaderCell>
+                            {relationtype === 'isReferencing' ? (
                               <FormattedMessage
-                                id="Referencing this item with {relationship}"
-                                defaultMessage="Referencing this item with {relationship}"
-                                values={{ relationship: <q>{relationtype}</q> }}
+                                id="Linking this item with hyperlink in text"
+                                defaultMessage="Linking this item with hyperlink in text"
                               />
-                            </>
-                          )}
-                        </Table.HeaderCell>
-                        <Table.HeaderCell>
-                          <FormattedMessage
-                            id="Review state"
-                            defaultMessage="Review state"
-                          />
-                        </Table.HeaderCell>
-                        <Table.HeaderCell>
-                          <FormattedMessage id="Type" defaultMessage="Type" />
-                        </Table.HeaderCell>
-                      </Table.Row>,
+                            ) : relationtype === 'relatedItems' ? (
+                              <FormattedMessage
+                                id="Referencing this item as related item"
+                                defaultMessage="Referencing this item as related item"
+                              />
+                            ) : (
+                              <>
+                                <FormattedMessage
+                                  id="Referencing this item with {relationship}"
+                                  defaultMessage="Referencing this item with {relationship}"
+                                  values={{
+                                    relationship: <q>{relationtype}</q>,
+                                  }}
+                                />
+                              </>
+                            )}
+                          </Table.HeaderCell>
+                          <Table.HeaderCell>
+                            <FormattedMessage
+                              id="Review state"
+                              defaultMessage="Review state"
+                            />
+                          </Table.HeaderCell>
+                          <Table.HeaderCell>
+                            <FormattedMessage id="Type" defaultMessage="Type" />
+                          </Table.HeaderCell>
+                        </Table.Row>
+                      </React.Fragment>,
                     ],
                     links_ordered[relationtype].map((link) => {
                       return (
@@ -173,8 +183,8 @@ const LinksToItem = (props) => {
           </Segment>
         )}
       </Segment.Group>
-      {__CLIENT__ && (
-        <Portal node={document.getElementById('toolbar')}>
+      {isClient &&
+        createPortal(
           <Toolbar
             pathname={pathname}
             hideDefaultViewButtons
@@ -208,22 +218,41 @@ const LinksToItem = (props) => {
                 </>
               </>
             }
-          />
-        </Portal>
-      )}
+          />,
+          document.getElementById('toolbar'),
+        )}
     </Container>
   );
 };
 
 export const __test__ = LinksToItem;
-export default compose(
-  asyncConnect([
-    {
-      key: 'actions',
-      // Dispatch async/await to make the operation synchronous, otherwise it returns
-      // before the promise is resolved
-      promise: async ({ location, store: { dispatch } }) =>
-        await dispatch(listActions(getBaseUrl(location.pathname))),
+
+export default asyncConnect([
+  {
+    key: 'content',
+    // Dispatch async/await to make the operation synchronous, otherwise it returns
+    // before the promise is resolved
+    promise: async ({ location, store: { dispatch } }) => {
+      const pathname = getBaseUrl(location.pathname);
+      return await dispatch(getContent(pathname));
     },
-  ]),
-)(LinksToItem);
+  },
+  {
+    key: 'actions',
+    // Dispatch async/await to make the operation synchronous, otherwise it returns
+    // before the promise is resolved
+    promise: async ({ location, store: { dispatch } }) =>
+      await dispatch(listActions(getBaseUrl(location.pathname))),
+  },
+  {
+    key: 'relations',
+    // Dispatch async/await to make the operation synchronous, otherwise it returns
+    // before the promise is resolved
+    promise: async ({ location, store: { dispatch } }) => {
+      const pathname = getBaseUrl(location.pathname);
+      return await dispatch(
+        queryRelations(null, false, pathname, null, [pathname]),
+      );
+    },
+  },
+])(LinksToItem);
diff --git a/packages/volto/src/components/manage/LinksToItem/LinksToItem.test.jsx b/packages/volto/src/components/manage/LinksToItem/LinksToItem.test.jsx
index 4c590cbbcc..210bd35124 100644
--- a/packages/volto/src/components/manage/LinksToItem/LinksToItem.test.jsx
+++ b/packages/volto/src/components/manage/LinksToItem/LinksToItem.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
@@ -10,9 +10,8 @@ import { __test__ as LinksToItem } from './LinksToItem';
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../Toolbar/More', () => jest.fn(() => <div className="More" />));
 
 describe('LinksToItem', () => {
@@ -99,14 +98,15 @@ describe('LinksToItem', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <LinksToItem location={{ pathname: '/page-1/links-to-item' }} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/LinksToItem/__snapshots__/LinksToItem.test.jsx.snap b/packages/volto/src/components/manage/LinksToItem/__snapshots__/LinksToItem.test.jsx.snap
index 71a4163128..45741837c2 100644
--- a/packages/volto/src/components/manage/LinksToItem/__snapshots__/LinksToItem.test.jsx.snap
+++ b/packages/volto/src/components/manage/LinksToItem/__snapshots__/LinksToItem.test.jsx.snap
@@ -1,142 +1,142 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`LinksToItem renders "links and references" view 1`] = `
-<div
-  className="ui container"
-  id="linkstoitem"
->
+<div>
   <div
-    className="ui raised segments"
+    class="ui container"
+    id="linkstoitem"
   >
     <div
-      className="ui segment primary"
+      class="ui raised segments"
     >
-      Content that links to or references 
-      <q>
-        page #1
-      </q>
-    </div>
-    <table
-      className="ui selectable single line attached compact table"
-    >
-      <tbody
-        className=""
+      <div
+        class="ui segment primary"
       >
-        <tr
-          className=""
+        Content that links to or references 
+        <q>
+          page #1
+        </q>
+      </div>
+      <table
+        class="ui selectable single line attached compact table"
+      >
+        <tbody
+          class=""
         >
-          <th
-            className=""
-          >
-            Linking this item with hyperlink in text
-          </th>
-          <th
-            className=""
+          <tr
+            class=""
           >
-            Review state
-          </th>
-          <th
-            className=""
-          >
-            Type
-          </th>
-        </tr>
-        <tr
-          className=""
-        >
-          <td
-            className=""
+            <th
+              class=""
+            >
+              Linking this item with hyperlink in text
+            </th>
+            <th
+              class=""
+            >
+              Review state
+            </th>
+            <th
+              class=""
+            >
+              Type
+            </th>
+          </tr>
+          <tr
+            class=""
           >
-            <a
-              className="source published"
-              href="/page-basil"
-              onClick={[Function]}
-              target={null}
-              title={null}
+            <td
+              class=""
             >
-              <span
-                className="label"
-                title="Document"
+              <a
+                class="source published"
+                href="/page-basil"
               >
-                Basil
+                <span
+                  class="label"
+                  title="Document"
+                >
+                  Basil
+                </span>
+              </a>
+            </td>
+            <td
+              class=""
+            >
+              <span>
+                published
               </span>
-            </a>
-          </td>
-          <td
-            className=""
-          >
-            <span>
-              published
-            </span>
-          </td>
-          <td
-            className=""
-          >
-            <span>
-              Document
-            </span>
-          </td>
-        </tr>
-        <tr
-          className=""
-        >
-          <th
-            className=""
-          >
-            Referencing this item as related item
-          </th>
-          <th
-            className=""
-          >
-            Review state
-          </th>
-          <th
-            className=""
+            </td>
+            <td
+              class=""
+            >
+              <span>
+                Document
+              </span>
+            </td>
+          </tr>
+          <tr
+            class=""
           >
-            Type
-          </th>
-        </tr>
-        <tr
-          className=""
-        >
-          <td
-            className=""
+            <th
+              class=""
+            >
+              Referencing this item as related item
+            </th>
+            <th
+              class=""
+            >
+              Review state
+            </th>
+            <th
+              class=""
+            >
+              Type
+            </th>
+          </tr>
+          <tr
+            class=""
           >
-            <a
-              className="source published"
-              href="/page-cucumber"
-              onClick={[Function]}
-              target={null}
-              title={null}
+            <td
+              class=""
             >
-              <span
-                className="label"
-                title="Document"
+              <a
+                class="source published"
+                href="/page-cucumber"
               >
-                Cucumber
+                <span
+                  class="label"
+                  title="Document"
+                >
+                  Cucumber
+                </span>
+              </a>
+            </td>
+            <td
+              class=""
+            >
+              <span>
+                published
               </span>
-            </a>
-          </td>
-          <td
-            className=""
-          >
-            <span>
-              published
-            </span>
-          </td>
-          <td
-            className=""
-          >
-            <span>
-              Document
-            </span>
-          </td>
-        </tr>
-      </tbody>
-    </table>
+            </td>
+            <td
+              class=""
+            >
+              <span>
+                Document
+              </span>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Multilingual/CreateTranslation.test.jsx b/packages/volto/src/components/manage/Multilingual/CreateTranslation.test.jsx
deleted file mode 100644
index 56ff1b32a1..0000000000
--- a/packages/volto/src/components/manage/Multilingual/CreateTranslation.test.jsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from 'react';
-import renderer from 'react-test-renderer';
-import configureStore from 'redux-mock-store';
-import { Provider } from 'react-intl-redux';
-import { MemoryRouter } from 'react-router-dom';
-import config from '@plone/volto/registry';
-
-import CreateTranslation from './CreateTranslation';
-
-beforeAll(() => {
-  config.settings.isMultilingual = true;
-  config.settings.supportedLanguages = ['de', 'es'];
-});
-
-const mockStore = configureStore();
-
-describe('CreateTranslation', () => {
-  it('renders a CreateTranslation component', () => {
-    const store = mockStore({
-      intl: {
-        locale: 'en',
-        messages: {},
-      },
-      translations: {
-        translationLocation: '/es',
-      },
-    });
-    const component = renderer.create(
-      <Provider store={store}>
-        <MemoryRouter>
-          <CreateTranslation
-            location={{
-              pathname: '/blog-post',
-              state: {
-                language: 'es',
-                translationOf: '/en/page-en',
-              },
-            }}
-          />
-        </MemoryRouter>
-      </Provider>,
-    );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
-  });
-});
diff --git a/packages/volto/src/components/manage/Multilingual/ManageTranslations.jsx b/packages/volto/src/components/manage/Multilingual/ManageTranslations.jsx
index a375b98e89..37fe9a11dc 100644
--- a/packages/volto/src/components/manage/Multilingual/ManageTranslations.jsx
+++ b/packages/volto/src/components/manage/Multilingual/ManageTranslations.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { Button, Container, Segment, Table } from 'semantic-ui-react';
 import { Helmet } from '@plone/volto/helpers';
 import { flattenToAppURL, getBaseUrl, langmap } from '@plone/volto/helpers';
@@ -15,7 +15,7 @@ import {
 } from '@plone/volto/actions';
 import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
 import { useSelector, useDispatch } from 'react-redux';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { toast } from 'react-toastify';
 
 import addSVG from '@plone/volto/icons/add.svg';
@@ -64,6 +64,12 @@ const ManageTranslations = (props) => {
   const content = useSelector((state) => state.content.data);
   const dispatch = useDispatch();
 
+  const [isClient, setIsClient] = useState(false);
+
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
+
   const { isObjectBrowserOpen, openObjectBrowser } = props;
 
   const currentSelectedItem = React.useRef(null);
@@ -269,8 +275,8 @@ const ManageTranslations = (props) => {
             </Table.Body>
           </Table>
         )}
-        {__CLIENT__ && (
-          <Portal node={document.getElementById('toolbar')}>
+        {isClient &&
+          createPortal(
             <Toolbar
               pathname={pathname}
               hideDefaultViewButtons
@@ -284,9 +290,9 @@ const ManageTranslations = (props) => {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Segment.Group>
     </Container>
   );
diff --git a/packages/volto/src/components/manage/Multilingual/ManageTranslations.test.jsx b/packages/volto/src/components/manage/Multilingual/ManageTranslations.test.jsx
index a8d51b4101..f4a85720ad 100644
--- a/packages/volto/src/components/manage/Multilingual/ManageTranslations.test.jsx
+++ b/packages/volto/src/components/manage/Multilingual/ManageTranslations.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter } from 'react-router-dom';
@@ -12,9 +12,7 @@ beforeAll(() => {
   config.settings.supportedLanguages = ['de', 'es'];
 });
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 const mockStore = configureStore();
 
@@ -36,7 +34,7 @@ describe('ManageTranslations', () => {
         },
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <ManageTranslations
@@ -48,10 +46,11 @@ describe('ManageTranslations', () => {
               },
             }}
           />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Multilingual/__snapshots__/CreateTranslation.test.jsx.snap b/packages/volto/src/components/manage/Multilingual/__snapshots__/CreateTranslation.test.jsx.snap
deleted file mode 100644
index 6676d8b34e..0000000000
--- a/packages/volto/src/components/manage/Multilingual/__snapshots__/CreateTranslation.test.jsx.snap
+++ /dev/null
@@ -1,3 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`CreateTranslation renders a CreateTranslation component 1`] = `null`;
diff --git a/packages/volto/src/components/manage/Multilingual/__snapshots__/ManageTranslations.test.jsx.snap b/packages/volto/src/components/manage/Multilingual/__snapshots__/ManageTranslations.test.jsx.snap
index af4ba1ee3a..c91ee38455 100644
--- a/packages/volto/src/components/manage/Multilingual/__snapshots__/ManageTranslations.test.jsx.snap
+++ b/packages/volto/src/components/manage/Multilingual/__snapshots__/ManageTranslations.test.jsx.snap
@@ -1,212 +1,160 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ManageTranslations renders a ManageTranslations component 1`] = `
-<div
-  className="ui container"
-  id="page-manage-translations"
->
+<div>
   <div
-    className="ui raised segments"
+    class="ui container"
+    id="page-manage-translations"
   >
     <div
-      className="ui segment primary"
+      class="ui raised segments"
     >
-      Manage translations for 
-      <q>
-        My page
-      </q>
-    </div>
-    <table
-      className="ui selectable single line attached compact table"
-    >
-      <thead
-        className=""
+      <div
+        class="ui segment primary"
       >
-        <tr
-          className=""
-        >
-          <th
-            className=""
-          >
-            Language
-          </th>
-          <th
-            className=""
-          >
-            Path
-          </th>
-          <th
-            className="right aligned"
-          >
-            Tools
-          </th>
-        </tr>
-      </thead>
-      <tbody
-        className=""
+        Manage translations for 
+        <q>
+          My page
+        </q>
+      </div>
+      <table
+        class="ui selectable single line attached compact table"
       >
-        <tr
-          className=""
+        <thead
+          class=""
         >
-          <td
-            className="collapsing"
+          <tr
+            class=""
           >
-            Deutsch
-          </td>
-          <td
-            className=""
-          >
-            <a
-              href="/"
-              onClick={[Function]}
+            <th
+              class=""
+            >
+              Language
+            </th>
+            <th
+              class=""
+            >
+              Path
+            </th>
+            <th
+              class="right aligned"
             >
-              
-            </a>
-          </td>
-          <td
-            className="right aligned manage-multilingual-tools"
+              Tools
+            </th>
+          </tr>
+        </thead>
+        <tbody
+          class=""
+        >
+          <tr
+            class=""
           >
-            <div
-              className="ui buttons"
+            <td
+              class="collapsing"
+            >
+              Deutsch
+            </td>
+            <td
+              class=""
             >
               <a
-                className="ui basic icon button"
-                href="//create-translation"
-                onClick={[Function]}
-                role="button"
-              >
-                <svg
-                  className="icon"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "24px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </a>
-            </div>
-            <div
-              className="ui buttons"
+                href="/"
+              />
+            </td>
+            <td
+              class="right aligned manage-multilingual-tools"
             >
-              <button
-                aria-label="Link translation for deutsch"
-                className="ui basic icon button"
-                onClick={[Function]}
+              <div
+                class="ui buttons"
               >
-                <svg
-                  className="icon"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "24px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </button>
-            </div>
-          </td>
-        </tr>
-        <tr
-          className=""
-        >
-          <td
-            className="collapsing"
-          >
-            Español
-          </td>
-          <td
-            className=""
+                <a
+                  class="ui basic icon button"
+                  href="//create-translation"
+                  role="button"
+                >
+                  <svg
+                    class="icon"
+                    style="height: 24px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
+                </a>
+              </div>
+              <div
+                class="ui buttons"
+              >
+                <button
+                  aria-label="Link translation for deutsch"
+                  class="ui basic icon button"
+                >
+                  <svg
+                    class="icon"
+                    style="height: 24px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
+                </button>
+              </div>
+            </td>
+          </tr>
+          <tr
+            class=""
           >
-            <a
-              href="/"
-              onClick={[Function]}
+            <td
+              class="collapsing"
             >
-              
-            </a>
-          </td>
-          <td
-            className="right aligned manage-multilingual-tools"
-          >
-            <div
-              className="ui buttons"
+              Español
+            </td>
+            <td
+              class=""
             >
               <a
-                className="ui basic icon button"
-                href="//create-translation"
-                onClick={[Function]}
-                role="button"
-              >
-                <svg
-                  className="icon"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "24px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </a>
-            </div>
-            <div
-              className="ui buttons"
+                href="/"
+              />
+            </td>
+            <td
+              class="right aligned manage-multilingual-tools"
             >
-              <button
-                aria-label="Link translation for español"
-                className="ui basic icon button"
-                onClick={[Function]}
+              <div
+                class="ui buttons"
               >
-                <svg
-                  className="icon"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "24px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </button>
-            </div>
-          </td>
-        </tr>
-      </tbody>
-    </table>
+                <a
+                  class="ui basic icon button"
+                  href="//create-translation"
+                  role="button"
+                >
+                  <svg
+                    class="icon"
+                    style="height: 24px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
+                </a>
+              </div>
+              <div
+                class="ui buttons"
+              >
+                <button
+                  aria-label="Link translation for español"
+                  class="ui basic icon button"
+                >
+                  <svg
+                    class="icon"
+                    style="height: 24px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
+                </button>
+              </div>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+  </div>
+  <div
+    id="toolbar"
+  >
     <div
       id="Portal"
     />
diff --git a/packages/volto/src/components/manage/Preferences/ChangePassword.jsx b/packages/volto/src/components/manage/Preferences/ChangePassword.jsx
index ca817592f6..b686ca0c9f 100644
--- a/packages/volto/src/components/manage/Preferences/ChangePassword.jsx
+++ b/packages/volto/src/components/manage/Preferences/ChangePassword.jsx
@@ -9,7 +9,7 @@ import { Helmet } from '@plone/volto/helpers';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link, withRouter } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { defineMessages, injectIntl } from 'react-intl';
 import { Container } from 'semantic-ui-react';
 import jwtDecode from 'jwt-decode';
@@ -195,8 +195,8 @@ class ChangePassword extends Component {
           onCancel={this.onCancel}
           loading={this.props.loading}
         />
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -213,9 +213,9 @@ class ChangePassword extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Preferences/ChangePassword.test.jsx b/packages/volto/src/components/manage/Preferences/ChangePassword.test.jsx
index 48f71c5aa4..7746c796f2 100644
--- a/packages/volto/src/components/manage/Preferences/ChangePassword.test.jsx
+++ b/packages/volto/src/components/manage/Preferences/ChangePassword.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureStore from 'redux-mock-store';
 import jwt from 'jsonwebtoken';
@@ -9,9 +9,7 @@ import ChangePassword from './ChangePassword';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 describe('ChangePassword', () => {
   it('renders a change password component', () => {
@@ -36,14 +34,15 @@ describe('ChangePassword', () => {
         },
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <ChangePassword location={{ pathname: '/blog' }} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Preferences/PersonalInformation.test.jsx b/packages/volto/src/components/manage/Preferences/PersonalInformation.test.jsx
index 52eac28cee..b7abdfaf81 100644
--- a/packages/volto/src/components/manage/Preferences/PersonalInformation.test.jsx
+++ b/packages/volto/src/components/manage/Preferences/PersonalInformation.test.jsx
@@ -18,9 +18,7 @@ const userSchema = {
   loading: false,
 };
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 describe('PersonalInformation', () => {
   it('renders a personal information component', async () => {
diff --git a/packages/volto/src/components/manage/Preferences/PersonalPreferences.test.jsx b/packages/volto/src/components/manage/Preferences/PersonalPreferences.test.jsx
index 97ed07e951..8a72fe0d9f 100644
--- a/packages/volto/src/components/manage/Preferences/PersonalPreferences.test.jsx
+++ b/packages/volto/src/components/manage/Preferences/PersonalPreferences.test.jsx
@@ -8,9 +8,7 @@ import PersonalPreferences from './PersonalPreferences';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 jest.mock('@plone/volto/helpers/Loadable/Loadable');
 beforeAll(
diff --git a/packages/volto/src/components/manage/Preferences/__snapshots__/ChangePassword.test.jsx.snap b/packages/volto/src/components/manage/Preferences/__snapshots__/ChangePassword.test.jsx.snap
index ef3e37d8c5..1dbacb73fa 100644
--- a/packages/volto/src/components/manage/Preferences/__snapshots__/ChangePassword.test.jsx.snap
+++ b/packages/volto/src/components/manage/Preferences/__snapshots__/ChangePassword.test.jsx.snap
@@ -1,113 +1,92 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ChangePassword renders a change password component 1`] = `
-<div
-  className="ui container"
-  id="page-change-password"
->
+<div>
   <div
-    className="ui container"
+    class="ui container"
+    id="page-change-password"
   >
-    <form
-      className="ui form"
-      method="post"
-      onSubmit={[Function]}
+    <div
+      class="ui container"
     >
-      <fieldset
-        className="invisible"
+      <form
+        class="ui form"
+        method="post"
       >
-        <div
-          className="ui raised segments"
+        <fieldset
+          class="invisible"
         >
           <div
-            className="ui segment"
+            class="ui raised segments"
           >
             <div
-              className="mocked-password-widget"
-              id="mocked-field-oldPassword"
+              class="ui segment"
             >
-              Current password
-               - 
-              Enter your current password.
+              <div
+                class="mocked-password-widget"
+                id="mocked-field-oldPassword"
+              >
+                Current password
+                 - 
+                Enter your current password.
+              </div>
+              <div
+                class="mocked-password-widget"
+                id="mocked-field-newPassword"
+              >
+                New password
+                 - 
+                Enter your new password. Minimum 8 characters.
+              </div>
+              <div
+                class="mocked-password-widget"
+                id="mocked-field-newPasswordRepeat"
+              >
+                Confirm password
+                 - 
+                Re-enter the password. Make sure the passwords are identical.
+              </div>
             </div>
             <div
-              className="mocked-password-widget"
-              id="mocked-field-newPassword"
+              class="ui clearing segment actions"
             >
-              New password
-               - 
-              Enter your new password. Minimum 8 characters.
+              <button
+                aria-label="Save"
+                class="ui basic primary right floated button"
+                title="Save"
+                type="submit"
+              >
+                <svg
+                  class="icon circled"
+                  style="height: 30px; width: auto; fill: currentColor;"
+                  viewBox=""
+                  xmlns=""
+                />
+              </button>
+              <button
+                aria-label="Cancel"
+                class="ui basic secondary right floated button"
+                title="Cancel"
+              >
+                <svg
+                  class="icon circled"
+                  style="height: 30px; width: auto; fill: currentColor;"
+                  viewBox=""
+                  xmlns=""
+                />
+              </button>
             </div>
-            <div
-              className="mocked-password-widget"
-              id="mocked-field-newPasswordRepeat"
-            >
-              Confirm password
-               - 
-              Re-enter the password. Make sure the passwords are identical.
-            </div>
-          </div>
-          <div
-            className="ui clearing segment actions"
-          >
-            <button
-              aria-label="Save"
-              className="ui basic primary right floated button"
-              onClick={[Function]}
-              title="Save"
-              type="submit"
-            >
-              <svg
-                className="icon circled"
-                dangerouslySetInnerHTML={
-                  Object {
-                    "__html": undefined,
-                  }
-                }
-                onClick={null}
-                style={
-                  Object {
-                    "fill": "currentColor",
-                    "height": "30px",
-                    "width": "auto",
-                  }
-                }
-                viewBox=""
-                xmlns=""
-              />
-            </button>
-            <button
-              aria-label="Cancel"
-              className="ui basic secondary right floated button"
-              onClick={[Function]}
-              title="Cancel"
-            >
-              <svg
-                className="icon circled"
-                dangerouslySetInnerHTML={
-                  Object {
-                    "__html": undefined,
-                  }
-                }
-                onClick={null}
-                style={
-                  Object {
-                    "fill": "currentColor",
-                    "height": "30px",
-                    "width": "auto",
-                  }
-                }
-                viewBox=""
-                xmlns=""
-              />
-            </button>
           </div>
-        </div>
-      </fieldset>
-    </form>
+        </fieldset>
+      </form>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Rules/Rules.jsx b/packages/volto/src/components/manage/Rules/Rules.jsx
index cc0aacf11f..f47c14c567 100644
--- a/packages/volto/src/components/manage/Rules/Rules.jsx
+++ b/packages/volto/src/components/manage/Rules/Rules.jsx
@@ -8,7 +8,7 @@ import { Helmet } from '@plone/volto/helpers';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Button,
   Checkbox,
@@ -484,8 +484,8 @@ class Rules extends Component {
             </Button>
           </React.Fragment>
         )}
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -502,9 +502,9 @@ class Rules extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Rules/Rules.test.jsx b/packages/volto/src/components/manage/Rules/Rules.test.jsx
index fad9e8a3ab..ba8f414ce4 100644
--- a/packages/volto/src/components/manage/Rules/Rules.test.jsx
+++ b/packages/volto/src/components/manage/Rules/Rules.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { Provider } from 'react-intl-redux';
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
@@ -9,9 +9,8 @@ import Rules from './Rules';
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
+
 jest.mock('../Toolbar/More', () => jest.fn(() => <div className="More" />));
 
 describe('Rules', () => {
@@ -65,12 +64,13 @@ describe('Rules', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <Rules location={{ pathname: '/blog/rules' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Rules/__snapshots__/Rules.test.jsx.snap b/packages/volto/src/components/manage/Rules/__snapshots__/Rules.test.jsx.snap
index cdc03912ae..8562329969 100644
--- a/packages/volto/src/components/manage/Rules/__snapshots__/Rules.test.jsx.snap
+++ b/packages/volto/src/components/manage/Rules/__snapshots__/Rules.test.jsx.snap
@@ -1,29 +1,35 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Rules renders rules object control 1`] = `
-<div
-  className="ui container"
-  id="rules"
->
+<div>
   <div
-    className="ui raised segments"
+    class="ui container"
+    id="rules"
   >
     <div
-      className="ui segment primary"
+      class="ui raised segments"
     >
-      Content rules for 
-      <q>
-        Blog
-      </q>
-    </div>
-    <div
-      className="ui secondary segment"
-    >
-      The following content rules are active in this Page. Use the content rules control panel to create new rules or delete or modify existing ones.
+      <div
+        class="ui segment primary"
+      >
+        Content rules for 
+        <q>
+          Blog
+        </q>
+      </div>
+      <div
+        class="ui secondary segment"
+      >
+        The following content rules are active in this Page. Use the content rules control panel to create new rules or delete or modify existing ones.
+      </div>
     </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Sharing/Sharing.jsx b/packages/volto/src/components/manage/Sharing/Sharing.jsx
index 31d715ad0a..b50ece9658 100644
--- a/packages/volto/src/components/manage/Sharing/Sharing.jsx
+++ b/packages/volto/src/components/manage/Sharing/Sharing.jsx
@@ -10,7 +10,7 @@ import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Link, withRouter } from 'react-router-dom';
 import { find, isEqual, map } from 'lodash';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import {
   Button,
   Checkbox,
@@ -505,8 +505,8 @@ class SharingComponent extends Component {
             </Form>
           </Plug>
         </Segment.Group>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
@@ -523,9 +523,9 @@ class SharingComponent extends Component {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/manage/Sharing/Sharing.test.jsx b/packages/volto/src/components/manage/Sharing/Sharing.test.jsx
index 9e0cafbfff..4924fe2379 100644
--- a/packages/volto/src/components/manage/Sharing/Sharing.test.jsx
+++ b/packages/volto/src/components/manage/Sharing/Sharing.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import jwt from 'jsonwebtoken';
@@ -10,9 +10,7 @@ import Sharing from './Sharing';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../Toolbar/Toolbar', () => jest.fn(() => <div id="Portal" />));
 
 describe('Sharing', () => {
   it('renders a sharing component', () => {
@@ -57,16 +55,18 @@ describe('Sharing', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+
+    const { container } = render(
       <Provider store={store}>
         <PluggablesProvider>
           <MemoryRouter>
             <Sharing location={{ pathname: '/blog' }} />
+            <div id="toolbar"></div>
           </MemoryRouter>
         </PluggablesProvider>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/manage/Sharing/__snapshots__/Sharing.test.jsx.snap b/packages/volto/src/components/manage/Sharing/__snapshots__/Sharing.test.jsx.snap
index f56ecded12..b9502bffc7 100644
--- a/packages/volto/src/components/manage/Sharing/__snapshots__/Sharing.test.jsx.snap
+++ b/packages/volto/src/components/manage/Sharing/__snapshots__/Sharing.test.jsx.snap
@@ -1,217 +1,186 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Sharing renders a sharing component 1`] = `
-<div
-  className="ui container"
-  id="page-sharing"
->
+<div>
   <div
-    className="ui raised segments"
+    class="ui container"
+    id="page-sharing"
   >
     <div
-      className="ui segment primary"
+      class="ui raised segments"
     >
-      Sharing for 
-      <q>
-        Blog
-      </q>
-    </div>
-    <div
-      className="ui secondary segment"
-    >
-      You can control who can view and edit your item using the list below.
-    </div>
-    <div
-      className="ui segment"
-    >
-      <form
-        className="ui form"
-        onSubmit={[Function]}
+      <div
+        class="ui segment primary"
       >
-        <div
-          className="field"
+        Sharing for 
+        <q>
+          Blog
+        </q>
+      </div>
+      <div
+        class="ui secondary segment"
+      >
+        You can control who can view and edit your item using the list below.
+      </div>
+      <div
+        class="ui segment"
+      >
+        <form
+          class="ui form"
         >
           <div
-            className="ui action input"
+            class="field"
           >
-            <input
-              id="sharing-component-search"
-              name="SearchableText"
-              onChange={[Function]}
-              placeholder="Search for user or group"
-              type="text"
-            />
-            <button
-              aria-label="Search"
-              className="ui icon button"
-              onClick={[Function]}
+            <div
+              class="ui action input"
             >
-              <i
-                aria-hidden="true"
-                className="search icon"
-                onClick={[Function]}
+              <input
+                id="sharing-component-search"
+                name="SearchableText"
+                placeholder="Search for user or group"
+                type="text"
               />
-            </button>
+              <button
+                aria-label="Search"
+                class="ui icon button"
+              >
+                <i
+                  aria-hidden="true"
+                  class="search icon"
+                />
+              </button>
+            </div>
           </div>
-        </div>
-      </form>
-    </div>
-    <form
-      className="ui form"
-      onSubmit={[Function]}
-    >
-      <table
-        className="ui celled striped attached padded table"
+        </form>
+      </div>
+      <form
+        class="ui form"
       >
-        <thead
-          className=""
+        <table
+          class="ui celled striped attached padded table"
         >
-          <tr
-            className=""
+          <thead
+            class=""
           >
-            <th
-              className=""
+            <tr
+              class=""
             >
-              Name
-            </th>
-            <th
-              className=""
-            >
-              Can add
-            </th>
-          </tr>
-        </thead>
-        <tbody
-          className=""
-        >
-          <tr
-            className=""
+              <th
+                class=""
+              >
+                Name
+              </th>
+              <th
+                class=""
+              >
+                Can add
+              </th>
+            </tr>
+          </thead>
+          <tbody
+            class=""
           >
-            <td
-              className=""
+            <tr
+              class=""
             >
-              <i
-                aria-hidden="true"
-                className="user icon"
-                onClick={[Function]}
-                title="User"
+              <td
+                class=""
+              >
+                <i
+                  aria-hidden="true"
+                  class="user icon"
+                  title="User"
+                />
+                 
+                John Doe
+                 (john-doe)
+              </td>
+              <td
+                class=""
               />
-               
-              John Doe
-               (john-doe)
-            </td>
-            <td
-              className=""
-            />
-          </tr>
-        </tbody>
-      </table>
-      <div
-        className="ui attached segment"
-      >
+            </tr>
+          </tbody>
+        </table>
         <div
-          className="field"
+          class="ui attached segment"
         >
           <div
-            className="ui checked checkbox"
-            onChange={[Function]}
-            onClick={[Function]}
-            onMouseDown={[Function]}
-            onMouseUp={[Function]}
+            class="field"
           >
-            <input
-              checked={true}
-              className="hidden"
-              id="inherit-permissions-checkbox"
-              name="inherit-permissions-checkbox"
-              readOnly={true}
-              tabIndex={0}
-              type="checkbox"
-            />
-            <label
-              htmlFor="inherit-permissions-checkbox"
+            <div
+              class="ui checked checkbox"
             >
-              Inherit permissions from higher levels
-            </label>
+              <input
+                checked=""
+                class="hidden"
+                id="inherit-permissions-checkbox"
+                name="inherit-permissions-checkbox"
+                readonly=""
+                tabindex="0"
+                type="checkbox"
+                value=""
+              />
+              <label
+                for="inherit-permissions-checkbox"
+              >
+                Inherit permissions from higher levels
+              </label>
+            </div>
           </div>
+          <p
+            class="help"
+          >
+            By default, permissions from the container of this item are inherited. If you disable this, only the explicitly defined sharing permissions will be valid. In the overview, the symbol 
+            <i
+              aria-hidden="true"
+              class="green check circle outline icon"
+            />
+             indicates an inherited value. Similarly, the symbol 
+            <i
+              aria-hidden="true"
+              class="blue check circle outline icon"
+            />
+             indicates a global role, which is managed by the site administrator.
+          </p>
         </div>
-        <p
-          className="help"
-        >
-          By default, permissions from the container of this item are inherited. If you disable this, only the explicitly defined sharing permissions will be valid. In the overview, the symbol 
-          <i
-            aria-hidden="true"
-            className="green check circle outline icon"
-            onClick={[Function]}
-          />
-           indicates an inherited value. Similarly, the symbol 
-          <i
-            aria-hidden="true"
-            className="blue check circle outline icon"
-            onClick={[Function]}
-          />
-           indicates a global role, which is managed by the site administrator.
-        </p>
-      </div>
-      <div
-        className="ui clearing attached segment actions"
-      >
-        <button
-          aria-label="Save"
-          className="ui basic primary right floated button"
-          onClick={[Function]}
-          title="Save"
-          type="submit"
-        >
-          <svg
-            className="icon circled"
-            dangerouslySetInnerHTML={
-              Object {
-                "__html": undefined,
-              }
-            }
-            onClick={null}
-            style={
-              Object {
-                "fill": "currentColor",
-                "height": "30px",
-                "width": "auto",
-              }
-            }
-            viewBox=""
-            xmlns=""
-          />
-        </button>
-        <button
-          aria-label="Cancel"
-          className="ui basic secondary right floated button"
-          onClick={[Function]}
-          title="Cancel"
+        <div
+          class="ui clearing attached segment actions"
         >
-          <svg
-            className="icon circled"
-            dangerouslySetInnerHTML={
-              Object {
-                "__html": undefined,
-              }
-            }
-            onClick={null}
-            style={
-              Object {
-                "fill": "currentColor",
-                "height": "30px",
-                "width": "auto",
-              }
-            }
-            viewBox=""
-            xmlns=""
-          />
-        </button>
-      </div>
-    </form>
+          <button
+            aria-label="Save"
+            class="ui basic primary right floated button"
+            title="Save"
+            type="submit"
+          >
+            <svg
+              class="icon circled"
+              style="height: 30px; width: auto; fill: currentColor;"
+              viewBox=""
+              xmlns=""
+            />
+          </button>
+          <button
+            aria-label="Cancel"
+            class="ui basic secondary right floated button"
+            title="Cancel"
+          >
+            <svg
+              class="icon circled"
+              style="height: 30px; width: auto; fill: currentColor;"
+              viewBox=""
+              xmlns=""
+            />
+          </button>
+        </div>
+      </form>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Sidebar/ObjectBrowser.jsx b/packages/volto/src/components/manage/Sidebar/ObjectBrowser.jsx
index 0a31dcd486..a509550b95 100644
--- a/packages/volto/src/components/manage/Sidebar/ObjectBrowser.jsx
+++ b/packages/volto/src/components/manage/Sidebar/ObjectBrowser.jsx
@@ -98,7 +98,7 @@ const withObjectBrowser = (WrappedComponent) =>
               <ObjectBrowserBody
                 {...this.props}
                 data={
-                  this.state.propDataName
+                  this.state.propDataName && this.props[this.state.propDataName]
                     ? this.props[this.state.propDataName]
                     : this.props.data
                 }
diff --git a/packages/volto/src/components/manage/Sidebar/Sidebar.jsx b/packages/volto/src/components/manage/Sidebar/Sidebar.jsx
index d480ac2ed9..790cb8bc94 100644
--- a/packages/volto/src/components/manage/Sidebar/Sidebar.jsx
+++ b/packages/volto/src/components/manage/Sidebar/Sidebar.jsx
@@ -138,6 +138,7 @@ const Sidebar = (props) => {
           panes={[
             !!documentTab && {
               menuItem: {
+                key: 'documentTab',
                 as: 'button',
                 className: 'ui button',
                 content: type || intl.formatMessage(messages.document),
@@ -152,6 +153,7 @@ const Sidebar = (props) => {
             },
             !!blockTab && {
               menuItem: {
+                key: 'blockTab',
                 as: 'button',
                 className: 'ui button',
                 content: intl.formatMessage(messages.block),
diff --git a/packages/volto/src/components/manage/Sidebar/SidebarPopup.jsx b/packages/volto/src/components/manage/Sidebar/SidebarPopup.jsx
index 14cd922a1f..58d6897fc3 100644
--- a/packages/volto/src/components/manage/Sidebar/SidebarPopup.jsx
+++ b/packages/volto/src/components/manage/Sidebar/SidebarPopup.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { CSSTransition } from 'react-transition-group';
 import PropTypes from 'prop-types';
 import { doesNodeContainClick } from 'semantic-ui-react/dist/commonjs/lib';
@@ -32,9 +32,13 @@ const SidebarPopup = (props) => {
           classNames="overlay-container"
           unmountOnExit
         >
-          <Portal node={document?.body}>
-            <div className="overlay-container"></div>
-          </Portal>
+          <>
+            {document?.body &&
+              createPortal(
+                <div className="overlay-container"></div>,
+                document?.body,
+              )}
+          </>
         </CSSTransition>
       )}
       <CSSTransition
@@ -43,23 +47,26 @@ const SidebarPopup = (props) => {
         classNames="sidebar-container"
         unmountOnExit
       >
-        <Portal>
-          <aside
-            role="presentation"
-            onClick={(e) => {
-              e.stopPropagation();
-            }}
-            onKeyDown={(e) => {
-              e.stopPropagation();
-            }}
-            ref={asideElement}
-            key="sidebarpopup"
-            className="sidebar-container"
-            style={{ overflowY: 'auto' }}
-          >
-            {children}
-          </aside>
-        </Portal>
+        <>
+          {createPortal(
+            <aside
+              role="presentation"
+              onClick={(e) => {
+                e.stopPropagation();
+              }}
+              onKeyDown={(e) => {
+                e.stopPropagation();
+              }}
+              ref={asideElement}
+              key="sidebarpopup"
+              className="sidebar-container"
+              style={{ overflowY: 'auto' }}
+            >
+              {children}
+            </aside>,
+            document.body,
+          )}
+        </>
       </CSSTransition>
     </>
   );
diff --git a/packages/volto/src/components/manage/Sidebar/SidebarPortal.jsx b/packages/volto/src/components/manage/Sidebar/SidebarPortal.jsx
index c99cb92fef..f77b80c2a7 100644
--- a/packages/volto/src/components/manage/Sidebar/SidebarPortal.jsx
+++ b/packages/volto/src/components/manage/Sidebar/SidebarPortal.jsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 
 /**
  * Portal that wraps Sidebar components
@@ -16,8 +16,9 @@ const SidebarPortal = ({ children, selected, tab = 'sidebar-properties' }) => {
 
   return (
     <>
-      {selected && (
-        <Portal node={isClient && document.getElementById(tab)}>
+      {isClient &&
+        selected &&
+        createPortal(
           <div role="form" style={{ height: '100%' }}>
             <div
               style={{ height: '100%' }}
@@ -31,9 +32,9 @@ const SidebarPortal = ({ children, selected, tab = 'sidebar-properties' }) => {
             >
               {children}
             </div>
-          </div>
-        </Portal>
-      )}
+          </div>,
+          document.getElementById(tab),
+        )}
     </>
   );
 };
diff --git a/packages/volto/src/components/manage/Sidebar/__snapshots__/SidebarPopup.test.jsx.snap b/packages/volto/src/components/manage/Sidebar/__snapshots__/SidebarPopup.test.jsx.snap
index 6d383e2cda..8144871def 100644
--- a/packages/volto/src/components/manage/Sidebar/__snapshots__/SidebarPopup.test.jsx.snap
+++ b/packages/volto/src/components/manage/Sidebar/__snapshots__/SidebarPopup.test.jsx.snap
@@ -8,23 +8,29 @@ exports[`sidebar popup is not rendered when the block is not selected 1`] = `
     timeout={500}
     unmountOnExit={true}
   >
-    <Portal>
-      <aside
-        className="sidebar-container"
-        onClick={[Function]}
-        onKeyDown={[Function]}
-        role="presentation"
-        style={
-          Object {
-            "overflowY": "auto",
+    <React.Fragment>
+      Object {
+        "$$typeof": Symbol(react.portal),
+        "children": <aside
+          className="sidebar-container"
+          onClick={[Function]}
+          onKeyDown={[Function]}
+          role="presentation"
+          style={
+            Object {
+              "overflowY": "auto",
+            }
           }
-        }
-      >
-        <p>
-          Tested, but you shouldn't see this in the snapshot!
-        </p>
-      </aside>
-    </Portal>
+        >
+          <p>
+            Tested, but you shouldn't see this in the snapshot!
+          </p>
+        </aside>,
+        "containerInfo": <body />,
+        "implementation": null,
+        "key": null,
+      }
+    </React.Fragment>
   </CSSTransition>
 </React.Fragment>
 `;
@@ -37,23 +43,29 @@ exports[`sidebar popup is rendered when the block is selected 1`] = `
     timeout={500}
     unmountOnExit={true}
   >
-    <Portal>
-      <aside
-        className="sidebar-container"
-        onClick={[Function]}
-        onKeyDown={[Function]}
-        role="presentation"
-        style={
-          Object {
-            "overflowY": "auto",
+    <React.Fragment>
+      Object {
+        "$$typeof": Symbol(react.portal),
+        "children": <aside
+          className="sidebar-container"
+          onClick={[Function]}
+          onKeyDown={[Function]}
+          role="presentation"
+          style={
+            Object {
+              "overflowY": "auto",
+            }
           }
-        }
-      >
-        <p>
-          Tested!
-        </p>
-      </aside>
-    </Portal>
+        >
+          <p>
+            Tested!
+          </p>
+        </aside>,
+        "containerInfo": <body />,
+        "implementation": null,
+        "key": null,
+      }
+    </React.Fragment>
   </CSSTransition>
 </React.Fragment>
 `;
diff --git a/packages/volto/src/components/manage/Sidebar/__snapshots__/SidebarPortal.test.jsx.snap b/packages/volto/src/components/manage/Sidebar/__snapshots__/SidebarPortal.test.jsx.snap
index d90ec6d71b..8ef45208d7 100644
--- a/packages/volto/src/components/manage/Sidebar/__snapshots__/SidebarPortal.test.jsx.snap
+++ b/packages/volto/src/components/manage/Sidebar/__snapshots__/SidebarPortal.test.jsx.snap
@@ -2,34 +2,4 @@
 
 exports[`sidebar portal is not rendered when the block is not selected 1`] = `<React.Fragment />`;
 
-exports[`sidebar portal is rendered when the block is selected 1`] = `
-<React.Fragment>
-  <Portal
-    node={null}
-  >
-    <div
-      role="form"
-      style={
-        Object {
-          "height": "100%",
-        }
-      }
-    >
-      <div
-        onClick={[Function]}
-        onKeyDown={[Function]}
-        role="presentation"
-        style={
-          Object {
-            "height": "100%",
-          }
-        }
-      >
-        <p>
-          Tested!
-        </p>
-      </div>
-    </div>
-  </Portal>
-</React.Fragment>
-`;
+exports[`sidebar portal is rendered when the block is selected 1`] = `<React.Fragment />`;
diff --git a/packages/volto/src/components/manage/Widgets/FileWidget.jsx b/packages/volto/src/components/manage/Widgets/FileWidget.jsx
index 34db736933..b168d37d43 100644
--- a/packages/volto/src/components/manage/Widgets/FileWidget.jsx
+++ b/packages/volto/src/components/manage/Widgets/FileWidget.jsx
@@ -112,7 +112,7 @@ const FileWidget = (props) => {
       if (imageMimetypes.includes(fields[1])) {
         setFileType(true);
         let imagePreview = document.getElementById(`field-${id}-image`);
-        imagePreview.src = reader.result;
+        if (imagePreview) imagePreview.src = reader.result;
       } else {
         setFileType(false);
       }
diff --git a/packages/volto/src/components/manage/Widgets/ObjectBrowserWidget.test.jsx b/packages/volto/src/components/manage/Widgets/ObjectBrowserWidget.test.jsx
index 70e1a4a53b..2783a93d5a 100644
--- a/packages/volto/src/components/manage/Widgets/ObjectBrowserWidget.test.jsx
+++ b/packages/volto/src/components/manage/Widgets/ObjectBrowserWidget.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import ObjectBrowserWidget from './ObjectBrowserWidget';
@@ -14,7 +14,7 @@ test('renders a objectBrowser widget component', () => {
       messages: {},
     },
   });
-  const component = renderer.create(
+  const { container } = render(
     <Provider store={store}>
       <MemoryRouter>
         <ObjectBrowserWidget
@@ -26,6 +26,6 @@ test('renders a objectBrowser widget component', () => {
       </MemoryRouter>
     </Provider>,
   );
-  const json = component.toJSON();
-  expect(json).toMatchSnapshot();
+
+  expect(container).toMatchSnapshot();
 });
diff --git a/packages/volto/src/components/manage/Widgets/ObjectListWidget.test.js b/packages/volto/src/components/manage/Widgets/ObjectListWidget.test.js
index 161549dee1..8332bf129d 100644
--- a/packages/volto/src/components/manage/Widgets/ObjectListWidget.test.js
+++ b/packages/volto/src/components/manage/Widgets/ObjectListWidget.test.js
@@ -2,7 +2,6 @@ import React from 'react';
 import { Provider } from 'react-intl-redux';
 import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
-import '@testing-library/jest-dom/extend-expect';
 import ObjectListWidget from './ObjectListWidget';
 
 jest.mock('@plone/volto/helpers/Loadable/Loadable');
diff --git a/packages/volto/src/components/manage/Widgets/ObjectWidget.test.jsx b/packages/volto/src/components/manage/Widgets/ObjectWidget.test.jsx
index b182d3f2bc..6f0d2d9e22 100644
--- a/packages/volto/src/components/manage/Widgets/ObjectWidget.test.jsx
+++ b/packages/volto/src/components/manage/Widgets/ObjectWidget.test.jsx
@@ -3,7 +3,6 @@ import renderer from 'react-test-renderer';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { render, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
 import ObjectWidget from './ObjectWidget';
 
 const mockStore = configureStore();
diff --git a/packages/volto/src/components/manage/Widgets/SchemaWidget.test.jsx b/packages/volto/src/components/manage/Widgets/SchemaWidget.test.jsx
index 44b19cc1a0..4ded955e95 100644
--- a/packages/volto/src/components/manage/Widgets/SchemaWidget.test.jsx
+++ b/packages/volto/src/components/manage/Widgets/SchemaWidget.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
@@ -21,7 +21,7 @@ test('renders a schema widget component', () => {
     },
   });
 
-  const component = renderer.create(
+  const { container } = render(
     <Provider store={store}>
       <SchemaWidget
         id="my-field"
@@ -31,6 +31,6 @@ test('renders a schema widget component', () => {
       />
     </Provider>,
   );
-  const json = component.toJSON();
-  expect(json).toMatchSnapshot();
+
+  expect(container).toMatchSnapshot();
 });
diff --git a/packages/volto/src/components/manage/Widgets/SchemaWidgetFieldset.test.jsx b/packages/volto/src/components/manage/Widgets/SchemaWidgetFieldset.test.jsx
index 95af6d1e0c..62667d8373 100644
--- a/packages/volto/src/components/manage/Widgets/SchemaWidgetFieldset.test.jsx
+++ b/packages/volto/src/components/manage/Widgets/SchemaWidgetFieldset.test.jsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { DragDropContext, Droppable } from 'react-beautiful-dnd';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import SchemaWidgetFieldsetComponent from './SchemaWidgetFieldset';
 
 jest.mock('@plone/volto/helpers/Loadable/Loadable');
@@ -10,7 +10,7 @@ beforeAll(
 );
 
 test('renders a contents item component', () => {
-  const component = renderer.create(
+  const { container } = render(
     <DragDropContext onDragEnd={(x) => x}>
       <Droppable droppableId="tabs-schema-edit" direction="horizontal">
         {(provided, snapshot) => (
@@ -28,7 +28,7 @@ test('renders a contents item component', () => {
               onShowEditFieldset={(x) => x}
               onShowDeleteFieldset={(x) => x}
               onClick={(x) => x}
-              getItemStyle={(x) => x}
+              getItemStyle={(x) => ({})}
               isDraggable={false}
               isDisabled={false}
             />
@@ -38,6 +38,6 @@ test('renders a contents item component', () => {
       </Droppable>
     </DragDropContext>,
   );
-  const json = component.toJSON();
-  expect(json).toMatchSnapshot();
+
+  expect(container).toMatchSnapshot();
 });
diff --git a/packages/volto/src/components/manage/Widgets/UrlWidget.test.jsx b/packages/volto/src/components/manage/Widgets/UrlWidget.test.jsx
index e9625d4f3f..35dfe39c35 100644
--- a/packages/volto/src/components/manage/Widgets/UrlWidget.test.jsx
+++ b/packages/volto/src/components/manage/Widgets/UrlWidget.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
@@ -15,7 +15,7 @@ test('renders an url widget component', () => {
     },
   });
 
-  const component = renderer.create(
+  const { container } = render(
     <Provider store={store}>
       <UrlWidget
         id="test-url"
@@ -27,6 +27,6 @@ test('renders an url widget component', () => {
       />
     </Provider>,
   );
-  const json = component.toJSON();
-  expect(json).toMatchSnapshot();
+
+  expect(container).toMatchSnapshot();
 });
diff --git a/packages/volto/src/components/manage/Widgets/VocabularyTermsWidget.test.jsx b/packages/volto/src/components/manage/Widgets/VocabularyTermsWidget.test.jsx
index 1d505fbe27..32e5ff4008 100644
--- a/packages/volto/src/components/manage/Widgets/VocabularyTermsWidget.test.jsx
+++ b/packages/volto/src/components/manage/Widgets/VocabularyTermsWidget.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
@@ -55,7 +55,7 @@ test('renders a dictionary widget component', () => {
       },
     ],
   };
-  const component = renderer.create(
+  const { container } = render(
     <Provider store={store}>
       <VocabularyTermsWidget
         id="test-dict"
@@ -68,6 +68,6 @@ test('renders a dictionary widget component', () => {
       />
     </Provider>,
   );
-  const json = component.toJSON();
-  expect(json).toMatchSnapshot();
+
+  expect(container).toMatchSnapshot();
 });
diff --git a/packages/volto/src/components/manage/Widgets/__snapshots__/ArrayWidget.test.jsx.snap b/packages/volto/src/components/manage/Widgets/__snapshots__/ArrayWidget.test.jsx.snap
index a5b5ac4d20..5a9dbbe75c 100644
--- a/packages/volto/src/components/manage/Widgets/__snapshots__/ArrayWidget.test.jsx.snap
+++ b/packages/volto/src/components/manage/Widgets/__snapshots__/ArrayWidget.test.jsx.snap
@@ -251,9 +251,7 @@ exports[`renders an array widget component 1`] = `
                         "whiteSpace": "pre",
                       }
                     }
-                  >
-                    
-                  </div>
+                  />
                 </div>
               </div>
             </div>
diff --git a/packages/volto/src/components/manage/Widgets/__snapshots__/ObjectBrowserWidget.test.jsx.snap b/packages/volto/src/components/manage/Widgets/__snapshots__/ObjectBrowserWidget.test.jsx.snap
index 0b08cefc6c..5704b6974f 100644
--- a/packages/volto/src/components/manage/Widgets/__snapshots__/ObjectBrowserWidget.test.jsx.snap
+++ b/packages/volto/src/components/manage/Widgets/__snapshots__/ObjectBrowserWidget.test.jsx.snap
@@ -1,74 +1,60 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders a objectBrowser widget component 1`] = `
-<div
-  className="inline field text field-wrapper-my-field"
->
+<div>
   <div
-    className="ui grid"
+    class="inline field text field-wrapper-my-field"
   >
     <div
-      className="stretched row"
+      class="ui grid"
     >
       <div
-        className="four wide column"
+        class="stretched row"
       >
         <div
-          className="wrapper"
+          class="four wide column"
         >
-          <label
-            htmlFor="field-my-field"
-            id="fieldset-default-field-label-my-field"
+          <div
+            class="wrapper"
           >
-            My field
-          </label>
+            <label
+              for="field-my-field"
+              id="fieldset-default-field-label-my-field"
+            >
+              My field
+            </label>
+          </div>
         </div>
-      </div>
-      <div
-        className="eight wide column"
-      >
         <div
-          aria-labelledby="fieldset-default-field-label-my-field"
-          className="objectbrowser-field"
+          class="eight wide column"
         >
           <div
-            className="selected-values"
-            onClick={[Function]}
-            onKeyDown={[Function]}
-            role="searchbox"
-            tabIndex={0}
+            aria-labelledby="fieldset-default-field-label-my-field"
+            class="objectbrowser-field"
           >
             <div
-              className="placeholder"
+              class="selected-values"
+              role="searchbox"
+              tabindex="0"
             >
-              No items selected
+              <div
+                class="placeholder"
+              >
+                No items selected
+              </div>
             </div>
+            <button
+              aria-label="Open object browser"
+              class="ui button action"
+            >
+              <svg
+                class="icon"
+                style="height: 18px; width: auto; fill: currentColor;"
+                viewBox=""
+                xmlns=""
+              />
+            </button>
           </div>
-          
-          <button
-            aria-label="Open object browser"
-            className="ui button action"
-            onClick={[Function]}
-          >
-            <svg
-              className="icon"
-              dangerouslySetInnerHTML={
-                Object {
-                  "__html": undefined,
-                }
-              }
-              onClick={null}
-              style={
-                Object {
-                  "fill": "currentColor",
-                  "height": "18px",
-                  "width": "auto",
-                }
-              }
-              viewBox=""
-              xmlns=""
-            />
-          </button>
         </div>
       </div>
     </div>
diff --git a/packages/volto/src/components/manage/Widgets/__snapshots__/SchemaWidget.test.jsx.snap b/packages/volto/src/components/manage/Widgets/__snapshots__/SchemaWidget.test.jsx.snap
index 4ff936138b..0f8e642ef6 100644
--- a/packages/volto/src/components/manage/Widgets/__snapshots__/SchemaWidget.test.jsx.snap
+++ b/packages/volto/src/components/manage/Widgets/__snapshots__/SchemaWidget.test.jsx.snap
@@ -2,130 +2,99 @@
 
 exports[`renders a schema widget component 1`] = `
 <div>
-  <div
-    className="ui segments"
-    style={
-      Object {
-        "margin": "-1rem",
-      }
-    }
-  >
+  <div>
     <div
-      className="ui pointing secondary attached tabular menu"
-      role="tablist"
-      style={
-        Object {
-          "background": "transparent",
-          "display": "flex",
-          "flexDirection": "row",
-          "flexWrap": "wrap",
-        }
-      }
+      class="ui segments"
+      style="margin: -1rem;"
     >
       <div
-        className="item active"
-        data-rbd-draggable-context-id="0"
-        onClick={[Function]}
-        onTransitionEnd={null}
-        style={
-          Object {
-            "background": "transparent",
-            "transform": null,
-            "transition": null,
-            "userSelect": "none",
-          }
-        }
+        class="ui pointing secondary attached tabular menu"
+        role="tablist"
+        style="background: transparent; display: flex; flex-direction: row; flex-wrap: wrap;"
       >
-        <i
-          aria-describedby="rbd-hidden-text-0-hidden-text-0"
-          aria-hidden="true"
-          className="grey bars icon drag handle"
-          data-rbd-drag-handle-context-id="0"
-          draggable={false}
-          onDragStart={[Function]}
-          role="button"
-          tabIndex={0}
-        />
-        <button
-          className="item ui noborder button"
-          onClick={[Function]}
+        <div
+          class="item active"
+          data-rbd-draggable-context-id="0"
+          style="user-select: none; background: transparent;"
         >
           <i
+            aria-describedby="rbd-hidden-text-0-hidden-text-0"
             aria-hidden="true"
-            className="blue write square large icon"
-            onClick={[Function]}
+            class="grey bars icon drag handle"
+            data-rbd-drag-handle-context-id="0"
+            draggable="false"
+            role="button"
+            tabindex="0"
           />
-        </button>
-        <button
-          className="item ui noborder button"
-          onClick={[Function]}
+          <button
+            class="item ui noborder button"
+          >
+            <i
+              aria-hidden="true"
+              class="blue write square large icon"
+            />
+          </button>
+          <button
+            class="item ui noborder button"
+          >
+            <i
+              aria-hidden="true"
+              class="red close large icon"
+            />
+          </button>
+        </div>
+        <div
+          class="item item-add"
         >
-          <i
-            aria-hidden="true"
-            className="red close large icon"
-            onClick={[Function]}
-          />
-        </button>
+          <button
+            aria-label="Add"
+            class="item ui noborder button"
+          >
+            <i
+              aria-hidden="true"
+              class="plus large icon"
+            />
+          </button>
+        </div>
       </div>
       <div
-        className="item item-add"
-      >
-        <button
-          aria-label="Add"
-          className="item ui noborder button"
-          onClick={[Function]}
-        >
-          <i
-            aria-hidden="true"
-            className="plus large icon"
-            onClick={[Function]}
-          />
-        </button>
-      </div>
-    </div>
-    <div
-      style={
-        Object {
-          "background": "transparent",
-        }
-      }
-    />
-    <div
-      className="inline field"
-    >
+        style="background: transparent;"
+      />
       <div
-        className="ui grid"
+        class="inline field"
       >
         <div
-          className="stretched row"
+          class="ui grid"
         >
           <div
-            className="twelve wide column"
+            class="stretched row"
           >
             <div
-              className="wrapper"
+              class="twelve wide column"
             >
-              <label
-                htmlFor="addfield"
+              <div
+                class="wrapper"
               >
-                Add field
-              </label>
-            </div>
-            <div
-              className="toolbar"
-            >
-              <button
-                aria-label="Add"
-                className="item ui noborder button"
-                id="addfield"
-                onClick={[Function]}
+                <label
+                  for="addfield"
+                >
+                  Add field
+                </label>
+              </div>
+              <div
+                class="toolbar"
               >
-                <i
-                  aria-hidden="true"
-                  className="blue plus large icon"
-                  onClick={[Function]}
-                />
-              </button>
+                <button
+                  aria-label="Add"
+                  class="item ui noborder button"
+                  id="addfield"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="blue plus large icon"
+                  />
+                </button>
+              </div>
             </div>
           </div>
         </div>
diff --git a/packages/volto/src/components/manage/Widgets/__snapshots__/SchemaWidgetFieldset.test.jsx.snap b/packages/volto/src/components/manage/Widgets/__snapshots__/SchemaWidgetFieldset.test.jsx.snap
index 2ef48dc97a..6b64777f79 100644
--- a/packages/volto/src/components/manage/Widgets/__snapshots__/SchemaWidgetFieldset.test.jsx.snap
+++ b/packages/volto/src/components/manage/Widgets/__snapshots__/SchemaWidgetFieldset.test.jsx.snap
@@ -1,39 +1,34 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders a contents item component 1`] = `
-<div
-  className="ui pointing secondary attached tabular menu"
-  role="tablist"
->
+<div>
   <div
-    className="item"
-    data-rbd-draggable-context-id="0"
-    data-rbd-draggable-id="test"
-    onClick={[Function]}
-    onTransitionEnd={null}
-    style={false}
+    class="ui pointing secondary attached tabular menu"
+    role="tablist"
   >
-    test
-    <button
-      className="item ui noborder button"
-      onClick={[Function]}
+    <div
+      class="item"
+      data-rbd-draggable-context-id="0"
+      data-rbd-draggable-id="test"
     >
-      <i
-        aria-hidden="true"
-        className="blue write square large icon"
-        onClick={[Function]}
-      />
-    </button>
-    <button
-      className="item ui noborder button"
-      onClick={[Function]}
-    >
-      <i
-        aria-hidden="true"
-        className="red close large icon"
-        onClick={[Function]}
-      />
-    </button>
+      test
+      <button
+        class="item ui noborder button"
+      >
+        <i
+          aria-hidden="true"
+          class="blue write square large icon"
+        />
+      </button>
+      <button
+        class="item ui noborder button"
+      >
+        <i
+          aria-hidden="true"
+          class="red close large icon"
+        />
+      </button>
+    </div>
   </div>
 </div>
 `;
diff --git a/packages/volto/src/components/manage/Widgets/__snapshots__/TokenWidget.test.jsx.snap b/packages/volto/src/components/manage/Widgets/__snapshots__/TokenWidget.test.jsx.snap
index 3040534bdf..2d2d3857df 100644
--- a/packages/volto/src/components/manage/Widgets/__snapshots__/TokenWidget.test.jsx.snap
+++ b/packages/volto/src/components/manage/Widgets/__snapshots__/TokenWidget.test.jsx.snap
@@ -103,9 +103,7 @@ exports[`renders a token widget component 1`] = `
                         "whiteSpace": "pre",
                       }
                     }
-                  >
-                    
-                  </div>
+                  />
                 </div>
               </div>
             </div>
diff --git a/packages/volto/src/components/manage/Widgets/__snapshots__/UrlWidget.test.jsx.snap b/packages/volto/src/components/manage/Widgets/__snapshots__/UrlWidget.test.jsx.snap
index 3695fbc0c9..7b3e2e5222 100644
--- a/packages/volto/src/components/manage/Widgets/__snapshots__/UrlWidget.test.jsx.snap
+++ b/packages/volto/src/components/manage/Widgets/__snapshots__/UrlWidget.test.jsx.snap
@@ -1,77 +1,61 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders an url widget component 1`] = `
-<div
-  className="inline field url wide field-wrapper-test-url"
->
+<div>
   <div
-    className="ui grid"
+    class="inline field url wide field-wrapper-test-url"
   >
     <div
-      className="stretched row"
+      class="ui grid"
     >
       <div
-        className="four wide column"
+        class="stretched row"
       >
         <div
-          className="wrapper"
+          class="four wide column"
         >
-          <label
-            htmlFor="field-test-url"
-            id="fieldset-default-field-label-test-url"
+          <div
+            class="wrapper"
           >
-            My Url
-          </label>
+            <label
+              for="field-test-url"
+              id="fieldset-default-field-label-test-url"
+            >
+              My Url
+            </label>
+          </div>
         </div>
-      </div>
-      <div
-        className="eight wide column"
-      >
         <div
-          className="wrapper"
+          class="eight wide column"
         >
           <div
-            className="ui input"
+            class="wrapper"
           >
-            <input
-              id="field-test-url"
-              maxLength={null}
-              minLength={null}
-              name="test-url"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onClick={[Function]}
-              type="url"
-              value=""
-            />
-          </div>
-          <div
-            className="ui buttons"
-          >
-            <button
-              aria-label="openUrlBrowser"
-              className="ui basic icon button"
-              onClick={[Function]}
+            <div
+              class="ui input"
             >
-              <svg
-                className="icon"
-                dangerouslySetInnerHTML={
-                  Object {
-                    "__html": undefined,
-                  }
-                }
-                onClick={null}
-                style={
-                  Object {
-                    "fill": "currentColor",
-                    "height": "24px",
-                    "width": "auto",
-                  }
-                }
-                viewBox=""
-                xmlns=""
+              <input
+                id="field-test-url"
+                name="test-url"
+                type="url"
+                value=""
               />
-            </button>
+            </div>
+            <div
+              class="ui buttons"
+            >
+              <button
+                aria-label="openUrlBrowser"
+                class="ui basic icon button"
+              >
+                <svg
+                  class="icon"
+                  style="height: 24px; width: auto; fill: currentColor;"
+                  viewBox=""
+                  xmlns=""
+                />
+              </button>
+            </div>
           </div>
         </div>
       </div>
diff --git a/packages/volto/src/components/manage/Widgets/__snapshots__/VocabularyTermsWidget.test.jsx.snap b/packages/volto/src/components/manage/Widgets/__snapshots__/VocabularyTermsWidget.test.jsx.snap
index 7fbf01c87a..1874373aa8 100644
--- a/packages/volto/src/components/manage/Widgets/__snapshots__/VocabularyTermsWidget.test.jsx.snap
+++ b/packages/volto/src/components/manage/Widgets/__snapshots__/VocabularyTermsWidget.test.jsx.snap
@@ -1,386 +1,257 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders a dictionary widget component 1`] = `
-<div
-  className="inline field vocabularytermswidget dictwidget field-wrapper-test-dict"
->
+<div>
   <div
-    className="ui grid"
+    class="inline field vocabularytermswidget dictwidget field-wrapper-test-dict"
   >
     <div
-      className="stretched row"
+      class="ui grid"
     >
       <div
-        className="four wide column"
+        class="stretched row"
       >
         <div
-          className="wrapper"
+          class="four wide column"
         >
-          <label
-            htmlFor="field-test-dict"
-            id="fieldset-default-field-label-test-dict"
+          <div
+            class="wrapper"
           >
-            My Vocabulary
-          </label>
+            <label
+              for="field-test-dict"
+              id="fieldset-default-field-label-test-dict"
+            >
+              My Vocabulary
+            </label>
+          </div>
         </div>
-      </div>
-      <div
-        className="eight wide column"
-      >
         <div
-          className="add-item-button-wrapper"
+          class="eight wide column"
         >
-          <button
-            aria-label="Vocabulary term"
-            className="ui button"
-            onClick={[Function]}
+          <div
+            class="add-item-button-wrapper"
           >
-            <svg
-              className="icon"
-              dangerouslySetInnerHTML={
-                Object {
-                  "__html": undefined,
-                }
-              }
-              onClick={null}
-              style={
-                Object {
-                  "fill": "currentColor",
-                  "height": "18px",
-                  "width": "auto",
-                }
-              }
-              viewBox=""
-              xmlns=""
-            />
-            Add term
-          </button>
-        </div>
-        <div
-          data-rbd-droppable-context-id="0"
-          data-rbd-droppable-id="id-0"
-          style={
-            Object {
-              "position": "relative",
-            }
-          }
-        >
+            <button
+              aria-label="Vocabulary term"
+              class="ui button"
+            >
+              <svg
+                class="icon"
+                style="height: 18px; width: auto; fill: currentColor;"
+                viewBox=""
+                xmlns=""
+              />
+              Add term
+            </button>
+          </div>
           <div
-            className="vocabularyterm"
-            data-rbd-draggable-context-id="0"
-            data-rbd-draggable-id="talk"
-            onTransitionEnd={null}
-            style={
-              Object {
-                "transform": null,
-                "transition": null,
-              }
-            }
+            data-rbd-droppable-context-id="0"
+            data-rbd-droppable-id="id-0"
+            style="position: relative;"
           >
             <div
-              style={
-                Object {
-                  "alignItems": "center",
-                  "display": "flex",
-                }
-              }
+              class="vocabularyterm"
+              data-rbd-draggable-context-id="0"
+              data-rbd-draggable-id="talk"
             >
               <div
-                aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                className="draghandlewrapper"
-                data-rbd-drag-handle-context-id="0"
-                data-rbd-drag-handle-draggable-id="talk"
-                draggable={false}
-                onDragStart={[Function]}
-                role="button"
-                tabIndex={0}
-              >
-                <svg
-                  className="icon"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "18px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </div>
-              <div
-                className="ui drag block inner"
+                style="align-items: center; display: flex;"
               >
                 <div
-                  className="mocked-default-widget"
-                  id="mocked-field-en-0-test-dict-talk"
+                  aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                  class="draghandlewrapper"
+                  data-rbd-drag-handle-context-id="0"
+                  data-rbd-drag-handle-draggable-id="talk"
+                  draggable="false"
+                  role="button"
+                  tabindex="0"
                 >
-                  English
-                   - 
-                  No description
+                  <svg
+                    class="icon"
+                    style="height: 18px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
                 </div>
                 <div
-                  className="mocked-default-widget"
-                  id="mocked-field-de-1-test-dict-talk"
+                  class="ui drag block inner"
                 >
-                  Deutsch
-                   - 
-                  No description
+                  <div
+                    class="mocked-default-widget"
+                    id="mocked-field-en-0-test-dict-talk"
+                  >
+                    English
+                     - 
+                    No description
+                  </div>
+                  <div
+                    class="mocked-default-widget"
+                    id="mocked-field-de-1-test-dict-talk"
+                  >
+                    Deutsch
+                     - 
+                    No description
+                  </div>
+                  <div
+                    class="mocked-default-widget"
+                    id="mocked-field-it-2-test-dict-talk"
+                  >
+                    Italiano
+                     - 
+                    No description
+                  </div>
                 </div>
-                <div
-                  className="mocked-default-widget"
-                  id="mocked-field-it-2-test-dict-talk"
-                >
-                  Italiano
-                   - 
-                  No description
+                <div>
+                  <button
+                    aria-label="Remove term #talk"
+                    class="ui basic icon button delete-button"
+                    title="Remove term"
+                  >
+                    <svg
+                      class="icon"
+                      style="height: 20px; width: auto; fill: #e40166;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
                 </div>
               </div>
-              <div>
-                <button
-                  aria-label="Remove term #talk"
-                  className="ui basic icon button delete-button"
-                  onClick={[Function]}
-                  title="Remove term"
-                >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "#e40166",
-                        "height": "20px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-              </div>
             </div>
-          </div>
-          <div
-            className="vocabularyterm"
-            data-rbd-draggable-context-id="0"
-            data-rbd-draggable-id="keynote"
-            onTransitionEnd={null}
-            style={
-              Object {
-                "transform": null,
-                "transition": null,
-              }
-            }
-          >
             <div
-              style={
-                Object {
-                  "alignItems": "center",
-                  "display": "flex",
-                }
-              }
+              class="vocabularyterm"
+              data-rbd-draggable-context-id="0"
+              data-rbd-draggable-id="keynote"
             >
               <div
-                aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                className="draghandlewrapper"
-                data-rbd-drag-handle-context-id="0"
-                data-rbd-drag-handle-draggable-id="keynote"
-                draggable={false}
-                onDragStart={[Function]}
-                role="button"
-                tabIndex={0}
-              >
-                <svg
-                  className="icon"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "18px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </div>
-              <div
-                className="ui drag block inner"
+                style="align-items: center; display: flex;"
               >
                 <div
-                  className="mocked-default-widget"
-                  id="mocked-field-en-0-test-dict-keynote"
+                  aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                  class="draghandlewrapper"
+                  data-rbd-drag-handle-context-id="0"
+                  data-rbd-drag-handle-draggable-id="keynote"
+                  draggable="false"
+                  role="button"
+                  tabindex="0"
                 >
-                  English
-                   - 
-                  No description
+                  <svg
+                    class="icon"
+                    style="height: 18px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
                 </div>
                 <div
-                  className="mocked-default-widget"
-                  id="mocked-field-de-1-test-dict-keynote"
+                  class="ui drag block inner"
                 >
-                  Deutsch
-                   - 
-                  No description
+                  <div
+                    class="mocked-default-widget"
+                    id="mocked-field-en-0-test-dict-keynote"
+                  >
+                    English
+                     - 
+                    No description
+                  </div>
+                  <div
+                    class="mocked-default-widget"
+                    id="mocked-field-de-1-test-dict-keynote"
+                  >
+                    Deutsch
+                     - 
+                    No description
+                  </div>
+                  <div
+                    class="mocked-default-widget"
+                    id="mocked-field-it-2-test-dict-keynote"
+                  >
+                    Italiano
+                     - 
+                    No description
+                  </div>
                 </div>
-                <div
-                  className="mocked-default-widget"
-                  id="mocked-field-it-2-test-dict-keynote"
-                >
-                  Italiano
-                   - 
-                  No description
+                <div>
+                  <button
+                    aria-label="Remove term #keynote"
+                    class="ui basic icon button delete-button"
+                    title="Remove term"
+                  >
+                    <svg
+                      class="icon"
+                      style="height: 20px; width: auto; fill: #e40166;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
                 </div>
               </div>
-              <div>
-                <button
-                  aria-label="Remove term #keynote"
-                  className="ui basic icon button delete-button"
-                  onClick={[Function]}
-                  title="Remove term"
-                >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "#e40166",
-                        "height": "20px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-              </div>
             </div>
-          </div>
-          <div
-            className="vocabularyterm"
-            data-rbd-draggable-context-id="0"
-            data-rbd-draggable-id="lightning-talk"
-            onTransitionEnd={null}
-            style={
-              Object {
-                "transform": null,
-                "transition": null,
-              }
-            }
-          >
             <div
-              style={
-                Object {
-                  "alignItems": "center",
-                  "display": "flex",
-                }
-              }
+              class="vocabularyterm"
+              data-rbd-draggable-context-id="0"
+              data-rbd-draggable-id="lightning-talk"
             >
               <div
-                aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                className="draghandlewrapper"
-                data-rbd-drag-handle-context-id="0"
-                data-rbd-drag-handle-draggable-id="lightning-talk"
-                draggable={false}
-                onDragStart={[Function]}
-                role="button"
-                tabIndex={0}
-              >
-                <svg
-                  className="icon"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "18px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </div>
-              <div
-                className="ui drag block inner"
+                style="align-items: center; display: flex;"
               >
                 <div
-                  className="mocked-default-widget"
-                  id="mocked-field-en-0-test-dict-lightning-talk"
+                  aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                  class="draghandlewrapper"
+                  data-rbd-drag-handle-context-id="0"
+                  data-rbd-drag-handle-draggable-id="lightning-talk"
+                  draggable="false"
+                  role="button"
+                  tabindex="0"
                 >
-                  English
-                   - 
-                  No description
+                  <svg
+                    class="icon"
+                    style="height: 18px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
                 </div>
                 <div
-                  className="mocked-default-widget"
-                  id="mocked-field-de-1-test-dict-lightning-talk"
+                  class="ui drag block inner"
                 >
-                  Deutsch
-                   - 
-                  No description
+                  <div
+                    class="mocked-default-widget"
+                    id="mocked-field-en-0-test-dict-lightning-talk"
+                  >
+                    English
+                     - 
+                    No description
+                  </div>
+                  <div
+                    class="mocked-default-widget"
+                    id="mocked-field-de-1-test-dict-lightning-talk"
+                  >
+                    Deutsch
+                     - 
+                    No description
+                  </div>
+                  <div
+                    class="mocked-default-widget"
+                    id="mocked-field-it-2-test-dict-lightning-talk"
+                  >
+                    Italiano
+                     - 
+                    No description
+                  </div>
                 </div>
-                <div
-                  className="mocked-default-widget"
-                  id="mocked-field-it-2-test-dict-lightning-talk"
-                >
-                  Italiano
-                   - 
-                  No description
+                <div>
+                  <button
+                    aria-label="Remove term #lightning-talk"
+                    class="ui basic icon button delete-button"
+                    title="Remove term"
+                  >
+                    <svg
+                      class="icon"
+                      style="height: 20px; width: auto; fill: #e40166;"
+                      viewBox=""
+                      xmlns=""
+                    />
+                  </button>
                 </div>
               </div>
-              <div>
-                <button
-                  aria-label="Remove term #lightning-talk"
-                  className="ui basic icon button delete-button"
-                  onClick={[Function]}
-                  title="Remove term"
-                >
-                  <svg
-                    className="icon"
-                    dangerouslySetInnerHTML={
-                      Object {
-                        "__html": undefined,
-                      }
-                    }
-                    onClick={null}
-                    style={
-                      Object {
-                        "fill": "#e40166",
-                        "height": "20px",
-                        "width": "auto",
-                      }
-                    }
-                    viewBox=""
-                    xmlns=""
-                  />
-                </button>
-              </div>
             </div>
           </div>
         </div>
diff --git a/packages/volto/src/components/theme/Comments/Comments.jsx b/packages/volto/src/components/theme/Comments/Comments.jsx
index 729195907d..5e6f22a773 100644
--- a/packages/volto/src/components/theme/Comments/Comments.jsx
+++ b/packages/volto/src/components/theme/Comments/Comments.jsx
@@ -1,7 +1,7 @@
 import { useEffect, useState, useMemo, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { useDispatch, useSelector, shallowEqual } from 'react-redux';
 import { compose } from 'redux';
 import { Button, Comment, Container, Icon } from 'semantic-ui-react';
@@ -356,19 +356,18 @@ const Comments = (props) => {
         </Button>
       )}
 
-      {replyTo && (
-        <Portal
-          node={document && document.getElementById(`reply-place-${replyTo}`)}
-        >
+      {replyTo &&
+        document &&
+        createPortal(
           <Form
             onSubmit={onSubmit}
             onCancel={onEditCancel}
             submitLabel={intl.formatMessage(messages.comment)}
             resetAfterSubmit
             schema={makeFormSchema(intl)}
-          />
-        </Portal>
-      )}
+          />,
+          document.getElementById(`reply-place-${replyTo}`),
+        )}
     </Container>
   );
 };
diff --git a/packages/volto/src/components/theme/Component/Component.test.jsx b/packages/volto/src/components/theme/Component/Component.test.jsx
index c55175b062..1a9b3633bb 100644
--- a/packages/volto/src/components/theme/Component/Component.test.jsx
+++ b/packages/volto/src/components/theme/Component/Component.test.jsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import '@testing-library/jest-dom/extend-expect';
 import { render } from '@testing-library/react';
 import Component from './Component';
 import config from '@plone/volto/registry';
diff --git a/packages/volto/src/components/theme/ContactForm/ContactForm.jsx b/packages/volto/src/components/theme/ContactForm/ContactForm.jsx
index bc88659f2b..480b9fdb8e 100644
--- a/packages/volto/src/components/theme/ContactForm/ContactForm.jsx
+++ b/packages/volto/src/components/theme/ContactForm/ContactForm.jsx
@@ -1,5 +1,5 @@
 import { useCallback, useEffect } from 'react';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Container, Message, Icon } from 'semantic-ui-react';
 import { defineMessages, useIntl } from 'react-intl';
 import { Link, useHistory, useLocation } from 'react-router-dom';
@@ -149,8 +149,8 @@ const ContactFormComponent = () => {
             required: ['from', 'message'],
           }}
         />
-        {isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {isClient &&
+          createPortal(
             <Toolbar
               pathname={pathname}
               hideDefaultViewButtons
@@ -164,9 +164,9 @@ const ContactFormComponent = () => {
                   />
                 </Link>
               }
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     </div>
   );
diff --git a/packages/volto/src/components/theme/ContactForm/ContactForm.test.jsx b/packages/volto/src/components/theme/ContactForm/ContactForm.test.jsx
index ddabf5b5c8..cd38a3a5c9 100644
--- a/packages/volto/src/components/theme/ContactForm/ContactForm.test.jsx
+++ b/packages/volto/src/components/theme/ContactForm/ContactForm.test.jsx
@@ -1,13 +1,13 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter } from 'react-router-dom';
 import ContactForm from './ContactForm';
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../manage/Toolbar/Toolbar', () =>
+  jest.fn(() => <div id="Portal" />),
+);
 
 const mockStore = configureStore();
 describe('Contact form', () => {
@@ -25,15 +25,16 @@ describe('Contact form', () => {
       userSession: {},
       content: {},
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <ContactForm />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders a contact form with error message', () => {
@@ -52,14 +53,15 @@ describe('Contact form', () => {
       userSession: {},
       content: {},
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <ContactForm />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/theme/ContactForm/__snapshots__/ContactForm.test.jsx.snap b/packages/volto/src/components/theme/ContactForm/__snapshots__/ContactForm.test.jsx.snap
index 242fdd5718..32561ac0c3 100644
--- a/packages/volto/src/components/theme/ContactForm/__snapshots__/ContactForm.test.jsx.snap
+++ b/packages/volto/src/components/theme/ContactForm/__snapshots__/ContactForm.test.jsx.snap
@@ -1,154 +1,128 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Contact form renders a contact form 1`] = `
-<div
-  id="contact-form"
->
+<div>
   <div
-    className="ui container"
-    id="view"
+    id="contact-form"
   >
     <div
-      className="ui icon negative attached message"
+      class="ui container"
+      id="view"
     >
-      <i
-        aria-hidden="true"
-        className="warning icon"
-        onClick={[Function]}
-      />
       <div
-        className="content"
+        class="ui icon negative attached message"
       >
+        <i
+          aria-hidden="true"
+          class="warning icon"
+        />
         <div
-          className="header"
+          class="content"
         >
-          Error
+          <div
+            class="header"
+          >
+            Error
+          </div>
         </div>
       </div>
-    </div>
-    <div
-      className="ui container"
-    >
-      <form
-        className="ui form"
-        method="post"
-        onSubmit={[Function]}
+      <div
+        class="ui container"
       >
-        <fieldset
-          className="invisible"
+        <form
+          class="ui form"
+          method="post"
         >
-          <div
-            className="ui raised segments"
+          <fieldset
+            class="invisible"
           >
             <div
-              className="ui segment"
+              class="ui raised segments"
             >
               <div
-                className="ui segment primary"
+                class="ui segment"
               >
-                <h1
-                  style={
-                    Object {
-                      "fontSize": "16px",
-                    }
-                  }
+                <div
+                  class="ui segment primary"
                 >
-                   
-                  Contact form
-                </h1>
-              </div>
-              <div
-                className="mocked-default-widget"
-                id="mocked-field-name"
-              >
-                Name
-                 - 
-                No description
-              </div>
-              <div
-                className="mocked-default-widget"
-                id="mocked-field-from"
-              >
-                From
-                 - 
-                No description
-              </div>
-              <div
-                className="mocked-default-widget"
-                id="mocked-field-subject"
-              >
-                Subject
-                 - 
-                No description
+                  <h1
+                    style="font-size: 16px;"
+                  >
+                     
+                    Contact form
+                  </h1>
+                </div>
+                <div
+                  class="mocked-default-widget"
+                  id="mocked-field-name"
+                >
+                  Name
+                   - 
+                  No description
+                </div>
+                <div
+                  class="mocked-default-widget"
+                  id="mocked-field-from"
+                >
+                  From
+                   - 
+                  No description
+                </div>
+                <div
+                  class="mocked-default-widget"
+                  id="mocked-field-subject"
+                >
+                  Subject
+                   - 
+                  No description
+                </div>
+                <div
+                  class="mocked-textarea-widget"
+                  id="mocked-field-message"
+                >
+                  Message
+                   - 
+                  No description
+                </div>
               </div>
               <div
-                className="mocked-textarea-widget"
-                id="mocked-field-message"
+                class="ui clearing segment actions"
               >
-                Message
-                 - 
-                No description
+                <button
+                  aria-label="Send"
+                  class="ui basic primary right floated button"
+                  title="Send"
+                  type="submit"
+                >
+                  <svg
+                    class="icon circled"
+                    style="height: 30px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
+                </button>
+                <button
+                  aria-label="Cancel"
+                  class="ui basic secondary right floated button"
+                  title="Cancel"
+                >
+                  <svg
+                    class="icon circled"
+                    style="height: 30px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
+                </button>
               </div>
             </div>
-            <div
-              className="ui clearing segment actions"
-            >
-              <button
-                aria-label="Send"
-                className="ui basic primary right floated button"
-                onClick={[Function]}
-                title="Send"
-                type="submit"
-              >
-                <svg
-                  className="icon circled"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "30px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </button>
-              <button
-                aria-label="Cancel"
-                className="ui basic secondary right floated button"
-                onClick={[Function]}
-                title="Cancel"
-              >
-                <svg
-                  className="icon circled"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "30px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </button>
-            </div>
-          </div>
-        </fieldset>
-      </form>
+          </fieldset>
+        </form>
+      </div>
     </div>
+  </div>
+  <div
+    id="toolbar"
+  >
     <div
       id="Portal"
     />
@@ -157,157 +131,131 @@ exports[`Contact form renders a contact form 1`] = `
 `;
 
 exports[`Contact form renders a contact form with error message 1`] = `
-<div
-  id="contact-form"
->
+<div>
   <div
-    className="ui container"
-    id="view"
+    id="contact-form"
   >
     <div
-      className="ui icon negative attached message"
+      class="ui container"
+      id="view"
     >
-      <i
-        aria-hidden="true"
-        className="warning icon"
-        onClick={[Function]}
-      />
       <div
-        className="content"
+        class="ui icon negative attached message"
       >
+        <i
+          aria-hidden="true"
+          class="warning icon"
+        />
         <div
-          className="header"
+          class="content"
         >
-          Error
+          <div
+            class="header"
+          >
+            Error
+          </div>
+          <p>
+            Error foo
+          </p>
         </div>
-        <p>
-          Error foo
-        </p>
       </div>
-    </div>
-    <div
-      className="ui container"
-    >
-      <form
-        className="ui form"
-        method="post"
-        onSubmit={[Function]}
+      <div
+        class="ui container"
       >
-        <fieldset
-          className="invisible"
+        <form
+          class="ui form"
+          method="post"
         >
-          <div
-            className="ui raised segments"
+          <fieldset
+            class="invisible"
           >
             <div
-              className="ui segment"
+              class="ui raised segments"
             >
               <div
-                className="ui segment primary"
+                class="ui segment"
               >
-                <h1
-                  style={
-                    Object {
-                      "fontSize": "16px",
-                    }
-                  }
+                <div
+                  class="ui segment primary"
                 >
-                   
-                  Contact form
-                </h1>
-              </div>
-              <div
-                className="mocked-default-widget"
-                id="mocked-field-name"
-              >
-                Name
-                 - 
-                No description
-              </div>
-              <div
-                className="mocked-default-widget"
-                id="mocked-field-from"
-              >
-                From
-                 - 
-                No description
-              </div>
-              <div
-                className="mocked-default-widget"
-                id="mocked-field-subject"
-              >
-                Subject
-                 - 
-                No description
+                  <h1
+                    style="font-size: 16px;"
+                  >
+                     
+                    Contact form
+                  </h1>
+                </div>
+                <div
+                  class="mocked-default-widget"
+                  id="mocked-field-name"
+                >
+                  Name
+                   - 
+                  No description
+                </div>
+                <div
+                  class="mocked-default-widget"
+                  id="mocked-field-from"
+                >
+                  From
+                   - 
+                  No description
+                </div>
+                <div
+                  class="mocked-default-widget"
+                  id="mocked-field-subject"
+                >
+                  Subject
+                   - 
+                  No description
+                </div>
+                <div
+                  class="mocked-textarea-widget"
+                  id="mocked-field-message"
+                >
+                  Message
+                   - 
+                  No description
+                </div>
               </div>
               <div
-                className="mocked-textarea-widget"
-                id="mocked-field-message"
+                class="ui clearing segment actions"
               >
-                Message
-                 - 
-                No description
+                <button
+                  aria-label="Send"
+                  class="ui basic primary right floated button"
+                  title="Send"
+                  type="submit"
+                >
+                  <svg
+                    class="icon circled"
+                    style="height: 30px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
+                </button>
+                <button
+                  aria-label="Cancel"
+                  class="ui basic secondary right floated button"
+                  title="Cancel"
+                >
+                  <svg
+                    class="icon circled"
+                    style="height: 30px; width: auto; fill: currentColor;"
+                    viewBox=""
+                    xmlns=""
+                  />
+                </button>
               </div>
             </div>
-            <div
-              className="ui clearing segment actions"
-            >
-              <button
-                aria-label="Send"
-                className="ui basic primary right floated button"
-                onClick={[Function]}
-                title="Send"
-                type="submit"
-              >
-                <svg
-                  className="icon circled"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "30px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </button>
-              <button
-                aria-label="Cancel"
-                className="ui basic secondary right floated button"
-                onClick={[Function]}
-                title="Cancel"
-              >
-                <svg
-                  className="icon circled"
-                  dangerouslySetInnerHTML={
-                    Object {
-                      "__html": undefined,
-                    }
-                  }
-                  onClick={null}
-                  style={
-                    Object {
-                      "fill": "currentColor",
-                      "height": "30px",
-                      "width": "auto",
-                    }
-                  }
-                  viewBox=""
-                  xmlns=""
-                />
-              </button>
-            </div>
-          </div>
-        </fieldset>
-      </form>
+          </fieldset>
+        </form>
+      </div>
     </div>
+  </div>
+  <div
+    id="toolbar"
+  >
     <div
       id="Portal"
     />
diff --git a/packages/volto/src/components/theme/Footer/Footer.test.jsx b/packages/volto/src/components/theme/Footer/Footer.test.jsx
index c28c61a0f3..3cc17ee78b 100644
--- a/packages/volto/src/components/theme/Footer/Footer.test.jsx
+++ b/packages/volto/src/components/theme/Footer/Footer.test.jsx
@@ -3,7 +3,6 @@ import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter } from 'react-router-dom';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
 import Footer from './Footer';
 
 const mockStore = configureStore();
diff --git a/packages/volto/src/components/theme/Logout/Logout.test.jsx b/packages/volto/src/components/theme/Logout/Logout.test.jsx
index a008fb7f5f..c4a23463bc 100644
--- a/packages/volto/src/components/theme/Logout/Logout.test.jsx
+++ b/packages/volto/src/components/theme/Logout/Logout.test.jsx
@@ -1,8 +1,9 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-redux';
 import { IntlProvider } from 'react-intl';
+import { MemoryRouter } from 'react-router-dom';
 
 import Logout from './Logout';
 
@@ -21,14 +22,16 @@ describe('Logout', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <IntlProvider locale="en">
-          <Logout location={{ pathname: '' }} />
+          <MemoryRouter>
+            <Logout location={{ pathname: '' }} />
+          </MemoryRouter>
         </IntlProvider>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/theme/Logout/__snapshots__/Logout.test.jsx.snap b/packages/volto/src/components/theme/Logout/__snapshots__/Logout.test.jsx.snap
index 2884e0d677..eb1076578a 100644
--- a/packages/volto/src/components/theme/Logout/__snapshots__/Logout.test.jsx.snap
+++ b/packages/volto/src/components/theme/Logout/__snapshots__/Logout.test.jsx.snap
@@ -1,3 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Logout renders a logout component 1`] = `<div />`;
+exports[`Logout renders a logout component 1`] = `
+<div>
+  <div />
+</div>
+`;
diff --git a/packages/volto/src/components/theme/Navigation/__snapshots__/ContextNavigation.test.jsx.snap b/packages/volto/src/components/theme/Navigation/__snapshots__/ContextNavigation.test.jsx.snap
index 3ca843db04..9d747a5f8b 100644
--- a/packages/volto/src/components/theme/Navigation/__snapshots__/ContextNavigation.test.jsx.snap
+++ b/packages/volto/src/components/theme/Navigation/__snapshots__/ContextNavigation.test.jsx.snap
@@ -25,11 +25,8 @@ exports[`ContextNavigation renders a navigation component with an active item 1`
             class="contenttype-undefined"
             href="/front-page"
           >
-            
             Welcome to Plone!
-            
           </a>
-          
         </div>
       </div>
       <div
@@ -43,7 +40,6 @@ exports[`ContextNavigation renders a navigation component with an active item 1`
             class="contenttype-undefined in_path"
             href="/blog"
           >
-            
             Blog
             <div
               class="content active-indicator"
@@ -56,7 +52,6 @@ exports[`ContextNavigation renders a navigation component with an active item 1`
               />
             </div>
           </a>
-          
         </div>
       </div>
       <div
@@ -70,11 +65,8 @@ exports[`ContextNavigation renders a navigation component with an active item 1`
             class="contenttype-undefined"
             href="/users"
           >
-            
             Users
-            
           </a>
-          
         </div>
       </div>
     </div>
@@ -108,11 +100,8 @@ exports[`ContextNavigation renders a navigation component with an active item wh
             href="/folder2/folder21"
             title=""
           >
-            
             Folder21
-            
           </a>
-          
         </div>
       </div>
       <div
@@ -127,11 +116,8 @@ exports[`ContextNavigation renders a navigation component with an active item wh
             href="/folder2/folder21/doc211"
             title=""
           >
-            
             Doc211
-            
           </a>
-          
         </div>
       </div>
       <div
@@ -146,7 +132,6 @@ exports[`ContextNavigation renders a navigation component with an active item wh
             href="/folder2/folder21/doc212"
             title=""
           >
-            
             Doc212
             <div
               class="content active-indicator"
@@ -159,7 +144,6 @@ exports[`ContextNavigation renders a navigation component with an active item wh
               />
             </div>
           </a>
-          
         </div>
       </div>
     </div>
@@ -167,11 +151,7 @@ exports[`ContextNavigation renders a navigation component with an active item wh
 </div>
 `;
 
-exports[`ContextNavigation renders a navigation component with only one active item even if there are similar item names 1`] = `
-<div>
-  
-</div>
-`;
+exports[`ContextNavigation renders a navigation component with only one active item even if there are similar item names 1`] = `<div />`;
 
 exports[`ContextNavigation renders a navigation slot component without active items 1`] = `
 <div>
@@ -198,11 +178,8 @@ exports[`ContextNavigation renders a navigation slot component without active it
             class="contenttype-undefined"
             href="/front-page"
           >
-            
             Welcome to Plone!
-            
           </a>
-          
         </div>
       </div>
       <div
@@ -216,11 +193,8 @@ exports[`ContextNavigation renders a navigation slot component without active it
             class="contenttype-undefined"
             href="/blog"
           >
-            
             Blog
-            
           </a>
-          
         </div>
       </div>
       <div
@@ -234,11 +208,8 @@ exports[`ContextNavigation renders a navigation slot component without active it
             class="contenttype-undefined"
             href="/users"
           >
-            
             Users
-            
           </a>
-          
         </div>
       </div>
     </div>
diff --git a/packages/volto/src/components/theme/Pagination/__snapshots__/Pagination.test.jsx.snap b/packages/volto/src/components/theme/Pagination/__snapshots__/Pagination.test.jsx.snap
index d7816b0a8e..70e8398a6f 100644
--- a/packages/volto/src/components/theme/Pagination/__snapshots__/Pagination.test.jsx.snap
+++ b/packages/volto/src/components/theme/Pagination/__snapshots__/Pagination.test.jsx.snap
@@ -30,7 +30,6 @@ exports[`Pagination renders no pagination when only 1 page 1`] = `
         viewBox=""
         xmlns=""
       />
-      
     </a>
     <a
       className="item"
@@ -73,7 +72,6 @@ exports[`Pagination renders page size options when specified 1`] = `
         viewBox=""
         xmlns=""
       />
-      
     </a>
     <a
       className="item"
@@ -148,7 +146,6 @@ exports[`Pagination renders pagination when multiple pages are specified 1`] = `
         viewBox=""
         xmlns=""
       />
-      
     </a>
     <a
       className="item"
@@ -234,7 +231,6 @@ exports[`Pagination renders pagination when multiple pages are specified 1`] = `
         viewBox=""
         xmlns=""
       />
-      
     </a>
   </div>
 </div>
diff --git a/packages/volto/src/components/theme/Search/Search.jsx b/packages/volto/src/components/theme/Search/Search.jsx
index e6d0341662..e5b9c17e74 100644
--- a/packages/volto/src/components/theme/Search/Search.jsx
+++ b/packages/volto/src/components/theme/Search/Search.jsx
@@ -10,7 +10,7 @@ import { compose } from 'redux';
 import { UniversalLink } from '@plone/volto/components';
 import { asyncConnect } from '@plone/volto/helpers';
 import { FormattedMessage } from 'react-intl';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { Container, Pagination, Button, Header } from 'semantic-ui-react';
 import qs from 'query-string';
 import classNames from 'classnames';
@@ -309,15 +309,15 @@ class Search extends Component {
             </section>
           </article>
         </div>
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
+        {this.state.isClient &&
+          createPortal(
             <Toolbar
               pathname={this.props.pathname}
               hideDefaultViewButtons
               inner={<span />}
-            />
-          </Portal>
-        )}
+            />,
+            document.getElementById('toolbar'),
+          )}
       </Container>
     );
   }
diff --git a/packages/volto/src/components/theme/Search/Search.test.jsx b/packages/volto/src/components/theme/Search/Search.test.jsx
index b5d2416169..86a5a6cb00 100644
--- a/packages/volto/src/components/theme/Search/Search.test.jsx
+++ b/packages/volto/src/components/theme/Search/Search.test.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 import { MemoryRouter } from 'react-router-dom';
@@ -8,9 +8,10 @@ import { __test__ as Search } from './Search';
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../manage/Toolbar/Toolbar', () =>
+  jest.fn(() => <div id="Portal" />),
+);
+
 jest.mock('./SearchTags', () => jest.fn(() => <div id="search-tags" />));
 
 describe('Search', () => {
@@ -27,15 +28,16 @@ describe('Search', () => {
     const history = {
       location: { pathname: '/blog', search: '?SearchableText=blog' },
     };
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <Search history={history} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders a search component', () => {
@@ -59,14 +61,15 @@ describe('Search', () => {
     const history = {
       location: { pathname: '/blog', search: '?SearchableText=blog' },
     };
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <MemoryRouter>
           <Search history={history} />
+          <div id="toolbar"></div>
         </MemoryRouter>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 });
diff --git a/packages/volto/src/components/theme/Search/__snapshots__/Search.test.jsx.snap b/packages/volto/src/components/theme/Search/__snapshots__/Search.test.jsx.snap
index c65a7fb602..3f2a0de48f 100644
--- a/packages/volto/src/components/theme/Search/__snapshots__/Search.test.jsx.snap
+++ b/packages/volto/src/components/theme/Search/__snapshots__/Search.test.jsx.snap
@@ -1,120 +1,126 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Search renders a search component 1`] = `
-<div
-  className="ui container"
-  id="page-search"
->
+<div>
   <div
-    className="container"
+    class="ui container"
+    id="page-search"
   >
-    <article
-      id="content"
+    <div
+      class="container"
     >
-      <header>
-        <h1
-          className="documentFirstHeading"
-        >
-          Search results for 
-          <q>
-            blog
-          </q>
-        </h1>
-        <div
-          id="search-tags"
-        />
-        <div>
-          No results found
-        </div>
-      </header>
-      <section
-        id="content-core"
+      <article
+        id="content"
       >
-        <article
-          className="tileItem"
-        >
-          <h2
-            className="tileHeadline"
+        <header>
+          <h1
+            class="documentFirstHeading"
           >
-            <a
-              className="summary url"
-              href="/blog"
-              onClick={[Function]}
-              target={null}
-              title="Folder"
-            >
-              Blog
-            </a>
-          </h2>
+            Search results for 
+            <q>
+              blog
+            </q>
+          </h1>
           <div
-            className="tileBody"
-          >
-            <span
-              className="description"
-            >
-              My blog
-            </span>
+            id="search-tags"
+          />
+          <div>
+            No results found
           </div>
-          <div
-            className="tileFooter"
+        </header>
+        <section
+          id="content-core"
+        >
+          <article
+            class="tileItem"
           >
-            <a
-              className={null}
-              href="/blog"
-              onClick={[Function]}
-              target={null}
-              title={null}
+            <h2
+              class="tileHeadline"
             >
-              Read More…
-            </a>
-          </div>
-          <div
-            className="visualClear"
-          />
-        </article>
-      </section>
-    </article>
+              <a
+                class="summary url"
+                href="/blog"
+                title="Folder"
+              >
+                Blog
+              </a>
+            </h2>
+            <div
+              class="tileBody"
+            >
+              <span
+                class="description"
+              >
+                My blog
+              </span>
+            </div>
+            <div
+              class="tileFooter"
+            >
+              <a
+                href="/blog"
+              >
+                Read More…
+              </a>
+            </div>
+            <div
+              class="visualClear"
+            />
+          </article>
+        </section>
+      </article>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
 
 exports[`Search renders an empty search component 1`] = `
-<div
-  className="ui container"
-  id="page-search"
->
+<div>
   <div
-    className="container"
+    class="ui container"
+    id="page-search"
   >
-    <article
-      id="content"
+    <div
+      class="container"
     >
-      <header>
-        <h1
-          className="documentFirstHeading"
-        >
-          Search results for 
-          <q>
-            blog
-          </q>
-        </h1>
-        <div
-          id="search-tags"
+      <article
+        id="content"
+      >
+        <header>
+          <h1
+            class="documentFirstHeading"
+          >
+            Search results for 
+            <q>
+              blog
+            </q>
+          </h1>
+          <div
+            id="search-tags"
+          />
+          <div>
+            No results found
+          </div>
+        </header>
+        <section
+          id="content-core"
         />
-        <div>
-          No results found
-        </div>
-      </header>
-      <section
-        id="content-core"
-      />
-    </article>
+      </article>
+    </div>
   </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
diff --git a/packages/volto/src/components/theme/SlotRenderer/SlotRenderer.test.jsx b/packages/volto/src/components/theme/SlotRenderer/SlotRenderer.test.jsx
index 0f09535e5a..ac915dee89 100644
--- a/packages/volto/src/components/theme/SlotRenderer/SlotRenderer.test.jsx
+++ b/packages/volto/src/components/theme/SlotRenderer/SlotRenderer.test.jsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import '@testing-library/jest-dom/extend-expect';
 import { render } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import SlotRenderer from './SlotRenderer';
diff --git a/packages/volto/src/components/theme/View/View.jsx b/packages/volto/src/components/theme/View/View.jsx
index ae9d97b53b..418897e5f0 100644
--- a/packages/volto/src/components/theme/View/View.jsx
+++ b/packages/volto/src/components/theme/View/View.jsx
@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Redirect } from 'react-router-dom';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { injectIntl } from 'react-intl';
 import qs from 'query-string';
 
@@ -269,11 +269,11 @@ class View extends Component {
         {this.props.content.allow_discussion && (
           <Comments pathname={this.props.pathname} />
         )}
-        {this.state.isClient && (
-          <Portal node={document.getElementById('toolbar')}>
-            <Toolbar pathname={this.props.pathname} inner={<span />} />
-          </Portal>
-        )}
+        {this.state.isClient &&
+          createPortal(
+            <Toolbar pathname={this.props.pathname} inner={<span />} />,
+            document.getElementById('toolbar'),
+          )}
       </div>
     );
   }
diff --git a/packages/volto/src/components/theme/View/View.test.jsx b/packages/volto/src/components/theme/View/View.test.jsx
index 0fd4580099..0ecb074695 100644
--- a/packages/volto/src/components/theme/View/View.test.jsx
+++ b/packages/volto/src/components/theme/View/View.test.jsx
@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import configureStore from 'redux-mock-store';
 import { Provider } from 'react-intl-redux';
 
@@ -25,9 +25,10 @@ beforeAll(() => {
 
 const mockStore = configureStore();
 
-jest.mock('react-portal', () => ({
-  Portal: jest.fn(() => <div id="Portal" />),
-}));
+jest.mock('../../manage/Toolbar/Toolbar', () =>
+  jest.fn(() => <div id="Portal" />),
+);
+
 jest.mock('../SocialSharing/SocialSharing', () =>
   jest.fn(() => <div id="SocialSharing" />),
 );
@@ -150,13 +151,14 @@ describe('View', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <View location={{ pathname: '/test' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders a summary view', () => {
@@ -170,13 +172,14 @@ describe('View', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <View location={{ pathname: '/test' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders a tabular view', () => {
@@ -190,13 +193,14 @@ describe('View', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <View location={{ pathname: '/test' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders a document view', () => {
@@ -210,13 +214,14 @@ describe('View', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { container } = render(
       <Provider store={store}>
         <View location={{ pathname: '/test' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
-    const json = component.toJSON();
-    expect(json).toMatchSnapshot();
+
+    expect(container).toMatchSnapshot();
   });
 
   it('renders a new view element if the @id changed', () => {
@@ -238,16 +243,18 @@ describe('View', () => {
         messages: {},
       },
     });
-    const component = renderer.create(
+    const { rerender } = render(
       <Provider store={store}>
         <View location={{ pathname: '/a' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
     expect(instanceCount).toBe(1);
     store.getState().content.data['@id'] = '/b';
-    component.update(
+    rerender(
       <Provider store={store}>
         <View location={{ pathname: '/b' }} />
+        <div id="toolbar"></div>
       </Provider>,
     );
     expect(instanceCount).toBe(2);
diff --git a/packages/volto/src/components/theme/View/__snapshots__/View.test.jsx.snap b/packages/volto/src/components/theme/View/__snapshots__/View.test.jsx.snap
index 49a539fd4e..6a915aa342 100644
--- a/packages/volto/src/components/theme/View/__snapshots__/View.test.jsx.snap
+++ b/packages/volto/src/components/theme/View/__snapshots__/View.test.jsx.snap
@@ -1,69 +1,94 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`View renders a document view 1`] = `
-<div
-  id="view"
->
+<div>
   <div
-    id="ContentMetadataTags"
-  />
-  <div
-    id="SlotRenderer"
-  />
-  <div
-    id="DefaultView"
-  />
-  <div
-    id="SlotRenderer"
-  />
+    id="view"
+  >
+    <div
+      id="ContentMetadataTags"
+    />
+    <div
+      id="SlotRenderer"
+    />
+    <div
+      id="DefaultView"
+    />
+    <div
+      id="SlotRenderer"
+    />
+  </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
 
 exports[`View renders a summary view 1`] = `
-<div
-  id="view"
->
-  <div
-    id="ContentMetadataTags"
-  />
-  <div
-    id="SlotRenderer"
-  />
-  <div
-    id="SummaryView"
-  />
+<div>
   <div
-    id="SlotRenderer"
-  />
+    id="view"
+  >
+    <div
+      id="ContentMetadataTags"
+    />
+    <div
+      id="SlotRenderer"
+    />
+    <div
+      id="SummaryView"
+    />
+    <div
+      id="SlotRenderer"
+    />
+  </div>
   <div
-    id="Portal"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
 </div>
 `;
 
 exports[`View renders a tabular view 1`] = `
-<div
-  id="view"
->
+<div>
   <div
-    id="ContentMetadataTags"
-  />
+    id="view"
+  >
+    <div
+      id="ContentMetadataTags"
+    />
+    <div
+      id="SlotRenderer"
+    />
+    <div
+      id="TabularView"
+    />
+    <div
+      id="SlotRenderer"
+    />
+  </div>
   <div
-    id="SlotRenderer"
-  />
-  <div
-    id="TabularView"
-  />
-  <div
-    id="SlotRenderer"
-  />
+    id="toolbar"
+  >
+    <div
+      id="Portal"
+    />
+  </div>
+</div>
+`;
+
+exports[`View renders an empty view 1`] = `
+<div>
+  <span />
   <div
-    id="Portal"
+    id="toolbar"
   />
 </div>
 `;
-
-exports[`View renders an empty view 1`] = `<span />`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/ArrayWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/ArrayWidget.test.js.snap
index 5606114c33..14acae810a 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/ArrayWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/ArrayWidget.test.js.snap
@@ -4,7 +4,6 @@ exports[`ArrayWidget renders a full vocabulary array view widget component 1`] =
 <span
   className="metadata array widget"
 >
-  
   <span>
     Foo
   </span>
@@ -19,7 +18,6 @@ exports[`ArrayWidget renders a full vocabulary array view widget component with
 <span
   className="metadata array widget"
 >
-  
   <span>
     <strong>
       Foo
@@ -38,7 +36,6 @@ exports[`ArrayWidget renders a simple array view widget component 1`] = `
 <span
   className="metadata array widget"
 >
-  
   <span>
     foo
   </span>
@@ -53,7 +50,6 @@ exports[`ArrayWidget renders a vocabulary array view widget component 1`] = `
 <span
   className="metadata array widget"
 >
-  
   <span>
     Foo
   </span>
@@ -64,4 +60,4 @@ exports[`ArrayWidget renders a vocabulary array view widget component 1`] = `
 </span>
 `;
 
-exports[`ArrayWidget renders an empty array view widget component 1`] = `""`;
+exports[`ArrayWidget renders an empty array view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/BooleanWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/BooleanWidget.test.js.snap
index 530cb8978b..6731e6cdbe 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/BooleanWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/BooleanWidget.test.js.snap
@@ -36,4 +36,4 @@ exports[`BooleanWidget renders a boolean true view widget component with childre
 </span>
 `;
 
-exports[`BooleanWidget renders an empty boolean view widget component 1`] = `""`;
+exports[`BooleanWidget renders an empty boolean view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/DateWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/DateWidget.test.js.snap
index 535c64414d..7dfb2d2935 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/DateWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/DateWidget.test.js.snap
@@ -26,4 +26,4 @@ exports[`DateWidget renders a date view widget component with children 1`] = `
 </span>
 `;
 
-exports[`DateWidget renders an empty date view widget component 1`] = `""`;
+exports[`DateWidget renders an empty date view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/DatetimeWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/DatetimeWidget.test.js.snap
index 86947ef154..6f97180b22 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/DatetimeWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/DatetimeWidget.test.js.snap
@@ -26,4 +26,4 @@ exports[`DatetimeWidget renders a date view widget component with children 1`] =
 </span>
 `;
 
-exports[`DatetimeWidget renders an empty date view widget component 1`] = `""`;
+exports[`DatetimeWidget renders an empty date view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/DescriptionWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/DescriptionWidget.test.js.snap
index 61e322ff75..e7b55c5f45 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/DescriptionWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/DescriptionWidget.test.js.snap
@@ -18,4 +18,4 @@ exports[`DescriptionWidget renders a description view widget component with chil
 </p>
 `;
 
-exports[`DescriptionWidget renders an empty description view widget component 1`] = `""`;
+exports[`DescriptionWidget renders an empty description view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/EmailWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/EmailWidget.test.js.snap
index 1a6eebaa10..e43bb4ed46 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/EmailWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/EmailWidget.test.js.snap
@@ -26,4 +26,4 @@ exports[`EmailWidget renders an email view widget component with children 1`] =
 </a>
 `;
 
-exports[`EmailWidget renders an empty email view widget component 1`] = `""`;
+exports[`EmailWidget renders an empty email view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/FileWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/FileWidget.test.js.snap
index f37b373c4d..c1ded79bd9 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/FileWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/FileWidget.test.js.snap
@@ -47,4 +47,4 @@ exports[`FileWidget renders a simple file view widget component 1`] = `
 </a>
 `;
 
-exports[`FileWidget renders an empty file view widget component 1`] = `""`;
+exports[`FileWidget renders an empty file view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/ImageWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/ImageWidget.test.js.snap
index 7d2e6d47ca..47437e40d1 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/ImageWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/ImageWidget.test.js.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`ImageWidget renders an empty image view widget component 1`] = `""`;
+exports[`ImageWidget renders an empty image view widget component 1`] = `null`;
 
 exports[`ImageWidget renders an image view widget component 1`] = `
 <span
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/PasswordWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/PasswordWidget.test.js.snap
index d691caa218..b4b2b8637e 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/PasswordWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/PasswordWidget.test.js.snap
@@ -18,4 +18,4 @@ exports[`PasswordWidget renders a password view widget component with children 1
 </span>
 `;
 
-exports[`PasswordWidget renders an empty password view widget component 1`] = `""`;
+exports[`PasswordWidget renders an empty password view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/RelationWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/RelationWidget.test.js.snap
index d7c722318c..7fbf15d328 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/RelationWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/RelationWidget.test.js.snap
@@ -92,4 +92,4 @@ exports[`RelationWidget renders a relation view widget component 1`] = `
 </a>
 `;
 
-exports[`RelationWidget renders an empty relation view widget component 1`] = `""`;
+exports[`RelationWidget renders an empty relation view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/RelationsWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/RelationsWidget.test.js.snap
index 4b2b53ac47..7f5a2f0070 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/RelationsWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/RelationsWidget.test.js.snap
@@ -264,4 +264,4 @@ exports[`RelationsWidget renders a vocabulary relations view widget component 1`
 </ul>
 `;
 
-exports[`RelationsWidget renders an empty relations view widget component 1`] = `""`;
+exports[`RelationsWidget renders an empty relations view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/RichTextWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/RichTextWidget.test.js.snap
index 565d050626..00ea582f44 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/RichTextWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/RichTextWidget.test.js.snap
@@ -22,4 +22,4 @@ exports[`RichTextWidget renders a rich text view widget component with children
 />
 `;
 
-exports[`RichTextWidget renders an empty rich text view widget component 1`] = `""`;
+exports[`RichTextWidget renders an empty rich text view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/SelectWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/SelectWidget.test.js.snap
index e5d9e555b6..dd913ad14c 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/SelectWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/SelectWidget.test.js.snap
@@ -26,4 +26,4 @@ exports[`SelectWidget renders a select view widget component 1`] = `
 </span>
 `;
 
-exports[`SelectWidget renders an empty select view widget component 1`] = `""`;
+exports[`SelectWidget renders an empty select view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/TextWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/TextWidget.test.js.snap
index 5129b795b8..35aab38e8d 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/TextWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/TextWidget.test.js.snap
@@ -28,4 +28,4 @@ exports[`TextWidget renders a text view widget component with children 1`] = `
 </span>
 `;
 
-exports[`TextWidget renders an empty text view widget component 1`] = `""`;
+exports[`TextWidget renders an empty text view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/TitleWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/TitleWidget.test.js.snap
index efd0541d37..c911ccadae 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/TitleWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/TitleWidget.test.js.snap
@@ -18,4 +18,4 @@ exports[`TitleWidget renders a title view widget component with children 1`] = `
 </h1>
 `;
 
-exports[`TitleWidget renders an empty title view widget component 1`] = `""`;
+exports[`TitleWidget renders an empty title view widget component 1`] = `null`;
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/TokenWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/TokenWidget.test.js.snap
index ca60a25602..c651a7a33e 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/TokenWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/TokenWidget.test.js.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`TokenWidget renders an empty tags view widget component 1`] = `""`;
+exports[`TokenWidget renders an empty tags view widget component 1`] = `null`;
 
 exports[`TokenWidget renders tags view widget component 1`] = `
 <span
diff --git a/packages/volto/src/components/theme/Widgets/__snapshots__/UrlWidget.test.js.snap b/packages/volto/src/components/theme/Widgets/__snapshots__/UrlWidget.test.js.snap
index b18d60fa7c..13b46360b2 100644
--- a/packages/volto/src/components/theme/Widgets/__snapshots__/UrlWidget.test.js.snap
+++ b/packages/volto/src/components/theme/Widgets/__snapshots__/UrlWidget.test.js.snap
@@ -26,4 +26,4 @@ exports[`UrlWidget renders an URL view widget component with children 1`] = `
 </a>
 `;
 
-exports[`UrlWidget renders an empty URL view widget component 1`] = `""`;
+exports[`UrlWidget renders an empty URL view widget component 1`] = `null`;
diff --git a/packages/volto/src/helpers/AsyncConnect/AsyncConnect.test.js b/packages/volto/src/helpers/AsyncConnect/AsyncConnect.test.js
index 2b6a371334..fcf54dfa7c 100644
--- a/packages/volto/src/helpers/AsyncConnect/AsyncConnect.test.js
+++ b/packages/volto/src/helpers/AsyncConnect/AsyncConnect.test.js
@@ -12,8 +12,6 @@ import { AsyncConnectWithContext, AsyncConnect } from './AsyncConnect'; // , Asy
 import { asyncConnect, loadOnServer } from './';
 import { matchAllRoutes } from './utils';
 
-import '@testing-library/jest-dom/extend-expect';
-
 describe('<ReduxAsyncConnect />', () => {
   const initialEmptyState = {
     router: {
diff --git a/packages/volto/src/helpers/Html/__snapshots__/Html.test.jsx.snap b/packages/volto/src/helpers/Html/__snapshots__/Html.test.jsx.snap
index 08b1b54bbd..08d9709f22 100644
--- a/packages/volto/src/helpers/Html/__snapshots__/Html.test.jsx.snap
+++ b/packages/volto/src/helpers/Html/__snapshots__/Html.test.jsx.snap
@@ -8,11 +8,6 @@ exports[`Html renders a html component 1`] = `
     <meta
       charSet="utf-8"
     />
-    
-    
-    
-    
-    
     <script
       dangerouslySetInnerHTML={
         Object {
@@ -105,11 +100,6 @@ exports[`Html renders a html component with apiPath present 1`] = `
     <meta
       charSet="utf-8"
     />
-    
-    
-    
-    
-    
     <script
       dangerouslySetInnerHTML={
         Object {
diff --git a/packages/volto/src/helpers/Utils/UseDetectClickOutside.stories.jsx b/packages/volto/src/helpers/Utils/UseDetectClickOutside.stories.jsx
index 1fa45fb51d..f8f69bf465 100644
--- a/packages/volto/src/helpers/Utils/UseDetectClickOutside.stories.jsx
+++ b/packages/volto/src/helpers/Utils/UseDetectClickOutside.stories.jsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { useDetectClickOutside } from './useDetectClickOutside';
-import { Portal } from 'react-portal';
+import { createPortal } from 'react-dom';
 import { usePopper } from 'react-popper';
 import { BlockChooser } from '@plone/volto/components';
 
@@ -44,10 +44,9 @@ function OpenedChooserWithPortal(props) {
     triggerKeys: ['Escape'],
   });
 
-  return (
-    <Portal node={document.getElementById('body')}>
-      <div ref={blockChooserRef}>{`Hello ${props.id}`}</div>
-    </Portal>
+  return createPortal(
+    <div ref={blockChooserRef}>{`Hello ${props.id}`}</div>,
+    document.getElementById('body'),
   );
 }
 
@@ -124,7 +123,7 @@ function TestComponentWithPortalAndPopper(props) {
         ref={setReferenceElement}
         onClick={() => setOpenMenu(true)}
       >{`Click me ${props.id}`}</button>
-      <Portal node={document.getElementById('body')}>
+      {createPortal(
         <div
           ref={setPopperElement}
           style={styles.popper}
@@ -136,8 +135,9 @@ function TestComponentWithPortalAndPopper(props) {
               setOpenMenu={setOpenMenu}
             />
           )}
-        </div>
-      </Portal>
+        </div>,
+        document.body,
+      )}
     </div>
   );
 }
diff --git a/packages/volto/src/helpers/Utils/usePagination.test.js b/packages/volto/src/helpers/Utils/usePagination.test.js
deleted file mode 100644
index 26924d78a0..0000000000
--- a/packages/volto/src/helpers/Utils/usePagination.test.js
+++ /dev/null
@@ -1,115 +0,0 @@
-import { renderHook } from '@testing-library/react-hooks';
-import { usePagination } from './usePagination';
-import * as redux from 'react-redux';
-import routeData from 'react-router';
-import { slugify } from '@plone/volto/helpers/Utils/Utils';
-
-const searchBlockId = '545b33de-92cf-4747-969d-68851837b317';
-const searchBlockId2 = '454b33de-92cf-4747-969d-68851837b713';
-const searchBlock = {
-  '@type': 'search',
-  query: {
-    b_size: '4',
-    query: [
-      {
-        i: 'path',
-        o: 'plone.app.querystring.operation.string.relativePath',
-        v: '',
-      },
-    ],
-    sort_order: 'ascending',
-  },
-  showSearchInput: true,
-  showTotalResults: true,
-};
-let state = {
-  content: {
-    data: {
-      blocks: {
-        [searchBlockId]: searchBlock,
-      },
-      blocks_layout: {
-        items: [searchBlockId],
-      },
-    },
-  },
-};
-
-let mockUseLocationValue = {
-  pathname: '/testroute',
-  search: '',
-};
-
-const setUp = (searchParam, numberOfSearches) => {
-  mockUseLocationValue.search = searchParam;
-  if (numberOfSearches > 1) {
-    state.content.data.blocks[searchBlockId2] = searchBlock;
-    state.content.data.blocks_layout.items.push(searchBlockId2);
-  }
-  return renderHook(({ id, defaultPage }) => usePagination(id, defaultPage), {
-    initialProps: {
-      id: searchBlockId,
-      defaultPage: 1,
-    },
-  });
-};
-
-describe(`Tests for usePagination, for the block ${searchBlockId}`, () => {
-  const useLocation = jest.spyOn(routeData, 'useLocation');
-  const useHistory = jest.spyOn(routeData, 'useHistory');
-  const useSelector = jest.spyOn(redux, 'useSelector');
-  beforeEach(() => {
-    useLocation.mockReturnValue(mockUseLocationValue);
-    useHistory.mockReturnValue({ replace: jest.fn() });
-    useSelector.mockImplementation((cb) => cb(state));
-  });
-
-  it('1 paginated block with id and defaultPage 1 - shoud be 1', () => {
-    const { result } = setUp();
-    expect(result.current.currentPage).toBe(1);
-  });
-
-  it('1 paginated block without params - shoud be 1', () => {
-    const { result } = setUp();
-    expect(result.current.currentPage).toBe(1);
-  });
-
-  const param1 = '?page=2';
-  it(`1 paginated block with params: ${param1} - shoud be 2`, () => {
-    const { result } = setUp(param1);
-    expect(result.current.currentPage).toBe(2);
-  });
-
-  const param2 = `?${slugify(`page-${searchBlockId}`)}=2`;
-  it(`2 paginated blocks with current block in the params: ${param2} - shoud be 2`, () => {
-    const { result } = setUp(param2, 2);
-    expect(result.current.currentPage).toBe(2);
-  });
-
-  const param3 = `?${slugify(`page-${searchBlockId2}`)}=2`;
-  it(`2 paginated blocks with the other block in the params: ${param3} - shoud be 1`, () => {
-    const { result } = setUp(param3, 2);
-    expect(result.current.currentPage).toBe(1);
-  });
-
-  const param4 = `?${slugify(`page-${searchBlockId}`)}=2&${slugify(
-    `page-${searchBlockId2}`,
-  )}=1`;
-  it(`2 paginated blocks with both blocks in the params, current 2: ${param4} - shoud be 2`, () => {
-    const { result } = setUp(param4, 2);
-    expect(result.current.currentPage).toBe(2);
-  });
-
-  const param5 = `?${slugify(`page-${searchBlockId}`)}=1&${slugify(
-    `page-${searchBlockId2}`,
-  )}=2`;
-  it(`2 paginated blocks with both blocks in the params, current 1: ${param5} - shoud be 1`, () => {
-    const { result } = setUp(param5, 2);
-    expect(result.current.currentPage).toBe(1);
-  });
-
-  it(`2 paginated blocks with wrong page param: ${param1} - shoud be 1`, () => {
-    const { result } = setUp(param1, 2);
-    expect(result.current.currentPage).toBe(1);
-  });
-});
diff --git a/packages/volto/src/start-client.jsx b/packages/volto/src/start-client.jsx
index 179af9e57d..4494b118c7 100644
--- a/packages/volto/src/start-client.jsx
+++ b/packages/volto/src/start-client.jsx
@@ -1,7 +1,7 @@
 import '@plone/volto/config'; // This is the bootstrap for the global config - client side
 import '@root/theme';
 import React from 'react';
-import { hydrate } from 'react-dom';
+import { hydrateRoot } from 'react-dom/client';
 import { Provider } from 'react-redux';
 import { IntlProvider } from 'react-intl-redux';
 import { ConnectedRouter } from 'connected-react-router';
@@ -58,7 +58,8 @@ export default function client() {
   }
 
   loadableReady(() => {
-    hydrate(
+    hydrateRoot(
+      document.getElementById('main'),
       <CookiesProvider>
         <Provider store={store}>
           <IntlProvider onError={reactIntlErrorHandler}>
@@ -70,7 +71,6 @@ export default function client() {
           </IntlProvider>
         </Provider>
       </CookiesProvider>,
-      document.getElementById('main'),
     );
   });
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index d7d8135798..e26c7128ea 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -308,7 +308,7 @@ importers:
         version: 2.4.3(react-router-dom@5.2.0)(react@17.0.2)
       react-select:
         specifier: 4.3.1
-        version: 4.3.1(@types/react@18.2.57)(react-dom@17.0.2)(react@17.0.2)
+        version: 4.3.1(react-dom@17.0.2)(react@17.0.2)
       react-select-async-paginate:
         specifier: 0.5.3
         version: 0.5.3(react-dom@17.0.2)(react-select@4.3.1)(react@17.0.2)
@@ -727,16 +727,16 @@ importers:
         version: 5.0.5(react-dom@18.2.0)(react@18.2.0)
       '@tanstack/react-router':
         specifier: ^1.16.0
-        version: 1.16.2(react-dom@18.2.0)(react@18.2.0)
+        version: 1.17.4(react-dom@18.2.0)(react@18.2.0)
       '@tanstack/react-router-server':
         specifier: ^1.16.0
-        version: 1.16.2(preact@10.19.4)(react-dom@18.2.0)(react@18.2.0)
+        version: 1.17.4(preact@10.19.6)(react-dom@18.2.0)(react@18.2.0)
       '@tanstack/router-devtools':
         specifier: ^1.16.0
-        version: 1.16.2(react-dom@18.2.0)(react@18.2.0)
+        version: 1.17.4(csstype@3.1.2)(react-dom@18.2.0)(react@18.2.0)
       '@tanstack/router-vite-plugin':
         specifier: ^1.16.1
-        version: 1.16.3
+        version: 1.16.5
       axios:
         specifier: ^1.6.5
         version: 1.6.7(debug@4.3.2)
@@ -770,13 +770,13 @@ importers:
         version: 6.0.4(@babel/core@7.23.9)
       '@tanstack/react-query-devtools':
         specifier: ^5.20.1
-        version: 5.20.5(@tanstack/react-query@5.0.5)(react@18.2.0)
+        version: 5.24.1(@tanstack/react-query@5.0.5)(react@18.2.0)
       '@types/express':
         specifier: ^4.17.21
         version: 4.17.21
       '@types/react':
         specifier: ^18.2.55
-        version: 18.2.55
+        version: 18.2.60
       '@types/react-dom':
         specifier: ^18.2.19
         version: 18.2.19
@@ -831,7 +831,7 @@ importers:
         version: link:../types
       '@types/react':
         specifier: ^18
-        version: 18.2.55
+        version: 18.2.60
       '@types/react-dom':
         specifier: ^18
         version: 18.2.19
@@ -922,7 +922,7 @@ importers:
         version: 9.0.1
       vite:
         specifier: ^4.5.1
-        version: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+        version: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
       vite-plugin-dts:
         specifier: ^3.6.0
         version: 3.6.4(typescript@5.2.2)(vite@4.5.1)
@@ -1064,10 +1064,10 @@ importers:
         version: 22.1.0
       lightningcss:
         specifier: ^1.23.0
-        version: 1.23.0
+        version: 1.24.0
       lightningcss-cli:
         specifier: ^1.23.0
-        version: 1.23.0
+        version: 1.24.0
       parcel:
         specifier: ^2.11.0
         version: 2.11.0(postcss@8.4.31)(typescript@5.2.2)
@@ -1100,10 +1100,10 @@ importers:
         version: 5.2.2
       vite:
         specifier: ^4.5.0
-        version: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+        version: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
       vitest:
         specifier: ^0.34.6
-        version: 0.34.6(jsdom@22.1.0)(lightningcss@1.23.0)
+        version: 0.34.6(jsdom@22.1.0)(lightningcss@1.24.0)
       vitest-axe:
         specifier: ^0.1.0
         version: 0.1.0(vitest@0.34.6)
@@ -1111,20 +1111,20 @@ importers:
   packages/coresandbox:
     dependencies:
       react:
-        specifier: 17.0.2
-        version: 17.0.2
+        specifier: 18.2.0
+        version: 18.2.0
       react-dom:
-        specifier: 17.0.2
-        version: 17.0.2(react@17.0.2)
+        specifier: 18.2.0
+        version: 18.2.0(react@18.2.0)
       react-intl:
         specifier: 3.8.0
-        version: 3.8.0(react@17.0.2)
+        version: 3.8.0(react@18.2.0)
       react-redux:
         specifier: 7.2.4
-        version: 7.2.4(react-dom@17.0.2)(react@17.0.2)
+        version: 7.2.4(react-dom@18.2.0)(react@18.2.0)
       semantic-ui-react:
         specifier: 2.0.3
-        version: 2.0.3(react-dom@17.0.2)(react@17.0.2)
+        version: 2.0.3(react-dom@18.2.0)(react@18.2.0)
     devDependencies:
       '@plone/registry':
         specifier: workspace:*
@@ -1133,11 +1133,11 @@ importers:
         specifier: workspace:*
         version: link:../types
       '@types/react':
-        specifier: ^17.0.52
-        version: 17.0.70
+        specifier: ^18
+        version: 18.2.27
       '@types/react-dom':
-        specifier: ^17
-        version: 17.0.23
+        specifier: ^18
+        version: 18.2.12
       '@types/react-redux':
         specifier: ^7.1.33
         version: 7.1.33
@@ -1226,7 +1226,7 @@ importers:
         version: link:../types
       '@types/react':
         specifier: ^18
-        version: 18.2.55
+        version: 18.2.60
       '@types/react-dom':
         specifier: ^18
         version: 18.2.19
@@ -1247,10 +1247,10 @@ importers:
     dependencies:
       '@parcel/plugin':
         specifier: ^2.10.2
-        version: 2.11.0(@parcel/core@2.11.0)
+        version: 2.10.3(@parcel/core@2.11.0)
       '@parcel/utils':
         specifier: ^2.10.2
-        version: 2.11.0
+        version: 2.10.3
 
   packages/registry:
     dependencies:
@@ -1266,12 +1266,6 @@ importers:
       glob:
         specifier: 7.1.6
         version: 7.1.6
-      react:
-        specifier: ^16.8.0 || ^17.0.0 || ^18.0.0
-        version: 17.0.2
-      react-dom:
-        specifier: ^16.8.0 || ^17.0.0 || ^18.0.0
-        version: 17.0.2(react@17.0.2)
     devDependencies:
       '@parcel/packager-ts':
         specifier: 2.10.2
@@ -1283,14 +1277,20 @@ importers:
         specifier: workspace:*
         version: link:../types
       '@types/react':
-        specifier: ^17.0.52
-        version: 17.0.70
+        specifier: ^18
+        version: 18.2.27
       '@types/react-dom':
-        specifier: ^17
-        version: 17.0.23
+        specifier: ^18
+        version: 18.2.12
       parcel:
         specifier: 2.10.2
         version: 2.10.2(postcss@8.4.31)(typescript@5.2.2)
+      react:
+        specifier: ^18.2.0
+        version: 18.2.0
+      react-dom:
+        specifier: ^18.2.0
+        version: 18.2.0(react@18.2.0)
       release-it:
         specifier: 16.2.1
         version: 16.2.1(typescript@5.2.2)
@@ -1350,13 +1350,6 @@ importers:
   packages/tsconfig: {}
 
   packages/types:
-    dependencies:
-      react:
-        specifier: ^16.8.0 || ^17.0.0 || ^18.0.0
-        version: 16.14.0
-      react-dom:
-        specifier: ^16.8.0 || ^17.0.0 || ^18.0.0
-        version: 17.0.2(react@16.14.0)
     devDependencies:
       '@parcel/packager-ts':
         specifier: 2.10.2
@@ -1365,20 +1358,26 @@ importers:
         specifier: 2.10.2
         version: 2.10.2(@parcel/core@2.11.0)(typescript@5.2.2)
       '@types/react':
-        specifier: ^17.0.52
-        version: 17.0.70
+        specifier: ^18
+        version: 18.2.27
       '@types/react-dom':
-        specifier: ^17
-        version: 17.0.23
+        specifier: ^18
+        version: 18.2.12
       history:
         specifier: ^5.3.0
         version: 5.3.0
       parcel:
         specifier: 2.10.2
         version: 2.10.2(postcss@8.4.31)(typescript@5.2.2)
+      react:
+        specifier: ^18.2.0
+        version: 18.2.0
+      react-dom:
+        specifier: ^18.2.0
+        version: 18.2.0(react@18.2.0)
       react-intl:
         specifier: 3.8.0
-        version: 3.8.0(react@16.14.0)
+        version: 3.8.0(react@18.2.0)
       release-it:
         specifier: 16.2.1
         version: 16.2.1(typescript@5.2.2)
@@ -1426,10 +1425,10 @@ importers:
         version: 5.13.2(@babel/core@7.23.3)
       '@loadable/component':
         specifier: 5.14.1
-        version: 5.14.1(react@17.0.2)
+        version: 5.14.1(react@18.2.0)
       '@loadable/server':
         specifier: 5.14.0
-        version: 5.14.0(@loadable/component@5.14.1)(react@17.0.2)
+        version: 5.14.0(@loadable/component@5.14.1)(react@18.2.0)
       '@loadable/webpack-plugin':
         specifier: 5.15.2
         version: 5.15.2(webpack@5.90.1)
@@ -1444,7 +1443,7 @@ importers:
         version: link:../volto-slate
       '@types/react':
         specifier: ^18.2.57
-        version: 18.2.57
+        version: 18.2.60
       '@types/react-dom':
         specifier: ^18.2.19
         version: 18.2.19
@@ -1480,7 +1479,7 @@ importers:
         version: 8.2.0
       connected-react-router:
         specifier: 6.8.0
-        version: 6.8.0(history@4.10.1)(immutable@3.8.2)(react-redux@7.2.4)(react-router@5.2.0)(react@17.0.2)(redux@4.1.0)(seamless-immutable@7.1.4)
+        version: 6.8.0(history@4.10.1)(immutable@3.8.2)(react-redux@8.1.2)(react-router@5.2.0)(react@18.2.0)(redux@4.2.1)(seamless-immutable@7.1.4)
       crypto-random-string:
         specifier: 3.2.0
         version: 3.2.0
@@ -1492,7 +1491,7 @@ importers:
         version: 4.3.2(supports-color@8.1.1)
       decorate-component-with-props:
         specifier: 1.2.1
-        version: 1.2.1(react@17.0.2)
+        version: 1.2.1(react@18.2.0)
       deep-freeze:
         specifier: 0.0.1
         version: 0.0.1
@@ -1507,22 +1506,22 @@ importers:
         version: 3.5.0
       draft-js:
         specifier: 0.10.5
-        version: 0.10.5(react-dom@17.0.2)(react@17.0.2)
+        version: 0.10.5(react-dom@18.2.0)(react@18.2.0)
       draft-js-block-breakout-plugin:
         specifier: 2.0.1
-        version: 2.0.1(draft-js@0.10.5)(react-dom@17.0.2)(react@17.0.2)
+        version: 2.0.1(draft-js@0.10.5)(react-dom@18.2.0)(react@18.2.0)
       draft-js-buttons:
         specifier: 2.0.2
-        version: 2.0.2(draft-js@0.10.5)(react-dom@17.0.2)(react@17.0.2)
+        version: 2.0.2(draft-js@0.10.5)(react-dom@18.2.0)(react@18.2.0)
       draft-js-import-html:
         specifier: 1.4.1
         version: 1.4.1(draft-js@0.10.5)(immutable@3.8.2)
       draft-js-inline-toolbar-plugin:
         specifier: 2.0.3
-        version: 2.0.3(draft-js@0.10.5)(react-dom@17.0.2)(react@17.0.2)
+        version: 2.0.3(draft-js@0.10.5)(react-dom@18.2.0)(react@18.2.0)
       draft-js-plugins-editor:
         specifier: 2.1.1
-        version: 2.1.1(draft-js@0.10.5)(react-dom@17.0.2)(react@17.0.2)
+        version: 2.1.1(draft-js@0.10.5)(react-dom@18.2.0)(react@18.2.0)
       draft-js-plugins-utils:
         specifier: 2.0.3
         version: 2.0.3(draft-js@0.10.5)
@@ -1603,7 +1602,7 @@ importers:
         version: 1.0.0
       jotai:
         specifier: 2.0.3
-        version: 2.0.3(react@17.0.2)
+        version: 2.0.3(react@18.2.0)
       jwt-decode:
         specifier: 2.2.0
         version: 2.2.0
@@ -1702,133 +1701,130 @@ importers:
         version: 4.2.18(mini-css-extract-plugin@2.7.2)(postcss@8.4.31)(razzle-dev-utils@4.2.18)(razzle@4.2.18)(webpack@5.90.1)
       rc-time-picker:
         specifier: 3.7.3
-        version: 3.7.3(react-dom@17.0.2)(react@17.0.2)
+        version: 3.7.3(react-dom@18.2.0)(react@18.2.0)
       react:
-        specifier: 17.0.2
-        version: 17.0.2
+        specifier: 18.2.0
+        version: 18.2.0
       react-anchor-link-smooth-scroll:
         specifier: 1.0.12
         version: 1.0.12
       react-animate-height:
         specifier: 2.0.17
-        version: 2.0.17(react-dom@17.0.2)(react@17.0.2)
+        version: 2.0.17(react-dom@18.2.0)(react@18.2.0)
       react-beautiful-dnd:
         specifier: 13.0.0
-        version: 13.0.0(react-dom@17.0.2)(react@17.0.2)
+        version: 13.0.0(react-dom@18.2.0)(react@18.2.0)
       react-cookie:
         specifier: 4.1.1
-        version: 4.1.1(react@17.0.2)
+        version: 4.1.1(react@18.2.0)
       react-dates:
         specifier: 21.5.1
-        version: 21.5.1(@babel/runtime@7.20.6)(moment@2.29.4)(react-dom@17.0.2)(react-with-direction@1.4.0)(react@17.0.2)
+        version: 21.5.1(@babel/runtime@7.20.6)(moment@2.29.4)(react-dom@18.2.0)(react-with-direction@1.4.0)(react@18.2.0)
       react-detect-click-outside:
         specifier: 1.1.1
-        version: 1.1.1(react-dom@17.0.2)(react@17.0.2)
+        version: 1.1.1(react-dom@18.2.0)(react@18.2.0)
       react-dnd:
         specifier: 5.0.0
-        version: 5.0.0(react@17.0.2)
+        version: 5.0.0(react@18.2.0)
       react-dnd-html5-backend:
         specifier: 5.0.1
         version: 5.0.1
       react-dom:
-        specifier: 17.0.2
-        version: 17.0.2(react@17.0.2)
+        specifier: 18.2.0
+        version: 18.2.0(react@18.2.0)
       react-dropzone:
         specifier: 11.1.0
-        version: 11.1.0(react@17.0.2)
+        version: 11.1.0(react@18.2.0)
       react-fast-compare:
         specifier: 2.0.4
         version: 2.0.4
       react-image-gallery:
         specifier: 1.2.7
-        version: 1.2.7(react@17.0.2)
+        version: 1.2.7(react@18.2.0)
       react-intersection-observer:
         specifier: 9.1.0
-        version: 9.1.0(react@17.0.2)
+        version: 9.1.0(react@18.2.0)
       react-intl:
         specifier: 3.8.0
-        version: 3.8.0(react@17.0.2)
+        version: 3.8.0(react@18.2.0)
       react-intl-redux:
-        specifier: 2.2.0
-        version: 2.2.0(react-intl@3.8.0)(react-redux@7.2.4)
+        specifier: 2.3.0
+        version: 2.3.0(@babel/runtime@7.20.6)(prop-types@15.7.2)(react-intl@3.8.0)(react-redux@8.1.2)(react@18.2.0)
       react-medium-image-zoom:
         specifier: 3.0.15
-        version: 3.0.15(prop-types@15.7.2)(react-dom@17.0.2)(react@17.0.2)
+        version: 3.0.15(prop-types@15.7.2)(react-dom@18.2.0)(react@18.2.0)
       react-popper:
         specifier: ^2.3.0
-        version: 2.3.0(@popperjs/core@2.11.8)(react-dom@17.0.2)(react@17.0.2)
-      react-portal:
-        specifier: 4.2.1
-        version: 4.2.1(react-dom@17.0.2)(react@17.0.2)
+        version: 2.3.0(@popperjs/core@2.11.8)(react-dom@18.2.0)(react@18.2.0)
       react-redux:
-        specifier: 7.2.4
-        version: 7.2.4(react-dom@17.0.2)(react@17.0.2)
+        specifier: 8.1.2
+        version: 8.1.2(@types/react-dom@18.2.19)(@types/react@18.2.60)(react-dom@18.2.0)(react@18.2.0)(redux@4.2.1)
       react-router:
         specifier: 5.2.0
-        version: 5.2.0(react@17.0.2)
+        version: 5.2.0(react@18.2.0)
       react-router-config:
         specifier: 5.1.1
-        version: 5.1.1(react-router@5.2.0)(react@17.0.2)
+        version: 5.1.1(react-router@5.2.0)(react@18.2.0)
       react-router-dom:
         specifier: 5.2.0
-        version: 5.2.0(react@17.0.2)
+        version: 5.2.0(react@18.2.0)
       react-router-hash-link:
         specifier: 2.4.3
-        version: 2.4.3(react-router-dom@5.2.0)(react@17.0.2)
+        version: 2.4.3(react-router-dom@5.2.0)(react@18.2.0)
       react-select:
         specifier: 4.3.1
-        version: 4.3.1(@types/react@18.2.57)(react-dom@17.0.2)(react@17.0.2)
+        version: 4.3.1(@types/react@18.2.60)(react-dom@18.2.0)(react@18.2.0)
       react-select-async-paginate:
         specifier: 0.5.3
-        version: 0.5.3(react-dom@17.0.2)(react-select@4.3.1)(react@17.0.2)
+        version: 0.5.3(react-dom@18.2.0)(react-select@4.3.1)(react@18.2.0)
       react-share:
         specifier: 2.3.1
-        version: 2.3.1(react@17.0.2)
+        version: 2.3.1(react@18.2.0)
       react-side-effect:
-        specifier: 2.1.0
-        version: 2.1.0(react@17.0.2)
+        specifier: 2.1.2
+        version: 2.1.2(react@18.2.0)
       react-simple-code-editor:
         specifier: 0.7.1
-        version: 0.7.1(react-dom@17.0.2)(react@17.0.2)
+        version: 0.7.1(react-dom@18.2.0)(react@18.2.0)
       react-sortable-hoc:
         specifier: 2.0.0
-        version: 2.0.0(prop-types@15.7.2)(react-dom@17.0.2)(react@17.0.2)
+        version: 2.0.0(prop-types@15.7.2)(react-dom@18.2.0)(react@18.2.0)
       react-test-renderer:
-        specifier: 17.0.2
-        version: 17.0.2(react@17.0.2)
+        specifier: 18.2.0
+        version: 18.2.0(react@18.2.0)
       react-toastify:
         specifier: 5.4.1
-        version: 5.4.1(react-dom@17.0.2)(react@17.0.2)
+        version: 5.4.1(react-dom@18.2.0)(react@18.2.0)
       react-transition-group:
         specifier: 4.4.5
-        version: 4.4.5(react-dom@17.0.2)(react@17.0.2)
+        version: 4.4.5(react-dom@18.2.0)(react@18.2.0)
       react-virtualized:
         specifier: 9.22.3
-        version: 9.22.3(react-dom@17.0.2)(react@17.0.2)
+        version: 9.22.3(react-dom@18.2.0)(react@18.2.0)
       redraft:
         specifier: 0.10.2
         version: 0.10.2
       redux:
-        specifier: 4.1.0
-        version: 4.1.0
+        specifier: 4.2.1
+        version: 4.2.1
       redux-actions:
-        specifier: 2.6.5
-        version: 2.6.5
+        specifier: 3.0.0
+        version: 3.0.0
       redux-connect:
         specifier: 10.0.0
-        version: 10.0.0(prop-types@15.7.2)(react-redux@7.2.4)(react-router-config@5.1.1)(react-router-dom@5.2.0)(react-router@5.2.0)(react@17.0.2)(redux-actions@2.6.5)
+        version: 10.0.0(prop-types@15.7.2)(react-redux@8.1.2)(react-router-config@5.1.1)(react-router-dom@5.2.0)(react-router@5.2.0)(react@18.2.0)(redux-actions@3.0.0)
       redux-devtools-extension:
-        specifier: 2.13.8
-        version: 2.13.8(redux@4.1.0)
+        specifier: 2.13.9
+        version: 2.13.9(redux@4.2.1)
       redux-localstorage-simple:
-        specifier: 2.3.1
-        version: 2.3.1
+        specifier: 2.5.1
+        version: 2.5.1
       redux-mock-store:
         specifier: 1.5.4
         version: 1.5.4
       redux-thunk:
-        specifier: 2.3.0
-        version: 2.3.0(redux@4.1.0)
+        specifier: 2.4.2
+        version: 2.4.2(redux@4.2.1)
       rrule:
         specifier: 2.7.1
         version: 2.7.1
@@ -1837,7 +1833,7 @@ importers:
         version: 2.4.1
       semantic-ui-react:
         specifier: 2.1.5
-        version: 2.1.5(react-dom@17.0.2)(react@17.0.2)
+        version: 2.1.5(react-dom@18.2.0)(react@18.2.0)
       serialize-javascript:
         specifier: 3.1.0
         version: 3.1.0
@@ -1849,7 +1845,7 @@ importers:
         version: 0.100.0(slate@0.100.0)
       slate-react:
         specifier: 0.98.4
-        version: 0.98.4(react-dom@17.0.2)(react@17.0.2)(slate@0.100.0)
+        version: 0.98.4(react-dom@18.2.0)(react@18.2.0)(slate@0.100.0)
       start-server-and-test:
         specifier: 1.14.0
         version: 1.14.0
@@ -1894,7 +1890,7 @@ importers:
         version: 0.11.3
       use-deep-compare-effect:
         specifier: 1.8.1
-        version: 1.8.1(react@17.0.2)
+        version: 1.8.1(react@18.2.0)
       uuid:
         specifier: ^8.3.2
         version: 8.3.2
@@ -1931,40 +1927,40 @@ importers:
         version: 6.0.1
       '@storybook/addon-actions':
         specifier: ^6.5.15
-        version: 6.5.16(react-dom@17.0.2)(react@17.0.2)
+        version: 6.5.16(react-dom@18.2.0)(react@18.2.0)
       '@storybook/addon-controls':
         specifier: 6.5.15
-        version: 6.5.15(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
+        version: 6.5.15(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
       '@storybook/addon-docs':
         specifier: ^6.5.15
-        version: 6.5.16(@babel/core@7.23.3)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1)
+        version: 6.5.16(@babel/core@7.23.3)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1)
       '@storybook/addon-essentials':
         specifier: ^6.5.15
-        version: 6.5.16(@babel/core@7.23.3)(@storybook/builder-webpack5@6.5.16)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1)
+        version: 6.5.16(@babel/core@7.23.3)(@storybook/builder-webpack5@6.5.16)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1)
       '@storybook/addon-links':
         specifier: ^6.5.15
-        version: 6.5.16(react-dom@17.0.2)(react@17.0.2)
+        version: 6.5.16(react-dom@18.2.0)(react@18.2.0)
       '@storybook/builder-webpack5':
         specifier: ^6.5.15
-        version: 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
+        version: 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
       '@storybook/manager-webpack5':
         specifier: ^6.5.15
-        version: 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
+        version: 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
       '@storybook/react':
         specifier: ^6.5.15
-        version: 6.5.16(@babel/core@7.23.3)(@storybook/builder-webpack5@6.5.16)(@storybook/manager-webpack5@6.5.16)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(require-from-string@2.0.2)(typescript@5.2.2)(webpack-dev-server@4.11.1)
+        version: 6.5.16(@babel/core@7.23.3)(@storybook/builder-webpack5@6.5.16)(@storybook/manager-webpack5@6.5.16)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(require-from-string@2.0.2)(typescript@5.2.2)(webpack-dev-server@4.11.1)
       '@testing-library/cypress':
         specifier: 9.0.0
         version: 9.0.0(cypress@13.1.0)
       '@testing-library/jest-dom':
-        specifier: 5.16.4
-        version: 5.16.4
+        specifier: 6.4.1
+        version: 6.4.1(@jest/globals@29.7.0)(@types/jest@29.5.8)(jest@26.6.3)(vitest@0.34.6)
       '@testing-library/react':
-        specifier: 12.1.5
-        version: 12.1.5(react-dom@17.0.2)(react@17.0.2)
+        specifier: 14.2.0
+        version: 14.2.0(react-dom@18.2.0)(react@18.2.0)
       '@testing-library/react-hooks':
         specifier: 8.0.1
-        version: 8.0.1(@types/react@18.2.57)(react-dom@17.0.2)(react-test-renderer@17.0.2)(react@17.0.2)
+        version: 8.0.1(@types/react@18.2.60)(react-dom@18.2.0)(react-test-renderer@18.2.0)(react@18.2.0)
       '@types/jest':
         specifier: ^29.5.8
         version: 29.5.8
@@ -1975,8 +1971,8 @@ importers:
         specifier: ^5.3.3
         version: 5.3.3
       '@types/react-test-renderer':
-        specifier: 18.0.1
-        version: 18.0.1
+        specifier: 18.0.7
+        version: 18.0.7
       '@types/uuid':
         specifier: ^9.0.2
         version: 9.0.7
@@ -2023,8 +2019,8 @@ importers:
         specifier: 6.0.9
         version: 6.0.9
       react-is:
-        specifier: ^16.13.1
-        version: 16.13.1
+        specifier: ^18.2.0
+        version: 18.2.0
       release-it:
         specifier: ^16.2.1
         version: 16.2.1(typescript@5.2.2)
@@ -2065,14 +2061,14 @@ importers:
         specifier: ^16.6.0
         version: 16.7.0
       react:
-        specifier: 17.0.2
-        version: 17.0.2
+        specifier: 18.2.0
+        version: 18.2.0
       react-dom:
-        specifier: 17.0.2
-        version: 17.0.2(react@17.0.2)
+        specifier: 18.2.0
+        version: 18.2.0(react@18.2.0)
       react-intersection-observer:
         specifier: 9.1.0
-        version: 9.1.0(react@17.0.2)
+        version: 9.1.0(react@18.2.0)
       slate:
         specifier: 0.100.0
         version: 0.100.0
@@ -2084,14 +2080,14 @@ importers:
         version: 0.100.0(slate@0.100.0)
       slate-react:
         specifier: 0.98.4
-        version: 0.98.4(react-dom@17.0.2)(react@17.0.2)(slate@0.100.0)
+        version: 0.98.4(react-dom@18.2.0)(react@18.2.0)(slate@0.100.0)
       weak-key:
         specifier: ^1.0.2
         version: 1.0.3
     devDependencies:
       '@testing-library/react':
         specifier: 9.5.0
-        version: 9.5.0(react-dom@17.0.2)(react@17.0.2)
+        version: 9.5.0(react-dom@18.2.0)(react@18.2.0)
       babel-plugin-transform-class-properties:
         specifier: ^6.24.1
         version: 6.24.1
@@ -2314,7 +2310,7 @@ packages:
     dependencies:
       '@babel/compat-data': 7.23.3
       '@babel/helper-validator-option': 7.22.15
-      browserslist: 4.22.1
+      browserslist: 4.23.0
       lru-cache: 5.1.1
       semver: 6.3.1
 
@@ -5169,7 +5165,28 @@ packages:
     resolution: {integrity: sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==}
     dev: false
 
-  /@emotion/react@11.11.1(@types/react@18.2.57)(react@17.0.2):
+  /@emotion/react@11.11.1(@types/react@18.2.60)(react@18.2.0):
+    resolution: {integrity: sha512-5mlW1DquU5HaxjLkfkGN1GA/fvVGdyHURRiX/0FHl2cfIfRxSOfmxEH5YS43edp0OldZrZ+dkBKbngxcNCdZvA==}
+    peerDependencies:
+      '@types/react': '*'
+      react: '>=16.8.0'
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+    dependencies:
+      '@babel/runtime': 7.20.6
+      '@emotion/babel-plugin': 11.11.0
+      '@emotion/cache': 11.11.0
+      '@emotion/serialize': 1.1.2
+      '@emotion/use-insertion-effect-with-fallbacks': 1.0.1(react@18.2.0)
+      '@emotion/utils': 1.2.1
+      '@emotion/weak-memoize': 0.3.1
+      '@types/react': 18.2.60
+      hoist-non-react-statics: 3.3.2
+      react: 18.2.0
+    dev: false
+
+  /@emotion/react@11.11.1(react@17.0.2):
     resolution: {integrity: sha512-5mlW1DquU5HaxjLkfkGN1GA/fvVGdyHURRiX/0FHl2cfIfRxSOfmxEH5YS43edp0OldZrZ+dkBKbngxcNCdZvA==}
     peerDependencies:
       '@types/react': '*'
@@ -5185,7 +5202,6 @@ packages:
       '@emotion/use-insertion-effect-with-fallbacks': 1.0.1(react@17.0.2)
       '@emotion/utils': 1.2.1
       '@emotion/weak-memoize': 0.3.1
-      '@types/react': 18.2.57
       hoist-non-react-statics: 3.3.2
       react: 17.0.2
     dev: false
@@ -5270,7 +5286,6 @@ packages:
       react: '>=16.8.0'
     dependencies:
       react: 18.2.0
-    dev: true
 
   /@emotion/utils@0.11.3:
     resolution: {integrity: sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw==}
@@ -5932,15 +5947,26 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
-  /@fluentui/react-component-event-listener@0.63.1(react-dom@17.0.2)(react@17.0.2):
+  /@fluentui/react-component-event-listener@0.51.7(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-NjVm+crN0T9A7vITL8alZeHnuV8zi2gos0nezU/2YOxaUAB9E4zKiPxt/6k5U50rJs/gj8Nu45iXxnjO41HbZg==}
+    peerDependencies:
+      react: ^16.8.0 || ^17
+      react-dom: ^16.8.0 || ^17
+    dependencies:
+      '@babel/runtime': 7.20.6
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
+  /@fluentui/react-component-event-listener@0.63.1(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-gSMdOh6tI3IJKZFqxfQwbTpskpME0CvxdxGM2tdglmf6ZPVDi0L4+KKIm+2dN8nzb8Ya1A8ZT+Ddq0KmZtwVQg==}
     peerDependencies:
       react: ^16.8.0 || ^17 || ^18
       react-dom: ^16.8.0 || ^17 || ^18
     dependencies:
       '@babel/runtime': 7.20.6
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
     dev: false
 
   /@fluentui/react-component-ref@0.51.7(react-dom@17.0.2)(react@17.0.2):
@@ -5955,15 +5981,27 @@ packages:
       react-is: 16.13.1
     dev: false
 
-  /@fluentui/react-component-ref@0.63.1(react-dom@17.0.2)(react@17.0.2):
+  /@fluentui/react-component-ref@0.51.7(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-CX27jVJYaFoBCWpuWAizQZ2se137ku1dmDyn8sw+ySNJa+kkQf7LnMydiPW5K7cRdUSqUJW3eS4EjKRvVAx8xA==}
+    peerDependencies:
+      react: ^16.8.0 || ^17
+      react-dom: ^16.8.0 || ^17
+    dependencies:
+      '@babel/runtime': 7.20.6
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-is: 16.13.1
+    dev: false
+
+  /@fluentui/react-component-ref@0.63.1(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-8MkXX4+R3i80msdbD4rFpEB4WWq2UDvGwG386g3ckIWbekdvN9z2kWAd9OXhRGqB7QeOsoAGWocp6gAMCivRlw==}
     peerDependencies:
       react: ^16.8.0 || ^17 || ^18
       react-dom: ^16.8.0 || ^17 || ^18
     dependencies:
       '@babel/runtime': 7.20.6
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       react-is: 16.13.1
     dev: false
 
@@ -6072,12 +6110,6 @@ packages:
       '@swc/helpers': 0.5.3
     dev: false
 
-  /@internationalized/date@3.5.1:
-    resolution: {integrity: sha512-LUQIfwU9e+Fmutc/DpRTGXSdgYZLBegi4wygCWDSVmUdLTaMHsQyASDiJtREwanwKuQLq0hY76fCJ9J/9I2xOQ==}
-    dependencies:
-      '@swc/helpers': 0.5.3
-    dev: false
-
   /@internationalized/date@3.5.2:
     resolution: {integrity: sha512-vo1yOMUt2hzp63IutEaTUxROdvQg1qlMRsbCvbay2AK2Gai7wIgCyK5weEX3nHkiLgo4qCXHijFNC/ILhlRpOQ==}
     dependencies:
@@ -6104,12 +6136,6 @@ packages:
       '@swc/helpers': 0.5.3
     dev: false
 
-  /@internationalized/number@3.5.0:
-    resolution: {integrity: sha512-ZY1BW8HT9WKYvaubbuqXbbDdHhOUMfE2zHHFJeTppid0S+pc8HtdIxFxaYMsGjCb4UsF+MEJ4n2TfU7iHnUK8w==}
-    dependencies:
-      '@swc/helpers': 0.5.3
-    dev: false
-
   /@internationalized/number@3.5.1:
     resolution: {integrity: sha512-N0fPU/nz15SwR9IbfJ5xaS9Ss/O5h1sVXMZf43vc9mxEG48ovglvvzBjF53aHlq20uoR6c+88CrIXipU/LSzwg==}
     dependencies:
@@ -6122,12 +6148,6 @@ packages:
       '@swc/helpers': 0.5.3
     dev: false
 
-  /@internationalized/string@3.2.0:
-    resolution: {integrity: sha512-Xx3Sy3f2c9ctT+vh8c7euEaEHQZltp0euZ3Hy4UfT3E13r6lxpUS3kgKyumEjboJZSnaZv7JhqWz3D75v+IxQg==}
-    dependencies:
-      '@swc/helpers': 0.5.3
-    dev: false
-
   /@internationalized/string@3.2.1:
     resolution: {integrity: sha512-vWQOvRIauvFMzOO+h7QrdsJmtN1AXAFVcaLWP9AseRN2o7iHceZ6bIXhBD4teZl8i91A3gxKnWBlGgjCwU6MFQ==}
     dependencies:
@@ -6633,7 +6653,7 @@ packages:
       magic-string: 0.27.0
       react-docgen-typescript: 2.2.2(typescript@5.2.2)
       typescript: 5.2.2
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
     dev: true
 
   /@jridgewell/gen-mapping@0.3.3:
@@ -6783,6 +6803,18 @@ packages:
       react-is: 16.13.1
     dev: false
 
+  /@loadable/component@5.14.1(react@18.2.0):
+    resolution: {integrity: sha512-UQBZfZrp1FLTf8RNhljXNHFNY4QhAA1L2+GOEeABBFre9TD0aFyQh3Sai5QxcOfy+FTbjIfti5iHaNRR7yUzEQ==}
+    engines: {node: '>=8'}
+    peerDependencies:
+      react: '>=16.3.0'
+    dependencies:
+      '@babel/runtime': 7.20.6
+      hoist-non-react-statics: 3.3.2
+      react: 18.2.0
+      react-is: 16.13.1
+    dev: false
+
   /@loadable/server@5.14.0(@loadable/component@5.14.1)(react@17.0.2):
     resolution: {integrity: sha512-oiZiHzUdkOsDzZNXU6fsZ7U0W3+nWZRljVCFCeR8CZSXEKUfXAllUf8tx5G385q7vapAQpXM7U8EzgDns3Q4vQ==}
     engines: {node: '>=8'}
@@ -6795,6 +6827,18 @@ packages:
       react: 17.0.2
     dev: false
 
+  /@loadable/server@5.14.0(@loadable/component@5.14.1)(react@18.2.0):
+    resolution: {integrity: sha512-oiZiHzUdkOsDzZNXU6fsZ7U0W3+nWZRljVCFCeR8CZSXEKUfXAllUf8tx5G385q7vapAQpXM7U8EzgDns3Q4vQ==}
+    engines: {node: '>=8'}
+    peerDependencies:
+      '@loadable/component': ^5.0.1
+      react: '>=16.3.0'
+    dependencies:
+      '@loadable/component': 5.14.1(react@18.2.0)
+      lodash: 4.17.21
+      react: 18.2.0
+    dev: false
+
   /@loadable/webpack-plugin@5.15.2(webpack@5.90.1):
     resolution: {integrity: sha512-+o87jPHn3E8sqW0aBA+qwKuG8JyIfMGdz3zECv0t/JF0KHhxXtzIlTiqzlIYc5ZpFs/vKSQfjzGIR5tPJjoXDw==}
     engines: {node: '>=8'}
@@ -6815,7 +6859,7 @@ packages:
       nopt: 5.0.0
       npmlog: 5.0.1
       rimraf: 3.0.2
-      semver: 7.6.0
+      semver: 7.5.4
       tar: 6.2.0
     transitivePeerDependencies:
       - encoding
@@ -6880,13 +6924,21 @@ packages:
       react: 17.0.2
     dev: true
 
+  /@mdx-js/react@1.6.22(react@18.2.0):
+    resolution: {integrity: sha512-TDoPum4SHdfPiGSAaRBw7ECyI8VaHpK8GJugbJIJuqyh6kzw9ZLJZW3HGL3NNrJGxcAixUvqROm+YuQOo5eXtg==}
+    peerDependencies:
+      react: ^16.13.1 || ^17.0.0
+    dependencies:
+      react: 18.2.0
+    dev: true
+
   /@mdx-js/react@2.3.0(react@18.2.0):
     resolution: {integrity: sha512-zQH//gdOmuu7nt2oJR29vFhDv88oGPmVw6BggmrHeMI+xgEkp1B2dX9/bMBSYtK0dyLX/aOmesKS09g222K1/g==}
     peerDependencies:
       react: '>=16'
     dependencies:
       '@types/mdx': 2.0.10
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
       react: 18.2.0
     dev: true
 
@@ -7187,20 +7239,20 @@ packages:
     resolution: {integrity: sha512-8KG5RD0GVP4ydEzRn/I4BNDuxDtqVbOdm8675T49OIG/NGhaK0pjPX7ZcDlvKYbA+ulvVK3ztfcF4uBdOxuJbQ==}
     dependencies:
       '@gar/promisify': 1.1.3
-      semver: 7.6.0
+      semver: 7.5.4
 
   /@npmcli/fs@2.1.2:
     resolution: {integrity: sha512-yOJKRvohFOaLqipNtwYB9WugyZKhC/DZC4VYPmpaCzDBrA8YpK3qHZ8/HGscMnE4GqbkLNuVcCnxkeQEdGt6LQ==}
     engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
     dependencies:
       '@gar/promisify': 1.1.3
-      semver: 7.6.0
+      semver: 7.5.4
 
   /@npmcli/fs@3.1.0:
     resolution: {integrity: sha512-7kZUAaLscfgbwBQRbvdMYaZOWyMEcPTH/tJjnyAWJ/dvvs9Ef+CERx/qJb9GExJpl1qipaDGn7KqHnFGGixd0w==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
     dependencies:
-      semver: 7.6.0
+      semver: 7.5.4
 
   /@npmcli/git@2.1.0:
     resolution: {integrity: sha512-/hBFX/QG1b+N7PZBFs0bi+evgRZcK9nWBxQKZkGoXUT5hJSwl5c4d7y8/hm+NQZRPhQ67RzFaj5UM9YeyKoryw==}
@@ -7226,7 +7278,7 @@ packages:
       proc-log: 3.0.0
       promise-inflight: 1.0.1
       promise-retry: 2.0.1
-      semver: 7.6.0
+      semver: 7.5.4
       which: 3.0.1
     transitivePeerDependencies:
       - bluebird
@@ -7309,7 +7361,7 @@ packages:
       json-parse-even-better-errors: 3.0.0
       normalize-package-data: 5.0.0
       proc-log: 3.0.0
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - bluebird
     dev: true
@@ -7725,6 +7777,19 @@ packages:
       lmdb: 2.8.5
     dev: true
 
+  /@parcel/cache@2.10.3(@parcel/core@2.11.0):
+    resolution: {integrity: sha512-fNNOFOl4dwOlzP8iAa+evZ+3BakX0sV+3+PiYA0zaps7EmPmkTSGDhCWzaYRSO8fhmNDlrUX9Xh7b/X738LFqA==}
+    engines: {node: '>= 12.0.0'}
+    peerDependencies:
+      '@parcel/core': ^2.10.3
+    dependencies:
+      '@parcel/core': 2.11.0
+      '@parcel/fs': 2.10.3(@parcel/core@2.11.0)
+      '@parcel/logger': 2.10.3
+      '@parcel/utils': 2.10.3
+      lmdb: 2.8.5
+    dev: false
+
   /@parcel/cache@2.11.0(@parcel/core@2.11.0):
     resolution: {integrity: sha512-RSSkGNjO00lJPyftzaC9eaNVs4jMjPSAm0VJNWQ9JSm2n4A9BzQtTFAt1vhJOzzW1UsQvvBge9DdfkB7a2gIOw==}
     engines: {node: '>= 12.0.0'}
@@ -7744,6 +7809,13 @@ packages:
       chalk: 4.1.2
     dev: true
 
+  /@parcel/codeframe@2.10.3:
+    resolution: {integrity: sha512-70ovUzeXBowDMjK+1xaLT4hm3jZUK7EbaCS6tN1cmmr0S1TDhU7g37jnpni+u9de9Lc/lErwTaDVXUf9WSQzQw==}
+    engines: {node: '>= 12.0.0'}
+    dependencies:
+      chalk: 4.1.2
+    dev: false
+
   /@parcel/codeframe@2.11.0:
     resolution: {integrity: sha512-YHs9g/i5af/sd/JrWAojU9YFbKffcJ3Tx2EJaK0ME8OJsye91UaI/3lxSUYLmJG9e4WLNJtqci8V5FBMz//ZPg==}
     engines: {node: '>= 12.0.0'}
@@ -7894,7 +7966,7 @@ packages:
       json5: 2.2.3
       msgpackr: 1.9.9
       nullthrows: 1.1.1
-      semver: 7.6.0
+      semver: 7.5.4
     dev: true
 
   /@parcel/core@2.11.0:
@@ -7935,6 +8007,14 @@ packages:
       nullthrows: 1.1.1
     dev: true
 
+  /@parcel/diagnostic@2.10.3:
+    resolution: {integrity: sha512-Hf3xG9UVkDABDXWi89TjEP5U1CLUUj81kx/QFeupBXnzt5GEQZBhkxdBq6+4w17Mmuvk7H5uumNsSptkWq9PCA==}
+    engines: {node: '>= 12.0.0'}
+    dependencies:
+      '@mischnic/json-sourcemap': 0.1.1
+      nullthrows: 1.1.1
+    dev: false
+
   /@parcel/diagnostic@2.11.0:
     resolution: {integrity: sha512-4dJmOXVL5YGGQRRsQosQbSRONBcboB71mSwaeaEgz3pPdq9QXVPLACkGe/jTXSqa3OnAHu3g5vQLpE1g5xqBqw==}
     engines: {node: '>= 12.0.0'}
@@ -7947,6 +8027,11 @@ packages:
     engines: {node: '>= 12.0.0'}
     dev: true
 
+  /@parcel/events@2.10.3:
+    resolution: {integrity: sha512-I3FsZYmKzgvo1f6frUWdF7hWwpeWTshPrFqpn9ICDXs/1Hjlf32jNXLBqon9b9XUDfMw4nSRMFMzMLJpbdheGA==}
+    engines: {node: '>= 12.0.0'}
+    dev: false
+
   /@parcel/events@2.11.0:
     resolution: {integrity: sha512-K6SOjOrQsz1GdNl2qKBktq7KJ3Q3yxK8WXdmQYo10wG39dr051xtMb38aqieTp4eVhL8Yaq2iJgGkdr11fuBnA==}
     engines: {node: '>= 12.0.0'}
@@ -7961,7 +8046,7 @@ packages:
       '@parcel/rust': 2.10.2
       '@parcel/types': 2.10.2(@parcel/core@2.10.2)
       '@parcel/utils': 2.10.2
-      '@parcel/watcher': 2.4.0
+      '@parcel/watcher': 2.3.0
       '@parcel/workers': 2.10.2(@parcel/core@2.10.2)
     dev: true
 
@@ -7975,10 +8060,24 @@ packages:
       '@parcel/rust': 2.10.2
       '@parcel/types': 2.10.2(@parcel/core@2.11.0)
       '@parcel/utils': 2.10.2
-      '@parcel/watcher': 2.4.0
+      '@parcel/watcher': 2.3.0
       '@parcel/workers': 2.10.2(@parcel/core@2.11.0)
     dev: true
 
+  /@parcel/fs@2.10.3(@parcel/core@2.11.0):
+    resolution: {integrity: sha512-0w4+Lc7B5VpwqX4GQfjnI5qN7tc9qbGPSPsf/6U2YPWU4dkGsMfPEmLBx7dZvJy3UiGxpsjMMuRHa14+jJ5QrQ==}
+    engines: {node: '>= 12.0.0'}
+    peerDependencies:
+      '@parcel/core': ^2.10.3
+    dependencies:
+      '@parcel/core': 2.11.0
+      '@parcel/rust': 2.10.3
+      '@parcel/types': 2.10.3(@parcel/core@2.11.0)
+      '@parcel/utils': 2.10.3
+      '@parcel/watcher': 2.3.0
+      '@parcel/workers': 2.10.3(@parcel/core@2.11.0)
+    dev: false
+
   /@parcel/fs@2.11.0(@parcel/core@2.11.0):
     resolution: {integrity: sha512-zWckdnnovdrgdFX4QYuQV4bbKCsh6IYCkmwaB4yp47rhw1MP0lkBINLt4yFPHBxWXOpElCfxjL+z69c9xJQRBQ==}
     engines: {node: '>= 12.0.0'}
@@ -7989,7 +8088,7 @@ packages:
       '@parcel/rust': 2.11.0
       '@parcel/types': 2.11.0(@parcel/core@2.11.0)
       '@parcel/utils': 2.11.0
-      '@parcel/watcher': 2.4.0
+      '@parcel/watcher': 2.3.0
       '@parcel/workers': 2.11.0(@parcel/core@2.11.0)
 
   /@parcel/graph@3.0.2:
@@ -8013,6 +8112,14 @@ packages:
       '@parcel/events': 2.10.2
     dev: true
 
+  /@parcel/logger@2.10.3:
+    resolution: {integrity: sha512-mAVTA0NgbbwEUzkzjBqjqyBBax+8bscRaZIAsEqMiSFWGcUmRgwVlH/jy3QDkFc7OHzwvdPK+XlMLV7s/3DJNw==}
+    engines: {node: '>= 12.0.0'}
+    dependencies:
+      '@parcel/diagnostic': 2.10.3
+      '@parcel/events': 2.10.3
+    dev: false
+
   /@parcel/logger@2.11.0:
     resolution: {integrity: sha512-HtMEdCq3LKnvv4T2CIskcqlf2gpBvHMm3pkeUFB/hc/7hW/hE1k6/HA2VOQvc0tBsaMpmEx7PCrfrH56usQSyA==}
     engines: {node: '>= 12.0.0'}
@@ -8027,6 +8134,13 @@ packages:
       chalk: 4.1.2
     dev: true
 
+  /@parcel/markdown-ansi@2.10.3:
+    resolution: {integrity: sha512-uzN1AJmp1oYh/ZLdD9WA7xP5u/L3Bs/6AFZz5s695zus74RCx9OtQcF0Yyl1hbKVJDfuw9WFuzMfPL/9p/C5DQ==}
+    engines: {node: '>= 12.0.0'}
+    dependencies:
+      chalk: 4.1.2
+    dev: false
+
   /@parcel/markdown-ansi@2.11.0:
     resolution: {integrity: sha512-YA60EWbXi6cLOIzcwRC2wijotPauOGQbUi0vSbu0O6/mjQ68kWCMGz0hwZjDRQcPypQVJEIvTgMymLbvumxwhg==}
     engines: {node: '>= 12.0.0'}
@@ -8065,7 +8179,7 @@ packages:
       '@parcel/rust': 2.10.2
       '@parcel/utils': 2.10.2
       nullthrows: 1.1.1
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
@@ -8080,11 +8194,26 @@ packages:
       '@parcel/rust': 2.10.2
       '@parcel/utils': 2.10.2
       nullthrows: 1.1.1
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
 
+  /@parcel/node-resolver-core@3.1.3(@parcel/core@2.11.0):
+    resolution: {integrity: sha512-o7XK1KiK3ymO39bhc5qfDQiZpKA1xQmKg0TEPDNiLIXHKLEBheqarhw3Nwwt9MOFibfwsisQtDTIS+2v9A640A==}
+    engines: {node: '>= 12.0.0'}
+    dependencies:
+      '@mischnic/json-sourcemap': 0.1.1
+      '@parcel/diagnostic': 2.10.3
+      '@parcel/fs': 2.10.3(@parcel/core@2.11.0)
+      '@parcel/rust': 2.10.3
+      '@parcel/utils': 2.10.3
+      nullthrows: 1.1.1
+      semver: 7.5.4
+    transitivePeerDependencies:
+      - '@parcel/core'
+    dev: false
+
   /@parcel/node-resolver-core@3.2.0(@parcel/core@2.11.0):
     resolution: {integrity: sha512-XJRSxCkNbGFWjfmwFdcQZ/qlzWZd35qLtvLz2va8euGL7M5OMEQOv7dsvEhl0R+CC2zcnfFzZwxk78q6ezs8AQ==}
     engines: {node: '>= 12.0.0'}
@@ -8095,7 +8224,7 @@ packages:
       '@parcel/rust': 2.11.0
       '@parcel/utils': 2.11.0
       nullthrows: 1.1.1
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
 
@@ -8107,8 +8236,8 @@ packages:
       '@parcel/plugin': 2.10.2(@parcel/core@2.10.2)
       '@parcel/source-map': 2.1.1
       '@parcel/utils': 2.10.2
-      browserslist: 4.22.1
-      lightningcss: 1.22.1
+      browserslist: 4.23.0
+      lightningcss: 1.24.0
       nullthrows: 1.1.1
     transitivePeerDependencies:
       - '@parcel/core'
@@ -8123,7 +8252,7 @@ packages:
       '@parcel/source-map': 2.1.1
       '@parcel/utils': 2.11.0
       browserslist: 4.23.0
-      lightningcss: 1.23.0
+      lightningcss: 1.24.0
       nullthrows: 1.1.1
     transitivePeerDependencies:
       - '@parcel/core'
@@ -8267,7 +8396,7 @@ packages:
       '@parcel/types': 2.10.2(@parcel/core@2.11.0)
       '@parcel/utils': 2.10.2
       '@parcel/workers': 2.10.2(@parcel/core@2.10.2)
-      semver: 7.6.0
+      semver: 7.5.4
     dev: true
 
   /@parcel/package-manager@2.10.2(@parcel/core@2.11.0):
@@ -8284,9 +8413,26 @@ packages:
       '@parcel/types': 2.10.2(@parcel/core@2.11.0)
       '@parcel/utils': 2.10.2
       '@parcel/workers': 2.10.2(@parcel/core@2.11.0)
-      semver: 7.6.0
+      semver: 7.5.4
     dev: true
 
+  /@parcel/package-manager@2.10.3(@parcel/core@2.11.0):
+    resolution: {integrity: sha512-KqOW5oUmElrcb7d+hOC68ja1PI2qbPZTwdduduRvB90DAweMt7r1046+W2Df5bd+p9iv72DxGEn9xomX+qz9MA==}
+    engines: {node: '>= 12.0.0'}
+    peerDependencies:
+      '@parcel/core': ^2.10.3
+    dependencies:
+      '@parcel/core': 2.11.0
+      '@parcel/diagnostic': 2.10.3
+      '@parcel/fs': 2.10.3(@parcel/core@2.11.0)
+      '@parcel/logger': 2.10.3
+      '@parcel/node-resolver-core': 3.1.3(@parcel/core@2.11.0)
+      '@parcel/types': 2.10.3(@parcel/core@2.11.0)
+      '@parcel/utils': 2.10.3
+      '@parcel/workers': 2.10.3(@parcel/core@2.11.0)
+      semver: 7.5.4
+    dev: false
+
   /@parcel/package-manager@2.11.0(@parcel/core@2.11.0):
     resolution: {integrity: sha512-QzdsrUYlAwIzb8by7WJjqYnbR1MoMKWbtE1MXUeYsZbFusV8B6pOH+lwqNJKS/BFtddZMRPYFueZS2N2fwzjig==}
     engines: {node: '>= 12.0.0'}
@@ -8301,7 +8447,7 @@ packages:
       '@parcel/types': 2.11.0(@parcel/core@2.11.0)
       '@parcel/utils': 2.11.0
       '@parcel/workers': 2.11.0(@parcel/core@2.11.0)
-      semver: 7.6.0
+      semver: 7.5.4
 
   /@parcel/packager-css@2.10.2(@parcel/core@2.10.2):
     resolution: {integrity: sha512-+X4dV7mBdOhXSHeg5gAkk0Qju6A1oezYIancqDC17zoFzbHUfD13nHNDOXrEfMNFVWy93lB8vLJwchH54MDMwQ==}
@@ -8483,6 +8629,15 @@ packages:
       - '@parcel/core'
     dev: true
 
+  /@parcel/plugin@2.10.3(@parcel/core@2.11.0):
+    resolution: {integrity: sha512-FgsfGKSdtSV1EcO2NWFCZaY14W0PnEEF8vZaRCTML3vKfUbilYs/biaqf5geFOu4DwRuCC8unOTqFy7dLwcK/A==}
+    engines: {node: '>= 12.0.0'}
+    dependencies:
+      '@parcel/types': 2.10.3(@parcel/core@2.11.0)
+    transitivePeerDependencies:
+      - '@parcel/core'
+    dev: false
+
   /@parcel/plugin@2.11.0(@parcel/core@2.11.0):
     resolution: {integrity: sha512-9npuKBlhnPn7oeUpLJGecceg16GkXbvzbr6MNSZiHhkx3IBeITHQXlZnp2zAjUOFreNsYOfifwEF2S4KsARfBQ==}
     engines: {node: '>= 12.0.0'}
@@ -8500,6 +8655,15 @@ packages:
       chrome-trace-event: 1.0.3
     dev: true
 
+  /@parcel/profiler@2.10.3:
+    resolution: {integrity: sha512-yikaM6/vsvjDCcBHAXTKmDsWUF3UvC0lMG8RpnuVSN+R40MGH1vyrR4vNnqhkiCcs0RkVXm7bpuz3cDJLNLYSQ==}
+    engines: {node: '>= 12.0.0'}
+    dependencies:
+      '@parcel/diagnostic': 2.10.3
+      '@parcel/events': 2.10.3
+      chrome-trace-event: 1.0.3
+    dev: false
+
   /@parcel/profiler@2.11.0:
     resolution: {integrity: sha512-s10SS09prOdwnaAcjK8M5zO8o+zPJJW5oOqXPNdf6KH4NGD/ue7iOk2xM8QLw6ulSwxE7NDt++lyfW3AXgCZwg==}
     engines: {node: '>= 12.0.0'}
@@ -8694,6 +8858,11 @@ packages:
     engines: {node: '>= 12.0.0'}
     dev: true
 
+  /@parcel/rust@2.10.3:
+    resolution: {integrity: sha512-s1dD1QI/6JkWLICsFh8/iUvO7W1aj/avx+2mCSzuwEIsMywexpBf56qhVYMa3D9D50hS1h5FMk9RrSnSiPf8WA==}
+    engines: {node: '>= 12.0.0'}
+    dev: false
+
   /@parcel/rust@2.11.0:
     resolution: {integrity: sha512-UkLWdHOD8Md2YmJDPsqd3yIs9chhdl/ATfV/B/xdPKGmqtNouYpDCRlq+WxMt3mLoYgHEg9UwrWLTebo2rr2iQ==}
     engines: {node: '>= 12.0.0'}
@@ -8715,7 +8884,7 @@ packages:
       browserslist: 4.23.0
       json5: 2.2.3
       nullthrows: 1.1.1
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
@@ -8731,7 +8900,7 @@ packages:
       browserslist: 4.23.0
       json5: 2.2.3
       nullthrows: 1.1.1
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
@@ -8745,7 +8914,7 @@ packages:
       '@parcel/source-map': 2.1.1
       '@parcel/utils': 2.10.2
       browserslist: 4.23.0
-      lightningcss: 1.23.0
+      lightningcss: 1.24.0
       nullthrows: 1.1.1
     transitivePeerDependencies:
       - '@parcel/core'
@@ -8760,7 +8929,7 @@ packages:
       '@parcel/source-map': 2.1.1
       '@parcel/utils': 2.11.0
       browserslist: 4.23.0
-      lightningcss: 1.23.0
+      lightningcss: 1.24.0
       nullthrows: 1.1.1
     transitivePeerDependencies:
       - '@parcel/core'
@@ -8777,7 +8946,7 @@ packages:
       posthtml: 0.16.6
       posthtml-parser: 0.10.2
       posthtml-render: 3.0.0
-      semver: 7.6.0
+      semver: 7.5.4
       srcset: 4.0.0
     transitivePeerDependencies:
       - '@parcel/core'
@@ -8794,7 +8963,7 @@ packages:
       posthtml: 0.16.6
       posthtml-parser: 0.10.2
       posthtml-render: 3.0.0
-      semver: 7.6.0
+      semver: 7.5.4
       srcset: 4.0.0
     transitivePeerDependencies:
       - '@parcel/core'
@@ -8843,7 +9012,7 @@ packages:
       browserslist: 4.23.0
       nullthrows: 1.1.1
       regenerator-runtime: 0.13.11
-      semver: 7.6.0
+      semver: 7.5.4
     dev: true
 
   /@parcel/transformer-js@2.11.0(@parcel/core@2.11.0):
@@ -8897,7 +9066,7 @@ packages:
       clone: 2.1.2
       nullthrows: 1.1.1
       postcss-value-parser: 4.2.0
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
@@ -8913,7 +9082,7 @@ packages:
       clone: 2.1.2
       nullthrows: 1.1.1
       postcss-value-parser: 4.2.0
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
@@ -8928,7 +9097,7 @@ packages:
       posthtml: 0.16.6
       posthtml-parser: 0.10.2
       posthtml-render: 3.0.0
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
@@ -8943,7 +9112,7 @@ packages:
       posthtml: 0.16.6
       posthtml-parser: 0.10.2
       posthtml-render: 3.0.0
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
@@ -8999,7 +9168,7 @@ packages:
       posthtml: 0.16.6
       posthtml-parser: 0.10.2
       posthtml-render: 3.0.0
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
@@ -9015,7 +9184,7 @@ packages:
       posthtml: 0.16.6
       posthtml-parser: 0.10.2
       posthtml-render: 3.0.0
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - '@parcel/core'
     dev: true
@@ -9102,6 +9271,20 @@ packages:
       - '@parcel/core'
     dev: true
 
+  /@parcel/types@2.10.3(@parcel/core@2.11.0):
+    resolution: {integrity: sha512-4ISgDKcbJsR7NKj2jquPUPQWc/b2x6zHb/jZVdHVzMQxJp98DX+cvQR137iOTXUAFtwkKVjFcHWfejwGdGf9bw==}
+    dependencies:
+      '@parcel/cache': 2.10.3(@parcel/core@2.11.0)
+      '@parcel/diagnostic': 2.10.3
+      '@parcel/fs': 2.10.3(@parcel/core@2.11.0)
+      '@parcel/package-manager': 2.10.3(@parcel/core@2.11.0)
+      '@parcel/source-map': 2.1.1
+      '@parcel/workers': 2.10.3(@parcel/core@2.11.0)
+      utility-types: 3.10.0
+    transitivePeerDependencies:
+      - '@parcel/core'
+    dev: false
+
   /@parcel/types@2.11.0(@parcel/core@2.11.0):
     resolution: {integrity: sha512-lN5XlfV9b1s2rli8q1LqsLtu+D4ZwNI3sKmNcL/3tohSfQcF2EgF+MaiANGo9VzXOzoWFHt4dqWjO4OcdyC5tg==}
     dependencies:
@@ -9129,6 +9312,20 @@ packages:
       nullthrows: 1.1.1
     dev: true
 
+  /@parcel/utils@2.10.3:
+    resolution: {integrity: sha512-l9pEQgq+D57t42m2sJkdU08Dpp0HVzDEwVrp/by/l37ZkYPJ2Me3oXtsJhvA+hej2kO8+FuKPm64FaUVaA2g+w==}
+    engines: {node: '>= 12.0.0'}
+    dependencies:
+      '@parcel/codeframe': 2.10.3
+      '@parcel/diagnostic': 2.10.3
+      '@parcel/logger': 2.10.3
+      '@parcel/markdown-ansi': 2.10.3
+      '@parcel/rust': 2.10.3
+      '@parcel/source-map': 2.1.1
+      chalk: 4.1.2
+      nullthrows: 1.1.1
+    dev: false
+
   /@parcel/utils@2.11.0:
     resolution: {integrity: sha512-AcL70cXlIyE7eQdvjQbYxegN5l+skqvlJllxTWg4YkIZe9p8Gmv74jLAeLWh5F+IGl5WRn0TSy9JhNJjIMQGwQ==}
     engines: {node: '>= 12.0.0'}
@@ -9142,76 +9339,157 @@ packages:
       chalk: 4.1.2
       nullthrows: 1.1.1
 
-  /@parcel/watcher-android-arm64@2.4.0:
-    resolution: {integrity: sha512-+fPtO/GsbYX1LJnCYCaDVT3EOBjvSFdQN9Mrzh9zWAOOfvidPWyScTrHIZHHfJBvlHzNA0Gy0U3NXFA/M7PHUA==}
+  /@parcel/watcher-android-arm64@2.3.0:
+    resolution: {integrity: sha512-f4o9eA3dgk0XRT3XhB0UWpWpLnKgrh1IwNJKJ7UJek7eTYccQ8LR7XUWFKqw6aEq5KUNlCcGvSzKqSX/vtWVVA==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [android]
     requiresBuild: true
     optional: true
 
-  /@parcel/watcher-darwin-arm64@2.4.0:
-    resolution: {integrity: sha512-T/At5pansFuQ8VJLRx0C6C87cgfqIYhW2N/kBfLCUvDhCah0EnLLwaD/6MW3ux+rpgkpQAnMELOCTKlbwncwiA==}
+  /@parcel/watcher-android-arm64@2.4.1:
+    resolution: {integrity: sha512-LOi/WTbbh3aTn2RYddrO8pnapixAziFl6SMxHM69r3tvdSm94JtCenaKgk1GRg5FJ5wpMCpHeW+7yqPlvZv7kg==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
+    os: [android]
+    requiresBuild: true
+    dev: false
+    optional: true
+
+  /@parcel/watcher-darwin-arm64@2.3.0:
+    resolution: {integrity: sha512-mKY+oijI4ahBMc/GygVGvEdOq0L4DxhYgwQqYAz/7yPzuGi79oXrZG52WdpGA1wLBPrYb0T8uBaGFo7I6rvSKw==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+    requiresBuild: true
+    optional: true
+
+  /@parcel/watcher-darwin-arm64@2.4.1:
+    resolution: {integrity: sha512-ln41eihm5YXIY043vBrrHfn94SIBlqOWmoROhsMVTSXGh0QahKGy77tfEywQ7v3NywyxBBkGIfrWRHm0hsKtzA==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+    requiresBuild: true
+    dev: false
+    optional: true
+
+  /@parcel/watcher-darwin-x64@2.3.0:
+    resolution: {integrity: sha512-20oBj8LcEOnLE3mgpy6zuOq8AplPu9NcSSSfyVKgfOhNAc4eF4ob3ldj0xWjGGbOF7Dcy1Tvm6ytvgdjlfUeow==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
     os: [darwin]
     requiresBuild: true
     optional: true
 
-  /@parcel/watcher-darwin-x64@2.4.0:
-    resolution: {integrity: sha512-vZMv9jl+szz5YLsSqEGCMSllBl1gU1snfbRL5ysJU03MEa6gkVy9OMcvXV1j4g0++jHEcvzhs3Z3LpeEbVmY6Q==}
+  /@parcel/watcher-darwin-x64@2.4.1:
+    resolution: {integrity: sha512-yrw81BRLjjtHyDu7J61oPuSoeYWR3lDElcPGJyOvIXmor6DEo7/G2u1o7I38cwlcoBHQFULqF6nesIX3tsEXMg==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [darwin]
     requiresBuild: true
+    dev: false
+    optional: true
+
+  /@parcel/watcher-freebsd-x64@2.3.0:
+    resolution: {integrity: sha512-7LftKlaHunueAEiojhCn+Ef2CTXWsLgTl4hq0pkhkTBFI3ssj2bJXmH2L67mKpiAD5dz66JYk4zS66qzdnIOgw==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
+    os: [freebsd]
+    requiresBuild: true
     optional: true
 
-  /@parcel/watcher-freebsd-x64@2.4.0:
-    resolution: {integrity: sha512-dHTRMIplPDT1M0+BkXjtMN+qLtqq24sLDUhmU+UxxLP2TEY2k8GIoqIJiVrGWGomdWsy5IO27aDV1vWyQ6gfHA==}
+  /@parcel/watcher-freebsd-x64@2.4.1:
+    resolution: {integrity: sha512-TJa3Pex/gX3CWIx/Co8k+ykNdDCLx+TuZj3f3h7eOjgpdKM+Mnix37RYsYU4LHhiYJz3DK5nFCCra81p6g050w==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [freebsd]
     requiresBuild: true
+    dev: false
+    optional: true
+
+  /@parcel/watcher-linux-arm-glibc@2.3.0:
+    resolution: {integrity: sha512-1apPw5cD2xBv1XIHPUlq0cO6iAaEUQ3BcY0ysSyD9Kuyw4MoWm1DV+W9mneWI+1g6OeP6dhikiFE6BlU+AToTQ==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm]
+    os: [linux]
+    requiresBuild: true
     optional: true
 
-  /@parcel/watcher-linux-arm-glibc@2.4.0:
-    resolution: {integrity: sha512-9NQXD+qk46RwATNC3/UB7HWurscY18CnAPMTFcI9Y8CTbtm63/eex1SNt+BHFinEQuLBjaZwR2Lp+n7pmEJPpQ==}
+  /@parcel/watcher-linux-arm-glibc@2.4.1:
+    resolution: {integrity: sha512-4rVYDlsMEYfa537BRXxJ5UF4ddNwnr2/1O4MHM5PjI9cvV2qymvhwZSFgXqbS8YoTk5i/JR0L0JDs69BUn45YA==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm]
     os: [linux]
     requiresBuild: true
+    dev: false
     optional: true
 
-  /@parcel/watcher-linux-arm64-glibc@2.4.0:
-    resolution: {integrity: sha512-QuJTAQdsd7PFW9jNGaV9Pw+ZMWV9wKThEzzlY3Lhnnwy7iW23qtQFPql8iEaSFMCVI5StNNmONUopk+MFKpiKg==}
+  /@parcel/watcher-linux-arm64-glibc@2.3.0:
+    resolution: {integrity: sha512-mQ0gBSQEiq1k/MMkgcSB0Ic47UORZBmWoAWlMrTW6nbAGoLZP+h7AtUM7H3oDu34TBFFvjy4JCGP43JlylkTQA==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [linux]
     requiresBuild: true
     optional: true
 
-  /@parcel/watcher-linux-arm64-musl@2.4.0:
-    resolution: {integrity: sha512-oyN+uA9xcTDo/45bwsd6TFHa7Lc7hKujyMlvwrCLvSckvWogndCEoVYFNfZ6JJ2KNL/6fFiGPcbjp8jJmEh5Ng==}
+  /@parcel/watcher-linux-arm64-glibc@2.4.1:
+    resolution: {integrity: sha512-BJ7mH985OADVLpbrzCLgrJ3TOpiZggE9FMblfO65PlOCdG++xJpKUJ0Aol74ZUIYfb8WsRlUdgrZxKkz3zXWYA==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [linux]
     requiresBuild: true
+    dev: false
     optional: true
 
-  /@parcel/watcher-linux-x64-glibc@2.4.0:
-    resolution: {integrity: sha512-KphV8awJmxU3q52JQvJot0QMu07CIyEjV+2Tb2ZtbucEgqyRcxOBDMsqp1JNq5nuDXtcCC0uHQICeiEz38dPBQ==}
+  /@parcel/watcher-linux-arm64-musl@2.3.0:
+    resolution: {integrity: sha512-LXZAExpepJew0Gp8ZkJ+xDZaTQjLHv48h0p0Vw2VMFQ8A+RKrAvpFuPVCVwKJCr5SE+zvaG+Etg56qXvTDIedw==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    requiresBuild: true
+    optional: true
+
+  /@parcel/watcher-linux-arm64-musl@2.4.1:
+    resolution: {integrity: sha512-p4Xb7JGq3MLgAfYhslU2SjoV9G0kI0Xry0kuxeG/41UfpjHGOhv7UoUDAz/jb1u2elbhazy4rRBL8PegPJFBhA==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [linux]
+    requiresBuild: true
+    dev: false
+    optional: true
+
+  /@parcel/watcher-linux-x64-glibc@2.3.0:
+    resolution: {integrity: sha512-P7Wo91lKSeSgMTtG7CnBS6WrA5otr1K7shhSjKHNePVmfBHDoAOHYRXgUmhiNfbcGk0uMCHVcdbfxtuiZCHVow==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [linux]
     requiresBuild: true
     optional: true
 
-  /@parcel/watcher-linux-x64-musl@2.4.0:
-    resolution: {integrity: sha512-7jzcOonpXNWcSijPpKD5IbC6xC7yTibjJw9jviVzZostYLGxbz8LDJLUnLzLzhASPlPGgpeKLtFUMjAAzM+gSA==}
+  /@parcel/watcher-linux-x64-glibc@2.4.1:
+    resolution: {integrity: sha512-s9O3fByZ/2pyYDPoLM6zt92yu6P4E39a03zvO0qCHOTjxmt3GHRMLuRZEWhWLASTMSrrnVNWdVI/+pUElJBBBg==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [linux]
     requiresBuild: true
+    dev: false
+    optional: true
+
+  /@parcel/watcher-linux-x64-musl@2.3.0:
+    resolution: {integrity: sha512-+kiRE1JIq8QdxzwoYY+wzBs9YbJ34guBweTK8nlzLKimn5EQ2b2FSC+tAOpq302BuIMjyuUGvBiUhEcLIGMQ5g==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
+    os: [linux]
+    requiresBuild: true
+    optional: true
+
+  /@parcel/watcher-linux-x64-musl@2.4.1:
+    resolution: {integrity: sha512-L2nZTYR1myLNST0O632g0Dx9LyMNHrn6TOt76sYxWLdff3cB22/GZX2UPtJnaqQPdCRoszoY5rcOj4oMTtp5fQ==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
+    os: [linux]
+    requiresBuild: true
+    dev: false
     optional: true
 
   /@parcel/watcher-wasm@2.3.0:
@@ -9225,8 +9503,8 @@ packages:
     bundledDependencies:
       - napi-wasm
 
-  /@parcel/watcher-wasm@2.4.0:
-    resolution: {integrity: sha512-MNgQ4WCbBybqQ97KwR/hqJGYTg3+s8qHpgIyFWB2qJOBvoJWbXuJGmm4ZkPLq2bMaANqCZqrXwmKYagZTkMKZA==}
+  /@parcel/watcher-wasm@2.4.1:
+    resolution: {integrity: sha512-/ZR0RxqxU/xxDGzbzosMjh4W6NdYFMqq2nvo2b8SLi7rsl/4jkL8S5stIikorNkdR50oVDvqb/3JT05WM+CRRA==}
     engines: {node: '>= 10.0.0'}
     dependencies:
       is-glob: 4.0.3
@@ -9236,32 +9514,81 @@ packages:
     bundledDependencies:
       - napi-wasm
 
-  /@parcel/watcher-win32-arm64@2.4.0:
-    resolution: {integrity: sha512-NOej2lqlq8bQNYhUMnOD0nwvNql8ToQF+1Zhi9ULZoG+XTtJ9hNnCFfyICxoZLXor4bBPTOnzs/aVVoefYnjIg==}
+  /@parcel/watcher-win32-arm64@2.3.0:
+    resolution: {integrity: sha512-35gXCnaz1AqIXpG42evcoP2+sNL62gZTMZne3IackM+6QlfMcJLy3DrjuL6Iks7Czpd3j4xRBzez3ADCj1l7Aw==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [win32]
     requiresBuild: true
     optional: true
 
-  /@parcel/watcher-win32-ia32@2.4.0:
-    resolution: {integrity: sha512-IO/nM+K2YD/iwjWAfHFMBPz4Zqn6qBDqZxY4j2n9s+4+OuTSRM/y/irksnuqcspom5DjkSeF9d0YbO+qpys+JA==}
+  /@parcel/watcher-win32-arm64@2.4.1:
+    resolution: {integrity: sha512-Uq2BPp5GWhrq/lcuItCHoqxjULU1QYEcyjSO5jqqOK8RNFDBQnenMMx4gAl3v8GiWa59E9+uDM7yZ6LxwUIfRg==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [win32]
+    requiresBuild: true
+    dev: false
+    optional: true
+
+  /@parcel/watcher-win32-ia32@2.3.0:
+    resolution: {integrity: sha512-FJS/IBQHhRpZ6PiCjFt1UAcPr0YmCLHRbTc00IBTrelEjlmmgIVLeOx4MSXzx2HFEy5Jo5YdhGpxCuqCyDJ5ow==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [ia32]
+    os: [win32]
+    requiresBuild: true
+    optional: true
+
+  /@parcel/watcher-win32-ia32@2.4.1:
+    resolution: {integrity: sha512-maNRit5QQV2kgHFSYwftmPBxiuK5u4DXjbXx7q6eKjq5dsLXZ4FJiVvlcw35QXzk0KrUecJmuVFbj4uV9oYrcw==}
     engines: {node: '>= 10.0.0'}
     cpu: [ia32]
     os: [win32]
     requiresBuild: true
+    dev: false
+    optional: true
+
+  /@parcel/watcher-win32-x64@2.3.0:
+    resolution: {integrity: sha512-dLx+0XRdMnVI62kU3wbXvbIRhLck4aE28bIGKbRGS7BJNt54IIj9+c/Dkqb+7DJEbHUZAX1bwaoM8PqVlHJmCA==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
+    os: [win32]
+    requiresBuild: true
     optional: true
 
-  /@parcel/watcher-win32-x64@2.4.0:
-    resolution: {integrity: sha512-pAUyUVjfFjWaf/pShmJpJmNxZhbMvJASUpdes9jL6bTEJ+gDxPRSpXTIemNyNsb9AtbiGXs9XduP1reThmd+dA==}
+  /@parcel/watcher-win32-x64@2.4.1:
+    resolution: {integrity: sha512-+DvS92F9ezicfswqrvIRM2njcYJbd5mb9CUgtrHCHmvn7pPPa+nMDRu1o1bYYz/l5IB2NVGNJWiH7h1E58IF2A==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [win32]
     requiresBuild: true
+    dev: false
     optional: true
 
-  /@parcel/watcher@2.4.0:
-    resolution: {integrity: sha512-XJLGVL0DEclX5pcWa2N9SX1jCGTDd8l972biNooLFtjneuGqodupPQh6XseXIBBeVIMaaJ7bTcs3qGvXwsp4vg==}
+  /@parcel/watcher@2.3.0:
+    resolution: {integrity: sha512-pW7QaFiL11O0BphO+bq3MgqeX/INAk9jgBldVDYjlQPO4VddoZnF22TcF9onMhnLVHuNqBJeRf+Fj7eezi/+rQ==}
+    engines: {node: '>= 10.0.0'}
+    dependencies:
+      detect-libc: 1.0.3
+      is-glob: 4.0.3
+      micromatch: 4.0.5
+      node-addon-api: 7.0.0
+    optionalDependencies:
+      '@parcel/watcher-android-arm64': 2.3.0
+      '@parcel/watcher-darwin-arm64': 2.3.0
+      '@parcel/watcher-darwin-x64': 2.3.0
+      '@parcel/watcher-freebsd-x64': 2.3.0
+      '@parcel/watcher-linux-arm-glibc': 2.3.0
+      '@parcel/watcher-linux-arm64-glibc': 2.3.0
+      '@parcel/watcher-linux-arm64-musl': 2.3.0
+      '@parcel/watcher-linux-x64-glibc': 2.3.0
+      '@parcel/watcher-linux-x64-musl': 2.3.0
+      '@parcel/watcher-win32-arm64': 2.3.0
+      '@parcel/watcher-win32-ia32': 2.3.0
+      '@parcel/watcher-win32-x64': 2.3.0
+
+  /@parcel/watcher@2.4.1:
+    resolution: {integrity: sha512-HNjmfLQEVRZmHRET336f20H/8kOozUGwk7yajvsonjNxbj2wBTK1WsQuHkD5yYh9RxFGL2EyDHryOihOwUoKDA==}
     engines: {node: '>= 10.0.0'}
     dependencies:
       detect-libc: 1.0.3
@@ -9269,18 +9596,19 @@ packages:
       micromatch: 4.0.5
       node-addon-api: 7.0.0
     optionalDependencies:
-      '@parcel/watcher-android-arm64': 2.4.0
-      '@parcel/watcher-darwin-arm64': 2.4.0
-      '@parcel/watcher-darwin-x64': 2.4.0
-      '@parcel/watcher-freebsd-x64': 2.4.0
-      '@parcel/watcher-linux-arm-glibc': 2.4.0
-      '@parcel/watcher-linux-arm64-glibc': 2.4.0
-      '@parcel/watcher-linux-arm64-musl': 2.4.0
-      '@parcel/watcher-linux-x64-glibc': 2.4.0
-      '@parcel/watcher-linux-x64-musl': 2.4.0
-      '@parcel/watcher-win32-arm64': 2.4.0
-      '@parcel/watcher-win32-ia32': 2.4.0
-      '@parcel/watcher-win32-x64': 2.4.0
+      '@parcel/watcher-android-arm64': 2.4.1
+      '@parcel/watcher-darwin-arm64': 2.4.1
+      '@parcel/watcher-darwin-x64': 2.4.1
+      '@parcel/watcher-freebsd-x64': 2.4.1
+      '@parcel/watcher-linux-arm-glibc': 2.4.1
+      '@parcel/watcher-linux-arm64-glibc': 2.4.1
+      '@parcel/watcher-linux-arm64-musl': 2.4.1
+      '@parcel/watcher-linux-x64-glibc': 2.4.1
+      '@parcel/watcher-linux-x64-musl': 2.4.1
+      '@parcel/watcher-win32-arm64': 2.4.1
+      '@parcel/watcher-win32-ia32': 2.4.1
+      '@parcel/watcher-win32-x64': 2.4.1
+    dev: false
 
   /@parcel/workers@2.10.2(@parcel/core@2.10.2):
     resolution: {integrity: sha512-LvifdeORXKGGyhwOwnYxn1AsJ5u6Ihk2RJUxsVA4WYEjz2PSsmLAUDdp48ovssSMnTb9P2g4RrbEG1mJjYtBGA==}
@@ -9312,6 +9640,21 @@ packages:
       nullthrows: 1.1.1
     dev: true
 
+  /@parcel/workers@2.10.3(@parcel/core@2.11.0):
+    resolution: {integrity: sha512-qlN8G3VybPHVIbD6fsZr2gmrXG2UlROUQIPW/kkAvjQ29uRfFn7YEC8CHTICt8M1HhCNkr0cMXkuXQBi0l3kAg==}
+    engines: {node: '>= 12.0.0'}
+    peerDependencies:
+      '@parcel/core': ^2.10.3
+    dependencies:
+      '@parcel/core': 2.11.0
+      '@parcel/diagnostic': 2.10.3
+      '@parcel/logger': 2.10.3
+      '@parcel/profiler': 2.10.3
+      '@parcel/types': 2.10.3(@parcel/core@2.11.0)
+      '@parcel/utils': 2.10.3
+      nullthrows: 1.1.1
+    dev: false
+
   /@parcel/workers@2.11.0(@parcel/core@2.11.0):
     resolution: {integrity: sha512-wjybqdSy6Nk0N9iBGsFcp7739W2zvx0WGfVxPVShqhz46pIkPOiFF/iSn+kFu5EmMKTRWeUif42+a6rRZ7pCnQ==}
     engines: {node: '>= 12.0.0'}
@@ -9447,7 +9790,7 @@ packages:
   /@popperjs/core@2.11.8:
     resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
 
-  /@preact/preset-vite@2.8.1(@babel/core@7.23.9)(preact@10.19.4)(vite@4.5.0):
+  /@preact/preset-vite@2.8.1(@babel/core@7.23.9)(preact@10.19.6)(vite@4.5.0):
     resolution: {integrity: sha512-a9KV4opdj17X2gOFuGup0aE+sXYABX/tJi/QDptOrleX4FlnoZgDWvz45tHOdVfrZX+3uvVsIYPHxRsTerkDNA==}
     peerDependencies:
       '@babel/core': 7.x
@@ -9456,7 +9799,7 @@ packages:
       '@babel/core': 7.23.9
       '@babel/plugin-transform-react-jsx': 7.22.15(@babel/core@7.23.9)
       '@babel/plugin-transform-react-jsx-development': 7.22.5(@babel/core@7.23.9)
-      '@prefresh/vite': 2.4.5(preact@10.19.4)(vite@4.5.0)
+      '@prefresh/vite': 2.4.5(preact@10.19.6)(vite@4.5.0)
       '@rollup/pluginutils': 4.2.1
       babel-plugin-transform-hook-names: 1.0.2(@babel/core@7.23.9)
       debug: 4.3.4(supports-color@8.1.1)
@@ -9474,19 +9817,19 @@ packages:
     resolution: {integrity: sha512-uG3jGEAysxWoyG3XkYfjYHgaySFrSsaEb4GagLzYaxlydbuREtaX+FTxuIidp241RaLl85XoHg9Ej6E4+V1pcg==}
     dev: false
 
-  /@prefresh/core@1.5.2(preact@10.19.4):
+  /@prefresh/core@1.5.2(preact@10.19.6):
     resolution: {integrity: sha512-A/08vkaM1FogrCII5PZKCrygxSsc11obExBScm3JF1CryK2uDS3ZXeni7FeKCx1nYdUkj4UcJxzPzc1WliMzZA==}
     peerDependencies:
       preact: ^10.0.0
     dependencies:
-      preact: 10.19.4
+      preact: 10.19.6
     dev: false
 
   /@prefresh/utils@1.2.0:
     resolution: {integrity: sha512-KtC/fZw+oqtwOLUFM9UtiitB0JsVX0zLKNyRTA332sqREqSALIIQQxdUCS1P3xR/jT1e2e8/5rwH6gdcMLEmsQ==}
     dev: false
 
-  /@prefresh/vite@2.4.5(preact@10.19.4)(vite@4.5.0):
+  /@prefresh/vite@2.4.5(preact@10.19.6)(vite@4.5.0):
     resolution: {integrity: sha512-iForDVJ2M8gQYnm5pHumvTEJjGGc7YNYC0GVKnHFL+GvFfKHfH9Rpq67nUAzNbjuLEpqEOUuQVQajMazWu2ZNQ==}
     peerDependencies:
       preact: ^10.4.0
@@ -9494,10 +9837,10 @@ packages:
     dependencies:
       '@babel/core': 7.23.9
       '@prefresh/babel-plugin': 0.5.1
-      '@prefresh/core': 1.5.2(preact@10.19.4)
+      '@prefresh/core': 1.5.2(preact@10.19.6)
       '@prefresh/utils': 1.2.0
       '@rollup/pluginutils': 4.2.1
-      preact: 10.19.4
+      preact: 10.19.6
       vite: 4.5.0
     transitivePeerDependencies:
       - supports-color
@@ -10091,28 +10434,28 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/breadcrumbs@3.5.9(react@18.2.0):
-    resolution: {integrity: sha512-asbXTL5NjeHl1+YIF0K70y8tNHk8Lb6VneYH8yOkpLO49ejyNDYBK0tp0jtI9IZAQiTa2qkhYq58c9LloTwebQ==}
+  /@react-aria/breadcrumbs@3.5.8(react@18.2.0):
+    resolution: {integrity: sha512-jeek23igeqXct7S3ShW2jtFUc5g3fS9ZEBZkF64FWBrwfCiaZwb8TcKkK/xFw36/q5mxEt+seNiqnNzvsICJuQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/link': 3.6.3(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/link': 3.6.2(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-types/breadcrumbs': 3.7.2(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
     dev: false
 
-  /@react-aria/button@3.9.1(react@18.2.0):
-    resolution: {integrity: sha512-nAnLMUAnwIVcRkKzS1G2IU6LZSkIWPJGu9amz/g7Y02cGUwFp3lk5bEw2LdoaXiSDJNSX8g0SZFU8FROg57jfQ==}
+  /@react-aria/button@3.9.0(react@18.2.0):
+    resolution: {integrity: sha512-Jri4OCN+4YmpJDPNQvk1DJoskKD9sdTxZaWWWJdAwoSIunZk3IEBXVvRfKzsEAVtI+UJN25zC2kyjXbVPS2XAA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-stately/toggle': 3.7.0(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
@@ -10135,20 +10478,20 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/calendar@3.5.4(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-8k7khgea5kwfWriZJWCADNB0R2d7g5A6tTjUEktK4FFZcTb0RCubFejts4hRyzKlF9XHUro2dfh6sbZrzfMKDQ==}
+  /@react-aria/calendar@3.5.3(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-jW48jk0TIe0HAJS+z8zqd8M86FEuqrk1qEIjMWnf8rFnA7hPPpjdjUrY9vSIeC95NcbyZbFnr1bHzQjAIzosQw==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@internationalized/date': 3.5.1
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
+      '@internationalized/date': 3.5.0
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
       '@react-aria/live-announcer': 3.3.1
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/calendar': 3.4.3(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/calendar': 3.4.2(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
-      '@react-types/calendar': 3.4.3(react@18.2.0)
+      '@react-types/calendar': 3.4.2(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
@@ -10175,16 +10518,16 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/checkbox@3.13.0(react@18.2.0):
-    resolution: {integrity: sha512-eylJwtADIPKJ1Y5rITNJm/8JD8sXG2nhiZBIg1ko44Szxrpu+Le53NoGtg8nlrfh9vbUrXVvuFtf2jxbPXR5Jw==}
+  /@react-aria/checkbox@3.12.0(react@18.2.0):
+    resolution: {integrity: sha512-CyFZoI+z9hhyB3wb7IBsZxE30vXfYO2vSyET16zlkJ4qiFMqMiVLE4ekq034MHltCdpAczgP5yfKgNnJOmj7vQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/form': 3.0.1(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/toggle': 3.10.0(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/checkbox': 3.6.1(react@18.2.0)
+      '@react-aria/form': 3.0.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/toggle': 3.9.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/checkbox': 3.6.0(react@18.2.0)
       '@react-stately/form': 3.0.0(react@18.2.0)
       '@react-stately/toggle': 3.7.0(react@18.2.0)
       '@react-types/checkbox': 3.6.0(react@18.2.0)
@@ -10212,25 +10555,25 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/combobox@3.8.1(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-0Zsy91WC2uhnIjtProL1E5qRjBtRVdsNgpr8T9QCQht4i2sHd8L/srrOx7b6vRIngUMZq7GofOpQcKVdxx4kEA==}
+  /@react-aria/combobox@3.8.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-lInzzZrH4vFlxmvDpXgQRkkREm7YIx258IRpQqll8Bny2vKMmZoF06zWMbcHP0CjFqYxExQeTjSYx0OTRRxkCQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/listbox': 3.11.3(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/listbox': 3.11.2(react-dom@18.2.0)(react@18.2.0)
       '@react-aria/live-announcer': 3.3.1
-      '@react-aria/menu': 3.12.0(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/overlays': 3.20.0(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/selection': 3.17.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/textfield': 3.14.0(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/combobox': 3.8.1(react@18.2.0)
+      '@react-aria/menu': 3.11.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/overlays': 3.19.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/selection': 3.17.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/textfield': 3.13.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/collections': 3.10.3(react@18.2.0)
+      '@react-stately/combobox': 3.8.0(react@18.2.0)
       '@react-stately/form': 3.0.0(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
-      '@react-types/combobox': 3.10.0(react@18.2.0)
+      '@react-types/combobox': 3.9.0(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
@@ -10262,27 +10605,27 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/datepicker@3.9.1(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-bdlY2H/zwe3hQf64Lp1oGTf7Va8ennDyAv4Ffowb+BOoL8+FB9smtGyONKe87zXu7VJL2M5xYAi4n7c004PM+w==}
+  /@react-aria/datepicker@3.9.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-FIpiJxwBNOM8a6hLOqQJ4JrvRiGL6Zr44E1mHtAWStp2kBEJ6+O2JRm4PQ5Pzvdw6xnCpOBdfESdNdlXN7lVqQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@internationalized/date': 3.5.1
-      '@internationalized/number': 3.5.0
-      '@internationalized/string': 3.2.0
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/form': 3.0.1(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/spinbutton': 3.6.1(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/datepicker': 3.9.1(react@18.2.0)
+      '@internationalized/date': 3.5.0
+      '@internationalized/number': 3.4.0
+      '@internationalized/string': 3.1.1
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/form': 3.0.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/spinbutton': 3.6.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/datepicker': 3.9.0(react@18.2.0)
       '@react-stately/form': 3.0.0(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
-      '@react-types/calendar': 3.4.3(react@18.2.0)
-      '@react-types/datepicker': 3.7.1(react@18.2.0)
+      '@react-types/calendar': 3.4.2(react@18.2.0)
+      '@react-types/datepicker': 3.7.0(react@18.2.0)
       '@react-types/dialog': 3.5.7(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -10334,15 +10677,15 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/dialog@3.5.9(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-Eg5pFJN3b5NitKL60nf30iPpQGCyOcU4YakUVn5+GWKLBlm8ryE8jyoIIO0e0LCM65K+fL+gGHGK01GCZyKrpQ==}
+  /@react-aria/dialog@3.5.8(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-KIc1FORdHhZ3bWom4qHO0hmlL4e5Hup6N25EY8HP5I7Ftv9EBBGaO5grtxZ2fX8kiCJNI4y+k67ZZ71wKJvMiA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/overlays': 3.20.0(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/overlays': 3.19.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-types/dialog': 3.5.7(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -10350,19 +10693,19 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/dnd@3.5.1(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-7OPGePdle+xNYHAIAUOvIETRMfnkRt7h/C0bCkxUR2GYefEbTzfraso4ppNH2JZ7fCRd0K/Qe+jvQklwusHAKA==}
+  /@react-aria/dnd@3.5.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-6IuqmXwnfgRfeXDbfsPZzScapCmtRIkphTBPoLT575uEbZC7ROLgRJ/4NIKxvtTA6IIBqUGcvaqU9Mpg8j4U5Q==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@internationalized/string': 3.2.0
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
+      '@internationalized/string': 3.1.1
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
       '@react-aria/live-announcer': 3.3.1
-      '@react-aria/overlays': 3.20.0(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/dnd': 3.2.7(react@18.2.0)
+      '@react-aria/overlays': 3.19.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/dnd': 3.2.6(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -10403,19 +10746,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/focus@3.16.0(react@18.2.0):
-    resolution: {integrity: sha512-GP6EYI07E8NKQQcXHjpIocEU0vh0oi0Vcsd+/71fKS0NnTR0TUOEeil0JuuQ9ymkmPDTu51Aaaa4FxVsuN/23A==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      clsx: 2.0.0
-      react: 18.2.0
-    dev: false
-
   /@react-aria/focus@3.16.2(react@18.2.0):
     resolution: {integrity: sha512-Rqo9ummmgotESfypzFjI3uh58yMpL+E+lJBbQuXkBM0u0cU2YYzu0uOrFrq3zcHk997udZvq1pGK/R+2xk9B7g==}
     peerDependencies:
@@ -10429,13 +10759,13 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/form@3.0.1(react@18.2.0):
-    resolution: {integrity: sha512-6586oODMDR4/ciGRwXjpvEAg7tWGSDrXE//waK0n5e5sMuzlPOo1DHc5SpPTvz0XdJsu6VDt2rHdVWVIC9LEyw==}
+  /@react-aria/form@3.0.0(react@18.2.0):
+    resolution: {integrity: sha512-APeGph9oTO8nro4ZObuy1hk+0hpF/ji9O3odPGhLkzP/HvW2J7NI9pjKJOINfgtYr2yvVUZf/MbTMxPwtAxhaQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-stately/form': 3.0.0(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -10455,22 +10785,22 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/grid@3.8.6(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-JlQDkdm5heG1FfRyy5KnB8b6s/hRqSI6Xt2xN2AccLX5kcbfFr2/d5KVxyf6ahfa4Gfd46alN6477ju5eTWJew==}
+  /@react-aria/grid@3.8.5(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-0p+Bbs9rpQeOy8b75DamlzVPKylBoe/z0XwkeeTChHP2TK3TwPXh6J5EmisQx6K8zsb3iZULQRcP4QibvnMbrg==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
       '@react-aria/live-announcer': 3.3.1
-      '@react-aria/selection': 3.17.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/grid': 3.8.4(react@18.2.0)
-      '@react-stately/selection': 3.14.2(react@18.2.0)
-      '@react-stately/virtualizer': 3.6.6(react@18.2.0)
+      '@react-aria/selection': 3.17.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/collections': 3.10.3(react@18.2.0)
+      '@react-stately/grid': 3.8.3(react@18.2.0)
+      '@react-stately/selection': 3.14.1(react@18.2.0)
+      '@react-stately/virtualizer': 3.6.5(react@18.2.0)
       '@react-types/checkbox': 3.6.0(react@18.2.0)
       '@react-types/grid': 3.2.3(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
@@ -10503,19 +10833,19 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/gridlist@3.7.3(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-rkkepYM7xJiebR0g3uC4zzkdR7a8z0fLaM+sg9lSTbdElHMLAlrebS2ytEyZnhiu9nbOnw13GN1OC4/ZenzbHQ==}
+  /@react-aria/gridlist@3.7.2(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-9keGYZz0yILVqAnFzF6hGRtHm1vfSD1mNnH8oyn7mKjyr7qOln7s5f8Nl85ueMolfrV3H2rCZgM2itNQ+Ezzgg==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/grid': 3.8.6(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/selection': 3.17.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/list': 3.10.2(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/grid': 3.8.5(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/selection': 3.17.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/list': 3.10.1(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
@@ -10541,22 +10871,6 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/i18n@3.10.0(react@18.2.0):
-    resolution: {integrity: sha512-sviD5Y1pLPG49HHRmVjR+5nONrp0HK219+nu9Y7cDfUhXu2EjyhMS9t/n9/VZ69hHChZ2PnHYLEE2visu9CuCg==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@internationalized/date': 3.5.1
-      '@internationalized/message': 3.1.1
-      '@internationalized/number': 3.5.0
-      '@internationalized/string': 3.2.0
-      '@react-aria/ssr': 3.9.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-aria/i18n@3.10.2(react@18.2.0):
     resolution: {integrity: sha512-Z1ormoIvMOI4mEdcFLYsoJy9w/EzBdBmgfLP+S/Ah+1xwQOXpgwZxiKOhYHpWa0lf6hkKJL34N9MHJvCJ5Crvw==}
     peerDependencies:
@@ -10601,18 +10915,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/interactions@3.20.1(react@18.2.0):
-    resolution: {integrity: sha512-PLNBr87+SzRhe9PvvF9qvzYeP4ofTwfKSorwmO+hjr3qoczrSXf4LRQlb27wB6hF10C7ZE/XVbUI1lj4QQrZ/g==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-aria/ssr': 3.9.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-aria/interactions@3.21.1(react@18.2.0):
     resolution: {integrity: sha512-AlHf5SOzsShkHfV8GLLk3v9lEmYqYHURKcXWue0JdYbmquMRkUsf/+Tjl1+zHVAQ8lKqRnPYbTmc4AcZbqxltw==}
     peerDependencies:
@@ -10625,12 +10927,12 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/label@3.7.4(react@18.2.0):
-    resolution: {integrity: sha512-3Y0yyrqpLzZdzHw+TOyzwuyx5wa2ujU5DGfKuL5GFnU9Ii4DtdwBGSYS7Yu7qadU+eQmG4OGhAgFVswbIgIwJw==}
+  /@react-aria/label@3.7.3(react@18.2.0):
+    resolution: {integrity: sha512-v1zuqbpYyYaPjrBWpceGjMpwP4ne6fLoOXdoIZoKLux2jkAcyIF2kIJFiyYoPQYQJWGRNo7q1oSwamxmng4xJw==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
@@ -10647,14 +10949,14 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/link@3.6.3(react@18.2.0):
-    resolution: {integrity: sha512-8kPWc4u/lDow3Ll0LDxeMgaxt9Y3sl8UldKLGli8tzRSltYFugNh/n+i9sCnmo4Qv9Tp9kYv+yxBK50Uk9sINw==}
+  /@react-aria/link@3.6.2(react@18.2.0):
+    resolution: {integrity: sha512-v9gXgQ3Gev0JOlg2MAXcubDMgX+0BlJ+hTyFYFMuN/4jVBlAe426WKbjg+6MMzxwukWg9C3Q08JzqdFTi4cBng==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-types/link': 3.5.2(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -10675,18 +10977,18 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/listbox@3.11.3(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-PBrnldmyEYUUJvfDeljW8ITvZyBTfGpLNf0b5kfBPK3TDgRH4niEH2vYEcaZvSqb0FrpdvcunuTRXcOpfb+gCQ==}
+  /@react-aria/listbox@3.11.2(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-FXdoqYLUTJn16OxodyS518PIcwzFkCfW5bxQepoy88NDMGtqp6u8fvEPpAoZbomvw/pV9MuEaMAw9qLyfkD4DA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/selection': 3.17.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/list': 3.10.2(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/selection': 3.17.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/collections': 3.10.3(react@18.2.0)
+      '@react-stately/list': 3.10.1(react@18.2.0)
       '@react-types/listbox': 3.4.6(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -10725,21 +11027,21 @@ packages:
       '@swc/helpers': 0.5.3
     dev: false
 
-  /@react-aria/menu@3.12.0(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-Nsujv3b61WR0gybDKnBjAeyxDVJOfPLMggRUf9SQDfPWnrPXEsAFxaPaVcAkzlfI4HiQs1IxNwsKFNpc3PPZTQ==}
+  /@react-aria/menu@3.11.2(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-I4R5FOvRtwIQW+0naXav5giZBp935X2tXB2xBg/cSAYDXgfLmFPLHkyPbO77hR6FwazfFfJoKdn0pVcRox3lrQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/overlays': 3.20.0(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/selection': 3.17.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/menu': 3.6.0(react@18.2.0)
-      '@react-stately/tree': 3.7.5(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/overlays': 3.19.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/selection': 3.17.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/collections': 3.10.3(react@18.2.0)
+      '@react-stately/menu': 3.5.7(react@18.2.0)
+      '@react-stately/tree': 3.7.4(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
       '@react-types/menu': 3.9.6(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
@@ -10783,31 +11085,31 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/meter@3.4.9(react@18.2.0):
-    resolution: {integrity: sha512-1/FHFmFmSyfQBJ2oH152lp4nps76v1UdhnFbIsmRIH+0g0IfMv1yDT2M9dIZ/b9DgVZSx527FmWOXm0eHGKD6w==}
+  /@react-aria/meter@3.4.8(react@18.2.0):
+    resolution: {integrity: sha512-u/pNisFs8UottonYlwqaS2i/NhHIw9LcApHo55XP7XMFCnaHPlq3mJzpSsr0zuCTvat2djoKelj41jT6Fhuw+A==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/progress': 3.4.9(react@18.2.0)
+      '@react-aria/progress': 3.4.8(react@18.2.0)
       '@react-types/meter': 3.3.6(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
     dev: false
 
-  /@react-aria/numberfield@3.10.1(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-9rt+O63UL3zKR99c+8njbtBeVoEhitzzSCFWsqbtStyoUEV5tJQDgD9kSlozFLAzYftq2pJ7uazlptMEXyS13g==}
+  /@react-aria/numberfield@3.10.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-ixkvkPTn18RNPnbaT726CHA+Wpr/qTYWboq8hSaJK0LiAtiEWCKg0pmVtJ4lFntAQ5GNp02xudTwhQdLN5WRig==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/spinbutton': 3.6.1(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/textfield': 3.14.0(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/spinbutton': 3.6.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/textfield': 3.13.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-stately/form': 3.0.0(react@18.2.0)
-      '@react-stately/numberfield': 3.8.0(react@18.2.0)
+      '@react-stately/numberfield': 3.7.0(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
       '@react-types/numberfield': 3.7.0(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
@@ -10837,18 +11139,18 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/overlays@3.20.0(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-2m7MpRJL5UucbEuu08lMHsiFJoDowkJV4JAIFBZYK1NzVH0vF/A+w9HRNM7jRwx2DUxE+iIsZnl8yKV/7KY8OQ==}
+  /@react-aria/overlays@3.19.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-VN5GkB8+uZ2cfXljBtkqmrsAhBdGoj4un/agH0Qyihi2dazsMeafczSNnqzbpVgB4Zt2UHPJUkKwihgzXRxJJA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/ssr': 3.9.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-aria/visually-hidden': 3.8.8(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/ssr': 3.9.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-aria/visually-hidden': 3.8.7(react@18.2.0)
       '@react-stately/overlays': 3.6.4(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
       '@react-types/overlays': 3.8.4(react@18.2.0)
@@ -10893,38 +11195,20 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/progress@3.4.9(react@18.2.0):
-    resolution: {integrity: sha512-CME1ZLsJHOmSgK8IAPOC/+vYO5Oc614mkEw5MluT/yclw5rMyjAkK1XsHLjEXy81uwPeiRyoQQIMPKG2/sMxFQ==}
+  /@react-aria/progress@3.4.8(react@18.2.0):
+    resolution: {integrity: sha512-Nah3aj5BNRa0+urQZimzb0vuKQK7lsc8BrUwJuHTwGRBSWUjCADExrJYdhDIR/nLUV2TCmAQl+GJtTgbEEj0DQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-types/progress': 3.5.1(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
     dev: false
 
-  /@react-aria/radio@3.10.0(react@18.2.0):
-    resolution: {integrity: sha512-6NaKzdGymdcVWLYgHT0cHsVmNzPOp89o8r41w29OPBQWu8w2c9mxg4366OiIZn/uXIBS4abhQ4nL4toBRLgBrg==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/form': 3.0.1(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/radio': 3.10.1(react@18.2.0)
-      '@react-types/radio': 3.7.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-aria/radio@3.10.2(react@18.2.0):
     resolution: {integrity: sha512-CTUTR+qt3BLjmyQvKHZuVm+1kyvT72ZptOty++sowKXgJApTLdjq8so1IpaLAr8JIfzqD5I4tovsYwIQOX8log==}
     peerDependencies:
@@ -10943,14 +11227,32 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/searchfield@3.7.0(react@18.2.0):
-    resolution: {integrity: sha512-btBbkIwsExXWv5av62gINEbm4QFmDDT7r+d5TAKin5tvKqU8zrsM9fm7KCDEhIGcpUW+q2AUS589iw19z9uCcA==}
+  /@react-aria/radio@3.9.0(react@18.2.0):
+    resolution: {integrity: sha512-kr3+OQ1YU/3mURZfCsYaQmJ/c15qOm8uScaDRC39qz97bLNASakQqMImIaS+GluPKx1PEW3y2ErAgLplH28zZw==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/textfield': 3.14.0(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/form': 3.0.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/radio': 3.10.0(react@18.2.0)
+      '@react-types/radio': 3.6.0(react@18.2.0)
+      '@react-types/shared': 3.22.0(react@18.2.0)
+      '@swc/helpers': 0.5.3
+      react: 18.2.0
+    dev: false
+
+  /@react-aria/searchfield@3.6.0(react@18.2.0):
+    resolution: {integrity: sha512-mHaN+sx2SLqluvF0/YIBQ9WA5LakSWl79FgC0sOWEaOZhDswAbJ9tESdi/M/ahtOnVwblE0cpHRlUKV0Oz4gOw==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
+    dependencies:
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/textfield': 3.13.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-stately/searchfield': 3.5.0(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
       '@react-types/searchfield': 3.5.2(react@18.2.0)
@@ -10975,24 +11277,24 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/select@3.14.1(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-pAy/+Xbj11Lx6bi/O1hWH0NSIDRxFb6V7N0ry2L8x7MALljh516VbpnAc5RgvbjbuKq0cHUAcdINOzOzpYWm4A==}
+  /@react-aria/select@3.14.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-ulVFH8K1yr8CxQE7pzhlM3aWBltWfSbWdJV3FXDqM0kA+GHqqPwZVJcqPuegtaiju1z6nRk4q789kJa4o+4M9g==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/form': 3.0.1(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/listbox': 3.11.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/menu': 3.12.0(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/selection': 3.17.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-aria/visually-hidden': 3.8.8(react@18.2.0)
-      '@react-stately/select': 3.6.1(react@18.2.0)
+      '@react-aria/form': 3.0.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/listbox': 3.11.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/menu': 3.11.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/selection': 3.17.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-aria/visually-hidden': 3.8.7(react@18.2.0)
+      '@react-stately/select': 3.6.0(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
-      '@react-types/select': 3.9.1(react@18.2.0)
+      '@react-types/select': 3.9.0(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
@@ -11023,17 +11325,17 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/selection@3.17.3(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-xl2sgeGH61ngQeE05WOWWPVpGRTPMjQEFmsAWEprArFi4Z7ihSZgpGX22l1w7uSmtXM/eN/v0W8hUYUju5iXlQ==}
+  /@react-aria/selection@3.17.2(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-AXXY3eOIWnITabMn6c0bpLPXkSX7040LOZU+7pQgtZJwDdZorLuKw4i7WS5i71LcV71ywG4mtqc9mOb/GfhUbg==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/selection': 3.14.2(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/selection': 3.14.1(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
@@ -11068,28 +11370,28 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/separator@3.3.9(react@18.2.0):
-    resolution: {integrity: sha512-1wEXiaSJjq2+DR5TC0RKnUBsfZN+YXTzyI7XMzjQoc3YlclumX8wQtzPAOGOEjHB1JKUgo1Gw70FtupVXz58QQ==}
+  /@react-aria/separator@3.3.8(react@18.2.0):
+    resolution: {integrity: sha512-u15HgH2IVKN/mx7Hp9dfNiFpPU/mq2EA7l0e2fsVSjA77nhSctUFBAqaR7FAI/y86RUhq3zplIz4BJek1/3Dvw==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
     dev: false
 
-  /@react-aria/slider@3.7.4(react@18.2.0):
-    resolution: {integrity: sha512-OFJWeGSL2duVDFs/kcjlWsY6bqCVKZgM0aFn2QN4wmID+vfBvBnqGHAgWv3BCePTAPS3+GBjMN002TrftorjwQ==}
+  /@react-aria/slider@3.7.3(react@18.2.0):
+    resolution: {integrity: sha512-AbrTD9UzMn0CwxFjOhJHz2ms2zdJlBL3XnbvqkpsmpXUl0u8WT1QAEaMnS5+792gnSGZs/ARDmse53o+IO8wTA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/slider': 3.5.0(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/slider': 3.4.5(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@react-types/slider': 3.7.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -11113,15 +11415,15 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/spinbutton@3.6.1(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-u5GuOP3k4Zis055iY0fZJNHU7dUNCoSfUq5LKwJ1iNaCqDcavdstAnAg+X1a7rhpp5zCnJmAMseo3Qmzi9P+Ew==}
+  /@react-aria/spinbutton@3.6.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-I7f1gfwVRcjguEXZijk0z5g8njZ2YWnQzVzcwGf8ocLPxfw1CnSivNCzwVj2ChXPX10uXewXVMLWVCz+BRC9uQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
       '@react-aria/live-announcer': 3.3.1
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -11155,16 +11457,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/ssr@3.9.1(react@18.2.0):
-    resolution: {integrity: sha512-NqzkLFP8ZVI4GSorS0AYljC13QW2sc8bDqJOkBvkAt3M8gbcAXJWVRGtZBCRscki9RZF+rNlnPdg0G0jYkhJcg==}
-    engines: {node: '>= 12'}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-aria/ssr@3.9.2(react@18.2.0):
     resolution: {integrity: sha512-0gKkgDYdnq1w+ey8KzG9l+H5Z821qh9vVjztk55rUg71vTk/Eaebeir+WtzcLLwTjw3m/asIjx8Y59y1lJZhBw==}
     engines: {node: '>= 12'}
@@ -11175,12 +11467,12 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/switch@3.6.0(react@18.2.0):
-    resolution: {integrity: sha512-YNWc5fGLNXE4XlmDAKyqAdllRiClGR7ki4KGFY7nL+xR5jxzjCGU3S3ToMK5Op3QSMGZLxY/aYmC4O+MvcoADQ==}
+  /@react-aria/switch@3.5.7(react@18.2.0):
+    resolution: {integrity: sha512-zBEsB071zzhQ82RwAA42pFLXHgrpya0OoRAsTO6jHZwiaYMsyqJI2eiXd7F6rqklpgyO6k7jOQklGUuoSJW4pA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/toggle': 3.10.0(react@18.2.0)
+      '@react-aria/toggle': 3.9.0(react@18.2.0)
       '@react-stately/toggle': 3.7.0(react@18.2.0)
       '@react-types/switch': 3.5.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -11199,27 +11491,27 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/table@3.13.3(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-AzmETpyxwNqISTzwHJPs85x9gujG40IIsSOBUdp49oKhB85RbPLvMwhadp4wCVAoHw3erOC/TJxHtVc7o2K1LA==}
+  /@react-aria/table@3.13.2(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-bJgMx2SZ8SFmTosbv6k1lZ1a0Yw3f8tzWhpIQodCaMHhtI7izA6YqDNx47NeBNYpVm9DFfAoWbb79HFJ+OKIJA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/grid': 3.8.6(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/grid': 3.8.5(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
       '@react-aria/live-announcer': 3.3.1
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-aria/visually-hidden': 3.8.8(react@18.2.0)
-      '@react-stately/collections': 3.10.4(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-aria/visually-hidden': 3.8.7(react@18.2.0)
+      '@react-stately/collections': 3.10.3(react@18.2.0)
       '@react-stately/flags': 3.0.0
-      '@react-stately/table': 3.11.4(react@18.2.0)
-      '@react-stately/virtualizer': 3.6.6(react@18.2.0)
+      '@react-stately/table': 3.11.3(react@18.2.0)
+      '@react-stately/virtualizer': 3.6.5(react@18.2.0)
       '@react-types/checkbox': 3.6.0(react@18.2.0)
       '@react-types/grid': 3.2.3(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
-      '@react-types/table': 3.9.2(react@18.2.0)
+      '@react-types/table': 3.9.1(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
       react-dom: 18.2.0(react@18.2.0)
@@ -11251,17 +11543,17 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/tabs@3.8.3(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-Plw0K/5Qv35vYq7pHZFfQB2BF5OClFx4Abzo9hLVx4oMy3qb7i5lxmLBVbt81yPX/MdjYeP4zO1EHGBl4zMRhA==}
+  /@react-aria/tabs@3.8.2(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-zDfeEEyJmcnH9TFvJECWIrJpxX4SmREFV1/P8hN6ZUJPYoeiGMXYYFvjcRb1r3LN8XKlbwR37AQ3Cn1/yhrUwQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/selection': 3.17.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/tabs': 3.6.3(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/selection': 3.17.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/tabs': 3.6.2(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@react-types/tabs': 3.3.4(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -11287,19 +11579,19 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/tag@3.3.1(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-w7d8sVZqxTo8VFfeg2ixLp5kawtrcguGznVY4mt5aE6K8LMJOeNVDqNNfolfyia80VjOWjeX+RpVdVJRdrv/GQ==}
+  /@react-aria/tag@3.3.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-mANJTcPyut98O4D3cAKaNEV6QFfoljZCDAgC+uJkV/Zn8cU4JOFeNLAyNoLRlPvYw+msqr6wUyPkWNERuO+1Uw==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/gridlist': 3.7.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/selection': 3.17.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/list': 3.10.2(react@18.2.0)
+      '@react-aria/gridlist': 3.7.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/selection': 3.17.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/list': 3.10.1(react@18.2.0)
       '@react-types/button': 3.9.1(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
@@ -11327,15 +11619,15 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: false
 
-  /@react-aria/textfield@3.14.0(react@18.2.0):
-    resolution: {integrity: sha512-LtHFcPK/N9m3KWSRM5KdmlIk7cUEk0OF+uBUrfKsGGc1bJKVToimdW7jQusChHmHhslHUR7WQ4KDjXyFjoLXOw==}
+  /@react-aria/textfield@3.13.0(react@18.2.0):
+    resolution: {integrity: sha512-sUlinDE+k/WhbskyqVOkuffuhiQpjgvp+iGRoralStVgb8Tcb+POxgAlw5jS4tNjdivCb3IjVJemUNJM7xsxxA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/form': 3.0.1(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/form': 3.0.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-stately/form': 3.0.0(react@18.2.0)
       '@react-stately/utils': 3.9.0(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
@@ -11361,20 +11653,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/toggle@3.10.0(react@18.2.0):
-    resolution: {integrity: sha512-6cUf4V9TuG2J7AvXUdU/GspEPFCubUOID3mrselSe563RViy+mMZk0vUEOdyoNanDcEXl58W4dE3SGWxFn71vg==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-stately/toggle': 3.7.0(react@18.2.0)
-      '@react-types/checkbox': 3.6.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-aria/toggle@3.10.2(react@18.2.0):
     resolution: {integrity: sha512-DgitscHWgI6IFgnvp2HcMpLGX/cAn+XX9kF5RJQbRQ9NqUgruU5cEEGSOLMrEJ6zXDa2xmOiQ+kINcyNhA+JLg==}
     peerDependencies:
@@ -11389,6 +11667,20 @@ packages:
       react: 18.2.0
     dev: false
 
+  /@react-aria/toggle@3.9.0(react@18.2.0):
+    resolution: {integrity: sha512-2YMWYQUEmcoAXtrAE86QXBS9XlmJyV6IFRlMTBNaeLTdH3AmACExgsyU66Tt0sKl6LMDMI376ItMFqAz27BBdQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
+    dependencies:
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-stately/toggle': 3.7.0(react@18.2.0)
+      '@react-types/checkbox': 3.6.0(react@18.2.0)
+      '@swc/helpers': 0.5.3
+      react: 18.2.0
+    dev: false
+
   /@react-aria/toolbar@3.0.0-beta.0(react@18.2.0):
     resolution: {integrity: sha512-5DCnasHCKxpzm2g7NkFggZF4A65snLL7Nz+0dhqvFTHVLYPEzgKnx7nJ4tFO9z7i9BL8+HrNmaur/eE+OVKVJg==}
     peerDependencies:
@@ -11415,14 +11707,14 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/tooltip@3.7.0(react@18.2.0):
-    resolution: {integrity: sha512-+u9Sftkfe09IDyPEnbbreFKS50vh9X/WTa7n1u2y3PenI9VreLpUR6czyzda4BlvQ95e9jQz1cVxUjxTNaZmBw==}
+  /@react-aria/tooltip@3.6.5(react@18.2.0):
+    resolution: {integrity: sha512-hXw4Z8nYLOWz3QOQ807wWZdvDwR3gofsmZhAehg2HPRwdRfCQK+1cjVKeUd9cKCAxs0Cay7dV0oUdilLbCQ2Gg==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-stately/tooltip': 3.4.6(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@react-types/tooltip': 3.4.6(react@18.2.0)
@@ -11458,19 +11750,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/utils@3.23.0(react@18.2.0):
-    resolution: {integrity: sha512-fJA63/VU4iQNT8WUvrmll3kvToqMurD69CcgVmbQ56V7ZbvlzFi44E7BpnoaofScYLLtFWRjVdaHsohT6O/big==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-aria/ssr': 3.9.1(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      clsx: 2.0.0
-      react: 18.2.0
-    dev: false
-
   /@react-aria/utils@3.23.2(react@18.2.0):
     resolution: {integrity: sha512-yznR9jJ0GG+YJvTMZxijQwVp+ahP66DY0apZf7X+dllyN+ByEDW+yaL1ewYPIpugxVzH5P8jhnBXsIyHKN411g==}
     peerDependencies:
@@ -11496,13 +11775,13 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-aria/visually-hidden@3.8.8(react@18.2.0):
-    resolution: {integrity: sha512-Cn2PYKD4ijGDtF0+dvsh8qa4y7KTNAlkTG6h20r8Q+6UTyRNmtE2/26QEaApRF8CBiNy9/BZC/ZC4FK2OjvCoA==}
+  /@react-aria/visually-hidden@3.8.7(react@18.2.0):
+    resolution: {integrity: sha512-OuIGMVQIt7GC43h4x35BgkZid8lhoPu7Xz4TQRP8nvOJWb1lH7ehrRRuGdUsK3y90nwpxTdNdg4DILblg+VaLw==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
@@ -11535,19 +11814,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/calendar@3.4.3(react@18.2.0):
-    resolution: {integrity: sha512-OrEcdskszDjnjVnFuSiDC2PVBJ6lWMCJROD5s6W1LUehUtBp8LX9wPavAGHV43LbhN9ldj560sxaQ4WCddrRCA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@internationalized/date': 3.5.1
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/calendar': 3.4.3(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/calendar@3.4.4(react@18.2.0):
     resolution: {integrity: sha512-f9ZOd096gGGD+3LmU1gkmfqytGyQtrgi+Qjn+70GbM2Jy65pwOR4I9YrobbmeAFov5Tff13mQEa0yqWvbcDLZQ==}
     peerDependencies:
@@ -11574,19 +11840,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/checkbox@3.6.1(react@18.2.0):
-    resolution: {integrity: sha512-rOjFeVBy32edYwhKiHj3ZLdLeO+xZ2fnBwxnOBjcygnw4Neygm8FJH/dB1J0hdYYR349yby86ED2x0wRc84zPw==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/form': 3.0.0(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/checkbox': 3.6.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/checkbox@3.6.3(react@18.2.0):
     resolution: {integrity: sha512-hWp0GXVbMI4sS2NbBjWgOnHNrRqSV4jeftP8zc5JsIYRmrWBUZitxluB34QuVPzrBO29bGsF0GTArSiQZt6BWw==}
     peerDependencies:
@@ -11610,16 +11863,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/collections@3.10.4(react@18.2.0):
-    resolution: {integrity: sha512-OHhCrItGt4zB2bSrgObRo0H2SC7QlkH8ReGxo+NVIWchXRLRoiWBP7S+IwleewEo5gOqDVPY3hqA9n4iiI8twg==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/collections@3.10.5(react@18.2.0):
     resolution: {integrity: sha512-k8Q29Nnvb7iAia1QvTanZsrWP2aqVNBy/1SlE6kLL6vDqtKZC+Esd1SDLHRmIcYIp5aTdfwIGd0NuiRQA7a81Q==}
     peerDependencies:
@@ -11647,23 +11890,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/combobox@3.8.1(react@18.2.0):
-    resolution: {integrity: sha512-FaWkqTXQdWg7ptaeU4iPcqF/kxbRg2ZNUcvW/hiL/enciV5tRCsddvfNqvDvy1L30z9AUwlp9MWqzm/DhBITCw==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/form': 3.0.0(react@18.2.0)
-      '@react-stately/list': 3.10.2(react@18.2.0)
-      '@react-stately/overlays': 3.6.4(react@18.2.0)
-      '@react-stately/select': 3.6.1(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/combobox': 3.10.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/combobox@3.8.2(react@18.2.0):
     resolution: {integrity: sha512-f+IHuFW848VoMbvTfSakn2WIh2urDxO355LrKxnisXPCkpQHpq3lvT2mJtKJwkPxjAy7xPjpV8ejgga2R6p53Q==}
     peerDependencies:
@@ -11717,22 +11943,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/datepicker@3.9.1(react@18.2.0):
-    resolution: {integrity: sha512-o5xLvlZGJyAbTev2yruGlV2fzQyIDuYTgL19TTt0W0WCfjGGr/AAA9GjGXXmyoRA7sZMxqIPnnv7lNrdA38ofA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@internationalized/date': 3.5.1
-      '@internationalized/string': 3.2.0
-      '@react-stately/form': 3.0.0(react@18.2.0)
-      '@react-stately/overlays': 3.6.4(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/datepicker': 3.7.1(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/datepicker@3.9.2(react@18.2.0):
     resolution: {integrity: sha512-Z6FrK6Af7R5BizqHhJFCj3Hn32mg5iLSDdEgFQAuO043guOXUKFUAnbxfbQUjL6PGE6QwWMfQD7PPGebHn9Ifw==}
     peerDependencies:
@@ -11760,17 +11970,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/dnd@3.2.7(react@18.2.0):
-    resolution: {integrity: sha512-QqSCvE9Rhp+Mr8Mt/SrByze24BFX1cy7gmXbwoqAYgHNIx3gWCVdBLqxfpfgYIhZdF9H72EWS8lQkfkZla06Ng==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/selection': 3.14.2(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/dnd@3.2.8(react@18.2.0):
     resolution: {integrity: sha512-oSo+2Bzum3Q1/d+3FuaDmpVHqqBB004tycuQDDFtad3N1BKm+fNfmslRK1ioLkPLK4sm1130V+BZBY3JXLe80A==}
     peerDependencies:
@@ -11827,19 +12026,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/grid@3.8.4(react@18.2.0):
-    resolution: {integrity: sha512-rwqV1K4lVhaiaqJkt4TfYqdJoVIyqvSm98rKAYfCNzrKcivVpoiCMJ2EMt6WlYCjDVBdEOQ7fMV1I60IV0pntA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/selection': 3.14.2(react@18.2.0)
-      '@react-types/grid': 3.2.3(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/grid@3.8.5(react@18.2.0):
     resolution: {integrity: sha512-KCzi0x0p1ZKK+OptonvJqMbn6Vlgo6GfOIlgcDd0dNYDP8TJ+3QFJAFre5mCr7Fubx7LcAOio4Rij0l/R8fkXQ==}
     peerDependencies:
@@ -11866,19 +12052,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/list@3.10.2(react@18.2.0):
-    resolution: {integrity: sha512-INt+zofkIg2KN8B95xPi9pJG7ZFWAm30oIm/lCPBqM3K1Nm03/QaAbiQj2QeJcOsG3lb7oqI6D6iwTolwJkjIQ==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/selection': 3.14.2(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/list@3.10.3(react@18.2.0):
     resolution: {integrity: sha512-Ul8el0tQy2Ucl3qMQ0fiqdJ874W1ZNjURVSgSxN+pGwVLNBVRjd6Fl7YwZFCXER2YOlzkwg+Zqozf/ZlS0EdXA==}
     peerDependencies:
@@ -11904,18 +12077,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/menu@3.6.0(react@18.2.0):
-    resolution: {integrity: sha512-OB6CjNyfOkAuirqx1oTL8z8epS9WDzLyrXjmRnxdiCU9EgRXLGAQNECuO7VIpl58oDry8tgRJiJ8fn8FivWSQA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/overlays': 3.6.4(react@18.2.0)
-      '@react-types/menu': 3.9.6(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/menu@3.6.1(react@18.2.0):
     resolution: {integrity: sha512-3v0vkTm/kInuuG8jG7jbxXDBnMQcoDZKWvYsBQq7+POt0LmijbLdbdZPBoz9TkZ3eo/OoP194LLHOaFTQyHhlw==}
     peerDependencies:
@@ -11941,19 +12102,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/numberfield@3.8.0(react@18.2.0):
-    resolution: {integrity: sha512-1XvB8tDOvZKcFnMM6qNLEaTVJcIc0jRFS/9jtS8MzalZvh8DbKi0Ucm1bGU7S5rkCx2QWqZ0rGOIm2h/RlcpkA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@internationalized/number': 3.5.0
-      '@react-stately/form': 3.0.0(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/numberfield': 3.7.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/numberfield@3.9.1(react@18.2.0):
     resolution: {integrity: sha512-btBIcBEfSVCUm6NwJrMrMygoIu/fQGazzD0RhF7PNsfvkFiWn+TSOyQqSXcsUJVOnBfoS/dVWj6r57KA7zl3FA==}
     peerDependencies:
@@ -12002,19 +12150,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/radio@3.10.1(react@18.2.0):
-    resolution: {integrity: sha512-MsBYbcLCvjKsqTAKe43T681F2XwKMsS7PLG0eplZgWP9210AMY78GeY1XPYZKHPAau8XkbYiuJqbqTerIJ3DBw==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/form': 3.0.0(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/radio': 3.7.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/radio@3.10.2(react@18.2.0):
     resolution: {integrity: sha512-JW5ZWiNMKcZvMTsuPeWJQLHXD5rlqy7Qk6fwUx/ZgeibvMBW/NnW19mm2+IMinzmbtERXvR6nsiA837qI+4dew==}
     peerDependencies:
@@ -12064,20 +12199,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/select@3.6.1(react@18.2.0):
-    resolution: {integrity: sha512-e5ixtLiYLlFWM8z1msDqXWhflF9esIRfroptZsltMn1lt2iImUlDRlOTZlMtPQzUrDWoiHXRX88sSKUM/jXjQQ==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/form': 3.0.0(react@18.2.0)
-      '@react-stately/list': 3.10.2(react@18.2.0)
-      '@react-stately/overlays': 3.6.4(react@18.2.0)
-      '@react-types/select': 3.9.1(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/select@3.6.2(react@18.2.0):
     resolution: {integrity: sha512-duOxdHKol93h6Ew6fap6Amz+zngoERKZLSKVm/8I8uaBgkoBhEeTFv7mlpHTgINxymMw3mMrvy6GL/gfKFwkqg==}
     peerDependencies:
@@ -12104,18 +12225,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/selection@3.14.2(react@18.2.0):
-    resolution: {integrity: sha512-mL7OoiUgVWaaF7ks5XSxgbXeShijYmD4G3bkBHhqkpugU600QH6BM2hloCq8KOUupk1y8oTljPtF9EmCv375DA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/selection@3.14.3(react@18.2.0):
     resolution: {integrity: sha512-d/t0rIWieqQ7wjLoMoWnuHEUSMoVXxkPBFuSlJF3F16289FiQ+b8aeKFDzFTYN7fFD8rkZTnpuE4Tcxg3TmA+w==}
     peerDependencies:
@@ -12140,18 +12249,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/slider@3.5.0(react@18.2.0):
-    resolution: {integrity: sha512-dOVpIxb7XKuiRxgpHt1bUSlsklciFki100tKIyBPR+Okar9iC/CwLYROYgVfLkGe77jEBNkor9tDLjDGEWcc1w==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@react-types/slider': 3.7.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/slider@3.5.2(react@18.2.0):
     resolution: {integrity: sha512-ntH3NLRG+AwVC7q4Dx9DcmMkMh9vmHjHNXAgaoqNjhvwfSIae7sQ69CkVe6XeJjIBy6LlH81Kgapz+ABe5a1ZA==}
     peerDependencies:
@@ -12181,23 +12278,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/table@3.11.4(react@18.2.0):
-    resolution: {integrity: sha512-dWINJIEOKQl4qq3moq+S8xCD3m+yJqBj0dahr+rOkS+t2uqORwzsusTM35D2T/ZHZi49S2GpE7QuDa+edCynPw==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/flags': 3.0.0
-      '@react-stately/grid': 3.8.4(react@18.2.0)
-      '@react-stately/selection': 3.14.2(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/grid': 3.2.3(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@react-types/table': 3.9.2(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/table@3.11.6(react@18.2.0):
     resolution: {integrity: sha512-34YsfOILXusj3p6QNcKEaDWVORhM6WEhwPSLCZlkwAJvkxuRQFdih5rQKoIDc0uV5aZsB6bYBqiFhnjY0VERhw==}
     peerDependencies:
@@ -12227,18 +12307,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/tabs@3.6.3(react@18.2.0):
-    resolution: {integrity: sha512-Nj+Gacwa2SIzYIvHW40GsyX4Q6c8kF7GOuXESeQswbCjnwqhrSbDBp+ngPcUPUJxqFh6JhDCVwAS3wMhUoyUwA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/list': 3.10.2(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@react-types/tabs': 3.3.4(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/tabs@3.6.4(react@18.2.0):
     resolution: {integrity: sha512-WZJgMBqzLgN88RN8AxhY4aH1+I+4w1qQA0Lh3LRSDegaytd+NHixCWaP3IPjePgCB5N1UsPe96Xglw75zjHmDg==}
     peerDependencies:
@@ -12308,19 +12376,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/tree@3.7.5(react@18.2.0):
-    resolution: {integrity: sha512-xTJVwvhAeY0N5rui4N/TxN7f8hjXdqApDuGDxMZeFAWoQz8Abf7LFKBVQ3OkT6qVr7P+23dgoisUDBhD5a45Hg==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-stately/collections': 3.10.4(react@18.2.0)
-      '@react-stately/selection': 3.14.2(react@18.2.0)
-      '@react-stately/utils': 3.9.0(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      '@swc/helpers': 0.5.3
-      react: 18.2.0
-    dev: false
-
   /@react-stately/tree@3.7.6(react@18.2.0):
     resolution: {integrity: sha512-y8KvEoZX6+YvqjNCVGS3zA/BKw4D3XrUtUKIDme3gu5Mn6z97u+hUXKdXVCniZR7yvV3fHAIXwE5V2K8Oit4aw==}
     peerDependencies:
@@ -12352,12 +12407,12 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-stately/virtualizer@3.6.6(react@18.2.0):
-    resolution: {integrity: sha512-9hWvfITdE/028q4YFve6FxlmA3PdSMkUwpYA+vfaGCXI/4DFZIssBMspUeu4PTRJoV+k+m0z1wYHPmufrq6a3g==}
+  /@react-stately/virtualizer@3.6.5(react@18.2.0):
+    resolution: {integrity: sha512-v0cZeNCGPMeo3LP4UrGuDo3Xpq7ufNaZyGObgSvdrIW49qK5F02kczcKy6NKg+QfOgC/+Nc9Tof/2S8dcxDrCA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@react-aria/utils': 3.23.0(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
@@ -12422,16 +12477,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-types/calendar@3.4.3(react@18.2.0):
-    resolution: {integrity: sha512-96x57ctX5wNEl+8et3sc2NQm8neOJayEeqOQQpyPtI7jyvst/xBrKCwysf9W/dhgPlUC+KeBAYFWfjd5hFVHYA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@internationalized/date': 3.5.1
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      react: 18.2.0
-    dev: false
-
   /@react-types/calendar@3.4.4(react@18.2.0):
     resolution: {integrity: sha512-hV1Thmb/AES5OmfPvvmyjSkmsEULjiDfA7Yyy70L/YKuSNKb7Su+Bf2VnZuDW3ec+GxO4JJNlpJ0AkbphWBvcg==}
     peerDependencies:
@@ -12460,15 +12505,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-types/combobox@3.10.0(react@18.2.0):
-    resolution: {integrity: sha512-1IXSNS02TPbguyYopaW2snU6sZusbClHrEyVr4zPeexTV4kpUUBNXOzFQ+eSQRR0r2XW57Z0yRW4GJ6FGU0yCA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      react: 18.2.0
-    dev: false
-
   /@react-types/combobox@3.10.1(react@18.2.0):
     resolution: {integrity: sha512-XMno1rgVRNta49vf5nV7VJpVSVAV20tt79t618gG1qRKH5Kt2Cy8lz2fQ5vHG6UTv/6jUOvU8g5Pc93sLaTmoA==}
     peerDependencies:
@@ -12499,18 +12535,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-types/datepicker@3.7.1(react@18.2.0):
-    resolution: {integrity: sha512-5juVDULOytNzkotqX8j5mYKJckeIpkgbHqVSGkPgLw0++FceIaSZ6RH56cqLup0pO45paqIt9zHh+QXBYX+syg==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@internationalized/date': 3.5.1
-      '@react-types/calendar': 3.4.3(react@18.2.0)
-      '@react-types/overlays': 3.8.4(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      react: 18.2.0
-    dev: false
-
   /@react-types/datepicker@3.7.2(react@18.2.0):
     resolution: {integrity: sha512-zThqFAdhQL1dqyVDsDSSTdfCjoD6634eyg/B0ZJfQxcLUR/5pch3v/gxBhbyCVDGMNHRWUWIJvY9DVOepuoSug==}
     peerDependencies:
@@ -12716,15 +12740,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-types/radio@3.7.0(react@18.2.0):
-    resolution: {integrity: sha512-EcwGAXzSHjSqpFZha7xn3IUrhPiJLj+0yb1Ip0qPmhWz0VVw2DwrkY7q/jfaKroVvQhTo2TbfGhcsAQrt0fRqg==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      react: 18.2.0
-    dev: false
-
   /@react-types/radio@3.7.1(react@18.2.0):
     resolution: {integrity: sha512-Zut3rN1odIUBLZdijeyou+UqsLeRE76d9A+npykYGu29ndqmo3w4sLn8QeQcdj1IR71ZnG0pW2Y2BazhK5XrrQ==}
     peerDependencies:
@@ -12763,15 +12778,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-types/select@3.9.1(react@18.2.0):
-    resolution: {integrity: sha512-EpKSxrnh8HdZvOF9dHQkjivAcdIp1K81FaxmvosH8Lygqh0iYXxAdZGtKLMyBoPI8YFhA+rotIzTcOqgCCnqWA==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      react: 18.2.0
-    dev: false
-
   /@react-types/select@3.9.2(react@18.2.0):
     resolution: {integrity: sha512-fGFrunednY3Pq/BBwVOf87Fsuyo/SlevL0wFIE9OOl2V5NXVaTY7/7RYA8hIOHPzmvsMbndy419BEudiNGhv4A==}
     peerDependencies:
@@ -12842,16 +12848,6 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@react-types/table@3.9.2(react@18.2.0):
-    resolution: {integrity: sha512-brw5JUANOzBa2rYNpN8AIl9nDZ9RwRZC6G/wTM/JhtirjC1S42oCtf8Ap5rWJBdmMG/5KOfcGNcAl/huyqb3gg==}
-    peerDependencies:
-      react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
-    dependencies:
-      '@react-types/grid': 3.2.3(react@18.2.0)
-      '@react-types/shared': 3.22.0(react@18.2.0)
-      react: 18.2.0
-    dev: false
-
   /@react-types/table@3.9.3(react@18.2.0):
     resolution: {integrity: sha512-Hs/pMbxJdga2zBol4H5pV1FVIiRjCuSTXst6idJjkctanTexR4xkyrtBwl+rdLNoGwQ2pGii49vgklc5bFK7zA==}
     peerDependencies:
@@ -13257,7 +13253,7 @@ packages:
       rollup: 4.8.0
       serialize-javascript: 6.0.1
       smob: 1.4.1
-      terser: 5.27.0
+      terser: 5.24.0
     dev: false
 
   /@rollup/plugin-wasm@6.2.2(rollup@4.8.0):
@@ -13452,6 +13448,18 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /@semantic-ui-react/event-stack@3.1.3(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-FdTmJyWvJaYinHrKRsMLDrz4tTMGdFfds299Qory53hBugiDvGC0tEJf+cHsi5igDwWb/CLOgOiChInHwq8URQ==}
+    peerDependencies:
+      react: ^16.0.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.0.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      exenv: 1.2.2
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /@seznam/compose-react-refs@1.0.6:
     resolution: {integrity: sha512-izzOXQfeQLonzrIQb8u6LQ8dk+ymz3WXTIXjvOlTXHq6sbzROg3NWU+9TTAOpEoK9Bth24/6F/XrfHJ5yR5n6Q==}
     dev: false
@@ -13516,11 +13524,11 @@ packages:
   /@sindresorhus/merge-streams@1.0.0:
     resolution: {integrity: sha512-rUV5WyJrJLoloD4NDN1V1+LDMDWOa4OTsT4yYJwQNpTU6FWxkxHpL7eu4w+DmiH8x/EAM1otkPE1+LaspIbplw==}
     engines: {node: '>=18'}
-    dev: true
 
   /@sindresorhus/merge-streams@2.3.0:
     resolution: {integrity: sha512-LtoMMhxAlorcGhmFYI+LhPgbPZCkgP6ra1YL604EeF6U98pLlQ3iWIGMdWSC+vWmPBWBNgmDBAhnAobLROJmwg==}
     engines: {node: '>=18'}
+    dev: true
 
   /@sinonjs/commons@1.8.6:
     resolution: {integrity: sha512-Ky+XkAkqPZSm3NLBeUng77EBQl3cmeJhITaGHdYH8kjVB+aun3S4XBRti2zt17mtt0mIUDiNxYeoJm6drVvBJQ==}
@@ -13610,6 +13618,40 @@ packages:
       uuid-browser: 3.1.0
     dev: true
 
+  /@storybook/addon-actions@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-aADjilFmuD6TNGz2CRPSupnyiA/IGkPJHDBTqMpsDXTUr8xnuD122xkIhg6UxmCM2y1c+ncwYXy3WPK2xXK57g==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    peerDependenciesMeta:
+      react:
+        optional: true
+      react-dom:
+        optional: true
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      core-js: 3.33.2
+      fast-deep-equal: 3.1.3
+      global: 4.4.0
+      lodash: 4.17.21
+      polished: 4.2.2
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-inspector: 5.1.1(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      telejson: 6.0.8
+      ts-dedent: 2.2.0
+      util-deprecate: 1.0.2
+      uuid-browser: 3.1.0
+    dev: true
+
   /@storybook/addon-actions@7.6.5:
     resolution: {integrity: sha512-lW/m9YcaNfBZk+TZLxyzHdd563mBWpsUIveOKYjcPdl/q0FblWWZrRsFHqwLK1ldZ4AZXs8J/47G8CBr6Ew2uQ==}
     dependencies:
@@ -13649,6 +13691,34 @@ packages:
       util-deprecate: 1.0.2
     dev: true
 
+  /@storybook/addon-backgrounds@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-t7qooZ892BruhilFmzYPbysFwpULt/q4zYXNSmKVbAYta8UVvitjcU4F18p8FpWd9WvhiTr0SDlyhNZuzvDfug==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    peerDependenciesMeta:
+      react:
+        optional: true
+      react-dom:
+        optional: true
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      core-js: 3.33.2
+      global: 4.4.0
+      memoizerific: 1.11.3
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      ts-dedent: 2.2.0
+      util-deprecate: 1.0.2
+    dev: true
+
   /@storybook/addon-backgrounds@7.6.5:
     resolution: {integrity: sha512-wZZOL19vg4TTRtOTl71XKqPe5hQx3XUh9Fle0wOi91FiFrBdqusrppnyS89wPS8RQG5lXEOFEUvYcMmdCcdZfw==}
     dependencies:
@@ -13682,7 +13752,7 @@ packages:
       - '@types/react'
     dev: true
 
-  /@storybook/addon-controls@6.5.15(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2):
+  /@storybook/addon-controls@6.5.15(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
     resolution: {integrity: sha512-q5y0TvD0stvQoJZ2PnFmmKIRNSOI4/k2NKyZq//J2cBUBcP1reYlFxdsNwLZWmAFpSIkc2+nsliEzNxU1WByoA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0
@@ -13693,19 +13763,19 @@ packages:
       react-dom:
         optional: true
     dependencies:
-      '@storybook/addons': 6.5.15(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/api': 6.5.15(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/addons': 6.5.15(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.15(react-dom@18.2.0)(react@18.2.0)
       '@storybook/client-logger': 6.5.15
-      '@storybook/components': 6.5.15(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/core-common': 6.5.15(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
+      '@storybook/components': 6.5.15(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-common': 6.5.15(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
       '@storybook/csf': 0.0.2--canary.4566f4d.1
       '@storybook/node-logger': 6.5.15
-      '@storybook/store': 6.5.15(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/theming': 6.5.15(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/store': 6.5.15(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/theming': 6.5.15(react-dom@18.2.0)(react@18.2.0)
       core-js: 3.33.2
       lodash: 4.17.21
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       ts-dedent: 2.2.0
     transitivePeerDependencies:
       - '@swc/core'
@@ -13754,6 +13824,42 @@ packages:
       - webpack-cli
     dev: true
 
+  /@storybook/addon-controls@6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
+    resolution: {integrity: sha512-kShSGjq1MjmmyL3l8i+uPz6yddtf82mzys0l82VKtcuyjrr5944wYFJ5NTXMfZxrO/U6FeFsfuFZE/k6ex3EMg==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    peerDependenciesMeta:
+      react:
+        optional: true
+      react-dom:
+        optional: true
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/node-logger': 6.5.16
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      core-js: 3.33.2
+      lodash: 4.17.21
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      ts-dedent: 2.2.0
+    transitivePeerDependencies:
+      - '@swc/core'
+      - esbuild
+      - eslint
+      - supports-color
+      - typescript
+      - uglify-js
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
   /@storybook/addon-controls@7.6.5(@types/react-dom@18.2.12)(@types/react@18.2.27)(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-EdSZ2pYf74mOXZGGJ22lrDvdvL0YKc95iWv9FFEhUFOloMy/0OZPB2ybYmd2KVCy3SeIE4Zfeiw8pDXdCUniOQ==}
     dependencies:
@@ -13769,7 +13875,7 @@ packages:
       - supports-color
     dev: true
 
-  /@storybook/addon-docs@6.5.16(@babel/core@7.23.3)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1):
+  /@storybook/addon-docs@6.5.16(@babel/core@7.23.3)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1):
     resolution: {integrity: sha512-QM9WDZG9P02UvbzLu947a8ZngOrQeAKAT8jCibQFM/+RJ39xBlfm8rm+cQy3dm94wgtjmVkA3mKGOV/yrrsddg==}
     peerDependencies:
       '@storybook/mdx2-csf': ^0.0.3
@@ -13786,28 +13892,28 @@ packages:
       '@babel/plugin-transform-react-jsx': 7.22.15(@babel/core@7.23.3)
       '@babel/preset-env': 7.23.3(@babel/core@7.23.3)
       '@jest/transform': 26.6.2
-      '@mdx-js/react': 1.6.22(react@17.0.2)
-      '@storybook/addons': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/api': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/components': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
+      '@mdx-js/react': 1.6.22(react@18.2.0)
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
       '@storybook/core-events': 6.5.16
       '@storybook/csf': 0.0.2--canary.4566f4d.1
-      '@storybook/docs-tools': 6.5.16(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/docs-tools': 6.5.16(react-dom@18.2.0)(react@18.2.0)
       '@storybook/mdx1-csf': 0.0.1(@babel/core@7.23.3)
       '@storybook/node-logger': 6.5.16
       '@storybook/postinstall': 6.5.16
-      '@storybook/preview-web': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/source-loader': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/store': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/theming': 6.5.16(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/preview-web': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/source-loader': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
       babel-loader: 8.3.0(@babel/core@7.23.3)(webpack@5.90.1)
       core-js: 3.33.2
       fast-deep-equal: 3.1.3
       global: 4.4.0
       lodash: 4.17.21
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       regenerator-runtime: 0.13.11
       remark-external-links: 8.0.0
       remark-slug: 6.1.0
@@ -13917,7 +14023,7 @@ packages:
       - supports-color
     dev: true
 
-  /@storybook/addon-essentials@6.5.16(@babel/core@7.23.3)(@storybook/builder-webpack5@6.5.16)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1):
+  /@storybook/addon-essentials@6.5.16(@babel/core@7.23.3)(@storybook/builder-webpack5@6.5.16)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1):
     resolution: {integrity: sha512-TeoMr6tEit4Pe91GH6f8g/oar1P4M0JL9S6oMcFxxrhhtOGO7XkWD5EnfyCx272Ok2VYfE58FNBTGPNBVIqYKQ==}
     peerDependencies:
       '@babel/core': ^7.9.6
@@ -13975,99 +14081,99 @@ packages:
         optional: true
     dependencies:
       '@babel/core': 7.23.3
+      '@storybook/addon-actions': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/addon-backgrounds': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/addon-controls': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/addon-docs': 6.5.16(@babel/core@7.23.3)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1)
+      '@storybook/addon-measure': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/addon-outline': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/addon-toolbars': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/addon-viewport': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/builder-webpack5': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/node-logger': 6.5.16
+      core-js: 3.33.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      ts-dedent: 2.2.0
+      webpack: 5.90.1
+    transitivePeerDependencies:
+      - '@storybook/mdx2-csf'
+      - '@swc/core'
+      - esbuild
+      - eslint
+      - supports-color
+      - typescript
+      - uglify-js
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
+  /@storybook/addon-essentials@6.5.16(@babel/core@7.23.9)(@storybook/builder-webpack5@6.5.16)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1):
+    resolution: {integrity: sha512-TeoMr6tEit4Pe91GH6f8g/oar1P4M0JL9S6oMcFxxrhhtOGO7XkWD5EnfyCx272Ok2VYfE58FNBTGPNBVIqYKQ==}
+    peerDependencies:
+      '@babel/core': ^7.9.6
+      '@storybook/angular': '*'
+      '@storybook/builder-manager4': '*'
+      '@storybook/builder-manager5': '*'
+      '@storybook/builder-webpack4': '*'
+      '@storybook/builder-webpack5': '*'
+      '@storybook/html': '*'
+      '@storybook/vue': '*'
+      '@storybook/vue3': '*'
+      '@storybook/web-components': '*'
+      lit: '*'
+      lit-html: '*'
+      react: '*'
+      react-dom: '*'
+      svelte: '*'
+      sveltedoc-parser: '*'
+      vue: '*'
+      webpack: '*'
+    peerDependenciesMeta:
+      '@storybook/angular':
+        optional: true
+      '@storybook/builder-manager4':
+        optional: true
+      '@storybook/builder-manager5':
+        optional: true
+      '@storybook/builder-webpack4':
+        optional: true
+      '@storybook/builder-webpack5':
+        optional: true
+      '@storybook/html':
+        optional: true
+      '@storybook/vue':
+        optional: true
+      '@storybook/vue3':
+        optional: true
+      '@storybook/web-components':
+        optional: true
+      lit:
+        optional: true
+      lit-html:
+        optional: true
+      react:
+        optional: true
+      react-dom:
+        optional: true
+      svelte:
+        optional: true
+      sveltedoc-parser:
+        optional: true
+      vue:
+        optional: true
+      webpack:
+        optional: true
+    dependencies:
+      '@babel/core': 7.23.9
       '@storybook/addon-actions': 6.5.16(react-dom@17.0.2)(react@17.0.2)
       '@storybook/addon-backgrounds': 6.5.16(react-dom@17.0.2)(react@17.0.2)
       '@storybook/addon-controls': 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
-      '@storybook/addon-docs': 6.5.16(@babel/core@7.23.3)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1)
-      '@storybook/addon-measure': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/addon-outline': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/addon-toolbars': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/addon-viewport': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/addons': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/api': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/builder-webpack5': 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
-      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
-      '@storybook/node-logger': 6.5.16
-      core-js: 3.33.2
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
-      regenerator-runtime: 0.13.11
-      ts-dedent: 2.2.0
-      webpack: 5.90.1
-    transitivePeerDependencies:
-      - '@storybook/mdx2-csf'
-      - '@swc/core'
-      - esbuild
-      - eslint
-      - supports-color
-      - typescript
-      - uglify-js
-      - vue-template-compiler
-      - webpack-cli
-    dev: true
-
-  /@storybook/addon-essentials@6.5.16(@babel/core@7.23.9)(@storybook/builder-webpack5@6.5.16)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1):
-    resolution: {integrity: sha512-TeoMr6tEit4Pe91GH6f8g/oar1P4M0JL9S6oMcFxxrhhtOGO7XkWD5EnfyCx272Ok2VYfE58FNBTGPNBVIqYKQ==}
-    peerDependencies:
-      '@babel/core': ^7.9.6
-      '@storybook/angular': '*'
-      '@storybook/builder-manager4': '*'
-      '@storybook/builder-manager5': '*'
-      '@storybook/builder-webpack4': '*'
-      '@storybook/builder-webpack5': '*'
-      '@storybook/html': '*'
-      '@storybook/vue': '*'
-      '@storybook/vue3': '*'
-      '@storybook/web-components': '*'
-      lit: '*'
-      lit-html: '*'
-      react: '*'
-      react-dom: '*'
-      svelte: '*'
-      sveltedoc-parser: '*'
-      vue: '*'
-      webpack: '*'
-    peerDependenciesMeta:
-      '@storybook/angular':
-        optional: true
-      '@storybook/builder-manager4':
-        optional: true
-      '@storybook/builder-manager5':
-        optional: true
-      '@storybook/builder-webpack4':
-        optional: true
-      '@storybook/builder-webpack5':
-        optional: true
-      '@storybook/html':
-        optional: true
-      '@storybook/vue':
-        optional: true
-      '@storybook/vue3':
-        optional: true
-      '@storybook/web-components':
-        optional: true
-      lit:
-        optional: true
-      lit-html:
-        optional: true
-      react:
-        optional: true
-      react-dom:
-        optional: true
-      svelte:
-        optional: true
-      sveltedoc-parser:
-        optional: true
-      vue:
-        optional: true
-      webpack:
-        optional: true
-    dependencies:
-      '@babel/core': 7.23.9
-      '@storybook/addon-actions': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/addon-backgrounds': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/addon-controls': 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
-      '@storybook/addon-docs': 6.5.16(@babel/core@7.23.9)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1)
+      '@storybook/addon-docs': 6.5.16(@babel/core@7.23.9)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1)
       '@storybook/addon-measure': 6.5.16(react-dom@17.0.2)(react@17.0.2)
       '@storybook/addon-outline': 6.5.16(react-dom@17.0.2)(react@17.0.2)
       '@storybook/addon-toolbars': 6.5.16(react-dom@17.0.2)(react@17.0.2)
@@ -14167,6 +14273,33 @@ packages:
       ts-dedent: 2.2.0
     dev: true
 
+  /@storybook/addon-links@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-P/mmqK57NGXnR0i3d/T5B0rIt0Lg8Yq+qionRr3LK3AwG/4yGnYt4GNomLEknn/eEwABYq1Q/Z1aOpgIhNdq5A==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    peerDependenciesMeta:
+      react:
+        optional: true
+      react-dom:
+        optional: true
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/router': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@types/qs': 6.9.10
+      core-js: 3.33.2
+      global: 4.4.0
+      prop-types: 15.7.2
+      qs: 6.11.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      ts-dedent: 2.2.0
+    dev: true
+
   /@storybook/addon-links@7.6.5(react@18.2.0):
     resolution: {integrity: sha512-Lx4Ng+iXt0YpIrKGr+nOZlpN9ypOoEDoP/7bZ6m7GXuVAkDm3JrRCBp7e2ZKSKcTxPdjPuO9HVKkIjtqjINlpw==}
     peerDependencies:
@@ -14214,6 +14347,29 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: true
 
+  /@storybook/addon-measure@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-DMwnXkmM2L6POTh4KaOWvOAtQ2p9Tr1UUNxz6VXiN5cKFohpCs6x0txdLU5WN8eWIq0VFsO7u5ZX34CGCc6gCg==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    peerDependenciesMeta:
+      react:
+        optional: true
+      react-dom:
+        optional: true
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      core-js: 3.33.2
+      global: 4.4.0
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: true
+
   /@storybook/addon-measure@7.6.5:
     resolution: {integrity: sha512-tlUudVQSrA+bwI4dhO8J7nYHtYdylcBZ86ybnqMmdTthsnyc7jnaFVQwbb6bbQJpPxvEvoNds5bVGUFocuvymQ==}
     dependencies:
@@ -14246,6 +14402,31 @@ packages:
       ts-dedent: 2.2.0
     dev: true
 
+  /@storybook/addon-outline@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-0du96nha4qltexO0Xq1xB7LeRSbqjC9XqtZLflXG7/X3ABoPD2cXgOV97eeaXUodIyb2qYBbHUfftBeA75x0+w==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    peerDependenciesMeta:
+      react:
+        optional: true
+      react-dom:
+        optional: true
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      core-js: 3.33.2
+      global: 4.4.0
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      ts-dedent: 2.2.0
+    dev: true
+
   /@storybook/addon-outline@7.6.5:
     resolution: {integrity: sha512-P7X4+Z9L/l/RZW9UvvM+iuK2SUHD22KPc+dbYOifRXDovUqhfmcKVh1CUqTDMyZrg2ZAbropehMz1eI9BlQfxg==}
     dependencies:
@@ -14275,6 +14456,28 @@ packages:
       regenerator-runtime: 0.13.11
     dev: true
 
+  /@storybook/addon-toolbars@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-y3PuUKiwOWrAvqx1YdUvArg0UaAwmboXFeR2bkrowk1xcT+xnRO3rML4npFeUl26OQ1FzwxX/cw6nknREBBLEA==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    peerDependenciesMeta:
+      react:
+        optional: true
+      react-dom:
+        optional: true
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      core-js: 3.33.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+    dev: true
+
   /@storybook/addon-toolbars@7.6.5:
     resolution: {integrity: sha512-/zqWbVNE/SHc8I5Prnd2Q8U57RGEIYvHfeXjfkuLcE2Quc4Iss4x/9eU7SKu4jm+IOO2s0wlN6HcqI3XEf2XxA==}
     dev: true
@@ -14305,6 +14508,32 @@ packages:
       regenerator-runtime: 0.13.11
     dev: true
 
+  /@storybook/addon-viewport@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-1Vyqf1U6Qng6TXlf4SdqUKyizlw1Wn6+qW8YeA2q1lbkJqn3UlnHXIp8Q0t/5q1dK5BFtREox3+jkGwbJrzkmA==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    peerDependenciesMeta:
+      react:
+        optional: true
+      react-dom:
+        optional: true
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-events': 6.5.16
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      core-js: 3.33.2
+      global: 4.4.0
+      memoizerific: 1.11.3
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+    dev: true
+
   /@storybook/addon-viewport@7.6.5:
     resolution: {integrity: sha512-9ghKTaduIUvQ6oShmWLuwMeTjtMR4RgKeKHrTJ7THMqvE/ydDPCYeL7ugF65ocXZSEz/QmxdK7uL686ZMKsqNA==}
     dependencies:
@@ -14330,24 +14559,24 @@ packages:
       regenerator-runtime: 0.13.11
     dev: true
 
-  /@storybook/addons@6.5.15(react-dom@17.0.2)(react@17.0.2):
+  /@storybook/addons@6.5.15(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-xT31SuSX+kYGyxCNK2nqL7WTxucs3rSmhiCLovJcUjYk+QquV3c2c53Ki7lwwdDbzfXFcNAe0HJ4hoTN4jhn0Q==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
     dependencies:
-      '@storybook/api': 6.5.15(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/api': 6.5.15(react-dom@18.2.0)(react@18.2.0)
       '@storybook/channels': 6.5.15
       '@storybook/client-logger': 6.5.15
       '@storybook/core-events': 6.5.15
       '@storybook/csf': 0.0.2--canary.4566f4d.1
-      '@storybook/router': 6.5.15(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/theming': 6.5.15(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/router': 6.5.15(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/theming': 6.5.15(react-dom@18.2.0)(react@18.2.0)
       '@types/webpack-env': 1.18.4
       core-js: 3.33.2
       global: 4.4.0
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       regenerator-runtime: 0.13.11
     dev: true
 
@@ -14372,6 +14601,27 @@ packages:
       regenerator-runtime: 0.13.11
     dev: true
 
+  /@storybook/addons@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-p3DqQi+8QRL5k7jXhXmJZLsE/GqHqyY6PcoA1oNTJr0try48uhTGUOYkgzmqtDaa/qPFO5LP+xCPzZXckGtquQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/channels': 6.5.16
+      '@storybook/client-logger': 6.5.16
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/router': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@types/webpack-env': 1.18.4
+      core-js: 3.33.2
+      global: 4.4.0
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+    dev: true
+
   /@storybook/api@6.3.0(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-swPMcQadLDRTnMjL9dwY6K1zXHn3KcAa3euvSHd1R4OKXTSBBj1zHvIaOrq6yHz7RIYOACmZlEV3CUru9FlvEA==}
     peerDependencies:
@@ -14402,7 +14652,7 @@ packages:
       util-deprecate: 1.0.2
     dev: true
 
-  /@storybook/api@6.5.15(react-dom@17.0.2)(react@17.0.2):
+  /@storybook/api@6.5.15(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-BBE0KXKvj1/3jTghbIoWfrcDM0t+xO7EYtWWAXD6XlhGsZVD2Dy82Z52ONyLulMDRpMWl0OYy3h6A1YnFUH25w==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0
@@ -14412,16 +14662,16 @@ packages:
       '@storybook/client-logger': 6.5.15
       '@storybook/core-events': 6.5.15
       '@storybook/csf': 0.0.2--canary.4566f4d.1
-      '@storybook/router': 6.5.15(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/router': 6.5.15(react-dom@18.2.0)(react@18.2.0)
       '@storybook/semver': 7.3.2
-      '@storybook/theming': 6.5.15(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/theming': 6.5.15(react-dom@18.2.0)(react@18.2.0)
       core-js: 3.33.2
       fast-deep-equal: 3.1.3
       global: 4.4.0
       lodash: 4.17.21
       memoizerific: 1.11.3
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       regenerator-runtime: 0.13.11
       store2: 2.14.2
       telejson: 6.0.8
@@ -14456,6 +14706,33 @@ packages:
       util-deprecate: 1.0.2
     dev: true
 
+  /@storybook/api@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-HOsuT8iomqeTMQJrRx5U8nsC7lJTwRr1DhdD0SzlqL4c80S/7uuCy4IZvOt4sYQjOzW5fOo/kamcoBXyLproTA==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/channels': 6.5.16
+      '@storybook/client-logger': 6.5.16
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/router': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/semver': 7.3.2
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      core-js: 3.33.2
+      fast-deep-equal: 3.1.3
+      global: 4.4.0
+      lodash: 4.17.21
+      memoizerific: 1.11.3
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      store2: 2.14.2
+      telejson: 6.0.8
+      ts-dedent: 2.2.0
+      util-deprecate: 1.0.2
+    dev: true
+
   /@storybook/blocks@7.6.5(@types/react-dom@18.2.12)(@types/react@18.2.27)(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-/NjuYkPks5w9lKn47KLgVC5cBkwfc+ERAp0CY0Xe//BQJkP+bcI8lE8d9Qc9IXFbOTvYEULeQrFgCkesk5BmLg==}
     peerDependencies:
@@ -14550,7 +14827,7 @@ packages:
       magic-string: 0.30.5
       rollup: 3.29.4
       typescript: 5.2.2
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
     transitivePeerDependencies:
       - encoding
       - supports-color
@@ -14627,6 +14904,77 @@ packages:
       - webpack-cli
     dev: true
 
+  /@storybook/builder-webpack4@6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
+    resolution: {integrity: sha512-YqDIrVNsUo8r9xc6AxsYDLxVYtMgl5Bxk+8/h1adsOko+jAFhdg6hOcAVxEmoSI0TMASOOVMFlT2hr23ppN2rQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+    dependencies:
+      '@babel/core': 7.23.9
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/channel-postmessage': 6.5.16
+      '@storybook/channels': 6.5.16
+      '@storybook/client-api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/core-events': 6.5.16
+      '@storybook/node-logger': 6.5.16
+      '@storybook/preview-web': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/router': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/semver': 7.3.2
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/ui': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@types/node': 16.18.61
+      '@types/webpack': 4.41.36
+      autoprefixer: 9.8.8
+      babel-loader: 8.3.0(@babel/core@7.23.9)(webpack@5.90.1)
+      case-sensitive-paths-webpack-plugin: 2.4.0
+      core-js: 3.33.2
+      css-loader: 3.6.0(webpack@5.90.1)
+      file-loader: 6.2.0(webpack@5.90.1)
+      find-up: 5.0.0
+      fork-ts-checker-webpack-plugin: 4.1.6(eslint@8.49.0)(typescript@5.2.2)(webpack@5.90.1)
+      glob: 7.1.6
+      glob-promise: 3.4.0(glob@7.1.6)
+      global: 4.4.0
+      html-webpack-plugin: 4.5.2(webpack@5.90.1)
+      pnp-webpack-plugin: 1.6.4(typescript@5.2.2)
+      postcss: 7.0.39
+      postcss-flexbugs-fixes: 4.2.1
+      postcss-loader: 4.3.0(postcss@7.0.39)(webpack@5.90.1)
+      raw-loader: 4.0.2(webpack@5.90.1)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      stable: 0.1.8
+      style-loader: 1.3.0(webpack@5.90.1)
+      terser-webpack-plugin: 4.2.3(webpack@5.90.1)
+      ts-dedent: 2.2.0
+      typescript: 5.2.2
+      url-loader: 4.1.1(file-loader@6.2.0)(webpack@5.90.1)
+      util-deprecate: 1.0.2
+      webpack: 5.90.1
+      webpack-dev-middleware: 3.7.3(webpack@5.90.1)
+      webpack-filter-warnings-plugin: 1.2.1(webpack@5.90.1)
+      webpack-hot-middleware: 2.25.4
+      webpack-virtual-modules: 0.2.2
+    transitivePeerDependencies:
+      - '@swc/core'
+      - bluebird
+      - esbuild
+      - eslint
+      - supports-color
+      - uglify-js
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
   /@storybook/builder-webpack5@6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2):
     resolution: {integrity: sha512-kh8Sofm1sbijaHDWtm0sXabqACHVFjikU/fIkkW786kpjoPIPIec1a+hrLgDsZxMU3I7XapSOaCFzWt6FjVXjg==}
     peerDependencies:
@@ -14670,7 +15018,68 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
       stable: 0.1.8
       style-loader: 2.0.0(webpack@5.90.1)
-      terser-webpack-plugin: 5.3.10(webpack@5.90.1)
+      terser-webpack-plugin: 5.3.6(webpack@5.90.1)
+      ts-dedent: 2.2.0
+      typescript: 5.2.2
+      util-deprecate: 1.0.2
+      webpack: 5.90.1
+      webpack-dev-middleware: 4.3.0(webpack@5.90.1)
+      webpack-hot-middleware: 2.25.4
+      webpack-virtual-modules: 0.4.6
+    transitivePeerDependencies:
+      - '@swc/core'
+      - esbuild
+      - eslint
+      - supports-color
+      - uglify-js
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
+  /@storybook/builder-webpack5@6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
+    resolution: {integrity: sha512-kh8Sofm1sbijaHDWtm0sXabqACHVFjikU/fIkkW786kpjoPIPIec1a+hrLgDsZxMU3I7XapSOaCFzWt6FjVXjg==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+    dependencies:
+      '@babel/core': 7.23.3
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/channel-postmessage': 6.5.16
+      '@storybook/channels': 6.5.16
+      '@storybook/client-api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/core-events': 6.5.16
+      '@storybook/node-logger': 6.5.16
+      '@storybook/preview-web': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/router': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/semver': 7.3.2
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@types/node': 16.18.61
+      babel-loader: 8.3.0(@babel/core@7.23.3)(webpack@5.90.1)
+      babel-plugin-named-exports-order: 0.0.2
+      browser-assert: 1.2.1
+      case-sensitive-paths-webpack-plugin: 2.4.0
+      core-js: 3.33.2
+      css-loader: 5.2.7(webpack@5.90.1)
+      fork-ts-checker-webpack-plugin: 6.5.3(eslint@8.49.0)(typescript@5.2.2)(webpack@5.90.1)
+      glob: 7.1.6
+      glob-promise: 3.4.0(glob@7.1.6)
+      html-webpack-plugin: 5.5.0(webpack@5.90.1)
+      path-browserify: 1.0.1
+      process: 0.11.10
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      stable: 0.1.8
+      style-loader: 2.0.0(webpack@5.90.1)
+      terser-webpack-plugin: 5.3.6(webpack@5.90.1)
       ts-dedent: 2.2.0
       typescript: 5.2.2
       util-deprecate: 1.0.2
@@ -14807,7 +15216,7 @@ packages:
       prompts: 2.4.2
       puppeteer-core: 2.1.1
       read-pkg-up: 7.0.1
-      semver: 7.6.0
+      semver: 7.5.4
       simple-update-notifier: 2.0.0
       strip-json-comments: 3.1.1
       tempy: 1.0.1
@@ -14878,6 +15287,36 @@ packages:
       util-deprecate: 1.0.2
     dev: true
 
+  /@storybook/client-api@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-i3UwkzzUFw8I+E6fOcgB5sc4oU2fhvaKnqC1mpd9IYGJ9JN9MnGIaVl3Ko28DtFItu/QabC9JsLIJVripFLktQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/channel-postmessage': 6.5.16
+      '@storybook/channels': 6.5.16
+      '@storybook/client-logger': 6.5.16
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@types/qs': 6.9.10
+      '@types/webpack-env': 1.18.4
+      core-js: 3.33.2
+      fast-deep-equal: 3.1.3
+      global: 4.4.0
+      lodash: 4.17.21
+      memoizerific: 1.11.3
+      qs: 6.11.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      store2: 2.14.2
+      synchronous-promise: 2.0.17
+      ts-dedent: 2.2.0
+      util-deprecate: 1.0.2
+    dev: true
+
   /@storybook/client-logger@6.3.0:
     resolution: {integrity: sha512-x/y820f/2Jm6RW5TxRv7IlbF6zWpTkHoajfwYuTpK/OXvK5gx6dwXGdgjNoaAGofGRz5SVjDjTDPOcd5X5AUPw==}
     dependencies:
@@ -14968,7 +15407,7 @@ packages:
       - '@types/react'
     dev: true
 
-  /@storybook/components@6.5.15(react-dom@17.0.2)(react@17.0.2):
+  /@storybook/components@6.5.15(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-bHTT0Oa3s4g+MBMaLBbX9ofMtb1AW59AzIUNGrfqW1XqJMGuUHMiJ7TSo+i5dRSFpbFygnwMEG9LfHxpR2Z0Dw==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0
@@ -14976,12 +15415,12 @@ packages:
     dependencies:
       '@storybook/client-logger': 6.5.15
       '@storybook/csf': 0.0.2--canary.4566f4d.1
-      '@storybook/theming': 6.5.15(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/theming': 6.5.15(react-dom@18.2.0)(react@18.2.0)
       core-js: 3.33.2
       memoizerific: 1.11.3
       qs: 6.11.2
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       regenerator-runtime: 0.13.11
       util-deprecate: 1.0.2
     dev: true
@@ -15004,6 +15443,24 @@ packages:
       util-deprecate: 1.0.2
     dev: true
 
+  /@storybook/components@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-LzBOFJKITLtDcbW9jXl0/PaG+4xAz25PK8JxPZpIALbmOpYWOAPcO6V9C2heX6e6NgWFMUxjplkULEk9RCQMNA==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/client-logger': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      core-js: 3.33.2
+      memoizerific: 1.11.3
+      qs: 6.11.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      util-deprecate: 1.0.2
+    dev: true
+
   /@storybook/components@7.6.5(@types/react-dom@18.2.12)(@types/react@18.2.27)(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-w4ZucbBBZ+NKMWlJKVj2I/bMBBq7gzDp9lzc4+8QaQ3vUPXKqc1ilIPYo/7UR5oxwDVMZocmMSgl9L8lvf7+Mw==}
     peerDependencies:
@@ -15064,6 +15521,43 @@ packages:
       webpack: 5.90.1
     dev: true
 
+  /@storybook/core-client@6.5.16(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1):
+    resolution: {integrity: sha512-14IRaDrVtKrQ+gNWC0wPwkCNfkZOKghYV/swCUnQX3rP99defsZK8Hc7xHIYoAiOP5+sc3sweRAxgmFiJeQ1Ig==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      typescript: '*'
+      webpack: 5.90.1
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/channel-postmessage': 6.5.16
+      '@storybook/channel-websocket': 6.5.16
+      '@storybook/client-api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/preview-web': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/ui': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      airbnb-js-shims: 2.2.1
+      ansi-to-html: 0.6.15
+      core-js: 3.33.2
+      global: 4.4.0
+      lodash: 4.17.21
+      qs: 6.11.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      ts-dedent: 2.2.0
+      typescript: 5.2.2
+      unfetch: 4.2.0
+      util-deprecate: 1.0.2
+      webpack: 5.90.1
+    dev: true
+
   /@storybook/core-client@7.6.5:
     resolution: {integrity: sha512-6FtyJcz8MSl+JYwNJZ53FM6rkT27pFHWcJPdtw/9229Ec8as9RpkNeZ/NBZjRTeDkn9Ki0VOiVAefNie9tZ/8Q==}
     dependencies:
@@ -15071,7 +15565,7 @@ packages:
       '@storybook/preview-api': 7.6.5
     dev: true
 
-  /@storybook/core-common@6.5.15(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2):
+  /@storybook/core-common@6.5.15(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
     resolution: {integrity: sha512-uits9o6qwHTPnjsNZP25f7hWmUBGRJ7FXtxxtEaNSmtiwk50KWxBaro7wt505lJ1Gb9vOhpNPhS7y3IxdsXNmQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0
@@ -15125,8 +15619,8 @@ packages:
       picomatch: 2.3.1
       pkg-dir: 5.0.0
       pretty-hrtime: 1.0.3
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       resolve-from: 5.0.0
       slash: 3.0.0
       telejson: 6.0.8
@@ -15217,6 +15711,79 @@ packages:
       - webpack-cli
     dev: true
 
+  /@storybook/core-common@6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
+    resolution: {integrity: sha512-2qtnKP3TTOzt2cp6LXKRTh7XrI9z5VanMnMTgeoFcA5ebnndD4V6BExQUdYPClE/QooLx6blUWNgS9dFEpjSqQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+    dependencies:
+      '@babel/core': 7.23.9
+      '@babel/plugin-proposal-class-properties': 7.18.6(@babel/core@7.23.9)
+      '@babel/plugin-proposal-decorators': 7.23.3(@babel/core@7.23.9)
+      '@babel/plugin-proposal-export-default-from': 7.18.10(@babel/core@7.23.9)
+      '@babel/plugin-proposal-nullish-coalescing-operator': 7.18.6(@babel/core@7.23.9)
+      '@babel/plugin-proposal-object-rest-spread': 7.20.7(@babel/core@7.23.9)
+      '@babel/plugin-proposal-optional-chaining': 7.21.0(@babel/core@7.23.9)
+      '@babel/plugin-proposal-private-methods': 7.18.6(@babel/core@7.23.9)
+      '@babel/plugin-proposal-private-property-in-object': 7.21.11(@babel/core@7.23.9)
+      '@babel/plugin-syntax-dynamic-import': 7.8.3(@babel/core@7.23.9)
+      '@babel/plugin-transform-arrow-functions': 7.23.3(@babel/core@7.23.9)
+      '@babel/plugin-transform-block-scoping': 7.23.3(@babel/core@7.23.9)
+      '@babel/plugin-transform-classes': 7.23.3(@babel/core@7.23.9)
+      '@babel/plugin-transform-destructuring': 7.23.3(@babel/core@7.23.9)
+      '@babel/plugin-transform-for-of': 7.23.3(@babel/core@7.23.9)
+      '@babel/plugin-transform-parameters': 7.23.3(@babel/core@7.23.9)
+      '@babel/plugin-transform-shorthand-properties': 7.23.3(@babel/core@7.23.9)
+      '@babel/plugin-transform-spread': 7.23.3(@babel/core@7.23.9)
+      '@babel/preset-env': 7.23.3(@babel/core@7.23.9)
+      '@babel/preset-react': 7.23.3(@babel/core@7.23.9)
+      '@babel/preset-typescript': 7.23.3(@babel/core@7.23.9)
+      '@babel/register': 7.22.15(@babel/core@7.23.9)
+      '@storybook/node-logger': 6.5.16
+      '@storybook/semver': 7.3.2
+      '@types/node': 16.18.61
+      '@types/pretty-hrtime': 1.0.3
+      babel-loader: 8.3.0(@babel/core@7.23.9)(webpack@5.90.1)
+      babel-plugin-macros: 3.1.0
+      babel-plugin-polyfill-corejs3: 0.1.7(@babel/core@7.23.9)
+      chalk: 4.1.2
+      core-js: 3.33.2
+      express: 4.18.2
+      file-system-cache: 1.1.0
+      find-up: 5.0.0
+      fork-ts-checker-webpack-plugin: 6.5.3(eslint@8.49.0)(typescript@5.2.2)(webpack@5.90.1)
+      fs-extra: 9.1.0
+      glob: 7.1.6
+      handlebars: 4.7.8
+      interpret: 2.2.0
+      json5: 2.2.3
+      lazy-universal-dotenv: 3.0.1
+      picomatch: 2.3.1
+      pkg-dir: 5.0.0
+      pretty-hrtime: 1.0.3
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      resolve-from: 5.0.0
+      slash: 3.0.0
+      telejson: 6.0.8
+      ts-dedent: 2.2.0
+      typescript: 5.2.2
+      util-deprecate: 1.0.2
+      webpack: 5.90.1
+    transitivePeerDependencies:
+      - '@swc/core'
+      - esbuild
+      - eslint
+      - supports-color
+      - uglify-js
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
   /@storybook/core-common@7.6.5:
     resolution: {integrity: sha512-z4EgzZSIVbID6Ib0jhh3jimKeaDWU8OOhoZYfn3galFmgQWowWOv1oMgipWiXfRLWw9DaLFQiCHIdLANH+VO2g==}
     dependencies:
@@ -15359,6 +15926,87 @@ packages:
       - webpack-cli
     dev: true
 
+  /@storybook/core-server@6.5.16(@storybook/builder-webpack5@6.5.16)(@storybook/manager-webpack5@6.5.16)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
+    resolution: {integrity: sha512-/3NPfmNyply395Dm0zaVZ8P9aruwO+tPx4D6/jpw8aqrRSwvAMndPMpoMCm0NXcpSm5rdX+Je4S3JW6JcggFkA==}
+    peerDependencies:
+      '@storybook/builder-webpack5': '*'
+      '@storybook/manager-webpack5': '*'
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      typescript: '*'
+    peerDependenciesMeta:
+      '@storybook/builder-webpack5':
+        optional: true
+      '@storybook/manager-webpack5':
+        optional: true
+      typescript:
+        optional: true
+    dependencies:
+      '@discoveryjs/json-ext': 0.5.7
+      '@storybook/builder-webpack4': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/builder-webpack5': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/core-client': 6.5.16(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1)
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/csf-tools': 6.5.16
+      '@storybook/manager-webpack4': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/manager-webpack5': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/node-logger': 6.5.16
+      '@storybook/semver': 7.3.2
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/telemetry': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@types/node': 16.18.61
+      '@types/node-fetch': 2.6.9
+      '@types/pretty-hrtime': 1.0.3
+      '@types/webpack': 4.41.36
+      better-opn: 2.1.1
+      boxen: 5.1.2
+      chalk: 4.1.2
+      cli-table3: 0.6.3
+      commander: 6.2.1
+      compression: 1.7.4
+      core-js: 3.33.2
+      cpy: 8.1.2
+      detect-port: 1.5.1
+      express: 4.18.2
+      fs-extra: 9.1.0
+      global: 4.4.0
+      globby: 11.1.0
+      ip: 2.0.0
+      lodash: 4.17.21
+      node-fetch: 2.7.0
+      open: 8.4.2
+      pretty-hrtime: 1.0.3
+      prompts: 2.4.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      serve-favicon: 2.5.0
+      slash: 3.0.0
+      telejson: 6.0.8
+      ts-dedent: 2.2.0
+      typescript: 5.2.2
+      util-deprecate: 1.0.2
+      watchpack: 2.4.0
+      webpack: 5.90.1
+      ws: 8.14.2
+      x-default-browser: 0.4.0
+    transitivePeerDependencies:
+      - '@storybook/mdx2-csf'
+      - '@swc/core'
+      - bluebird
+      - bufferutil
+      - encoding
+      - esbuild
+      - eslint
+      - supports-color
+      - uglify-js
+      - utf-8-validate
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
   /@storybook/core-server@7.6.5:
     resolution: {integrity: sha512-BfKzK/ObTjUcPvE5/r1pogCifM/4nLRhOUYJl7XekwHkOQwn19e6H3/ku1W3jDoYXBu642Dc9X7l/ERjKTqxFg==}
     dependencies:
@@ -15395,7 +16043,7 @@ packages:
       pretty-hrtime: 1.0.3
       prompts: 2.4.2
       read-pkg-up: 7.0.1
-      semver: 7.6.0
+      semver: 7.5.4
       telejson: 7.2.0
       tiny-invariant: 1.3.1
       ts-dedent: 2.2.0
@@ -15450,6 +16098,46 @@ packages:
       - webpack-cli
     dev: true
 
+  /@storybook/core@6.5.16(@storybook/builder-webpack5@6.5.16)(@storybook/manager-webpack5@6.5.16)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1):
+    resolution: {integrity: sha512-CEF3QFTsm/VMnMKtRNr4rRdLeIkIG0g1t26WcmxTdSThNPBd8CsWzQJ7Jqu7CKiut+MU4A1LMOwbwCE5F2gmyA==}
+    peerDependencies:
+      '@storybook/builder-webpack5': '*'
+      '@storybook/manager-webpack5': '*'
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      typescript: '*'
+      webpack: 5.90.1
+    peerDependenciesMeta:
+      '@storybook/builder-webpack5':
+        optional: true
+      '@storybook/manager-webpack5':
+        optional: true
+      typescript:
+        optional: true
+    dependencies:
+      '@storybook/builder-webpack5': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/core-client': 6.5.16(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1)
+      '@storybook/core-server': 6.5.16(@storybook/builder-webpack5@6.5.16)(@storybook/manager-webpack5@6.5.16)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/manager-webpack5': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      typescript: 5.2.2
+      webpack: 5.90.1
+    transitivePeerDependencies:
+      - '@storybook/mdx2-csf'
+      - '@swc/core'
+      - bluebird
+      - bufferutil
+      - encoding
+      - esbuild
+      - eslint
+      - supports-color
+      - uglify-js
+      - utf-8-validate
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
   /@storybook/csf-plugin@7.6.5:
     resolution: {integrity: sha512-iQ8Y/Qq1IUhHRddjDVicWJA2sM7OZA1FR97OvWUT2240WjCuQSCfy32JD8TQlYjqXgEolJeLPv3zW4qH5om4LQ==}
     dependencies:
@@ -15539,6 +16227,22 @@ packages:
       - supports-color
     dev: true
 
+  /@storybook/docs-tools@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-o+rAWPRGifjBF5xZzTKOqnHN3XQWkl0QFJYVDIiJYJrVll7ExCkpEq/PahOGzIBBV+tpMstJgmKM3lr/lu/jmg==}
+    dependencies:
+      '@babel/core': 7.23.9
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      core-js: 3.33.2
+      doctrine: 3.0.0
+      lodash: 4.17.21
+      regenerator-runtime: 0.13.11
+    transitivePeerDependencies:
+      - react
+      - react-dom
+      - supports-color
+    dev: true
+
   /@storybook/docs-tools@7.6.5:
     resolution: {integrity: sha512-UyHkHu5Af6jMpYsR4lZ69D32GQGeA0pLAn7jaBbQndgAjBdK1ykZcifiUC7Wz1hG7+YpuYspEGuDEddOh+X8FQ==}
     dependencies:
@@ -15594,7 +16298,7 @@ packages:
       dequal: 2.0.3
       lodash: 4.17.21
       memoizerific: 1.11.3
-      semver: 7.6.0
+      semver: 7.5.4
       store2: 2.14.2
       telejson: 7.2.0
       ts-dedent: 2.2.0
@@ -15663,6 +16367,66 @@ packages:
       - webpack-cli
     dev: true
 
+  /@storybook/manager-webpack4@6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
+    resolution: {integrity: sha512-5VJZwmQU6AgdsBPsYdu886UKBHQ9SJEnFMaeUxKEclXk+iRsmbzlL4GHKyVd6oGX/ZaecZtcHPR6xrzmA4Ziew==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+    dependencies:
+      '@babel/core': 7.23.9
+      '@babel/plugin-transform-template-literals': 7.23.3(@babel/core@7.23.9)
+      '@babel/preset-react': 7.23.3(@babel/core@7.23.9)
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-client': 6.5.16(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1)
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/node-logger': 6.5.16
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/ui': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@types/node': 16.18.61
+      '@types/webpack': 4.41.36
+      babel-loader: 8.3.0(@babel/core@7.23.9)(webpack@5.90.1)
+      case-sensitive-paths-webpack-plugin: 2.4.0
+      chalk: 4.1.2
+      core-js: 3.33.2
+      css-loader: 3.6.0(webpack@5.90.1)
+      express: 4.18.2
+      file-loader: 6.2.0(webpack@5.90.1)
+      find-up: 5.0.0
+      fs-extra: 9.1.0
+      html-webpack-plugin: 4.5.2(webpack@5.90.1)
+      node-fetch: 2.7.0
+      pnp-webpack-plugin: 1.6.4(typescript@5.2.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      read-pkg-up: 7.0.1
+      regenerator-runtime: 0.13.11
+      resolve-from: 5.0.0
+      style-loader: 1.3.0(webpack@5.90.1)
+      telejson: 6.0.8
+      terser-webpack-plugin: 4.2.3(webpack@5.90.1)
+      ts-dedent: 2.2.0
+      typescript: 5.2.2
+      url-loader: 4.1.1(file-loader@6.2.0)(webpack@5.90.1)
+      util-deprecate: 1.0.2
+      webpack: 5.90.1
+      webpack-dev-middleware: 3.7.3(webpack@5.90.1)
+      webpack-virtual-modules: 0.2.2
+    transitivePeerDependencies:
+      - '@swc/core'
+      - bluebird
+      - encoding
+      - esbuild
+      - eslint
+      - supports-color
+      - uglify-js
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
   /@storybook/manager-webpack5@6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2):
     resolution: {integrity: sha512-OtxXv8JCe0r/0rE5HxaFicsNsXA+fqZxzokxquFFgrYf/1Jg4d7QX6/pG5wINF+5qInJfVkRG6xhPzv1s5bk9Q==}
     peerDependencies:
@@ -15673,9 +16437,9 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@babel/core': 7.23.3
-      '@babel/plugin-transform-template-literals': 7.23.3(@babel/core@7.23.3)
-      '@babel/preset-react': 7.23.3(@babel/core@7.23.3)
+      '@babel/core': 7.23.9
+      '@babel/plugin-transform-template-literals': 7.23.3(@babel/core@7.23.9)
+      '@babel/preset-react': 7.23.3(@babel/core@7.23.9)
       '@storybook/addons': 6.5.16(react-dom@17.0.2)(react@17.0.2)
       '@storybook/core-client': 6.5.16(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1)
       '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
@@ -15683,12 +16447,12 @@ packages:
       '@storybook/theming': 6.5.16(react-dom@17.0.2)(react@17.0.2)
       '@storybook/ui': 6.5.16(react-dom@17.0.2)(react@17.0.2)
       '@types/node': 16.18.61
-      babel-loader: 8.3.0(@babel/core@7.23.3)(webpack@5.90.1)
+      babel-loader: 8.3.0(@babel/core@7.23.9)(webpack@5.90.1)
       case-sensitive-paths-webpack-plugin: 2.4.0
       chalk: 4.1.2
       core-js: 3.33.2
       css-loader: 5.2.7(webpack@5.90.1)
-      express: 4.17.3
+      express: 4.18.2
       find-up: 5.0.0
       fs-extra: 9.1.0
       html-webpack-plugin: 5.5.0(webpack@5.90.1)
@@ -15701,7 +16465,63 @@ packages:
       resolve-from: 5.0.0
       style-loader: 2.0.0(webpack@5.90.1)
       telejson: 6.0.8
-      terser-webpack-plugin: 5.3.10(webpack@5.90.1)
+      terser-webpack-plugin: 5.3.6(webpack@5.90.1)
+      ts-dedent: 2.2.0
+      typescript: 5.2.2
+      util-deprecate: 1.0.2
+      webpack: 5.90.1
+      webpack-dev-middleware: 4.3.0(webpack@5.90.1)
+      webpack-virtual-modules: 0.4.6
+    transitivePeerDependencies:
+      - '@swc/core'
+      - encoding
+      - esbuild
+      - eslint
+      - supports-color
+      - uglify-js
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
+  /@storybook/manager-webpack5@6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
+    resolution: {integrity: sha512-OtxXv8JCe0r/0rE5HxaFicsNsXA+fqZxzokxquFFgrYf/1Jg4d7QX6/pG5wINF+5qInJfVkRG6xhPzv1s5bk9Q==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+    dependencies:
+      '@babel/core': 7.23.9
+      '@babel/plugin-transform-template-literals': 7.23.3(@babel/core@7.23.9)
+      '@babel/preset-react': 7.23.3(@babel/core@7.23.9)
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-client': 6.5.16(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1)
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      '@storybook/node-logger': 6.5.16
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/ui': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@types/node': 16.18.61
+      babel-loader: 8.3.0(@babel/core@7.23.9)(webpack@5.90.1)
+      case-sensitive-paths-webpack-plugin: 2.4.0
+      chalk: 4.1.2
+      core-js: 3.33.2
+      css-loader: 5.2.7(webpack@5.90.1)
+      express: 4.18.2
+      find-up: 5.0.0
+      fs-extra: 9.1.0
+      html-webpack-plugin: 5.5.0(webpack@5.90.1)
+      node-fetch: 2.7.0
+      process: 0.11.10
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      read-pkg-up: 7.0.1
+      regenerator-runtime: 0.13.11
+      resolve-from: 5.0.0
+      style-loader: 2.0.0(webpack@5.90.1)
+      telejson: 6.0.8
+      terser-webpack-plugin: 5.3.6(webpack@5.90.1)
       ts-dedent: 2.2.0
       typescript: 5.2.2
       util-deprecate: 1.0.2
@@ -15854,6 +16674,32 @@ packages:
       util-deprecate: 1.0.2
     dev: true
 
+  /@storybook/preview-web@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-IJnvfe2sKCfk7apN9Fu9U8qibbarrPX5JB55ZzK1amSHVmSDuYk5MIMc/U3NnSQNnvd1DO5v/zMcGgj563hrtg==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/channel-postmessage': 6.5.16
+      '@storybook/client-logger': 6.5.16
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      ansi-to-html: 0.6.15
+      core-js: 3.33.2
+      global: 4.4.0
+      lodash: 4.17.21
+      qs: 6.11.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      synchronous-promise: 2.0.17
+      ts-dedent: 2.2.0
+      unfetch: 4.2.0
+      util-deprecate: 1.0.2
+    dev: true
+
   /@storybook/preview@7.6.5:
     resolution: {integrity: sha512-zmLa7C7yFGTYhgGZXoecdww9rx0Z5HpNi/GDBRWoNSK+FEdE8Jj2jF5NJ2ncldtYIyegz9ku29JFMKbhMj9K5Q==}
     dev: true
@@ -15904,7 +16750,7 @@ packages:
       react: 18.2.0
       react-docgen: 7.0.1
       react-dom: 18.2.0(react@18.2.0)
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
     transitivePeerDependencies:
       - '@preact/preset-vite'
       - encoding
@@ -15914,7 +16760,7 @@ packages:
       - vite-plugin-glimmerx
     dev: true
 
-  /@storybook/react@6.5.16(@babel/core@7.23.3)(@storybook/builder-webpack5@6.5.16)(@storybook/manager-webpack5@6.5.16)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(require-from-string@2.0.2)(typescript@5.2.2)(webpack-dev-server@4.11.1):
+  /@storybook/react@6.5.16(@babel/core@7.23.3)(@storybook/builder-webpack5@6.5.16)(@storybook/manager-webpack5@6.5.16)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(require-from-string@2.0.2)(typescript@5.2.2)(webpack-dev-server@4.11.1):
     resolution: {integrity: sha512-cBtNlOzf/MySpNLBK22lJ8wFU22HnfTB2xJyBk7W7Zi71Lm7Uxkhv1Pz8HdiQndJ0SlsAAQOWjQYsSZsGkZIaA==}
     engines: {node: '>=10.13.0'}
     hasBin: true
@@ -15946,18 +16792,18 @@ packages:
       '@babel/preset-flow': 7.23.3(@babel/core@7.23.3)
       '@babel/preset-react': 7.23.3(@babel/core@7.23.3)
       '@pmmmwh/react-refresh-webpack-plugin': 0.5.11(react-refresh@0.11.0)(webpack-dev-server@4.11.1)(webpack@5.90.1)
-      '@storybook/addons': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/builder-webpack5': 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/builder-webpack5': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
       '@storybook/client-logger': 6.5.16
-      '@storybook/core': 6.5.16(@storybook/builder-webpack5@6.5.16)(@storybook/manager-webpack5@6.5.16)(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)(webpack@5.90.1)
-      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
+      '@storybook/core': 6.5.16(@storybook/builder-webpack5@6.5.16)(@storybook/manager-webpack5@6.5.16)(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)(webpack@5.90.1)
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
       '@storybook/csf': 0.0.2--canary.4566f4d.1
-      '@storybook/docs-tools': 6.5.16(react-dom@17.0.2)(react@17.0.2)
-      '@storybook/manager-webpack5': 6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2)
+      '@storybook/docs-tools': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/manager-webpack5': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
       '@storybook/node-logger': 6.5.16
       '@storybook/react-docgen-typescript-plugin': 1.0.2-canary.6.9d540b91e815f8fc2f8829189deb00553559ff63.0(typescript@5.2.2)(webpack@5.90.1)
       '@storybook/semver': 7.3.2
-      '@storybook/store': 6.5.16(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/store': 6.5.16(react-dom@18.2.0)(react@18.2.0)
       '@types/estree': 0.0.51
       '@types/node': 16.18.61
       '@types/webpack-env': 1.18.4
@@ -15973,9 +16819,9 @@ packages:
       html-tags: 3.3.1
       lodash: 4.17.21
       prop-types: 15.7.2
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
-      react-element-to-jsx-string: 14.3.4(react-dom@17.0.2)(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-element-to-jsx-string: 14.3.4(react-dom@18.2.0)(react@18.2.0)
       react-refresh: 0.11.0
       read-pkg-up: 7.0.1
       regenerator-runtime: 0.13.11
@@ -16156,7 +17002,7 @@ packages:
       ts-dedent: 2.2.0
     dev: true
 
-  /@storybook/router@6.5.15(react-dom@17.0.2)(react@17.0.2):
+  /@storybook/router@6.5.15(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-9t8rI8t7/Krolau29gsdjdbRQ66orONIyP0efp0EukVgv6reNFzb/U14ARrl0uHys6Tl5Xyece9FoakQUdn8Kg==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0
@@ -16166,8 +17012,8 @@ packages:
       core-js: 3.33.2
       memoizerific: 1.11.3
       qs: 6.11.2
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       regenerator-runtime: 0.13.11
     dev: true
 
@@ -16186,6 +17032,21 @@ packages:
       regenerator-runtime: 0.13.11
     dev: true
 
+  /@storybook/router@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-ZgeP8a5YV/iuKbv31V8DjPxlV4AzorRiR8OuSt/KqaiYXNXlOoQDz/qMmiNcrshrfLpmkzoq7fSo4T8lWo2UwQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/client-logger': 6.5.16
+      core-js: 3.33.2
+      memoizerific: 1.11.3
+      qs: 6.11.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+    dev: true
+
   /@storybook/router@7.6.17:
     resolution: {integrity: sha512-GnyC0j6Wi5hT4qRhSyT8NPtJfGmf82uZw97LQRWeyYu5gWEshUdM7aj40XlNiScd5cZDp0owO1idduVF2k2l2A==}
     dependencies:
@@ -16231,13 +17092,33 @@ packages:
       regenerator-runtime: 0.13.11
     dev: true
 
-  /@storybook/store@6.5.15(react-dom@17.0.2)(react@17.0.2):
+  /@storybook/source-loader@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-fyVl4jrM/5JLrb48aqXPu7sTsmySQaVGFp1zfeqvPPlJRFMastDrePm5XGPN7Qjv1wsKmpuBvuweFKOT1pru3g==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      core-js: 3.33.2
+      estraverse: 5.3.0
+      global: 4.4.0
+      loader-utils: 2.0.4
+      lodash: 4.17.21
+      prettier: 2.3.0
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+    dev: true
+
+  /@storybook/store@6.5.15(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-r6cYTf6GtbqgdI4ZG3xuWdJAAu5fJ3xAWMiDkHyoK2u+R2TeYXIsJvgn0BPrW87sZhELIkg4ckdFECmATs3kpQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
     dependencies:
-      '@storybook/addons': 6.5.15(react-dom@17.0.2)(react@17.0.2)
+      '@storybook/addons': 6.5.15(react-dom@18.2.0)(react@18.2.0)
       '@storybook/client-logger': 6.5.15
       '@storybook/core-events': 6.5.15
       '@storybook/csf': 0.0.2--canary.4566f4d.1
@@ -16246,8 +17127,8 @@ packages:
       global: 4.4.0
       lodash: 4.17.21
       memoizerific: 1.11.3
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       regenerator-runtime: 0.13.11
       slash: 3.0.0
       stable: 0.1.8
@@ -16281,6 +17162,31 @@ packages:
       util-deprecate: 1.0.2
     dev: true
 
+  /@storybook/store@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-g+bVL5hmMq/9cM51K04e37OviUPHT0rHHrRm5wj/hrf18Kd9120b3sxdQ5Dc+HZ292yuME0n+cyrQPTYx9Epmw==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/client-logger': 6.5.16
+      '@storybook/core-events': 6.5.16
+      '@storybook/csf': 0.0.2--canary.4566f4d.1
+      core-js: 3.33.2
+      fast-deep-equal: 3.1.3
+      global: 4.4.0
+      lodash: 4.17.21
+      memoizerific: 1.11.3
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      slash: 3.0.0
+      stable: 0.1.8
+      synchronous-promise: 2.0.17
+      ts-dedent: 2.2.0
+      util-deprecate: 1.0.2
+    dev: true
+
   /@storybook/telemetry@6.5.16(eslint@8.49.0)(react-dom@17.0.2)(react@17.0.2)(typescript@5.2.2):
     resolution: {integrity: sha512-CWr5Uko1l9jJW88yTXsZTj/3GTabPvw0o7pDPOXPp8JRZiJTxv1JFaFCafhK9UzYbgcRuGfCC8kEWPZims7iKA==}
     dependencies:
@@ -16310,6 +17216,35 @@ packages:
       - webpack-cli
     dev: true
 
+  /@storybook/telemetry@6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2):
+    resolution: {integrity: sha512-CWr5Uko1l9jJW88yTXsZTj/3GTabPvw0o7pDPOXPp8JRZiJTxv1JFaFCafhK9UzYbgcRuGfCC8kEWPZims7iKA==}
+    dependencies:
+      '@storybook/client-logger': 6.5.16
+      '@storybook/core-common': 6.5.16(eslint@8.49.0)(react-dom@18.2.0)(react@18.2.0)(typescript@5.2.2)
+      chalk: 4.1.2
+      core-js: 3.33.2
+      detect-package-manager: 2.0.1
+      fetch-retry: 5.0.6
+      fs-extra: 9.1.0
+      global: 4.4.0
+      isomorphic-unfetch: 3.1.0
+      nanoid: 3.3.7
+      read-pkg-up: 7.0.1
+      regenerator-runtime: 0.13.11
+    transitivePeerDependencies:
+      - '@swc/core'
+      - encoding
+      - esbuild
+      - eslint
+      - react
+      - react-dom
+      - supports-color
+      - typescript
+      - uglify-js
+      - vue-template-compiler
+      - webpack-cli
+    dev: true
+
   /@storybook/telemetry@7.6.5:
     resolution: {integrity: sha512-FiLRh9k9LoGphqgBqPYySWdGqplihiZyDwqdo+Qs19RcQ/eiKg0W7fdA09nStcdcsHmDl/1cMfRhz9KUiMtwOw==}
     dependencies:
@@ -16356,7 +17291,7 @@ packages:
       ts-dedent: 2.2.0
     dev: true
 
-  /@storybook/theming@6.5.15(react-dom@17.0.2)(react@17.0.2):
+  /@storybook/theming@6.5.15(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-pgdW0lVZKKXQ4VhIfLHycMmwFSVOY7vLTKnytag4Y8Yz+aXm0bwDN/QxPntFzDH47F1Rcy2ywNnvty8ooDTvuA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0
@@ -16365,8 +17300,8 @@ packages:
       '@storybook/client-logger': 6.5.15
       core-js: 3.33.2
       memoizerific: 1.11.3
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
       regenerator-runtime: 0.13.11
     dev: true
 
@@ -16384,6 +17319,20 @@ packages:
       regenerator-runtime: 0.13.11
     dev: true
 
+  /@storybook/theming@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-hNLctkjaYLRdk1+xYTkC1mg4dYz2wSv6SqbLpcKMbkPHTE0ElhddGPHQqB362md/w9emYXNkt1LSMD8Xk9JzVQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/client-logger': 6.5.16
+      core-js: 3.33.2
+      memoizerific: 1.11.3
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+    dev: true
+
   /@storybook/theming@7.6.17(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-ZbaBt3KAbmBtfjNqgMY7wPMBshhSJlhodyMNQypv+95xLD/R+Az6aBYbpVAOygLaUQaQk4ar7H/Ww6lFIoiFbA==}
     peerDependencies:
@@ -16454,6 +17403,30 @@ packages:
       resolve-from: 5.0.0
     dev: true
 
+  /@storybook/ui@6.5.16(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-rHn/n12WM8BaXtZ3IApNZCiS+C4Oc5+Lkl4MoctX8V7QSml0SxZBB5hsJ/AiWkgbRxjQpa/L/Nt7/Qw0FjTH/A==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@storybook/addons': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/api': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/channels': 6.5.16
+      '@storybook/client-logger': 6.5.16
+      '@storybook/components': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/core-events': 6.5.16
+      '@storybook/router': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      '@storybook/semver': 7.3.2
+      '@storybook/theming': 6.5.16(react-dom@18.2.0)(react@18.2.0)
+      core-js: 3.33.2
+      memoizerific: 1.11.3
+      qs: 6.11.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      regenerator-runtime: 0.13.11
+      resolve-from: 5.0.0
+    dev: true
+
   /@swc/core-darwin-arm64@1.3.96:
     resolution: {integrity: sha512-8hzgXYVd85hfPh6mJ9yrG26rhgzCmcLO0h1TIl8U31hwmTbfZLzRitFQ/kqMJNbIBCwmNH1RU2QcJnL3d7f69A==}
     engines: {node: '>=10'}
@@ -16627,8 +17600,8 @@ packages:
     resolution: {integrity: sha512-effSYz9AWcZ6sNd+c8LCBYFIuDZApoCTXEpRlEYChBZpMz9QUUVMLToThwCyUY49+T5pANL3XxgZf3HV7hwJlg==}
     dev: false
 
-  /@tanstack/query-devtools@5.20.2:
-    resolution: {integrity: sha512-BZfSjhk/NGPbqte5E3Vc1Zbj28uWt///4I0DgzAdWrOtMVvdl0WlUXK23K2daLsbcyfoDR4jRI4f2Z5z/mMzuw==}
+  /@tanstack/query-devtools@5.24.0:
+    resolution: {integrity: sha512-pThim455t69zrZaQKa7IRkEIK8UBTS+gHVAdNfhO72Xh4rWpMc63ovRje5/n6iw63+d6QiJzVadsJVdPoodSeQ==}
     dev: true
 
   /@tanstack/react-cross-context@1.15.10(react-dom@18.2.0)(react@18.2.0):
@@ -16663,13 +17636,13 @@ packages:
       react: 18.2.0
     dev: false
 
-  /@tanstack/react-query-devtools@5.20.5(@tanstack/react-query@5.0.5)(react@18.2.0):
-    resolution: {integrity: sha512-Wl7IzNuKCb4h41a5iH/YXNwalHItqJPCAr4r8+0iUYOLHNOf3E9P0G4kzZ9sqDoWKxY04qst6Vrij9bwPzLQRQ==}
+  /@tanstack/react-query-devtools@5.24.1(@tanstack/react-query@5.0.5)(react@18.2.0):
+    resolution: {integrity: sha512-qa4SEugN+EF8JJXcpsM9Lu05HfUv5cvHvLuB0uw/81eJZyNHFdtHFBi5RLCgpBrOyVMDfH8UQ3VBMqXzFKV68A==}
     peerDependencies:
-      '@tanstack/react-query': ^5.20.5
+      '@tanstack/react-query': ^5.24.1
       react: ^18.0.0
     dependencies:
-      '@tanstack/query-devtools': 5.20.2
+      '@tanstack/query-devtools': 5.24.0
       '@tanstack/react-query': 5.0.5(react-dom@18.2.0)(react@18.2.0)
       react: 18.2.0
     dev: true
@@ -16690,18 +17663,18 @@ packages:
       react: 18.2.0
       react-dom: 18.2.0(react@18.2.0)
 
-  /@tanstack/react-router-server@1.16.2(preact@10.19.4)(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-vnhRBX/G/NUFLOA+AvyscWj2UiBon18UPhANB3cM5JX4XuJlSmbBXOyTINCky0HhQDOPWl1gyEJHet2enX/pYA==}
+  /@tanstack/react-router-server@1.17.4(preact@10.19.6)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-X1ZEOlHEKcTcldfZDhP5wP5Tv8u/1kxy9Nty08TrM4a9SWYNl0o3AzNnP9c8Y3C2IZ6j8ADAaDnPFwBhCaI5ng==}
     engines: {node: '>=12'}
     peerDependencies:
       react: '>=18'
       react-dom: '>=18'
     dependencies:
       '@tanstack/react-cross-context': 1.15.10(react-dom@18.2.0)(react@18.2.0)
-      '@tanstack/react-router': 1.16.2(react-dom@18.2.0)(react@18.2.0)
+      '@tanstack/react-router': 1.17.4(react-dom@18.2.0)(react@18.2.0)
       react: 18.2.0
       react-dom: 18.2.0(react@18.2.0)
-      vinxi: 0.2.1(preact@10.19.4)
+      vinxi: 0.2.1(preact@10.19.6)
     transitivePeerDependencies:
       - '@azure/app-configuration'
       - '@azure/cosmos'
@@ -16730,12 +17703,13 @@ packages:
       - sugarss
       - supports-color
       - terser
+      - uWebSockets.js
       - utf-8-validate
       - xml2js
     dev: false
 
-  /@tanstack/react-router@1.16.2(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-GgAxcs3JQjpC/nQd81S9MQ2wC9aPEw+fBt0n1VwYl/vW571OpU4HfRawu/OT4piHcV9/VS5oAUoZlwtApI0hLw==}
+  /@tanstack/react-router@1.17.4(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-iW/TgJN/qZ+Ly73jDU3D2AuC3IlAHGx3ybXTvVuZ1hihsud7arEg7g83hsuU+xbkPcVWfly9ndTb1XKxrovw9w==}
     engines: {node: '>=12'}
     peerDependencies:
       react: '>=16'
@@ -16761,32 +17735,36 @@ packages:
       use-sync-external-store: 1.2.0(react@18.2.0)
     dev: false
 
-  /@tanstack/router-devtools@1.16.2(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-ntGIeLjzEaWyo0Tb8x3tAC9YZXyywYDuODn3IZCYBx+ju4lIyQEIWjZpBNGEaHv3D9QfNTeZN0uposXylZN2kw==}
+  /@tanstack/router-devtools@1.17.4(csstype@3.1.2)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-tt02Xi1WpM/WkSrgmiKDvFa9OsLApWSfxulHVzyl/F9JMulOjqy45s0BxH2PlQSKGHjp8CNIBRyd4Ajs+sIN3A==}
     engines: {node: '>=12'}
     peerDependencies:
       react: '>=16'
       react-dom: '>=16'
     dependencies:
-      '@tanstack/react-router': 1.16.2(react-dom@18.2.0)(react@18.2.0)
+      '@tanstack/react-router': 1.17.4(react-dom@18.2.0)(react@18.2.0)
+      clsx: 2.1.0
       date-fns: 2.30.0
+      goober: 2.1.14(csstype@3.1.2)
       react: 18.2.0
       react-dom: 18.2.0(react@18.2.0)
+    transitivePeerDependencies:
+      - csstype
     dev: false
 
-  /@tanstack/router-generator@1.16.3:
-    resolution: {integrity: sha512-S3cO7bUtWnbMKVuC6nVcx4TpE1n98aCXQ3xhPtiZr5dgtIxIQFN+O62H0M1UJi1kkDPQ37dJoXzupXLxW1aexw==}
+  /@tanstack/router-generator@1.16.5:
+    resolution: {integrity: sha512-np9+DASQvD4ff+FrCZ4XqRMGpVC6Y2213kma/X05mvo241yh0D5C6paUY7N7pSBPpuTlJbYKi+73cm/xRtK3Hg==}
     engines: {node: '>=12'}
     dependencies:
       prettier: 3.2.5
       zod: 3.22.4
     dev: false
 
-  /@tanstack/router-vite-plugin@1.16.3:
-    resolution: {integrity: sha512-ECIzQP1QS3hxFKmg8UUw3u8fkPqWWb3XrEUm8NIQZ1bMfirYV8vVNpl2beeB5+N1mqEwBXzxXuXEse0utO4rPg==}
+  /@tanstack/router-vite-plugin@1.16.5:
+    resolution: {integrity: sha512-rNfAuWIScl0KnjWOda5hzQYgHdwpLu1OljvqZa260UrCB6e32882X2Ci687+OUBfydhZT/V53XtQ+la7/AO5Rw==}
     engines: {node: '>=12'}
     dependencies:
-      '@tanstack/router-generator': 1.16.3
+      '@tanstack/router-generator': 1.16.5
     dev: false
 
   /@tanstack/store@0.1.3:
@@ -16856,6 +17834,7 @@ packages:
       dom-accessibility-api: 0.5.16
       lodash: 4.17.21
       redent: 3.0.0
+    dev: false
 
   /@testing-library/jest-dom@5.16.5:
     resolution: {integrity: sha512-N5ixQ2qKpi5OLYfwQmUb/5mSV9LneAcaUfp32pn4yCnpb8r/Yz0pXFPck21dIicKmi+ta5WRAknkZCfA8refMA==}
@@ -16898,10 +17877,45 @@ packages:
       dom-accessibility-api: 0.5.16
       lodash: 4.17.21
       redent: 3.0.0
-      vitest: 0.34.6(jsdom@22.1.0)(lightningcss@1.23.0)
+      vitest: 0.34.6(jsdom@22.1.0)(lightningcss@1.24.0)
     dev: true
 
-  /@testing-library/react-hooks@8.0.1(@types/react@18.2.57)(react-dom@17.0.2)(react-test-renderer@17.0.2)(react@17.0.2):
+  /@testing-library/jest-dom@6.4.1(@jest/globals@29.7.0)(@types/jest@29.5.8)(jest@26.6.3)(vitest@0.34.6):
+    resolution: {integrity: sha512-Z7qMM3J2Zw5H/nC2/5CYx5YcuaD56JmDFKNIozZ89VIo6o6Y9FMhssics4e2madEKYDNEpZz3+glPGz0yWMOag==}
+    engines: {node: '>=14', npm: '>=6', yarn: '>=1'}
+    peerDependencies:
+      '@jest/globals': '>= 28'
+      '@types/bun': latest
+      '@types/jest': '>= 28'
+      jest: '>= 28'
+      vitest: '>= 0.32'
+    peerDependenciesMeta:
+      '@jest/globals':
+        optional: true
+      '@types/bun':
+        optional: true
+      '@types/jest':
+        optional: true
+      jest:
+        optional: true
+      vitest:
+        optional: true
+    dependencies:
+      '@adobe/css-tools': 4.3.2
+      '@babel/runtime': 7.20.6
+      '@jest/globals': 29.7.0
+      '@types/jest': 29.5.8
+      aria-query: 5.3.0
+      chalk: 3.0.0
+      css.escape: 1.5.1
+      dom-accessibility-api: 0.6.3
+      jest: 26.6.3
+      lodash: 4.17.21
+      redent: 3.0.0
+      vitest: 0.34.6(jsdom@21.1.2)
+    dev: true
+
+  /@testing-library/react-hooks@8.0.1(@types/react@18.2.60)(react-dom@18.2.0)(react-test-renderer@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-Aqhl2IVmLt8IovEVarNDFuJDVWVvhnr9/GCU6UUnrYXwgDFF9h2L2o2P9KBni1AST5sT6riAyoukFLyjQUgD/g==}
     engines: {node: '>=12'}
     peerDependencies:
@@ -16918,11 +17932,11 @@ packages:
         optional: true
     dependencies:
       '@babel/runtime': 7.20.6
-      '@types/react': 18.2.57
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
-      react-error-boundary: 3.1.4(react@17.0.2)
-      react-test-renderer: 17.0.2(react@17.0.2)
+      '@types/react': 18.2.60
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-error-boundary: 3.1.4(react@18.2.0)
+      react-test-renderer: 18.2.0(react@18.2.0)
     dev: true
 
   /@testing-library/react@12.1.5(react-dom@17.0.2)(react@17.0.2):
@@ -16937,6 +17951,7 @@ packages:
       '@types/react-dom': 17.0.23
       react: 17.0.2
       react-dom: 17.0.2(react@17.0.2)
+    dev: false
 
   /@testing-library/react@13.4.0(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-sXOGON+WNTh3MLE9rve97ftaZukN3oNf2KjDy7YTx6hcTO2uuLHuCGynMDhFwGw/jYf4OJ2Qk0i4i79qMNNkyw==}
@@ -16966,7 +17981,21 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: true
 
-  /@testing-library/react@9.5.0(react-dom@17.0.2)(react@17.0.2):
+  /@testing-library/react@14.2.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-7uBnPHyOG6nDGCzv8SLeJbSa33ZoYw7swYpSLIgJvBALdq7l9zPNk33om4USrxy1lKTxXaVfufzLmq83WNfWIw==}
+    engines: {node: '>=14'}
+    peerDependencies:
+      react: ^18.0.0
+      react-dom: ^18.0.0
+    dependencies:
+      '@babel/runtime': 7.20.6
+      '@testing-library/dom': 9.3.3
+      '@types/react-dom': 18.2.19
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: true
+
+  /@testing-library/react@9.5.0(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-di1b+D0p+rfeboHO5W7gTVeZDIK5+maEgstrZbWZSSvxDyfDRkkyBE1AJR5Psd6doNldluXlCWqXriUfqu/9Qg==}
     engines: {node: '>=8'}
     peerDependencies:
@@ -16976,8 +18005,8 @@ packages:
       '@babel/runtime': 7.20.6
       '@testing-library/dom': 6.16.0
       '@types/testing-library__react': 9.1.3
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
     dev: true
 
   /@testing-library/user-event@14.5.1(@testing-library/dom@9.3.3):
@@ -17223,7 +18252,7 @@ packages:
   /@types/hoist-non-react-statics@3.3.5:
     resolution: {integrity: sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==}
     dependencies:
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
       hoist-non-react-statics: 3.3.2
 
   /@types/html-minifier-terser@5.1.2:
@@ -17415,39 +18444,40 @@ packages:
   /@types/reach__router@1.3.14:
     resolution: {integrity: sha512-2iOQZbwfw1ZYwYK+dRp7D1b8kU6GlFPJ/iEt33zDYxfId5CAKT7vX3lN/XmJ+FaMZ3FyB99tPgfajcmZnTqdtg==}
     dependencies:
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
     dev: true
 
   /@types/react-dom@17.0.23:
     resolution: {integrity: sha512-lnJAZfMEDxfvELeeT24w4rnUYwpzUzQAOTfJQbWYnLcx8AEfz+fXJDCbowIBqNK/Bi4D6j8ovT8Qsda2OtDApA==}
     dependencies:
       '@types/react': 17.0.70
+    dev: false
 
   /@types/react-dom@18.2.12:
     resolution: {integrity: sha512-QWZuiA/7J/hPIGocXreCRbx7wyoeet9ooxfbSA+zbIWqyQEE7GMtRn4A37BdYyksnN+/NDnWgfxZH9UVGDw1hg==}
     dependencies:
-      '@types/react': 18.2.57
+      '@types/react': 18.2.27
     dev: true
 
   /@types/react-dom@18.2.19:
     resolution: {integrity: sha512-aZvQL6uUbIJpjZk4U8JZGbau9KDeAwMfmhyWorxgBkqDIEf6ROjRozcmPIicqsUwPUjbkDfHKgGee1Lq65APcA==}
     dependencies:
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
 
   /@types/react-redux@7.1.30:
     resolution: {integrity: sha512-i2kqM6YaUwFKduamV6QM/uHbb0eCP8f8ZQ/0yWf+BsAVVsZPRYJ9eeGWZ3uxLfWwwA0SrPRMTPTqsPFkY3HZdA==}
     dependencies:
       '@types/hoist-non-react-statics': 3.3.5
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
       hoist-non-react-statics: 3.3.2
-      redux: 4.1.0
+      redux: 4.2.1
     dev: false
 
   /@types/react-redux@7.1.33:
     resolution: {integrity: sha512-NF8m5AjWCkert+fosDsN3hAlHzpjSiXlVy9EgQEmLoBhaNXbmyeGs/aj5dQzKuF+/q+S7JQagorGDW8pJ28Hmg==}
     dependencies:
       '@types/hoist-non-react-statics': 3.3.5
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
       hoist-non-react-statics: 3.3.2
       redux: 4.1.0
     dev: true
@@ -17456,7 +18486,7 @@ packages:
     resolution: {integrity: sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==}
     dependencies:
       '@types/history': 4.7.11
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
       '@types/react-router': 5.1.20
     dev: true
 
@@ -17464,19 +18494,19 @@ packages:
     resolution: {integrity: sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==}
     dependencies:
       '@types/history': 4.7.11
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
     dev: true
 
   /@types/react-syntax-highlighter@11.0.5:
     resolution: {integrity: sha512-VIOi9i2Oj5XsmWWoB72p3KlZoEbdRAcechJa8Ztebw7bDl2YmR+odxIqhtJGp1q2EozHs02US+gzxJ9nuf56qg==}
     dependencies:
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
     dev: true
 
-  /@types/react-test-renderer@18.0.1:
-    resolution: {integrity: sha512-LjEF+jTUCjzd+Qq4eWqsmZvEWPA/l4L0my+YWN5US8Fo3wZOMiyrpBshHDFbkO8usjdO1B430mEWNU/i1MF7Qg==}
+  /@types/react-test-renderer@18.0.7:
+    resolution: {integrity: sha512-1+ANPOWc6rB3IkSnElhjv6VLlKg2dSv/OWClUyZimbLsQyBn8Js9Vtdsi3UICJ2rIQ3k2la06dkB+C92QfhKmg==}
     dependencies:
-      '@types/react': 18.2.57
+      '@types/react': 18.2.60
     dev: true
 
   /@types/react@17.0.70:
@@ -17485,6 +18515,7 @@ packages:
       '@types/prop-types': 15.7.10
       '@types/scheduler': 0.16.6
       csstype: 3.1.2
+    dev: false
 
   /@types/react@18.2.27:
     resolution: {integrity: sha512-Wfv7B7FZiR2r3MIqbAlXoY1+tXm4bOqfz4oRr+nyXdBqapDBZ0l/IGcSlAfvxIHEEJjkPU0MYAc/BlFPOcrgLw==}
@@ -17494,16 +18525,8 @@ packages:
       csstype: 3.1.2
     dev: true
 
-  /@types/react@18.2.55:
-    resolution: {integrity: sha512-Y2Tz5P4yz23brwm2d7jNon39qoAtMMmalOQv6+fEFt1mT+FcM3D841wDpoUvFXhaYenuROCy3FZYqdTjM7qVyA==}
-    dependencies:
-      '@types/prop-types': 15.7.10
-      '@types/scheduler': 0.16.6
-      csstype: 3.1.2
-    dev: true
-
-  /@types/react@18.2.57:
-    resolution: {integrity: sha512-ZvQsktJgSYrQiMirAN60y4O/LRevIV8hUzSOSNB6gfR3/o3wCBFQx3sPwIYtuDMeiVgsSS3UzCV26tEzgnfvQw==}
+  /@types/react@18.2.60:
+    resolution: {integrity: sha512-dfiPj9+k20jJrLGOu9Nf6eqxm2EyJRrq2NvwOFsfbb7sFExZ9WELPs67UImHj3Ayxg8ruTtKtNnbjaF8olPq0A==}
     dependencies:
       '@types/prop-types': 15.7.10
       '@types/scheduler': 0.16.6
@@ -17597,7 +18620,7 @@ packages:
     resolution: {integrity: sha512-mj1aH4cj3XUpMEgVpognma5kHVtbm6U6cHZmEFzCRiXPvKkuHrFr3+yXdGLXvfFRBaQIVshPGHI+hGTOJlhS/g==}
     deprecated: This is a stub types definition. testing-library__dom provides its own type definitions, so you do not need this installed.
     dependencies:
-      '@testing-library/dom': 8.20.1
+      '@testing-library/dom': 9.3.3
     dev: true
 
   /@types/testing-library__jest-dom@5.14.9:
@@ -17623,6 +18646,10 @@ packages:
     resolution: {integrity: sha512-IfYcSBWE3hLpBg8+X2SEa8LVkJdJEkT2Ese2aaLs3ptGdVtABxndrMaxuFlQ1qdFf9Q5rDvDpxI3WwgvKFAsQA==}
     dev: true
 
+  /@types/use-sync-external-store@0.0.3:
+    resolution: {integrity: sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA==}
+    dev: false
+
   /@types/uuid@9.0.7:
     resolution: {integrity: sha512-WUtIVRUZ9i5dYXefDEAI7sh9/O7jGvHg7Df/5O/gtH3Yabe5odI3UWopVR1qbPXQtvOxWu3mM4XxlYeZtMWF4g==}
     dev: true
@@ -17714,7 +18741,7 @@ packages:
       graphemer: 1.4.0
       ignore: 5.3.0
       natural-compare-lite: 1.4.0
-      semver: 7.6.0
+      semver: 7.5.4
       tsutils: 3.21.0(typescript@5.2.2)
       typescript: 5.2.2
     transitivePeerDependencies:
@@ -17741,7 +18768,7 @@ packages:
       graphemer: 1.4.0
       ignore: 5.3.0
       natural-compare-lite: 1.4.0
-      semver: 7.6.0
+      semver: 7.5.4
       tsutils: 3.21.0(typescript@5.3.3)
       typescript: 5.3.3
     transitivePeerDependencies:
@@ -18036,7 +19063,7 @@ packages:
       debug: 4.3.4(supports-color@8.1.1)
       globby: 11.1.0
       is-glob: 4.0.3
-      semver: 7.6.0
+      semver: 7.5.4
       tsutils: 3.21.0(typescript@5.2.2)
       typescript: 5.2.2
     transitivePeerDependencies:
@@ -18056,7 +19083,7 @@ packages:
       debug: 4.3.4(supports-color@8.1.1)
       globby: 11.1.0
       is-glob: 4.0.3
-      semver: 7.6.0
+      semver: 7.5.4
       tsutils: 3.21.0(typescript@5.3.3)
       typescript: 5.3.3
     transitivePeerDependencies:
@@ -18077,7 +19104,7 @@ packages:
       debug: 4.3.4(supports-color@8.1.1)
       globby: 11.1.0
       is-glob: 4.0.3
-      semver: 7.6.0
+      semver: 7.5.4
       ts-api-utils: 1.0.3(typescript@5.2.2)
       typescript: 5.2.2
     transitivePeerDependencies:
@@ -18117,7 +19144,7 @@ packages:
       '@typescript-eslint/typescript-estree': 5.62.0(typescript@5.2.2)
       eslint: 8.49.0
       eslint-scope: 5.1.1
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -18136,7 +19163,7 @@ packages:
       '@typescript-eslint/typescript-estree': 5.62.0(typescript@5.3.3)
       eslint: 8.49.0
       eslint-scope: 5.1.1
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -18156,7 +19183,7 @@ packages:
       '@typescript-eslint/typescript-estree': 5.62.0(typescript@5.2.2)
       eslint: 8.53.0
       eslint-scope: 5.1.1
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -18175,7 +19202,7 @@ packages:
       '@typescript-eslint/types': 6.7.0
       '@typescript-eslint/typescript-estree': 6.7.0(typescript@5.2.2)
       eslint: 8.49.0
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -18262,7 +19289,7 @@ packages:
       lodash: 4.17.21
       mlly: 1.4.2
       outdent: 0.8.0
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
       vite-node: 0.28.5(@types/node@20.9.0)
     transitivePeerDependencies:
       - '@types/node'
@@ -18286,7 +19313,7 @@ packages:
     dependencies:
       '@mapbox/node-pre-gyp': 1.0.11
       '@rollup/pluginutils': 4.2.1
-      acorn: 8.11.3
+      acorn: 8.11.2
       async-sema: 3.1.1
       bindings: 1.5.0
       estree-walker: 2.0.2
@@ -18300,12 +19327,12 @@ packages:
       - supports-color
     dev: false
 
-  /@vinxi/devtools@0.2.0(@babel/core@7.23.9)(preact@10.19.4)(vite@4.5.0):
+  /@vinxi/devtools@0.2.0(@babel/core@7.23.9)(preact@10.19.6)(vite@4.5.0):
     resolution: {integrity: sha512-LpQp5zbiBhV4eo2w6AiJFtpZZj4LaRBOnzggIPTeSJYvgrxRMAqe/34Har3vVo+b7sPOjxFbE1zHZhLzaAcidw==}
     dependencies:
-      '@preact/preset-vite': 2.8.1(@babel/core@7.23.9)(preact@10.19.4)(vite@4.5.0)
+      '@preact/preset-vite': 2.8.1(@babel/core@7.23.9)(preact@10.19.6)(vite@4.5.0)
       '@solidjs/router': 0.8.4(solid-js@1.8.15)
-      birpc: 0.2.15
+      birpc: 0.2.17
       solid-js: 1.8.15
       vite-plugin-inspect: 0.7.42(vite@4.5.0)
       vite-plugin-solid: 2.10.1(solid-js@1.8.15)(vite@4.5.0)
@@ -18326,7 +19353,7 @@ packages:
     resolution: {integrity: sha512-WSN1z931BtasZJlgPp704zJFnQFRg7yzSjkm3MzAWQYe4uXFXlFr1hc5Ac2zae5/HDOz5x1/zDM5Cb54vTCnWw==}
     hasBin: true
     dependencies:
-      '@parcel/watcher': 2.4.0
+      '@parcel/watcher': 2.3.0
       '@parcel/watcher-wasm': 2.3.0
       citty: 0.1.6
       clipboardy: 4.0.0
@@ -18336,7 +19363,7 @@ packages:
       h3: 1.10.1
       http-shutdown: 1.2.2
       jiti: 1.21.0
-      mlly: 1.5.0
+      mlly: 1.6.1
       node-forge: 1.3.1
       pathe: 1.1.2
       std-env: 3.7.0
@@ -18356,7 +19383,7 @@ packages:
       '@babel/plugin-transform-react-jsx-source': 7.23.3(@babel/core@7.23.9)
       magic-string: 0.27.0
       react-refresh: 0.14.0
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -18372,7 +19399,7 @@ packages:
       '@babel/plugin-transform-react-jsx-source': 7.23.3(@babel/core@7.23.9)
       '@types/babel__core': 7.20.4
       react-refresh: 0.14.0
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -18426,7 +19453,7 @@ packages:
       magic-string: 0.30.5
       picocolors: 1.0.0
       std-env: 3.5.0
-      vitest: 0.34.6(jsdom@22.1.0)(lightningcss@1.23.0)
+      vitest: 0.34.6(jsdom@22.1.0)(lightningcss@1.24.0)
     dev: true
 
   /@vitest/expect@0.28.5:
@@ -18474,7 +19501,7 @@ packages:
     dependencies:
       '@vitest/utils': 1.3.1
       p-limit: 5.0.0
-      pathe: 1.1.2
+      pathe: 1.1.1
     dev: true
 
   /@vitest/snapshot@0.34.6:
@@ -18489,7 +19516,7 @@ packages:
     resolution: {integrity: sha512-EF++BZbt6RZmOlE3SuTPu/NfwBF6q4ABS37HHXzs2LUVPBLx2QoY/K0fKpRChSo8eLiuxcbCVfqKgx/dplCDuQ==}
     dependencies:
       magic-string: 0.30.5
-      pathe: 1.1.2
+      pathe: 1.1.1
       pretty-format: 29.7.0
     dev: true
 
@@ -18792,14 +19819,6 @@ packages:
     dependencies:
       acorn: 8.11.2
 
-  /acorn-jsx@5.3.2(acorn@8.11.3):
-    resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
-    peerDependencies:
-      acorn: ^6.0.0 || ^7.0.0 || ^8.0.0
-    dependencies:
-      acorn: 8.11.3
-    dev: true
-
   /acorn-walk@6.2.0:
     resolution: {integrity: sha512-7evsyfH1cLOCdAzZAd43Cic04yKydNx0cF+7tiA19p1XnLLPU4dpCQOqpjqwokFe//vS0QqfqqjCS2JkiIs0cA==}
     engines: {node: '>=0.4.0'}
@@ -18844,6 +19863,7 @@ packages:
     resolution: {integrity: sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==}
     engines: {node: '>=0.4.0'}
     hasBin: true
+    dev: false
 
   /add-dom-event-listener@1.1.0:
     resolution: {integrity: sha512-WCxx1ixHT0GQU9hb0KI/mhgRQhnU+U3GvwY6ZvVjYq8rsihIGoaIOUbY0yMPBxLH5MDtr0kz3fisWGNcbWW7Jw==}
@@ -18942,6 +19962,23 @@ packages:
       react-is: 16.13.1
     dev: false
 
+  /airbnb-prop-types@2.16.0(react@18.2.0):
+    resolution: {integrity: sha512-7WHOFolP/6cS96PhKNrslCLMYAI8yB1Pp6u6XmxozQOiZbsI5ycglZr5cHhBFfuRcQQjzCMith5ZPZdYiJCxUg==}
+    peerDependencies:
+      react: ^0.14 || ^15.0.0 || ^16.0.0-alpha
+    dependencies:
+      array.prototype.find: 2.2.2
+      function.prototype.name: 1.1.6
+      is-regex: 1.1.4
+      object-is: 1.1.5
+      object.assign: 4.1.4
+      object.entries: 1.1.7
+      prop-types: 15.7.2
+      prop-types-exact: 1.2.0
+      react: 18.2.0
+      react-is: 16.13.1
+    dev: false
+
   /ajv-errors@1.0.1(ajv@6.12.6):
     resolution: {integrity: sha512-DCRfO/4nQ+89p/RK43i8Ezd41EqdGIU4ld7nGF8OQ14oc/we5rEntLCUa7+jrn3nn83BosfwZA0wb4pon2o8iQ==}
     peerDependencies:
@@ -19153,8 +20190,8 @@ packages:
       readable-stream: 3.6.2
     dev: false
 
-  /archiver@6.0.1:
-    resolution: {integrity: sha512-CXGy4poOLBKptiZH//VlWdFuUC1RESbdZjGjILwBuZ73P7WkAUN0htfSfBq/7k6FRFlpu7bg4JOkj1vU9G6jcQ==}
+  /archiver@6.0.2:
+    resolution: {integrity: sha512-UQ/2nW7NMl1G+1UnrLypQw1VdT9XZg/ECcKPq7l+STzStrSivFIXIp34D8M5zeNGW5NoOupdYCHv6VySCPNNlw==}
     engines: {node: '>= 12.0.0'}
     dependencies:
       archiver-utils: 4.0.1
@@ -19163,7 +20200,7 @@ packages:
       readable-stream: 3.6.2
       readdir-glob: 1.1.3
       tar-stream: 3.1.7
-      zip-stream: 5.0.1
+      zip-stream: 5.0.2
     dev: false
 
   /are-we-there-yet@1.1.7:
@@ -19262,7 +20299,7 @@ packages:
     optional: true
 
   /array-flatten@1.1.1:
-    resolution: {integrity: sha1-ml9pkFGx5wczKPKgCJaLZOopVdI=}
+    resolution: {integrity: sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg==}
 
   /array-flatten@2.1.2:
     resolution: {integrity: sha512-hNfzcOV8W4NdualtqBFPyVO+54DSJuZGY9qT4pRroB6S9e3iiido2ISIC5h9R2sPJ8H3FHCIiEnsv1lPXO3KtQ==}
@@ -20312,8 +21349,8 @@ packages:
     dependencies:
       file-uri-to-path: 1.0.0
 
-  /birpc@0.2.15:
-    resolution: {integrity: sha512-LuZgWLW6DB1zenkfJuF4/kfSZdazOR2xaMSzeqgvfbNIwECwV1AJso9wpNje79uaRU86Obbujv4qtDnwoOLQww==}
+  /birpc@0.2.17:
+    resolution: {integrity: sha512-+hkTxhot+dWsLpp3gia5AkVHIsKlZybNT5gIYiDlNzJrmYPcTM9k5/w2uaj3IPpd7LlEYpmCj4Jj1nC41VhDFg==}
     dev: false
 
   /bl@4.1.0:
@@ -20506,8 +21543,8 @@ packages:
     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
     hasBin: true
     dependencies:
-      caniuse-lite: 1.0.30001587
-      electron-to-chromium: 1.4.670
+      caniuse-lite: 1.0.30001591
+      electron-to-chromium: 1.4.685
       node-releases: 2.0.14
       update-browserslist-db: 1.0.13(browserslist@4.23.0)
 
@@ -20556,7 +21593,7 @@ packages:
   /builtins@5.0.1:
     resolution: {integrity: sha512-qwVpFEHNfhYJIzNRBvd2C1kyo6jz3ZSMPyyuR47OPdiKWlbYnZNyDWuyR175qDnAJLiCo5fBBqPb3RiXgWlkOQ==}
     dependencies:
-      semver: 7.6.0
+      semver: 7.5.4
 
   /bundle-name@3.0.0:
     resolution: {integrity: sha512-PKA4BeSvBpQKQ8iPOGCSiell+N8P+Tf1DlwqmYhpe2gAhKPHn8EYOxVT+ShuGmhg8lN8XiSlS80yiExKXrURlw==}
@@ -20615,17 +21652,16 @@ packages:
     resolution: {integrity: sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==}
     engines: {node: '>= 0.8'}
 
-  /c12@1.8.0:
-    resolution: {integrity: sha512-93U6RndoaAwFQPBcS9F/6lwtgBfrWh4695sQ/ChILkbj0C7zOZVptOU3Sxp0I/9xvfW/lzBWD90AXDQz4muSkA==}
+  /c12@1.9.0:
+    resolution: {integrity: sha512-7KTCZXdIbOA2hLRQ+1KzJ15Qp9Wn58one74dkihMVp2H6EzKTa3OYBy0BSfS1CCcmxYyqeX8L02m40zjQ+dstg==}
     dependencies:
       chokidar: 3.5.3
+      confbox: 0.1.3
       defu: 6.1.4
-      dotenv: 16.4.4
+      dotenv: 16.4.5
       giget: 1.2.1
       jiti: 1.21.0
-      json5: 2.2.3
-      jsonc-parser: 3.2.1
-      mlly: 1.5.0
+      mlly: 1.6.1
       ohash: 1.1.3
       pathe: 1.1.2
       perfect-debounce: 1.0.0
@@ -20889,8 +21925,8 @@ packages:
   /caniuse-lite@1.0.30001562:
     resolution: {integrity: sha512-kfte3Hym//51EdX4239i+Rmp20EsLIYGdPkERegTgU19hQWCRhsRFGKHTliUlsry53tv17K7n077Kqa0WJU4ng==}
 
-  /caniuse-lite@1.0.30001587:
-    resolution: {integrity: sha512-HMFNotUmLXn71BQxg8cijvqxnIAofforZOwGsxyXJ0qugTdspUF4sPSJ2vhgprHCB996tIDzEq1ubumPDV8ULA==}
+  /caniuse-lite@1.0.30001591:
+    resolution: {integrity: sha512-PCzRMei/vXjJyL5mJtzNiUCKP59dm8Apqc3PH8gJkMnMXZGox93RbE76jHsmLwmIo6/3nsYIpJtx0O7u5PqFuQ==}
 
   /capture-exit@2.0.0:
     resolution: {integrity: sha512-PiT/hQmTonHhl/HFGN+Lx3JJUznrVYJ3+AQsnthneZbvW7x+f08Tk7yLJTLEOUvBTbduLeeBkxEaYXUOUrRq6g==}
@@ -21283,6 +22319,11 @@ packages:
     engines: {node: '>=6'}
     dev: false
 
+  /clsx@2.1.0:
+    resolution: {integrity: sha512-m3iNNWpd9rl3jvvcBnu70ylMdrXt8Vlq4HYadnU5fwcOtvkSQWPmj7amUcDT2qYI7risszBjI5AUIUox9D16pg==}
+    engines: {node: '>=6'}
+    dev: false
+
   /cluster-key-slot@1.1.2:
     resolution: {integrity: sha512-RMr0FhtfXemyinomL4hrWcYJxmX6deFdCxpJzhDttxgO1+bcCnkk+9drydLVDmAMG7NE6aN/fl4F7ucU/90gAA==}
     engines: {node: '>=0.10.0'}
@@ -21487,8 +22528,8 @@ packages:
       arity-n: 1.0.4
     dev: false
 
-  /compress-commons@5.0.1:
-    resolution: {integrity: sha512-MPh//1cERdLtqwO3pOFLeXtpuai0Y2WCd5AhtKxznqM7WtaMYaOEMSgn45d9D10sIHSfIKE603HlOp8OPGrvag==}
+  /compress-commons@5.0.3:
+    resolution: {integrity: sha512-/UIcLWvwAQyVibgpQDPtfNM3SvqN7G9elAPAV7GM0L53EbNWwWiCsWtK8Fwed/APEbptPHXs5PuW+y8Bq8lFTA==}
     engines: {node: '>= 12.0.0'}
     dependencies:
       crc-32: 1.2.2
@@ -21538,6 +22579,10 @@ packages:
       typedarray: 0.0.6
     dev: true
 
+  /confbox@0.1.3:
+    resolution: {integrity: sha512-eH3ZxAihl1PhKfpr4VfEN6/vUd87fmgb6JkldHgg/YR6aEBhW63qUDgzP2Y6WM0UumdsYp5H3kibalXAdHfbgg==}
+    dev: false
+
   /config-chain@1.1.13:
     resolution: {integrity: sha512-qj+f8APARXHrM0hraqXYb2/bOVSV4PvJQlNZ/DVj0QrmNM2q2euizkeuVckQ57J+W0mRH6Hvi+k50M4Jul2VRQ==}
     dependencies:
@@ -21596,6 +22641,27 @@ packages:
       seamless-immutable: 7.1.4
     dev: false
 
+  /connected-react-router@6.8.0(history@4.10.1)(immutable@3.8.2)(react-redux@8.1.2)(react-router@5.2.0)(react@18.2.0)(redux@4.2.1)(seamless-immutable@7.1.4):
+    resolution: {integrity: sha512-E64/6krdJM3Ag3MMmh2nKPtMbH15s3JQDuaYJvOVXzu6MbHbDyIvuwLOyhQIuP4Om9zqEfZYiVyflROibSsONg==}
+    peerDependencies:
+      history: ^4.7.2
+      immutable: ^3.8.1 || ^4.0.0-rc.1
+      react: ^16.4.0
+      react-redux: ^6.0.0 || ^7.1.0
+      react-router: ^4.3.1 || ^5.0.0
+      redux: ^3.6.0 || ^4.0.0
+      seamless-immutable: ^7.1.3
+    dependencies:
+      history: 4.10.1
+      immutable: 3.8.2
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-redux: 8.1.2(@types/react-dom@18.2.19)(@types/react@18.2.60)(react-dom@18.2.0)(react@18.2.0)(redux@4.2.1)
+      react-router: 5.2.0(react@18.2.0)
+      redux: 4.2.1
+      seamless-immutable: 7.1.4
+    dev: false
+
   /consola@2.15.3:
     resolution: {integrity: sha512-9vAdYbHj6x2fLKC4+oPH0kFzY/orMZyG2Aj+kNylHxKGJ/Ed4dpNyAQYwJOdqO4zdM7XpVHmyejQDcQHrnuXbw==}
 
@@ -21894,8 +22960,13 @@ packages:
       shebang-command: 2.0.0
       which: 2.0.2
 
-  /crossws@0.1.1:
-    resolution: {integrity: sha512-c9c/o7bS3OjsdpSkvexpka0JNlesBF2JU9B2V1yNsYGwRbAafxhJQ7VI9b48D5bpONz/oxbPGMzBojy9sXoQIQ==}
+  /crossws@0.2.4:
+    resolution: {integrity: sha512-DAxroI2uSOgUKLz00NX6A8U/8EE3SZHmIND+10jkVSaypvyt57J5JEOxAQOL6lQxyzi/wZbTIwssU1uy69h5Vg==}
+    peerDependencies:
+      uWebSockets.js: '*'
+    peerDependenciesMeta:
+      uWebSockets.js:
+        optional: true
     dev: false
 
   /crypto-random-string@2.0.0:
@@ -21975,8 +23046,8 @@ packages:
       loader-utils: 2.0.4
       postcss: 8.4.31
       postcss-modules-extract-imports: 3.0.0(postcss@8.4.31)
-      postcss-modules-local-by-default: 4.0.4(postcss@8.4.31)
-      postcss-modules-scope: 3.1.1(postcss@8.4.31)
+      postcss-modules-local-by-default: 4.0.3(postcss@8.4.31)
+      postcss-modules-scope: 3.0.0(postcss@8.4.31)
       postcss-modules-values: 4.0.0(postcss@8.4.31)
       postcss-value-parser: 4.2.0
       schema-utils: 3.3.0
@@ -22079,6 +23150,7 @@ packages:
       inherits: 2.0.4
       source-map: 0.6.1
       source-map-resolve: 0.6.0
+    dev: false
 
   /cssesc@3.0.0:
     resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
@@ -22459,6 +23531,14 @@ packages:
       react: 17.0.2
     dev: false
 
+  /decorate-component-with-props@1.2.1(react@18.2.0):
+    resolution: {integrity: sha512-X2hZBnVHZAZQHG+g3Ce97SBtog1Vglzg7sPNbUY5XKmmgd3NVAiOHviw9hd7GOJIDrQ1slfwsmkbKQxESWFy7Q==}
+    peerDependencies:
+      react: ^0.14.0 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /dedent@0.7.0:
     resolution: {integrity: sha512-Q6fKUPqnAHAyhiUgFU7BUzLiv0kd8saH9al7tnu5Q/okj6dnupxyTgFIBjVzJATdfIAm9NAsvXNzjaKa+bxVyA==}
 
@@ -22693,8 +23773,8 @@ packages:
     resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==}
     engines: {node: '>=6'}
 
-  /destr@2.0.2:
-    resolution: {integrity: sha512-65AlobnZMiCET00KaFFjUefxDX0khFA/E4myqZ7a6Sq1yZtR8+FVIvilVX66vF2uobSumxooYZChiRPCKNqhmg==}
+  /destr@2.0.3:
+    resolution: {integrity: sha512-2N3BOUU4gYMpTP24s5rF5iP7BDr7uNTCs4ozw3kf/eKfvWSIu93GEBi5m427YoyJoeOzQ5smuu4nNAPGb8idSQ==}
     dev: false
 
   /destroy@1.0.4:
@@ -22828,7 +23908,7 @@ packages:
       asap: 2.0.6
       invariant: 2.2.4
       lodash: 4.17.21
-      redux: 4.1.0
+      redux: 4.2.1
     dev: false
 
   /dns-equal@1.0.0:
@@ -22865,6 +23945,10 @@ packages:
   /dom-accessibility-api@0.5.16:
     resolution: {integrity: sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==}
 
+  /dom-accessibility-api@0.6.3:
+    resolution: {integrity: sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==}
+    dev: true
+
   /dom-align@1.12.4:
     resolution: {integrity: sha512-R8LUSEay/68zE5c8/3BDxiTEvgb4xZTF0RKmAHfiEVN3klfIpXfi2/QCoiWPccVQ0J/ZGdz9OjzL4uJEP/MRAw==}
     dev: false
@@ -23007,8 +24091,8 @@ packages:
     engines: {node: '>=12'}
     dev: true
 
-  /dotenv@16.4.4:
-    resolution: {integrity: sha512-XvPXc8XAQThSjAbY6cQ/9PcBXmFoWuw1sQ3b8HqUCR6ziGXjkTi//kB9SWa2UwqlgdAIuRqAa/9hVljzPehbYg==}
+  /dotenv@16.4.5:
+    resolution: {integrity: sha512-ZmdL2rui+eB2YwhsWzjInR8LldtZHGDoQ1ugH85ppHKwpUHL7j7rN0Ti9NCnGiQbhaZ11FpR+7ao1dNsmduNUg==}
     engines: {node: '>=12'}
     dev: false
 
@@ -23033,6 +24117,19 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /draft-js-block-breakout-plugin@2.0.1(draft-js@0.10.5)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha1-o4471o2VONevFdTZZoRNbm0q2FA=}
+    peerDependencies:
+      draft-js: '>=0.10.1'
+      react: '>=15.0.0'
+      react-dom: '>=15.0.0'
+    dependencies:
+      draft-js: 0.10.5(react-dom@18.2.0)(react@18.2.0)
+      immutable: 3.7.6
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /draft-js-buttons@2.0.2(draft-js@0.10.5)(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-qC3vkZ4ZvKe86Uskf5CsZxgo4Rt6ITAE51sbiI5YCMasanXdMVRwbF4fQonMyahds1tgj9EeBNePOBnlKTz9gQ==}
     deprecated: use @draft-js-plugins/buttons >=v4 instead
@@ -23047,6 +24144,20 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /draft-js-buttons@2.0.2(draft-js@0.10.5)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-qC3vkZ4ZvKe86Uskf5CsZxgo4Rt6ITAE51sbiI5YCMasanXdMVRwbF4fQonMyahds1tgj9EeBNePOBnlKTz9gQ==}
+    deprecated: use @draft-js-plugins/buttons >=v4 instead
+    peerDependencies:
+      draft-js: ^0.10.1 || ^0.11.0
+      react: ^15.5.0 || ^16.0.0-rc
+      react-dom: ^15.5.0 || ^16.0.0-rc
+    dependencies:
+      clsx: 1.2.1
+      draft-js: 0.10.5(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /draft-js-import-element@1.4.0(draft-js@0.10.5)(immutable@3.8.2):
     resolution: {integrity: sha512-WmYT5PrCm47lGL5FkH6sRO3TTAcn7qNHsD3igiPqLG/RXrqyKrqN4+wBgbcT2lhna/yfWTRtgzAbQsSJoS1Meg==}
     peerDependencies:
@@ -23089,6 +24200,25 @@ packages:
       union-class-names: 1.0.0
     dev: false
 
+  /draft-js-inline-toolbar-plugin@2.0.3(draft-js@0.10.5)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-7OD7iaImu/NwBdJmv0/nmP4H4oUhjO10iFcUmDPJlmdc43icoNHABTk4/oUpn7xrunrj2GHxFexsgSEfpOTFlQ==}
+    deprecated: use @draft-js-plugins/inline-toolbar >=v4 instead
+    peerDependencies:
+      draft-js: ^0.10.1
+      react: ^15.5.0 || ^16.0.0-rc
+      react-dom: ^15.5.0 || ^16.0.0-rc
+    dependencies:
+      decorate-component-with-props: 1.2.1(react@18.2.0)
+      draft-js: 0.10.5(react-dom@18.2.0)(react@18.2.0)
+      draft-js-buttons: 2.0.2(draft-js@0.10.5)(react-dom@18.2.0)(react@18.2.0)
+      find-with-regex: 1.1.3(draft-js@0.10.5)
+      immutable: 3.7.6
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      union-class-names: 1.0.0
+    dev: false
+
   /draft-js-plugins-editor@2.1.1(draft-js@0.10.5)(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-fKGe71irNvFHJ5L/lUrh+3vPkBNq0de6x+cgiZUJ9zQERc5KPBtGXIFiarLFVHyrRTCPq+K6xmgfFSAERaFHPw==}
     deprecated: use @draft-js-plugins/editor >=v4 instead
@@ -23107,6 +24237,24 @@ packages:
       union-class-names: 1.0.0
     dev: false
 
+  /draft-js-plugins-editor@2.1.1(draft-js@0.10.5)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-fKGe71irNvFHJ5L/lUrh+3vPkBNq0de6x+cgiZUJ9zQERc5KPBtGXIFiarLFVHyrRTCPq+K6xmgfFSAERaFHPw==}
+    deprecated: use @draft-js-plugins/editor >=v4 instead
+    peerDependencies:
+      draft-js: ^0.10.1
+      react: ^15.5.0 || ^16.0.0-rc
+      react-dom: ^15.5.0 || ^16.0.0-rc
+    dependencies:
+      decorate-component-with-props: 1.2.1(react@18.2.0)
+      draft-js: 0.10.5(react-dom@18.2.0)(react@18.2.0)
+      find-with-regex: 1.1.3(draft-js@0.10.5)
+      immutable: 3.7.6
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      union-class-names: 1.0.0
+    dev: false
+
   /draft-js-plugins-utils@2.0.3(draft-js@0.10.5):
     resolution: {integrity: sha512-MjSIRjaCbSANjE0Fmg3wh4NsVF5y89AkrGxsJLOkMrPS0ZGymK1YHaqIelrBJt+6Kr46ALtHQieaOFxEbqbrdg==}
     peerDependencies:
@@ -23138,6 +24286,19 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /draft-js@0.10.5(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-LE6jSCV9nkPhfVX2ggcRLA4FKs6zWq9ceuO/88BpXdNCS7mjRTgs0NsV6piUCJX9YxMsB9An33wnkMmU2sD2Zg==}
+    peerDependencies:
+      react: ^0.14.0 || ^15.0.0-rc || ^16.0.0-rc || ^16.0.0
+      react-dom: ^0.14.0 || ^15.0.0-rc || ^16.0.0-rc || ^16.0.0
+    dependencies:
+      fbjs: 0.8.18
+      immutable: 3.7.6
+      object-assign: 4.1.1
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /draftjs-filters@2.3.0(draft-js@0.10.5):
     resolution: {integrity: sha512-Yi4G3zbbJwrTxFCtCooXLuIeThrY4YFvRrrL3Ck+zYi1V1/3z+j+QXHE/tNa182eb7Tq7t0AxNKE+mOFlqG8tw==}
     peerDependencies:
@@ -23207,8 +24368,8 @@ packages:
   /electron-to-chromium@1.4.585:
     resolution: {integrity: sha512-B4yBlX0azdA3rVMxpYwLQfDpdwOgcnLCkpvSOd68iFmeedo+WYjaBJS3/W58LVD8CB2nf+o7C4K9xz1l09RkWg==}
 
-  /electron-to-chromium@1.4.670:
-    resolution: {integrity: sha512-hcijYOWjOtjKrKPtNA6tuLlA/bTLO3heFG8pQA6mLpq7dRydSWicXova5lyxDzp1iVJaYhK7J2OQlGE52KYn7A==}
+  /electron-to-chromium@1.4.685:
+    resolution: {integrity: sha512-yDYeobbTEe4TNooEzOQO6xFqg9XnAkVy2Lod1C1B2it8u47JNLYvl9nLDWBamqUakWB8Jc1hhS1uHUNYTNQdfw==}
 
   /elegant-spinner@2.0.0:
     resolution: {integrity: sha512-5YRYHhvhYzV/FC4AiMdeSIg3jAYGq9xFvbhZMpPlJoBsfYgrw2DSCYeXfat6tYBu45PWiyRr3+flaCPPmviPaA==}
@@ -24940,7 +26101,6 @@ packages:
 
   /figgy-pudding@3.5.2:
     resolution: {integrity: sha512-0btnI/H8f2pavGMN8w40mlSKOfTK2SVJmBfBeVIj3kNw0swwgzyRq0d5TJVOwodFmtvpPeWPN/MCcfuWF0Ezbw==}
-    deprecated: This module is no longer supported.
 
   /figures@3.2.0:
     resolution: {integrity: sha512-yaduQFRKLXYOGgEn6AZau90j3ggSOyiqXU0F9JZfeXYhNa+Jk4X+s45A2zg5jns87GAFa34BBm2kXw4XpNcbdg==}
@@ -25277,7 +26437,7 @@ packages:
       memfs: 3.5.3
       minimatch: 3.1.2
       schema-utils: 2.7.0
-      semver: 7.6.0
+      semver: 7.5.4
       tapable: 1.1.3
       typescript: 5.2.2
       webpack: 5.90.1
@@ -25678,10 +26838,10 @@ packages:
     dependencies:
       colorette: 2.0.20
       defu: 6.1.3
-      https-proxy-agent: 7.0.4
+      https-proxy-agent: 7.0.2
       mri: 1.2.0
       node-fetch-native: 1.4.1
-      pathe: 1.1.2
+      pathe: 1.1.1
       tar: 6.2.0
     transitivePeerDependencies:
       - supports-color
@@ -25946,7 +27106,6 @@ packages:
       path-type: 5.0.0
       slash: 5.1.0
       unicorn-magic: 0.1.0
-    dev: true
 
   /globby@14.0.1:
     resolution: {integrity: sha512-jOMLD2Z7MAhyG8aJpNOpmziMOP4rPLcc95oQPKXBazW82z+CEgPFBQvEpRUa1KeIMUJo4Wsm+q6uzO/Q/4BksQ==}
@@ -25958,6 +27117,7 @@ packages:
       path-type: 5.0.0
       slash: 5.1.0
       unicorn-magic: 0.1.0
+    dev: true
 
   /globby@9.2.0:
     resolution: {integrity: sha512-ollPHROa5mcxDEkwg6bPt3QbEf4pDQSNtd6JPL1YvOvAo/7/0VAm9TccUeoTmarjPw4pfUthSCqcyfNB1I3ZSg==}
@@ -25982,6 +27142,14 @@ packages:
     resolution: {integrity: sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==}
     dev: false
 
+  /goober@2.1.14(csstype@3.1.2):
+    resolution: {integrity: sha512-4UpC0NdGyAFqLNPnhCT2iHpza2q+RAY3GV85a/mRPdzyPQMsj0KmMMuetdIkzWRbJ+Hgau1EZztq8ImmiMGhsg==}
+    peerDependencies:
+      csstype: ^3.0.10
+    dependencies:
+      csstype: 3.1.2
+    dev: false
+
   /gopd@1.0.1:
     resolution: {integrity: sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==}
     dependencies:
@@ -26103,7 +27271,7 @@ packages:
     dependencies:
       cookie-es: 1.0.0
       defu: 6.1.4
-      destr: 2.0.2
+      destr: 2.0.3
       iron-webcrypto: 1.0.0
       ohash: 1.1.3
       radix3: 1.1.0
@@ -26112,6 +27280,23 @@ packages:
       unenv: 1.9.0
     dev: false
 
+  /h3@1.11.1:
+    resolution: {integrity: sha512-AbaH6IDnZN6nmbnJOH72y3c5Wwh9P97soSVdGSBbcDACRdkC0FEWf25pzx4f/NuOCK6quHmW18yF2Wx+G4Zi1A==}
+    dependencies:
+      cookie-es: 1.0.0
+      crossws: 0.2.4
+      defu: 6.1.4
+      destr: 2.0.3
+      iron-webcrypto: 1.0.0
+      ohash: 1.1.3
+      radix3: 1.1.0
+      ufo: 1.4.0
+      uncrypto: 0.1.3
+      unenv: 1.9.0
+    transitivePeerDependencies:
+      - uWebSockets.js
+    dev: false
+
   /handle-thing@2.0.1:
     resolution: {integrity: sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg==}
 
@@ -26463,7 +27648,7 @@ packages:
       he: 1.2.0
       param-case: 3.0.4
       relateurl: 0.2.7
-      terser: 5.27.0
+      terser: 5.24.0
 
   /html-tags@3.3.1:
     resolution: {integrity: sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==}
@@ -28418,7 +29603,7 @@ packages:
     resolution: {integrity: sha512-oCj8FiZ3U0hTP4aSui87P4L4jC37BtQwUMqk+zk/b11FR19BJDeZsZAvIHutWnmtw7r85UmR3CEWZ0HWU2mAlw==}
     engines: {node: '>= 6'}
     dependencies:
-      '@babel/code-frame': 7.23.5
+      '@babel/code-frame': 7.22.13
       '@jest/test-result': 24.9.0
       '@jest/types': 24.9.0
       '@types/stack-utils': 1.0.1
@@ -28756,7 +29941,7 @@ packages:
       jest-resolve: 26.6.2
       natural-compare: 1.4.0
       pretty-format: 26.6.2
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - supports-color
 
@@ -28783,7 +29968,7 @@ packages:
       jest-util: 29.7.0
       natural-compare: 1.4.0
       pretty-format: 29.7.0
-      semver: 7.6.0
+      semver: 7.5.4
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -28979,6 +30164,18 @@ packages:
       react: 17.0.2
     dev: false
 
+  /jotai@2.0.3(react@18.2.0):
+    resolution: {integrity: sha512-MMjhSPAL3RoeZD9WbObufRT2quThEAEknHHridf2ma8Ml7ZVQmUiHk0ssdbR3F0h3kcwhYqSGJ59OjhPge7RRg==}
+    engines: {node: '>=12.20.0'}
+    peerDependencies:
+      react: '>=17.0.0'
+    peerDependenciesMeta:
+      react:
+        optional: true
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /joycon@3.1.1:
     resolution: {integrity: sha512-34wB/Y7MW7bzjKRjUKTa46I2Z7eV62Rkhva+KkopW7Qvv/OSWBqvkSY7vusOPrNuZcUG3tApvdVgNB8POj3SPw==}
     engines: {node: '>=10'}
@@ -29280,10 +30477,6 @@ packages:
   /jsonc-parser@3.2.0:
     resolution: {integrity: sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==}
 
-  /jsonc-parser@3.2.1:
-    resolution: {integrity: sha512-AilxAyFOAcK5wA1+LeaySVBrHsGQvUFCDWXKpZjzaL0PqW+xfBOttn8GNtWKFWqneyMZj41MWF9Kl6iPWLwgOA==}
-    dev: false
-
   /jsonfile@3.0.1:
     resolution: {integrity: sha512-oBko6ZHlubVB5mRFkur5vgYR1UyqX+S6Y/oCfLhqNdcc2fYFlDpIoNc7AfKS1KOGcnNAkvsr0grLck9ANM815w==}
     optionalDependencies:
@@ -29365,6 +30558,10 @@ packages:
     resolution: {integrity: sha512-Q8206k8pTY7krW32cdmPsP+DqqLgWx/hYPSj9/+7SYqSqz7UuwPbfSe07lQtvuuaVyiSJveXk0E5RydOuWwsEg==}
     dev: false
 
+  /just-curry-it@5.3.0:
+    resolution: {integrity: sha512-silMIRiFjUWlfaDhkgSzpuAyQ6EX/o09Eu8ZBfmFwQMbax7+LQzeIU2CBrICT6Ne4l86ITCGvUCBpCubWYy0Yw==}
+    dev: false
+
   /just-diff-apply@5.5.0:
     resolution: {integrity: sha512-OYTthRfSh55WOItVqwpefPtNt2VdKsq5AnAK6apdtR6yCH8pr0CmSr710J0Mf+WdQy7K/OzMy7K2MgAfdQURDw==}
 
@@ -29561,8 +30758,8 @@ packages:
       prelude-ls: 1.2.1
       type-check: 0.4.0
 
-  /lightningcss-cli-darwin-arm64@1.23.0:
-    resolution: {integrity: sha512-uZvy0I7lf5dt/Ti4egRuSpd3OEPA9I0+aQ/iXUB9pFl4enD6+EmGtfjfEwvOFgcECTO8SZW0tSaRgwhXtHz0qg==}
+  /lightningcss-cli-darwin-arm64@1.24.0:
+    resolution: {integrity: sha512-ryzm4Sc0JP4Dsz3L6GLpVCd8UQD5dY/skMy5WXIIMpMX+YwNfm02vgAwjddk3y0zENCHVyY/K0cnszVvhK65uQ==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [darwin]
@@ -29570,8 +30767,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-cli-darwin-x64@1.23.0:
-    resolution: {integrity: sha512-VTOPUVnL+znA1LktTK5jo+3qNhaU0hUYF2u8znJr07vG0NGy8KsZffimYUvWSKi7qid6M8CGAaY9Tw6zMqIniw==}
+  /lightningcss-cli-darwin-x64@1.24.0:
+    resolution: {integrity: sha512-CmJSNmKwfFIbzbK0TBQpJsnEYczed8Y9U5hFGSxVE4CTcQXFAJXvMbj5ST4lv/VxcnvyfyJNPl78cfUfA24M/Q==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [darwin]
@@ -29579,8 +30776,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-cli-freebsd-x64@1.23.0:
-    resolution: {integrity: sha512-dPeiQjfatVfTJA06Hb2ou6jtk/mbYmBM4YLro8bh6FWMNRKmglwR12kog4Dj/2umNtbLcf4OVDe5+/UhSL+Atw==}
+  /lightningcss-cli-freebsd-x64@1.24.0:
+    resolution: {integrity: sha512-c/qRQahVMq5T+N9p6ct01QN2PZfM65Kxc91EQGSvBmYVDBJK8Z/EOIwu11F6asNbe7V/2OCTmAa29if5lXl9RA==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [freebsd]
@@ -29588,8 +30785,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-cli-linux-arm-gnueabihf@1.23.0:
-    resolution: {integrity: sha512-bq7Lbn3btKbeV/6UTS0MucHF0cpnCAVUycvmTrNTB1VF0JvekUStORAhqRlhgMYsjgklGFvQSaBPX1pozYGp8Q==}
+  /lightningcss-cli-linux-arm-gnueabihf@1.24.0:
+    resolution: {integrity: sha512-JebGRmOMfestjpu/74LgvzLC6blzNQjL2PeUpz43d5O/WT0ssaygZuo6VqzZt3nYGW0NueZQwWIMSyryh3LW0A==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm]
     os: [linux]
@@ -29597,8 +30794,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-cli-linux-arm64-gnu@1.23.0:
-    resolution: {integrity: sha512-CbRzSK4tH2KpqoFuFLAb0DZgRIA7RsYYYKrDAdsC/S0kq6VBR/rSeISsczfCtMRSBTjqYwnZAdQXQO0YQrfsrA==}
+  /lightningcss-cli-linux-arm64-gnu@1.24.0:
+    resolution: {integrity: sha512-0Q6WflV2Q+Y0TjkBbegt/2oQbyFhpERMiR3YcoLaulUN/pnesCKmlC08cPDQ/vX5xQF9Y9sYHcd2QXs2cLhpMA==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [linux]
@@ -29606,8 +30803,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-cli-linux-arm64-musl@1.23.0:
-    resolution: {integrity: sha512-bkhubISbHj/G3+BuOMclC+V5k82PTYuWdGAvqrMB3HOd/yIcOxP1uX3O/KLo7qxrLw0m729RCo8Lk7Cd54Z6jg==}
+  /lightningcss-cli-linux-arm64-musl@1.24.0:
+    resolution: {integrity: sha512-m1mi/+TaVFZ44l9pMfMn3u1soZOINdljJ8bCUWN+cqeOyZrNY8hUIy7dZXd+HWkrdzUaMYjdzlgEV0PB7wwSBA==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [linux]
@@ -29615,8 +30812,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-cli-linux-x64-gnu@1.23.0:
-    resolution: {integrity: sha512-uWiB/7m1pI+UcpmrikD+r8T4b1hcjNHe43/GX2zkx+BtzzUhDwwW1/bXbatGar4K6BVDtSGP8B0diOtONsm2KQ==}
+  /lightningcss-cli-linux-x64-gnu@1.24.0:
+    resolution: {integrity: sha512-4SL/ogzO9iVK6fHEZ7qaCrKgZck3uFJFAPOEKYbA7d+lzByiOG+e9tW/8t+JpbNHu693X32u502AG9ZyXrxurg==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [linux]
@@ -29624,8 +30821,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-cli-linux-x64-musl@1.23.0:
-    resolution: {integrity: sha512-2GQKReVX2BLM+2vXdp9pUt8NzPy5PKyEU3PKNuAaKAW6gEMFRUWiISir6faSlMm6lCjEoqfrvAtrenELudhQCA==}
+  /lightningcss-cli-linux-x64-musl@1.24.0:
+    resolution: {integrity: sha512-u7lgtntJZH/8AWwT5+TBS3fj2OO/tcYJsrxZHzWumz7UaT6Etogh9Vehzlxb/U9yUl/yfeAfLQp93g0nM7ZyaA==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [linux]
@@ -29633,8 +30830,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-cli-win32-x64-msvc@1.23.0:
-    resolution: {integrity: sha512-5xAaw/S1cTywwGZGBFtNSnb5YH67toEualXjlKH2RpmtaWPYvxwtXr86BCnZotAqx0KNESMjE27tIWDvYAQNKQ==}
+  /lightningcss-cli-win32-x64-msvc@1.24.0:
+    resolution: {integrity: sha512-i90UzVhYMwYYKQQqkjsGv6whr2RHuBFPzh4k9N8sg+jI5JwskXAnSBattQPCt+lICJoaBdT0gBSRvepGUMVf4w==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [win32]
@@ -29642,27 +30839,27 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-cli@1.23.0:
-    resolution: {integrity: sha512-STwsFaVtiGwBCAl3swVvs/ido0ZzhcLFWn0KEkZv1DQNtNppJrULjqap/yaxCooDI5bfjJGj70Ne1tt3AwaQ+g==}
+  /lightningcss-cli@1.24.0:
+    resolution: {integrity: sha512-doj/5w6LlZUjDDg3RCRKwTu5duQCrKEHGL8DXLi0rEau58aehmKgf2dfj+9zshCkJTj+a+OpHDyPU1J2GO/aBg==}
     engines: {node: '>= 12.0.0'}
     hasBin: true
     requiresBuild: true
     dependencies:
       detect-libc: 1.0.3
     optionalDependencies:
-      lightningcss-cli-darwin-arm64: 1.23.0
-      lightningcss-cli-darwin-x64: 1.23.0
-      lightningcss-cli-freebsd-x64: 1.23.0
-      lightningcss-cli-linux-arm-gnueabihf: 1.23.0
-      lightningcss-cli-linux-arm64-gnu: 1.23.0
-      lightningcss-cli-linux-arm64-musl: 1.23.0
-      lightningcss-cli-linux-x64-gnu: 1.23.0
-      lightningcss-cli-linux-x64-musl: 1.23.0
-      lightningcss-cli-win32-x64-msvc: 1.23.0
-    dev: true
-
-  /lightningcss-darwin-arm64@1.22.1:
-    resolution: {integrity: sha512-ldvElu+R0QimNTjsKpaZkUv3zf+uefzLy/R1R19jtgOfSRM+zjUCUgDhfEDRmVqJtMwYsdhMI2aJtJChPC6Osg==}
+      lightningcss-cli-darwin-arm64: 1.24.0
+      lightningcss-cli-darwin-x64: 1.24.0
+      lightningcss-cli-freebsd-x64: 1.24.0
+      lightningcss-cli-linux-arm-gnueabihf: 1.24.0
+      lightningcss-cli-linux-arm64-gnu: 1.24.0
+      lightningcss-cli-linux-arm64-musl: 1.24.0
+      lightningcss-cli-linux-x64-gnu: 1.24.0
+      lightningcss-cli-linux-x64-musl: 1.24.0
+      lightningcss-cli-win32-x64-msvc: 1.24.0
+    dev: true
+
+  /lightningcss-darwin-arm64@1.24.0:
+    resolution: {integrity: sha512-rTNPkEiynOu4CfGdd5ZfVOQe2gd2idfQd4EfX1l2ZUUwd+2SwSdbb7cG4rlwfnZckbzCAygm85xkpekRE5/wFw==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [darwin]
@@ -29670,26 +30867,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-darwin-arm64@1.23.0:
-    resolution: {integrity: sha512-kl4Pk3Q2lnE6AJ7Qaij47KNEfY2/UXRZBT/zqGA24B8qwkgllr/j7rclKOf1axcslNXvvUdztjo4Xqh39Yq1aA==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [arm64]
-    os: [darwin]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /lightningcss-darwin-x64@1.22.1:
-    resolution: {integrity: sha512-5p2rnlVTv6Gpw4PlTLq925nTVh+HFh4MpegX8dPDYJae+NFVjQ67gY7O6iHIzQjLipDiYejFF0yHrhjU3XgLBQ==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [x64]
-    os: [darwin]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /lightningcss-darwin-x64@1.23.0:
-    resolution: {integrity: sha512-KeRFCNoYfDdcolcFXvokVw+PXCapd2yHS1Diko1z1BhRz/nQuD5XyZmxjWdhmhN/zj5sH8YvWsp0/lPLVzqKpg==}
+  /lightningcss-darwin-x64@1.24.0:
+    resolution: {integrity: sha512-4KCeF2RJjzp9xdGY8zIH68CUtptEg8uz8PfkHvsIdrP4t9t5CIgfDBhiB8AmuO75N6SofdmZexDZIKdy9vA7Ww==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [darwin]
@@ -29697,8 +30876,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-freebsd-x64@1.22.1:
-    resolution: {integrity: sha512-1FaBtcFrZqB2hkFbAxY//Pnp8koThvyB6AhjbdVqKD4/pu13Rl91fKt2N9qyeQPUt3xy7ORUvSO+dPk3J6EjXg==}
+  /lightningcss-freebsd-x64@1.24.0:
+    resolution: {integrity: sha512-FJAYlek1wXuVTsncNU0C6YD41q126dXcIUm97KAccMn9C4s/JfLSqGWT2gIzAblavPFkyGG2gIADTWp3uWfN1g==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [freebsd]
@@ -29706,26 +30885,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-freebsd-x64@1.23.0:
-    resolution: {integrity: sha512-xhnhf0bWPuZxcqknvMDRFFo2TInrmQRWZGB0f6YoAsZX8Y+epfjHeeOIGCfAmgF0DgZxHwYc8mIR5tQU9/+ROA==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [x64]
-    os: [freebsd]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /lightningcss-linux-arm-gnueabihf@1.22.1:
-    resolution: {integrity: sha512-6rub98tYGfE5I5j0BP8t/2d4BZyu1S7Iz9vUkm0H26snAFHYxLfj3RbQn0xHHIePSetjLnhcg3QlfwUAkD/FYg==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [arm]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /lightningcss-linux-arm-gnueabihf@1.23.0:
-    resolution: {integrity: sha512-fBamf/bULvmWft9uuX+bZske236pUZEoUlaHNBjnueaCTJ/xd8eXgb0cEc7S5o0Nn6kxlauMBnqJpF70Bgq3zg==}
+  /lightningcss-linux-arm-gnueabihf@1.24.0:
+    resolution: {integrity: sha512-N55K6JqzMx7C0hYUu1YmWqhkHwzEJlkQRMA6phY65noO0I1LOAvP4wBIoFWrzRE+O6zL0RmXJ2xppqyTbk3sYw==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm]
     os: [linux]
@@ -29733,8 +30894,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-linux-arm64-gnu@1.22.1:
-    resolution: {integrity: sha512-nYO5qGtb/1kkTZu3FeTiM+2B2TAb7m2DkLCTgQIs2bk2o9aEs7I96fwySKcoHWQAiQDGR9sMux9vkV4KQXqPaQ==}
+  /lightningcss-linux-arm64-gnu@1.24.0:
+    resolution: {integrity: sha512-MqqUB2TpYtFWeBvvf5KExDdClU3YGLW5bHKs50uKKootcvG9KoS7wYwd5UichS+W3mYLc5yXUPGD1DNWbLiYKw==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [linux]
@@ -29742,8 +30903,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-linux-arm64-gnu@1.23.0:
-    resolution: {integrity: sha512-RS7sY77yVLOmZD6xW2uEHByYHhQi5JYWmgVumYY85BfNoVI3DupXSlzbw+b45A9NnVKq45+oXkiN6ouMMtTwfg==}
+  /lightningcss-linux-arm64-musl@1.24.0:
+    resolution: {integrity: sha512-5wn4d9tFwa5bS1ao9mLexYVJdh3nn09HNIipsII6ZF7z9ZA5J4dOEhMgKoeCl891axTGTUYd8Kxn+Hn3XUSYRQ==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [linux]
@@ -29751,35 +30912,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-linux-arm64-musl@1.22.1:
-    resolution: {integrity: sha512-MCV6RuRpzXbunvzwY644iz8cw4oQxvW7oer9xPkdadYqlEyiJJ6wl7FyJOH7Q6ZYH4yjGAUCvxDBxPbnDu9ZVg==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [arm64]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /lightningcss-linux-arm64-musl@1.23.0:
-    resolution: {integrity: sha512-cU00LGb6GUXCwof6ACgSMKo3q7XYbsyTj0WsKHLi1nw7pV0NCq8nFTn6ZRBYLoKiV8t+jWl0Hv8KkgymmK5L5g==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [arm64]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /lightningcss-linux-x64-gnu@1.22.1:
-    resolution: {integrity: sha512-RjNgpdM20VUXgV7us/VmlO3Vn2ZRiDnc3/bUxCVvySZWPiVPprpqW/QDWuzkGa+NCUf6saAM5CLsZLSxncXJwg==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [x64]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /lightningcss-linux-x64-gnu@1.23.0:
-    resolution: {integrity: sha512-q4jdx5+5NfB0/qMbXbOmuC6oo7caPnFghJbIAV90cXZqgV8Am3miZhC4p+sQVdacqxfd+3nrle4C8icR3p1AYw==}
+  /lightningcss-linux-x64-gnu@1.24.0:
+    resolution: {integrity: sha512-3j5MdTh+LSDF3o6uDwRjRUgw4J+IfDCVtdkUrJvKxL79qBLUujXY7CTe5X3IQDDLKEe/3wu49r8JKgxr0MfjbQ==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [linux]
@@ -29787,8 +30921,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-linux-x64-musl@1.22.1:
-    resolution: {integrity: sha512-ZgO4C7Rd6Hv/5MnyY2KxOYmIlzk4rplVolDt3NbkNR8DndnyX0Q5IR4acJWNTBICQ21j3zySzKbcJaiJpk/4YA==}
+  /lightningcss-linux-x64-musl@1.24.0:
+    resolution: {integrity: sha512-HI+rNnvaLz0o36z6Ki0gyG5igVGrJmzczxA5fznr6eFTj3cHORoR/j2q8ivMzNFR4UKJDkTWUH5LMhacwOHWBA==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [linux]
@@ -29796,26 +30930,8 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss-linux-x64-musl@1.23.0:
-    resolution: {integrity: sha512-G9Ri3qpmF4qef2CV/80dADHKXRAQeQXpQTLx7AiQrBYQHqBjB75oxqj06FCIe5g4hNCqLPnM9fsO4CyiT1sFSQ==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [x64]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /lightningcss-win32-x64-msvc@1.22.1:
-    resolution: {integrity: sha512-4pozV4eyD0MDET41ZLHAeBo+H04Nm2UEYIk5w/ts40231dRFV7E0cjwbnZvSoc1DXFgecAhiC0L16ruv/ZDCpg==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [x64]
-    os: [win32]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /lightningcss-win32-x64-msvc@1.23.0:
-    resolution: {integrity: sha512-1rcBDJLU+obPPJM6qR5fgBUiCdZwZLafZM5f9kwjFLkb/UBNIzmae39uCSmh71nzPCTXZqHbvwu23OWnWEz+eg==}
+  /lightningcss-win32-x64-msvc@1.24.0:
+    resolution: {integrity: sha512-oeije/t7OZ5N9vSs6amyW/34wIYoBCpE6HUlsSKcP2SR1CVgx9oKEM00GtQmtqNnYiMIfsSm7+ppMb4NLtD5vg==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [win32]
@@ -29823,38 +30939,21 @@ packages:
     dev: true
     optional: true
 
-  /lightningcss@1.22.1:
-    resolution: {integrity: sha512-Fy45PhibiNXkm0cK5FJCbfO8Y6jUpD/YcHf/BtuI+jvYYqSXKF4muk61jjE8YxCR9y+hDYIWSzHTc+bwhDE6rQ==}
-    engines: {node: '>= 12.0.0'}
-    dependencies:
-      detect-libc: 1.0.3
-    optionalDependencies:
-      lightningcss-darwin-arm64: 1.22.1
-      lightningcss-darwin-x64: 1.22.1
-      lightningcss-freebsd-x64: 1.22.1
-      lightningcss-linux-arm-gnueabihf: 1.22.1
-      lightningcss-linux-arm64-gnu: 1.22.1
-      lightningcss-linux-arm64-musl: 1.22.1
-      lightningcss-linux-x64-gnu: 1.22.1
-      lightningcss-linux-x64-musl: 1.22.1
-      lightningcss-win32-x64-msvc: 1.22.1
-    dev: true
-
-  /lightningcss@1.23.0:
-    resolution: {integrity: sha512-SEArWKMHhqn/0QzOtclIwH5pXIYQOUEkF8DgICd/105O+GCgd7jxjNod/QPnBCSWvpRHQBGVz5fQ9uScby03zA==}
+  /lightningcss@1.24.0:
+    resolution: {integrity: sha512-y36QEEDVx4IM7/yIZNsZJMRREIu26WzTsauIysf5s76YeCmlSbRZS7aC97IGPuoFRnyZ5Wx43OBsQBFB5Ne7ng==}
     engines: {node: '>= 12.0.0'}
     dependencies:
       detect-libc: 1.0.3
     optionalDependencies:
-      lightningcss-darwin-arm64: 1.23.0
-      lightningcss-darwin-x64: 1.23.0
-      lightningcss-freebsd-x64: 1.23.0
-      lightningcss-linux-arm-gnueabihf: 1.23.0
-      lightningcss-linux-arm64-gnu: 1.23.0
-      lightningcss-linux-arm64-musl: 1.23.0
-      lightningcss-linux-x64-gnu: 1.23.0
-      lightningcss-linux-x64-musl: 1.23.0
-      lightningcss-win32-x64-msvc: 1.23.0
+      lightningcss-darwin-arm64: 1.24.0
+      lightningcss-darwin-x64: 1.24.0
+      lightningcss-freebsd-x64: 1.24.0
+      lightningcss-linux-arm-gnueabihf: 1.24.0
+      lightningcss-linux-arm64-gnu: 1.24.0
+      lightningcss-linux-arm64-musl: 1.24.0
+      lightningcss-linux-x64-gnu: 1.24.0
+      lightningcss-linux-x64-musl: 1.24.0
+      lightningcss-win32-x64-msvc: 1.24.0
     dev: true
 
   /lilconfig@2.1.0:
@@ -29917,28 +31016,30 @@ packages:
       - supports-color
     dev: true
 
-  /listhen@1.6.0:
-    resolution: {integrity: sha512-z0RcEXVX5oTpY1bO02SKoTU/kmZSrFSngNNzHRM6KICR17PTq7ANush6AE6ztGJwJD4RLpBrVHd9GnV51J7s3w==}
+  /listhen@1.7.2:
+    resolution: {integrity: sha512-7/HamOm5YD9Wb7CFgAZkKgVPA96WwhcTQoqtm2VTZGVbVVn3IWKRBTgrU7cchA3Q8k9iCsG8Osoi9GX4JsGM9g==}
     hasBin: true
     dependencies:
-      '@parcel/watcher': 2.4.0
-      '@parcel/watcher-wasm': 2.4.0
+      '@parcel/watcher': 2.4.1
+      '@parcel/watcher-wasm': 2.4.1
       citty: 0.1.6
       clipboardy: 4.0.0
       consola: 3.2.3
-      crossws: 0.1.1
+      crossws: 0.2.4
       defu: 6.1.4
       get-port-please: 3.1.2
-      h3: 1.10.1
+      h3: 1.11.1
       http-shutdown: 1.2.2
       jiti: 1.21.0
-      mlly: 1.5.0
+      mlly: 1.6.1
       node-forge: 1.3.1
       pathe: 1.1.2
       std-env: 3.7.0
-      ufo: 1.3.2
+      ufo: 1.4.0
       untun: 0.1.3
       uqr: 0.1.2
+    transitivePeerDependencies:
+      - uWebSockets.js
     dev: false
 
   /listr2@1.3.8:
@@ -30092,7 +31193,7 @@ packages:
     resolution: {integrity: sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==}
     engines: {node: '>=14'}
     dependencies:
-      mlly: 1.5.0
+      mlly: 1.4.2
       pkg-types: 1.0.3
 
   /locale@0.1.0:
@@ -30328,7 +31429,7 @@ packages:
     resolution: {integrity: sha512-Yj9mA8fPiVgOUpByoTZO5pNrcl5Yk37FcSHsUINpAsaBIEZIuqcCclDZJCVxqQShDsmYX8QG63svJiTbOATZwg==}
     engines: {node: 14 || >=16.14}
     dependencies:
-      semver: 7.6.0
+      semver: 7.5.4
 
   /lru-cache@4.1.5:
     resolution: {integrity: sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==}
@@ -30392,7 +31493,7 @@ packages:
     resolution: {integrity: sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==}
     engines: {node: '>=10'}
     dependencies:
-      semver: 7.6.0
+      semver: 7.5.4
 
   /make-error@1.3.6:
     resolution: {integrity: sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==}
@@ -30898,6 +31999,10 @@ packages:
     resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
     engines: {node: '>= 8'}
 
+  /merge@2.1.1:
+    resolution: {integrity: sha512-jz+Cfrg9GWOZbQAnDQ4hlVnQky+341Yk5ru8bZSe6sIDTCIg8n9i/u7hSQGSVOF3C7lH6mGtqjkiT9G4wFLL0w==}
+    dev: false
+
   /methods@1.1.2:
     resolution: {integrity: sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==}
     engines: {node: '>= 0.6'}
@@ -31058,8 +32163,8 @@ packages:
   /micromark-extension-mdxjs@1.0.1:
     resolution: {integrity: sha512-7YA7hF6i5eKOfFUzZ+0z6avRG52GpWR8DL+kN47y3f2KhxbBZMhmxe7auOeaTBrW2DenbbZTf1ea9tA2hDpC2Q==}
     dependencies:
-      acorn: 8.11.3
-      acorn-jsx: 5.3.2(acorn@8.11.3)
+      acorn: 8.11.2
+      acorn-jsx: 5.3.2(acorn@8.11.2)
       micromark-extension-mdx-expression: 1.0.8
       micromark-extension-mdx-jsx: 1.0.5
       micromark-extension-mdx-md: 1.0.1
@@ -31357,6 +32462,19 @@ packages:
       tiny-warning: 1.0.3
     dev: false
 
+  /mini-create-react-context@0.4.1(prop-types@15.7.2)(react@18.2.0):
+    resolution: {integrity: sha512-YWCYEmd5CQeHGSAKrYvXgmzzkrvssZcuuQDDeqkT+PziKGMgE+0MCCtcKbROzocGBG1meBLl2FotlRwf4gAzbQ==}
+    deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
+    peerDependencies:
+      prop-types: ^15.0.0
+      react: ^0.14.0 || ^15.0.0 || ^16.0.0 || ^17.0.0
+    dependencies:
+      '@babel/runtime': 7.20.6
+      prop-types: 15.7.2
+      react: 18.2.0
+      tiny-warning: 1.0.3
+    dev: false
+
   /mini-css-extract-plugin@0.12.0(webpack@5.90.1):
     resolution: {integrity: sha512-z6PQCe9rd1XUwZ8gMaEVwwRyZlrYy8Ba1gRjFP5HcV51HkXX+XlwZ+a1iAYTjSYwgNBXoNR7mhx79mDpOn5fdw==}
     engines: {node: '>= 6.9.0'}
@@ -31548,13 +32666,14 @@ packages:
       pkg-types: 1.0.3
       ufo: 1.3.2
 
-  /mlly@1.5.0:
-    resolution: {integrity: sha512-NPVQvAY1xr1QoVeG0cy8yUYC7FQcOx6evl/RjT1wL5FvzPnzOysoqB/jmx/DhssT2dYa8nxECLAaFI/+gVLhDQ==}
+  /mlly@1.6.1:
+    resolution: {integrity: sha512-vLgaHvaeunuOXHSmEbZ9izxPx3USsk8KCQ8iC+aTlp5sKRSoZvwhHh5L9VbKSaVC6sJDqbyohIS76E2VmHIPAA==}
     dependencies:
       acorn: 8.11.3
       pathe: 1.1.2
       pkg-types: 1.0.3
       ufo: 1.3.2
+    dev: false
 
   /modern-ahocorasick@1.0.1:
     resolution: {integrity: sha512-yoe+JbhTClckZ67b2itRtistFKf8yPYelHLc7e5xAwtNAXxM6wJTUx2C7QeVSJFDzKT7bCIFyBVybPMKvmB9AA==}
@@ -31846,22 +32965,22 @@ packages:
       '@rollup/pluginutils': 5.1.0(rollup@4.8.0)
       '@types/http-proxy': 1.17.14
       '@vercel/nft': 0.24.4
-      archiver: 6.0.1
-      c12: 1.8.0
+      archiver: 6.0.2
+      c12: 1.9.0
       chalk: 5.3.0
       chokidar: 3.5.3
       citty: 0.1.6
       consola: 3.2.3
       cookie-es: 1.0.0
       defu: 6.1.3
-      destr: 2.0.2
+      destr: 2.0.3
       dot-prop: 8.0.2
       esbuild: 0.19.9
       escape-string-regexp: 5.0.0
       estree-walker: 3.0.3
       etag: 1.8.1
       fs-extra: 11.2.0
-      globby: 14.0.1
+      globby: 14.0.0
       gzip-size: 7.0.0
       h3: 1.10.1
       hookable: 5.5.3
@@ -31870,7 +32989,7 @@ packages:
       jiti: 1.21.0
       klona: 2.0.6
       knitwork: 1.0.0
-      listhen: 1.6.0
+      listhen: 1.7.2
       magic-string: 0.30.5
       mime: 3.0.0
       mlly: 1.4.2
@@ -31879,7 +32998,7 @@ packages:
       ofetch: 1.3.3
       ohash: 1.1.3
       openapi-typescript: 6.7.4
-      pathe: 1.1.2
+      pathe: 1.1.1
       perfect-debounce: 1.0.0
       pkg-types: 1.0.3
       pretty-bytes: 6.1.1
@@ -31887,10 +33006,10 @@ packages:
       rollup: 4.8.0
       rollup-plugin-visualizer: 5.12.0(rollup@4.8.0)
       scule: 1.3.0
-      semver: 7.6.0
+      semver: 7.5.4
       serve-placeholder: 2.0.1
       serve-static: 1.15.0
-      std-env: 3.7.0
+      std-env: 3.5.0
       ufo: 1.3.2
       uncrypto: 0.1.3
       unctx: 2.3.1
@@ -31912,6 +33031,7 @@ packages:
       - encoding
       - idb-keyval
       - supports-color
+      - uWebSockets.js
     dev: false
 
   /no-case@3.0.4:
@@ -32025,7 +33145,7 @@ packages:
       nopt: 6.0.0
       npmlog: 6.0.2
       rimraf: 3.0.2
-      semver: 7.6.0
+      semver: 7.5.4
       tar: 6.2.0
       which: 2.0.2
     transitivePeerDependencies:
@@ -32058,7 +33178,7 @@ packages:
     dependencies:
       growly: 1.3.0
       is-wsl: 2.2.0
-      semver: 7.6.0
+      semver: 7.5.4
       shellwords: 0.1.1
       uuid: 8.3.2
       which: 2.0.2
@@ -32101,7 +33221,7 @@ packages:
     dependencies:
       hosted-git-info: 4.1.0
       is-core-module: 2.13.1
-      semver: 7.6.0
+      semver: 7.5.4
       validate-npm-package-license: 3.0.4
 
   /normalize-package-data@5.0.0:
@@ -32110,7 +33230,7 @@ packages:
     dependencies:
       hosted-git-info: 6.1.1
       is-core-module: 2.13.1
-      semver: 7.6.0
+      semver: 7.5.4
       validate-npm-package-license: 3.0.4
 
   /normalize-path@2.1.1:
@@ -32172,7 +33292,7 @@ packages:
     resolution: {integrity: sha512-W29RiK/xtpCGqn6f3ixfRYGk+zRyr+Ew9F2E20BfXxT5/euLdA/Nm7fO7OeTGuAmTs30cpgInyJ0cYe708YTZw==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
     dependencies:
-      semver: 7.6.0
+      semver: 7.5.4
 
   /npm-normalize-package-bin@1.0.1:
     resolution: {integrity: sha512-EPfafl6JL5/rU+ot6P3gRSCpPDW5VmIzX959Ob1+ySFUuuYHWHekXpwdUZcKP5C+DS4GEtdJluwBjnsNDl+fSA==}
@@ -32191,7 +33311,7 @@ packages:
     dependencies:
       hosted-git-info: 6.1.1
       proc-log: 3.0.0
-      semver: 7.6.0
+      semver: 7.5.4
       validate-npm-package-name: 5.0.0
 
   /npm-package-arg@8.1.5:
@@ -32233,7 +33353,7 @@ packages:
       npm-install-checks: 6.3.0
       npm-normalize-package-bin: 3.0.1
       npm-package-arg: 10.1.0
-      semver: 7.6.0
+      semver: 7.5.4
 
   /npm-registry-fetch@12.0.2:
     resolution: {integrity: sha512-Df5QT3RaJnXYuOwtXBXS9BWs+tHH2olvkCLh6jcR/b/u3DvPMlp3J0TvvYwplPKxHMOwfg287PYih9QqaVFoKA==}
@@ -32473,7 +33593,7 @@ packages:
   /ofetch@1.3.3:
     resolution: {integrity: sha512-s1ZCMmQWXy4b5K/TW9i/DtiN8Ku+xCiHcjQ6/J/nDdssirrQNOoB165Zu8EqLMA2lln1JUth9a0aW9Ap2ctrUg==}
     dependencies:
-      destr: 2.0.2
+      destr: 2.0.3
       node-fetch-native: 1.4.1
       ufo: 1.3.2
     dev: false
@@ -32875,7 +33995,7 @@ packages:
       got: 12.6.1
       registry-auth-token: 5.0.2
       registry-url: 6.0.1
-      semver: 7.6.0
+      semver: 7.5.4
     dev: true
 
   /pacote@12.0.3:
@@ -33218,6 +34338,7 @@ packages:
 
   /pathe@1.1.2:
     resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==}
+    dev: false
 
   /pathval@1.1.1:
     resolution: {integrity: sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==}
@@ -33328,7 +34449,7 @@ packages:
     dependencies:
       jsonc-parser: 3.2.0
       mlly: 1.4.2
-      pathe: 1.1.2
+      pathe: 1.1.1
 
   /pkg-up@3.1.0:
     resolution: {integrity: sha512-nDywThFk1i4BQK4twPQ6TA4RT8bDY96yeuCVBWL3ePARCiEKDRSrNGbFIgUJpLp+XeIR65v8ra7WuJOFUBtkMA==}
@@ -33501,7 +34622,7 @@ packages:
       loader-utils: 2.0.4
       postcss: 7.0.39
       schema-utils: 3.3.0
-      semver: 7.6.0
+      semver: 7.5.4
       webpack: 5.90.1
     dev: true
 
@@ -33517,7 +34638,7 @@ packages:
       loader-utils: 2.0.4
       postcss: 8.4.31
       schema-utils: 3.3.0
-      semver: 7.6.0
+      semver: 7.5.4
       webpack: 5.90.1
 
   /postcss-loader@7.0.2(postcss@8.4.31)(webpack@5.90.1):
@@ -33628,18 +34749,6 @@ packages:
       postcss: 8.4.31
       postcss-selector-parser: 6.0.13
       postcss-value-parser: 4.2.0
-    dev: true
-
-  /postcss-modules-local-by-default@4.0.4(postcss@8.4.31):
-    resolution: {integrity: sha512-L4QzMnOdVwRm1Qb8m4x8jsZzKAaPAgrUF1r/hjDR2Xj7R+8Zsf97jAlSQzWtKx5YNiNGN8QxmPFIc/sh+RQl+Q==}
-    engines: {node: ^10 || ^12 || >= 14}
-    peerDependencies:
-      postcss: ^8.1.0
-    dependencies:
-      icss-utils: 5.1.0(postcss@8.4.31)
-      postcss: 8.4.31
-      postcss-selector-parser: 6.0.13
-      postcss-value-parser: 4.2.0
 
   /postcss-modules-scope@2.2.0:
     resolution: {integrity: sha512-YyEgsTMRpNd+HmyC7H/mh3y+MeFWevy7V1evVhJWewmMbjDHIbZbOXICC2y+m1xI1UVfIT1HMW/O04Hxyu9oXQ==}
@@ -33657,16 +34766,6 @@ packages:
     dependencies:
       postcss: 8.4.31
       postcss-selector-parser: 6.0.13
-    dev: true
-
-  /postcss-modules-scope@3.1.1(postcss@8.4.31):
-    resolution: {integrity: sha512-uZgqzdTleelWjzJY+Fhti6F3C9iF1JR/dODLs/JDefozYcKTBCdD8BIl6nNPbTbcLnGrk56hzwZC2DaGNvYjzA==}
-    engines: {node: ^10 || ^12 || >= 14}
-    peerDependencies:
-      postcss: ^8.1.0
-    dependencies:
-      postcss: 8.4.31
-      postcss-selector-parser: 6.0.13
 
   /postcss-modules-values@3.0.0:
     resolution: {integrity: sha512-1//E5jCBrZ9DmRX+zCtmQtRSV6PV42Ix7Bzj9GbwJceduuf7IqP8MgeTXuRDHOWj2m0VzZD5+roFWDuU8RQjcg==}
@@ -33954,8 +35053,8 @@ packages:
       posthtml-render: 3.0.0
     dev: true
 
-  /preact@10.19.4:
-    resolution: {integrity: sha512-dwaX5jAh0Ga8uENBX1hSOujmKWgx9RtL80KaKUFLc6jb4vCEAc3EeZ0rnQO/FO4VgjfPMfoLFWnNG8bHuZ9VLw==}
+  /preact@10.19.6:
+    resolution: {integrity: sha512-gympg+T2Z1fG1unB8NH29yHJwnEaCH37Z32diPDku316OTnRPeMbiRV9kTrfZpocXjdfnWuFUl/Mj4BHaf6gnw==}
     dev: false
 
   /preferred-pm@3.1.2:
@@ -34729,6 +35828,23 @@ packages:
       react-lifecycles-compat: 3.0.4
     dev: false
 
+  /rc-animate@2.11.1(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-1NyuCGFJG/0Y+9RKh5y/i/AalUCA51opyyS/jO2seELpgymZm2u9QV3xwODwEuzkmeQ1BDPxMLmYLcTJedPlkQ==}
+    peerDependencies:
+      react: '>=16.9.0'
+      react-dom: '>=16.9.0'
+    dependencies:
+      babel-runtime: 6.26.0
+      classnames: 2.3.2
+      css-animation: 1.6.1
+      prop-types: 15.7.2
+      raf: 3.4.1
+      rc-util: 4.21.1
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-lifecycles-compat: 3.0.4
+    dev: false
+
   /rc-time-picker@3.7.3(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-Lv1Mvzp9fRXhXEnRLO4nW6GLNxUkfAZ3RsiIBsWjGjXXvMNjdr4BX/ayElHAFK0DoJqOhm7c5tjmIYpEOwcUXg==}
     dependencies:
@@ -34743,6 +35859,20 @@ packages:
       - react-dom
     dev: false
 
+  /rc-time-picker@3.7.3(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-Lv1Mvzp9fRXhXEnRLO4nW6GLNxUkfAZ3RsiIBsWjGjXXvMNjdr4BX/ayElHAFK0DoJqOhm7c5tjmIYpEOwcUXg==}
+    dependencies:
+      classnames: 2.2.6
+      moment: 2.29.4
+      prop-types: 15.7.2
+      raf: 3.4.1
+      rc-trigger: 2.6.5(react-dom@18.2.0)(react@18.2.0)
+      react-lifecycles-compat: 3.0.4
+    transitivePeerDependencies:
+      - react
+      - react-dom
+    dev: false
+
   /rc-trigger@2.6.5(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-m6Cts9hLeZWsTvWnuMm7oElhf+03GOjOLfTuU0QmdB9ZrW7jR2IpI5rpNM7i9MvAAlMAmTx5Zr7g3uu/aMvZAw==}
     dependencies:
@@ -34758,6 +35888,21 @@ packages:
       - react-dom
     dev: false
 
+  /rc-trigger@2.6.5(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-m6Cts9hLeZWsTvWnuMm7oElhf+03GOjOLfTuU0QmdB9ZrW7jR2IpI5rpNM7i9MvAAlMAmTx5Zr7g3uu/aMvZAw==}
+    dependencies:
+      babel-runtime: 6.26.0
+      classnames: 2.3.2
+      prop-types: 15.7.2
+      rc-align: 2.4.5
+      rc-animate: 2.11.1(react-dom@18.2.0)(react@18.2.0)
+      rc-util: 4.21.1
+      react-lifecycles-compat: 3.0.4
+    transitivePeerDependencies:
+      - react
+      - react-dom
+    dev: false
+
   /rc-util@4.21.1:
     resolution: {integrity: sha512-Z+vlkSQVc1l8O2UjR3WQ+XdWlhj5q9BMQNLk2iOBch75CqPfrJyGtcWMcnhRlNuDu0Ndtt4kLVO8JI8BrABobg==}
     dependencies:
@@ -34772,7 +35917,7 @@ packages:
     resolution: {integrity: sha512-lNeOl38Ws0eNxpO3+wD1I9rkHGQyj1NU1jlzv4go2CtEnEQEUfqnIvZG7W+bC/aXdJ27n5x/yUjb6RoT9tko+Q==}
     dependencies:
       defu: 6.1.4
-      destr: 2.0.2
+      destr: 2.0.3
       flat: 5.0.2
     dev: false
 
@@ -34801,6 +35946,18 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-animate-height@2.0.17(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-cumTv/vCZ1MudkqXsLXGW6XO7EbGWIV0uZzkZVBf5HlHQ7n1GkbCsQl44SVo9nlA9/p+4XqWh4yn1Cc37Gri6A==}
+    peerDependencies:
+      react: '>=15.6.2'
+      react-dom: '>=15.6.2'
+    dependencies:
+      classnames: 2.2.6
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-aria-components@1.0.0-rc.0(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-N8fE1iMd8dBxKOmN3XEk+RloHGOcOMEJyeabZCJRDY2F4M2GWYpZ4vCYad1jDD+UByumGW4JZInnDh1FlXdDZw==}
     peerDependencies:
@@ -34819,7 +35976,7 @@ packages:
       '@react-types/table': 3.9.1(react@18.2.0)
       '@swc/helpers': 0.5.3
       react: 18.2.0
-      react-aria: 3.31.0(react-dom@18.2.0)(react@18.2.0)
+      react-aria: 3.30.0(react-dom@18.2.0)(react@18.2.0)
       react-dom: 18.2.0(react@18.2.0)
       react-stately: 3.28.0(react@18.2.0)
       use-sync-external-store: 1.2.0(react@18.2.0)
@@ -34854,48 +36011,47 @@ packages:
       use-sync-external-store: 1.2.0(react@18.2.0)
     dev: false
 
-  /react-aria@3.31.0(react-dom@18.2.0)(react@18.2.0):
-    resolution: {integrity: sha512-fdmiEhopCq4TIP0BMMsDh92RMfGzVyNaSPdYLs5qqhDlVmaVL3NqWcK8RVstgI13ST/DIM+h9jgtp8+X1EDHMw==}
+  /react-aria@3.30.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-ULMlmH68/jXzkDaMjuM9O8dKCxnAYviW4E5sywfLX4J6mC6eGsQzoqtwWeQgr1M9SJqLfgKaVoDP1dLvb4XzEA==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0-rc.1 || ^18.0.0
     dependencies:
-      '@internationalized/string': 3.2.0
-      '@react-aria/breadcrumbs': 3.5.9(react@18.2.0)
-      '@react-aria/button': 3.9.1(react@18.2.0)
-      '@react-aria/calendar': 3.5.4(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/checkbox': 3.13.0(react@18.2.0)
-      '@react-aria/combobox': 3.8.1(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/datepicker': 3.9.1(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/dialog': 3.5.9(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/dnd': 3.5.1(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/focus': 3.16.0(react@18.2.0)
-      '@react-aria/gridlist': 3.7.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/i18n': 3.10.0(react@18.2.0)
-      '@react-aria/interactions': 3.20.1(react@18.2.0)
-      '@react-aria/label': 3.7.4(react@18.2.0)
-      '@react-aria/link': 3.6.3(react@18.2.0)
-      '@react-aria/listbox': 3.11.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/menu': 3.12.0(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/meter': 3.4.9(react@18.2.0)
-      '@react-aria/numberfield': 3.10.1(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/overlays': 3.20.0(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/progress': 3.4.9(react@18.2.0)
-      '@react-aria/radio': 3.10.0(react@18.2.0)
-      '@react-aria/searchfield': 3.7.0(react@18.2.0)
-      '@react-aria/select': 3.14.1(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/selection': 3.17.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/separator': 3.3.9(react@18.2.0)
-      '@react-aria/slider': 3.7.4(react@18.2.0)
-      '@react-aria/ssr': 3.9.1(react@18.2.0)
-      '@react-aria/switch': 3.6.0(react@18.2.0)
-      '@react-aria/table': 3.13.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/tabs': 3.8.3(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/tag': 3.3.1(react-dom@18.2.0)(react@18.2.0)
-      '@react-aria/textfield': 3.14.0(react@18.2.0)
-      '@react-aria/tooltip': 3.7.0(react@18.2.0)
-      '@react-aria/utils': 3.23.0(react@18.2.0)
-      '@react-aria/visually-hidden': 3.8.8(react@18.2.0)
+      '@react-aria/breadcrumbs': 3.5.8(react@18.2.0)
+      '@react-aria/button': 3.9.0(react@18.2.0)
+      '@react-aria/calendar': 3.5.3(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/checkbox': 3.12.0(react@18.2.0)
+      '@react-aria/combobox': 3.8.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/datepicker': 3.9.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/dialog': 3.5.8(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/dnd': 3.5.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/focus': 3.15.0(react@18.2.0)
+      '@react-aria/gridlist': 3.7.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/i18n': 3.9.0(react@18.2.0)
+      '@react-aria/interactions': 3.20.0(react@18.2.0)
+      '@react-aria/label': 3.7.3(react@18.2.0)
+      '@react-aria/link': 3.6.2(react@18.2.0)
+      '@react-aria/listbox': 3.11.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/menu': 3.11.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/meter': 3.4.8(react@18.2.0)
+      '@react-aria/numberfield': 3.10.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/overlays': 3.19.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/progress': 3.4.8(react@18.2.0)
+      '@react-aria/radio': 3.9.0(react@18.2.0)
+      '@react-aria/searchfield': 3.6.0(react@18.2.0)
+      '@react-aria/select': 3.14.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/selection': 3.17.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/separator': 3.3.8(react@18.2.0)
+      '@react-aria/slider': 3.7.3(react@18.2.0)
+      '@react-aria/ssr': 3.9.0(react@18.2.0)
+      '@react-aria/switch': 3.5.7(react@18.2.0)
+      '@react-aria/table': 3.13.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/tabs': 3.8.2(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/tag': 3.3.0(react-dom@18.2.0)(react@18.2.0)
+      '@react-aria/textfield': 3.13.0(react@18.2.0)
+      '@react-aria/tooltip': 3.6.5(react@18.2.0)
+      '@react-aria/utils': 3.22.0(react@18.2.0)
+      '@react-aria/visually-hidden': 3.8.7(react@18.2.0)
       '@react-types/shared': 3.22.0(react@18.2.0)
       react: 18.2.0
       react-dom: 18.2.0(react@18.2.0)
@@ -34961,12 +36117,31 @@ packages:
       react: 17.0.2
       react-dom: 17.0.2(react@17.0.2)
       react-redux: 7.2.4(react-dom@17.0.2)(react@17.0.2)
-      redux: 4.1.0
+      redux: 4.2.1
       use-memo-one: 1.1.3(react@17.0.2)
     transitivePeerDependencies:
       - react-native
     dev: false
 
+  /react-beautiful-dnd@13.0.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-87It8sN0ineoC3nBW0SbQuTFXM6bUqM62uJGY4BtTf0yzPl8/3+bHMWkgIe0Z6m8e+gJgjWxefGRVfpE3VcdEg==}
+    peerDependencies:
+      react: ^16.8.5
+      react-dom: ^16.8.5
+    dependencies:
+      '@babel/runtime': 7.20.6
+      css-box-model: 1.2.1
+      memoize-one: 5.2.1
+      raf-schd: 4.0.3
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-redux: 7.2.4(react-dom@18.2.0)(react@18.2.0)
+      redux: 4.2.1
+      use-memo-one: 1.1.3(react@18.2.0)
+    transitivePeerDependencies:
+      - react-native
+    dev: false
+
   /react-colorful@5.6.1(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-1exovf0uGTGyq5mXQT0zgQ80uvj2PCwvF8zY1RN9/vbJVSjSo3fsB/4L3ObbF7u70NduSiK4xu4Y6q1MHoUGEw==}
     peerDependencies:
@@ -34998,6 +36173,17 @@ packages:
       universal-cookie: 4.0.4
     dev: false
 
+  /react-cookie@4.1.1(react@18.2.0):
+    resolution: {integrity: sha512-ffn7Y7G4bXiFbnE+dKhHhbP+b8I34mH9jqnm8Llhj89zF4nPxPutxHT1suUqMeCEhLDBI7InYwf1tpaSoK5w8A==}
+    peerDependencies:
+      react: '>= 16.3.0'
+    dependencies:
+      '@types/hoist-non-react-statics': 3.3.5
+      hoist-non-react-statics: 3.3.2
+      react: 18.2.0
+      universal-cookie: 4.0.4
+    dev: false
+
   /react-dates@21.5.1(@babel/runtime@7.20.6)(moment@2.29.4)(react-dom@17.0.2)(react-with-direction@1.4.0)(react@17.0.2):
     resolution: {integrity: sha512-1Lplx6T5U2Gu1vN1jh8Nrb+nyA5Uw7LdVVKGqjIoO9Kj6F3mU2budB6DlkxB5hAcjxk3KNzcSHPMYcWPUxvL0g==}
     peerDependencies:
@@ -35028,6 +36214,36 @@ packages:
       react-with-styles-interface-css: 6.0.0(@babel/runtime@7.20.6)(react-with-styles@4.2.0)
     dev: false
 
+  /react-dates@21.5.1(@babel/runtime@7.20.6)(moment@2.29.4)(react-dom@18.2.0)(react-with-direction@1.4.0)(react@18.2.0):
+    resolution: {integrity: sha512-1Lplx6T5U2Gu1vN1jh8Nrb+nyA5Uw7LdVVKGqjIoO9Kj6F3mU2budB6DlkxB5hAcjxk3KNzcSHPMYcWPUxvL0g==}
+    peerDependencies:
+      '@babel/runtime': ^7.0.0
+      moment: ^2.18.1
+      react: ^0.14 || ^15.5.4 || ^16.1.1
+      react-dom: ^0.14 || ^15.5.4 || ^16.1.1
+      react-with-direction: ^1.3.1
+    dependencies:
+      '@babel/runtime': 7.20.6
+      airbnb-prop-types: 2.16.0(react@18.2.0)
+      consolidated-events: 2.0.2
+      enzyme-shallow-equal: 1.0.5
+      is-touch-device: 1.0.1
+      lodash: 4.17.21
+      moment: 2.29.4
+      object.assign: 4.1.4
+      object.values: 1.1.7
+      prop-types: 15.7.2
+      raf: 3.4.1
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-moment-proptypes: 1.8.1(moment@2.29.4)
+      react-outside-click-handler: 1.3.0(react-dom@18.2.0)(react@18.2.0)
+      react-portal: 4.2.1(react-dom@18.2.0)(react@18.2.0)
+      react-with-direction: 1.4.0(react-dom@18.2.0)(react@18.2.0)
+      react-with-styles: 4.2.0(@babel/runtime@7.20.6)(react-with-direction@1.4.0)(react@18.2.0)
+      react-with-styles-interface-css: 6.0.0(@babel/runtime@7.20.6)(react-with-styles@4.2.0)
+    dev: false
+
   /react-detect-click-outside@1.1.1(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-1MqRw9+RaA3dF4zJePSngxBqXut/RgHajFLR91cTV7PRmQyCIrQAUtv979IhQoaoWhVM8rdSx9Eg4/vc/hcReQ==}
     peerDependencies:
@@ -35038,6 +36254,16 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-detect-click-outside@1.1.1(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-1MqRw9+RaA3dF4zJePSngxBqXut/RgHajFLR91cTV7PRmQyCIrQAUtv979IhQoaoWhVM8rdSx9Eg4/vc/hcReQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17
+      react-dom: ^16.8.0 || ^17
+    dependencies:
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-dev-utils@11.0.4(eslint@8.49.0)(typescript@5.2.2)(webpack@5.90.1):
     resolution: {integrity: sha512-dx0LvIGHcOPtKbeiSUM4jqpBl3TcY7CDjZdfOIcKeznE7BWr9dg0iPG90G5yfVQ+p/rGNMXdbfStvzQZEVEi4A==}
     engines: {node: '>=10'}
@@ -35102,6 +36328,20 @@ packages:
       shallowequal: 1.1.0
     dev: false
 
+  /react-dnd@5.0.0(react@18.2.0):
+    resolution: {integrity: sha1-xKF8cBCeRW2tiQa+g45u6PMrBrU=}
+    peerDependencies:
+      react: '>= 16.3'
+    dependencies:
+      dnd-core: 4.0.5
+      hoist-non-react-statics: 2.5.5
+      invariant: 2.2.4
+      lodash: 4.17.21
+      react: 18.2.0
+      recompose: 0.27.1(react@18.2.0)
+      shallowequal: 1.1.0
+    dev: false
+
   /react-docgen-typescript-plugin@1.0.5(typescript@5.2.2)(webpack@5.90.1):
     resolution: {integrity: sha512-Ds6s2ioyIlH45XSfEVMNwRcDkzuff3xQCPxDFOzTc8GEshy+hksas8RYlmV4JEQREI+OGEGybhMCJk3vFbQZNQ==}
     peerDependencies:
@@ -35166,17 +36406,6 @@ packages:
       - supports-color
     dev: true
 
-  /react-dom@17.0.2(react@16.14.0):
-    resolution: {integrity: sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==}
-    peerDependencies:
-      react: 17.0.2
-    dependencies:
-      loose-envify: 1.4.0
-      object-assign: 4.1.1
-      react: 16.14.0
-      scheduler: 0.20.2
-    dev: false
-
   /react-dom@17.0.2(react@17.0.2):
     resolution: {integrity: sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==}
     peerDependencies:
@@ -35208,6 +36437,18 @@ packages:
       react: 17.0.2
     dev: false
 
+  /react-dropzone@11.1.0(react@18.2.0):
+    resolution: {integrity: sha512-gJT6iJadyTbevrigm6KZFaei/yNWfokzs1idumO7fXtRNPiGFDUpsQ+trHWwUO3yWOtJibpbo5tLZggjm+KV5w==}
+    engines: {node: '>= 8'}
+    peerDependencies:
+      react: '>= 16.8'
+    dependencies:
+      attr-accept: 2.2.2
+      file-selector: 0.1.19
+      prop-types: 15.7.2
+      react: 18.2.0
+    dev: false
+
   /react-element-to-jsx-string@14.3.4(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-t4ZwvV6vwNxzujDQ+37bspnLwA4JlgUPWhLjBJWsNIDceAf6ZKUTCjdm08cN6WeZ5pTMKiCJkmAYnpmR4Bm+dg==}
     peerDependencies:
@@ -35221,6 +36462,19 @@ packages:
       react-is: 17.0.2
     dev: true
 
+  /react-element-to-jsx-string@14.3.4(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-t4ZwvV6vwNxzujDQ+37bspnLwA4JlgUPWhLjBJWsNIDceAf6ZKUTCjdm08cN6WeZ5pTMKiCJkmAYnpmR4Bm+dg==}
+    peerDependencies:
+      react: ^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1
+      react-dom: ^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1
+    dependencies:
+      '@base2/pretty-print-object': 1.0.1
+      is-plain-object: 5.0.0
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-is: 17.0.2
+    dev: true
+
   /react-element-to-jsx-string@15.0.0(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-UDg4lXB6BzlobN60P8fHWVPX3Kyw8ORrTeBtClmIlGdkOOE+GYQSFvmEU5iLLpwp/6v42DINwNcwOhOLfQ//FQ==}
     peerDependencies:
@@ -35234,14 +36488,14 @@ packages:
       react-is: 18.1.0
     dev: true
 
-  /react-error-boundary@3.1.4(react@17.0.2):
+  /react-error-boundary@3.1.4(react@18.2.0):
     resolution: {integrity: sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==}
     engines: {node: '>=10', npm: '>=6'}
     peerDependencies:
       react: '>=16.13.1'
     dependencies:
       '@babel/runtime': 7.20.6
-      react: 17.0.2
+      react: 18.2.0
     dev: true
 
   /react-error-overlay@6.0.9:
@@ -35262,6 +36516,14 @@ packages:
       react: 17.0.2
     dev: false
 
+  /react-image-gallery@1.2.7(react@18.2.0):
+    resolution: {integrity: sha512-ts7yMWykvZhslGMuvVAUk7a1dJIx9QtIwK6Clv8dOGxPsJid92FRrLvXbZDvkYcUyj48sHalnBhqU6mZNCB2jg==}
+    peerDependencies:
+      react: ^16.0.0 || ^17.0.0
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /react-input-autosize@3.0.0(react@17.0.2):
     resolution: {integrity: sha512-nL9uS7jEs/zu8sqwFE5MAPx6pPkNAriACQ2rGLlqmKr2sPGtN7TXTyDdQt4lbNXVx7Uzadb40x8qotIuru6Rhg==}
     peerDependencies:
@@ -35271,6 +36533,15 @@ packages:
       react: 17.0.2
     dev: false
 
+  /react-input-autosize@3.0.0(react@18.2.0):
+    resolution: {integrity: sha512-nL9uS7jEs/zu8sqwFE5MAPx6pPkNAriACQ2rGLlqmKr2sPGtN7TXTyDdQt4lbNXVx7Uzadb40x8qotIuru6Rhg==}
+    peerDependencies:
+      react: ^16.3.0 || ^17.0.0
+    dependencies:
+      prop-types: 15.7.2
+      react: 18.2.0
+    dev: false
+
   /react-inspector@5.1.1(react@17.0.2):
     resolution: {integrity: sha512-GURDaYzoLbW8pMGXwYPDBIv6nqei4kK7LPRZ9q9HCZF54wqXz/dnylBp/kfE9XmekBhHvLDdcYeyIwSrvtOiWg==}
     peerDependencies:
@@ -35282,6 +36553,17 @@ packages:
       react: 17.0.2
     dev: true
 
+  /react-inspector@5.1.1(react@18.2.0):
+    resolution: {integrity: sha512-GURDaYzoLbW8pMGXwYPDBIv6nqei4kK7LPRZ9q9HCZF54wqXz/dnylBp/kfE9XmekBhHvLDdcYeyIwSrvtOiWg==}
+    peerDependencies:
+      react: ^16.8.4 || ^17.0.0
+    dependencies:
+      '@babel/runtime': 7.20.6
+      is-dom: 1.1.0
+      prop-types: 15.7.2
+      react: 18.2.0
+    dev: true
+
   /react-intersection-observer@9.1.0(react@17.0.2):
     resolution: {integrity: sha512-XSDWQGzgJ4/B4eW39+qa3S+uc4Gb+m6lxXR54m/uD5lqeL5sLrgYdntbjl4BlTYAblgUhz+JB5obINhZaD+c0Q==}
     peerDependencies:
@@ -35290,6 +36572,14 @@ packages:
       react: 17.0.2
     dev: false
 
+  /react-intersection-observer@9.1.0(react@18.2.0):
+    resolution: {integrity: sha512-XSDWQGzgJ4/B4eW39+qa3S+uc4Gb+m6lxXR54m/uD5lqeL5sLrgYdntbjl4BlTYAblgUhz+JB5obINhZaD+c0Q==}
+    peerDependencies:
+      react: ^15.0.0 || ^16.0.0 || ^17.0.0|| ^18.0.0
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /react-intl-redux@2.2.0(react-intl@3.8.0)(react-redux@7.2.4):
     resolution: {integrity: sha512-coiNaVbc6Wy9S98oI3cohjsRRkBYu9O0Os0IRGcBVYfHek4u1i8VKXa3rVQM52UzOpCIchcmXMHvC8znLStuWg==}
     peerDependencies:
@@ -35301,7 +36591,23 @@ packages:
       react-redux: 7.2.4(react-dom@17.0.2)(react@17.0.2)
     dev: false
 
-  /react-intl@3.8.0(react@16.14.0):
+  /react-intl-redux@2.3.0(@babel/runtime@7.20.6)(prop-types@15.7.2)(react-intl@3.8.0)(react-redux@8.1.2)(react@18.2.0):
+    resolution: {integrity: sha512-lIAco0dlVIn8Dzc+epHpZZD8oM2TD62SJTkJ+x33KnvYB5l9ouLTvgz1ztajHuhiIBFq6n2mWwnS74Vim8CMuQ==}
+    peerDependencies:
+      '@babel/runtime': ^7.17.9
+      prop-types: ^15.8.1
+      react: ^16.12.0 || ^17.0.2 || ^18.0.0
+      react-intl: "^2.2.2 ||\_^3.0.0 || ^4.0.0 || ^5.0.0"
+      react-redux: ^5.0.1 || ^6.0.0 || ^7.0.0
+    dependencies:
+      '@babel/runtime': 7.20.6
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-intl: 3.8.0(react@18.2.0)
+      react-redux: 8.1.2(@types/react-dom@18.2.19)(@types/react@18.2.60)(react-dom@18.2.0)(react@18.2.0)(redux@4.2.1)
+    dev: false
+
+  /react-intl@3.8.0(react@17.0.2):
     resolution: {integrity: sha512-jWSbc7PUJOpmy0gC9LzTyERpt/auYmMyY0jtCmczgmRns5MIKG9Bav+NpCyZ6XG2jJQgJNWpLkMFy8u7MgjuqA==}
     peerDependencies:
       react: ^16.3.0
@@ -35318,11 +36624,11 @@ packages:
       intl-messageformat: 7.8.4
       intl-messageformat-parser: 3.6.4
       invariant: 2.2.4
-      react: 16.14.0
+      react: 17.0.2
       shallow-equal: 1.2.1
-    dev: true
+    dev: false
 
-  /react-intl@3.8.0(react@17.0.2):
+  /react-intl@3.8.0(react@18.2.0):
     resolution: {integrity: sha512-jWSbc7PUJOpmy0gC9LzTyERpt/auYmMyY0jtCmczgmRns5MIKG9Bav+NpCyZ6XG2jJQgJNWpLkMFy8u7MgjuqA==}
     peerDependencies:
       react: ^16.3.0
@@ -35339,9 +36645,8 @@ packages:
       intl-messageformat: 7.8.4
       intl-messageformat-parser: 3.6.4
       invariant: 2.2.4
-      react: 17.0.2
+      react: 18.2.0
       shallow-equal: 1.2.1
-    dev: false
 
   /react-is-mounted-hook@1.1.2(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-yjq3Tj34CiFcdVOS/h6JerWLOLdJqEGKMNpTHc4kWebzz2YtIpgqMRrqxdmQhewM1KJREojdAV2tsNvBsUWyhA==}
@@ -35353,6 +36658,16 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-is-mounted-hook@1.1.2(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-yjq3Tj34CiFcdVOS/h6JerWLOLdJqEGKMNpTHc4kWebzz2YtIpgqMRrqxdmQhewM1KJREojdAV2tsNvBsUWyhA==}
+    peerDependencies:
+      react: ^16.8.6 || ^17
+      react-dom: ^16.8.6 || ^17
+    dependencies:
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-is@16.13.1:
     resolution: {integrity: sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==}
 
@@ -35381,6 +36696,18 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-medium-image-zoom@3.0.15(prop-types@15.7.2)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-OJc6XXmSFr0ApniFdCL1TliP6BG9eQabkcahWA9CbHha3y2IJXo1aAsQs7Irc2Wcek/N9QCeAY4wTitoMg5iLg==}
+    peerDependencies:
+      prop-types: ^15.5.8
+      react: ^16.0.0
+      react-dom: ^16.0.0
+    dependencies:
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-moment-proptypes@1.8.1(moment@2.29.4):
     resolution: {integrity: sha512-Er940DxWoObfIqPrZNfwXKugjxMIuk1LAuEzn23gytzV6hKS/sw108wibi9QubfMN4h+nrlje8eUCSbQRJo2fQ==}
     peerDependencies:
@@ -35404,6 +36731,21 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-outside-click-handler@1.3.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-Te/7zFU0oHpAnctl//pP3hEAeobfeHMyygHB8MnjP6sX5OR8KHT1G3jmLsV3U9RnIYo+Yn+peJYWu+D5tUS8qQ==}
+    peerDependencies:
+      react: ^0.14 || >=15
+      react-dom: ^0.14 || >=15
+    dependencies:
+      airbnb-prop-types: 2.16.0(react@18.2.0)
+      consolidated-events: 2.0.2
+      document.contains: 1.0.2
+      object.values: 1.1.7
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-popper-tooltip@3.1.1(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-EnERAnnKRptQBJyaee5GJScWNUKQPDD2ywvzZyUjst/wj5U64C8/CnSYLNEmP2hG0IJ3ZhtDxE8oDN+KOyavXQ==}
     peerDependencies:
@@ -35430,6 +36772,20 @@ packages:
       react-fast-compare: 3.2.2
       warning: 4.0.3
 
+  /react-popper@2.3.0(@popperjs/core@2.11.8)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-e1hj8lL3uM+sgSR4Lxzn5h1GxBlpa4CQz0XLF8kx4MDrDRWY0Ena4c97PUeSX9i5W3UAfDP0z0FXCTQkoXUl3Q==}
+    peerDependencies:
+      '@popperjs/core': ^2.0.0
+      react: ^16.8.0 || ^17 || ^18
+      react-dom: ^16.8.0 || ^17 || ^18
+    dependencies:
+      '@popperjs/core': 2.11.8
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-fast-compare: 3.2.2
+      warning: 4.0.3
+    dev: false
+
   /react-portal@4.2.1(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-fE9kOBagwmTXZ3YGRYb4gcMy+kSA+yLO0xnPankjRlfBv4uCpFXqKPfkpsGQQR15wkZ9EssnvTOl1yMzbkxhPQ==}
     peerDependencies:
@@ -35441,6 +36797,17 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-portal@4.2.1(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-fE9kOBagwmTXZ3YGRYb4gcMy+kSA+yLO0xnPankjRlfBv4uCpFXqKPfkpsGQQR15wkZ9EssnvTOl1yMzbkxhPQ==}
+    peerDependencies:
+      react: ^15.0.0-0 || ^16.0.0-0 || ^17.0.0-0
+      react-dom: ^15.0.0-0 || ^16.0.0-0 || ^17.0.0-0
+    dependencies:
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-redux@7.2.4(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-hOQ5eOSkEJEXdpIKbnRyl04LhaWabkDPV+Ix97wqQX3T3d2NQ8DUblNXXtNMavc7DpswyQM6xfaN4HQDKNY2JA==}
     peerDependencies:
@@ -35463,6 +36830,62 @@ packages:
       react-is: 16.13.1
     dev: false
 
+  /react-redux@7.2.4(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-hOQ5eOSkEJEXdpIKbnRyl04LhaWabkDPV+Ix97wqQX3T3d2NQ8DUblNXXtNMavc7DpswyQM6xfaN4HQDKNY2JA==}
+    peerDependencies:
+      react: ^16.8.3 || ^17
+      react-dom: '*'
+      react-native: '*'
+    peerDependenciesMeta:
+      react-dom:
+        optional: true
+      react-native:
+        optional: true
+    dependencies:
+      '@babel/runtime': 7.20.6
+      '@types/react-redux': 7.1.30
+      hoist-non-react-statics: 3.3.2
+      loose-envify: 1.4.0
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-is: 16.13.1
+    dev: false
+
+  /react-redux@8.1.2(@types/react-dom@18.2.19)(@types/react@18.2.60)(react-dom@18.2.0)(react@18.2.0)(redux@4.2.1):
+    resolution: {integrity: sha512-xJKYI189VwfsFc4CJvHqHlDrzyFTY/3vZACbE+rr/zQ34Xx1wQfB4OTOSeOSNrF6BDVe8OOdxIrAnMGXA3ggfw==}
+    peerDependencies:
+      '@types/react': ^16.8 || ^17.0 || ^18.0
+      '@types/react-dom': ^16.8 || ^17.0 || ^18.0
+      react: ^16.8 || ^17.0 || ^18.0
+      react-dom: ^16.8 || ^17.0 || ^18.0
+      react-native: '>=0.59'
+      redux: ^4 || ^5.0.0-beta.0
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+      react-dom:
+        optional: true
+      react-native:
+        optional: true
+      redux:
+        optional: true
+    dependencies:
+      '@babel/runtime': 7.20.6
+      '@types/hoist-non-react-statics': 3.3.5
+      '@types/react': 18.2.60
+      '@types/react-dom': 18.2.19
+      '@types/use-sync-external-store': 0.0.3
+      hoist-non-react-statics: 3.3.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-is: 18.2.0
+      redux: 4.2.1
+      use-sync-external-store: 1.2.0(react@18.2.0)
+    dev: false
+
   /react-refresh@0.11.0:
     resolution: {integrity: sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==}
     engines: {node: '>=0.10.0'}
@@ -35523,6 +36946,17 @@ packages:
       react-router: 5.2.0(react@17.0.2)
     dev: false
 
+  /react-router-config@5.1.1(react-router@5.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-DuanZjaD8mQp1ppHjgnnUnyOlqYXZVjnov/JzFhjLEwd3Z4dYjMSnqrEzzGThH47vpCOqPPwJM2FtthLeJ8Pbg==}
+    peerDependencies:
+      react: '>=15'
+      react-router: '>=5'
+    dependencies:
+      '@babel/runtime': 7.20.6
+      react: 18.2.0
+      react-router: 5.2.0(react@18.2.0)
+    dev: false
+
   /react-router-dom@5.2.0(react@17.0.2):
     resolution: {integrity: sha512-gxAmfylo2QUjcwxI63RhQ5G85Qqt4voZpUXSEqCwykV0baaOTQDR1f0PmY8AELqIyVc0NEZUj0Gov5lNGcXgsA==}
     peerDependencies:
@@ -35538,6 +36972,21 @@ packages:
       tiny-warning: 1.0.3
     dev: false
 
+  /react-router-dom@5.2.0(react@18.2.0):
+    resolution: {integrity: sha512-gxAmfylo2QUjcwxI63RhQ5G85Qqt4voZpUXSEqCwykV0baaOTQDR1f0PmY8AELqIyVc0NEZUj0Gov5lNGcXgsA==}
+    peerDependencies:
+      react: '>=15'
+    dependencies:
+      '@babel/runtime': 7.20.6
+      history: 4.10.1
+      loose-envify: 1.4.0
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-router: 5.2.0(react@18.2.0)
+      tiny-invariant: 1.3.1
+      tiny-warning: 1.0.3
+    dev: false
+
   /react-router-dom@6.21.0(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-1dUdVj3cwc1npzJaf23gulB562ESNvxf7E4x8upNJycqyUm5BRRZ6dd3LrlzhtLaMrwOCO8R0zoiYxdaJx4LlQ==}
     engines: {node: '>=14.0.0'}
@@ -35562,6 +37011,17 @@ packages:
       react-router-dom: 5.2.0(react@17.0.2)
     dev: false
 
+  /react-router-hash-link@2.4.3(react-router-dom@5.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-NU7GWc265m92xh/aYD79Vr1W+zAIXDWp3L2YZOYP4rCqPnJ6LI6vh3+rKgkidtYijozHclaEQTAHaAaMWPVI4A==}
+    peerDependencies:
+      react: '>=15'
+      react-router-dom: '>=4'
+    dependencies:
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-router-dom: 5.2.0(react@18.2.0)
+    dev: false
+
   /react-router@5.2.0(react@17.0.2):
     resolution: {integrity: sha512-smz1DUuFHRKdcJC0jobGo8cVbhO3x50tCL4icacOlcwDOEQPq4TMqwx3sY1TP+DvtTgz4nm3thuo7A+BK2U0Dw==}
     peerDependencies:
@@ -35580,6 +37040,24 @@ packages:
       tiny-warning: 1.0.3
     dev: false
 
+  /react-router@5.2.0(react@18.2.0):
+    resolution: {integrity: sha512-smz1DUuFHRKdcJC0jobGo8cVbhO3x50tCL4icacOlcwDOEQPq4TMqwx3sY1TP+DvtTgz4nm3thuo7A+BK2U0Dw==}
+    peerDependencies:
+      react: '>=15'
+    dependencies:
+      '@babel/runtime': 7.20.6
+      history: 4.10.1
+      hoist-non-react-statics: 3.3.2
+      loose-envify: 1.4.0
+      mini-create-react-context: 0.4.1(prop-types@15.7.2)(react@18.2.0)
+      path-to-regexp: 1.8.0
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-is: 16.13.1
+      tiny-invariant: 1.3.1
+      tiny-warning: 1.0.3
+    dev: false
+
   /react-router@6.21.0(react@18.2.0):
     resolution: {integrity: sha512-hGZ0HXbwz3zw52pLZV3j3+ec+m/PQ9cTpBvqjFQmy2XVUWGn5MD+31oXHb6dVTxYzmAeaiUBYjkoNz66n3RGCg==}
     engines: {node: '>=14.0.0'}
@@ -35600,13 +37078,29 @@ packages:
       '@seznam/compose-react-refs': 1.0.6
       react: 17.0.2
       react-is-mounted-hook: 1.1.2(react-dom@17.0.2)(react@17.0.2)
-      react-select: 4.3.1(@types/react@18.2.57)(react-dom@17.0.2)(react@17.0.2)
+      react-select: 4.3.1(react-dom@17.0.2)(react@17.0.2)
+      sleep-promise: 9.1.0
+    transitivePeerDependencies:
+      - react-dom
+    dev: false
+
+  /react-select-async-paginate@0.5.3(react-dom@18.2.0)(react-select@4.3.1)(react@18.2.0):
+    resolution: {integrity: sha512-SWX1twi/jzViDpQa1nS+xyjrFtn9RBezbL4aIjcJXCABKMY+8JhH4iAKqAW3pryZbm439/DaMtQeZADH17v7bQ==}
+    peerDependencies:
+      react: ^16.14.0 || ^17.0.0
+      react-select: ^2.0.0 || ^3.0.0 || ^4.0.0
+    dependencies:
+      '@babel/runtime': 7.20.6
+      '@seznam/compose-react-refs': 1.0.6
+      react: 18.2.0
+      react-is-mounted-hook: 1.1.2(react-dom@18.2.0)(react@18.2.0)
+      react-select: 4.3.1(@types/react@18.2.60)(react-dom@18.2.0)(react@18.2.0)
       sleep-promise: 9.1.0
     transitivePeerDependencies:
       - react-dom
     dev: false
 
-  /react-select@4.3.1(@types/react@18.2.57)(react-dom@17.0.2)(react@17.0.2):
+  /react-select@4.3.1(@types/react@18.2.60)(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-HBBd0dYwkF5aZk1zP81Wx5UsLIIT2lSvAY2JiJo199LjoLHoivjn9//KsmvQMEFGNhe58xyuOITjfxKCcGc62Q==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0
@@ -35614,7 +37108,26 @@ packages:
     dependencies:
       '@babel/runtime': 7.20.6
       '@emotion/cache': 11.11.0
-      '@emotion/react': 11.11.1(@types/react@18.2.57)(react@17.0.2)
+      '@emotion/react': 11.11.1(@types/react@18.2.60)(react@18.2.0)
+      memoize-one: 5.2.1
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-input-autosize: 3.0.0(react@18.2.0)
+      react-transition-group: 4.4.5(react-dom@18.2.0)(react@18.2.0)
+    transitivePeerDependencies:
+      - '@types/react'
+    dev: false
+
+  /react-select@4.3.1(react-dom@17.0.2)(react@17.0.2):
+    resolution: {integrity: sha512-HBBd0dYwkF5aZk1zP81Wx5UsLIIT2lSvAY2JiJo199LjoLHoivjn9//KsmvQMEFGNhe58xyuOITjfxKCcGc62Q==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0
+      react-dom: ^16.8.0 || ^17.0.0
+    dependencies:
+      '@babel/runtime': 7.20.6
+      '@emotion/cache': 11.11.0
+      '@emotion/react': 11.11.1(react@17.0.2)
       memoize-one: 5.2.1
       prop-types: 15.7.2
       react: 17.0.2
@@ -35632,7 +37145,17 @@ packages:
     dependencies:
       object-assign: 4.1.1
       react: 17.0.2
-      react-is: 16.13.1
+      react-is: 18.2.0
+    dev: false
+
+  /react-shallow-renderer@16.15.0(react@18.2.0):
+    resolution: {integrity: sha512-oScf2FqQ9LFVQgA73vr86xl2NaOIX73rh+YFqcOp68CWj56tSfgtGKrEbyhCj0rSijyG9M1CYprTh39fBi5hzA==}
+    peerDependencies:
+      react: ^16.0.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      object-assign: 4.1.1
+      react: 18.2.0
+      react-is: 18.2.0
 
   /react-share@2.3.1(react@17.0.2):
     resolution: {integrity: sha512-iLUQwCaeVgOkXJxa+8B0iyIIlUajY6BxO9TRb2j8erM+q1ORe0akQZ1gtjEfWYMG4UnGTMU1fOstqes+X0AStw==}
@@ -35649,6 +37172,21 @@ packages:
       - supports-color
     dev: false
 
+  /react-share@2.3.1(react@18.2.0):
+    resolution: {integrity: sha512-iLUQwCaeVgOkXJxa+8B0iyIIlUajY6BxO9TRb2j8erM+q1ORe0akQZ1gtjEfWYMG4UnGTMU1fOstqes+X0AStw==}
+    engines: {node: '>=6.9.0', npm: '>=5.0.0'}
+    peerDependencies:
+      react: ^0.13.0 || ^0.14.0 || ^15.0.0 || ^16.0.0-0
+    dependencies:
+      babel-runtime: 6.26.0
+      classnames: 2.2.6
+      jsonp: 0.2.1
+      prop-types: 15.7.2
+      react: 18.2.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: false
+
   /react-side-effect@2.1.0(react@17.0.2):
     resolution: {integrity: sha512-IgmcegOSi5SNX+2Snh1vqmF0Vg/CbkycU9XZbOHJlZ6kMzTmi3yc254oB1WCkgA7OQtIAoLmcSFuHTc/tlcqXg==}
     peerDependencies:
@@ -35657,6 +37195,14 @@ packages:
       react: 17.0.2
     dev: false
 
+  /react-side-effect@2.1.2(react@18.2.0):
+    resolution: {integrity: sha512-PVjOcvVOyIILrYoyGEpDN3vmYNLdy1CajSFNt4TDsVQC5KpTijDvWVoR+/7Rz2xT978D8/ZtFceXxzsPwZEDvw==}
+    peerDependencies:
+      react: ^16.3.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /react-simple-code-editor@0.7.1(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-AgvT7j7UfFa7b/DRDvFad6Y9/bda8ogXKG2ozElCWbWWj3itu05LS7bmLu63ohjfJDTWbm9Kq0PwIdL7pw3mBg==}
     peerDependencies:
@@ -35667,6 +37213,16 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-simple-code-editor@0.7.1(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-AgvT7j7UfFa7b/DRDvFad6Y9/bda8ogXKG2ozElCWbWWj3itu05LS7bmLu63ohjfJDTWbm9Kq0PwIdL7pw3mBg==}
+    peerDependencies:
+      react: ^16.0.0
+      react-dom: ^16.0.0
+    dependencies:
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-sortable-hoc@2.0.0(prop-types@15.7.2)(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-JZUw7hBsAHXK7PTyErJyI7SopSBFRcFHDjWW5SWjcugY0i6iH7f+eJkY8cJmGMlZ1C9xz1J3Vjz0plFpavVeRg==}
     peerDependencies:
@@ -35681,6 +37237,20 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-sortable-hoc@2.0.0(prop-types@15.7.2)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-JZUw7hBsAHXK7PTyErJyI7SopSBFRcFHDjWW5SWjcugY0i6iH7f+eJkY8cJmGMlZ1C9xz1J3Vjz0plFpavVeRg==}
+    peerDependencies:
+      prop-types: ^15.5.7
+      react: ^16.3.0 || ^17.0.0
+      react-dom: ^16.3.0 || ^17.0.0
+    dependencies:
+      '@babel/runtime': 7.20.6
+      invariant: 2.2.4
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-stately@3.28.0(react@18.2.0):
     resolution: {integrity: sha512-owEHRGS1zRMwtiR/jeXUjUWyqk8oe53wNtedMvg9+8+NNhDKL4/DXHcIp2A13q08v09xYWgVPtnu8fsF53x2PQ==}
     peerDependencies:
@@ -35783,6 +37353,17 @@ packages:
       react-is: 17.0.2
       react-shallow-renderer: 16.15.0(react@17.0.2)
       scheduler: 0.20.2
+    dev: false
+
+  /react-test-renderer@18.2.0(react@18.2.0):
+    resolution: {integrity: sha512-JWD+aQ0lh2gvh4NM3bBM42Kx+XybOxCpgYK7F8ugAlpaTSnWsX+39Z4XkOykGZAHrjwwTZT3x3KxswVWxHPUqA==}
+    peerDependencies:
+      react: ^18.2.0
+    dependencies:
+      react: 18.2.0
+      react-is: 18.2.0
+      react-shallow-renderer: 16.15.0(react@18.2.0)
+      scheduler: 0.23.0
 
   /react-textarea-autosize@8.5.3(react@17.0.2):
     resolution: {integrity: sha512-XT1024o2pqCuZSuBt9FwHlaDeNtVrtCXu0Rnz88t1jUGheCLa3PhjE1GH8Ctm2axEtvdCl5SUHYschyQ0L5QHQ==}
@@ -35812,6 +37393,20 @@ packages:
       react-transition-group: 4.4.5(react-dom@17.0.2)(react@17.0.2)
     dev: false
 
+  /react-toastify@5.4.1(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-24EwkWrj47Id/HGjYfdcntaZpAQ3J5NX31SnGRD66hM/KvPKVJzPiDBPZ+/RZ3SvNkbNWfHpPKFWzenJjC26hg==}
+    peerDependencies:
+      react: '>=15.0.0'
+      react-dom: '>=15.0.0'
+    dependencies:
+      '@babel/runtime': 7.20.6
+      classnames: 2.2.6
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-transition-group: 4.4.5(react-dom@18.2.0)(react@18.2.0)
+    dev: false
+
   /react-transition-group@4.4.5(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==}
     peerDependencies:
@@ -35826,6 +37421,20 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-transition-group@4.4.5(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==}
+    peerDependencies:
+      react: '>=16.6.0'
+      react-dom: '>=16.6.0'
+    dependencies:
+      '@babel/runtime': 7.20.6
+      dom-helpers: 5.2.1
+      loose-envify: 1.4.0
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-virtualized@9.22.3(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-MKovKMxWTcwPSxE1kK1HcheQTWfuCxAuBoSTf2gwyMM21NdX/PXUhnoP8Uc5dRKd+nKm8v41R36OellhdCpkrw==}
     peerDependencies:
@@ -35842,6 +37451,22 @@ packages:
       react-lifecycles-compat: 3.0.4
     dev: false
 
+  /react-virtualized@9.22.3(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-MKovKMxWTcwPSxE1kK1HcheQTWfuCxAuBoSTf2gwyMM21NdX/PXUhnoP8Uc5dRKd+nKm8v41R36OellhdCpkrw==}
+    peerDependencies:
+      react: ^15.3.0 || ^16.0.0-alpha
+      react-dom: ^15.3.0 || ^16.0.0-alpha
+    dependencies:
+      '@babel/runtime': 7.20.6
+      clsx: 1.2.1
+      dom-helpers: 5.2.1
+      loose-envify: 1.4.0
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-lifecycles-compat: 3.0.4
+    dev: false
+
   /react-with-direction@1.4.0(react-dom@17.0.2)(react@17.0.2):
     resolution: {integrity: sha512-ybHNPiAmaJpoWwugwqry9Hd1Irl2hnNXlo/2SXQBwbLn/jGMauMS2y9jw+ydyX5V9ICryCqObNSthNt5R94xpg==}
     peerDependencies:
@@ -35860,6 +37485,24 @@ packages:
       react-dom: 17.0.2(react@17.0.2)
     dev: false
 
+  /react-with-direction@1.4.0(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-ybHNPiAmaJpoWwugwqry9Hd1Irl2hnNXlo/2SXQBwbLn/jGMauMS2y9jw+ydyX5V9ICryCqObNSthNt5R94xpg==}
+    peerDependencies:
+      react: ^0.14 || ^15 || ^16
+      react-dom: ^0.14 || ^15 || ^16
+    dependencies:
+      airbnb-prop-types: 2.16.0(react@18.2.0)
+      brcast: 2.0.2
+      deepmerge: 1.5.2
+      direction: 1.0.4
+      hoist-non-react-statics: 3.3.2
+      object.assign: 4.1.4
+      object.values: 1.1.7
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react-with-styles-interface-css@6.0.0(@babel/runtime@7.20.6)(react-with-styles@4.2.0):
     resolution: {integrity: sha512-6khSG1Trf4L/uXOge/ZAlBnq2O2PEXlQEqAhCRbvzaQU4sksIkdwpCPEl6d+DtP3+IdhyffTWuHDO9lhe1iYvA==}
     peerDependencies:
@@ -35888,13 +37531,21 @@ packages:
       react-with-direction: 1.4.0(react-dom@17.0.2)(react@17.0.2)
     dev: false
 
-  /react@16.14.0:
-    resolution: {integrity: sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==}
-    engines: {node: '>=0.10.0'}
+  /react-with-styles@4.2.0(@babel/runtime@7.20.6)(react-with-direction@1.4.0)(react@18.2.0):
+    resolution: {integrity: sha512-tZCTY27KriRNhwHIbg1NkSdTTOSfXDg6Z7s+Q37mtz0Ym7Sc7IOr3PzVt4qJhJMW6Nkvfi3g34FuhtiGAJCBQA==}
+    peerDependencies:
+      '@babel/runtime': ^7.0.0
+      react: '>=0.14'
+      react-with-direction: ^1.3.1
     dependencies:
-      loose-envify: 1.4.0
-      object-assign: 4.1.1
+      '@babel/runtime': 7.20.6
+      airbnb-prop-types: 2.16.0(react@18.2.0)
+      hoist-non-react-statics: 3.3.2
+      object.assign: 4.1.4
       prop-types: 15.7.2
+      react: 18.2.0
+      react-with-direction: 1.4.0(react-dom@18.2.0)(react@18.2.0)
+    dev: false
 
   /react@17.0.2:
     resolution: {integrity: sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==}
@@ -36096,6 +37747,20 @@ packages:
       symbol-observable: 1.2.0
     dev: false
 
+  /recompose@0.27.1(react@18.2.0):
+    resolution: {integrity: sha512-p7xsyi/rfNjHfdP7vPU02uSFa+Q1eHhjKrvO+3+kRP4Ortj+MxEmpmd+UQtBGM2D2iNAjzNI5rCyBKp9Ob5McA==}
+    peerDependencies:
+      react: ^0.14.0 || ^15.0.0 || ^16.0.0
+    dependencies:
+      babel-runtime: 6.26.0
+      change-emitter: 0.1.6
+      fbjs: 0.8.18
+      hoist-non-react-statics: 2.5.5
+      react: 18.2.0
+      react-lifecycles-compat: 3.0.4
+      symbol-observable: 1.2.0
+    dev: false
+
   /recursive-readdir@2.2.2:
     resolution: {integrity: sha512-nRCcW9Sj7NuZwa2XvH9co8NPeXUBhZP7CRKJtU+cS6PW9FpCIFoI5ib0NT1ZrbNuPoRy0ylyCaUL8Gih4LSyFg==}
     engines: {node: '>=0.10.0'}
@@ -36154,6 +37819,10 @@ packages:
     resolution: {integrity: sha512-+CNMnI8QhgVMtAt54uQs3kUxC3Sybpa7Y63HR14uGLgI9/QR5ggHvpxwhGGe3wmx5V91YwqQIblN9k5lspAmGw==}
     dev: false
 
+  /reduce-reducers@1.0.4:
+    resolution: {integrity: sha512-Mb2WZ2bJF597exiqX7owBzrqJ74DHLK3yOQjCyPAaNifRncE8OD0wFIuoMhXxTnHK07+8zZ2SJEKy/qtiyR7vw==}
+    dev: false
+
   /redux-actions@2.6.5:
     resolution: {integrity: sha512-pFhEcWFTYNk7DhQgxMGnbsB1H2glqhQJRQrtPb96kD3hWiZRzXHwwmFPswg6V2MjraXRXWNmuP9P84tvdLAJmw==}
     dependencies:
@@ -36164,6 +37833,13 @@ packages:
       to-camel-case: 1.0.0
     dev: false
 
+  /redux-actions@3.0.0:
+    resolution: {integrity: sha512-5r+G8JizsTfyfWolVDkCLL2SpZA0Sk9ao2MXwfdXkG5+72s0PcO9qEqpo51D2o8dZY2gXLjNmY5yoRB+BuizRw==}
+    dependencies:
+      just-curry-it: 5.3.0
+      reduce-reducers: 1.0.4
+    dev: false
+
   /redux-connect@10.0.0(prop-types@15.7.2)(react-redux@7.2.4)(react-router-config@5.1.1)(react-router-dom@5.2.0)(react-router@5.2.0)(react@17.0.2)(redux-actions@2.6.5):
     resolution: {integrity: sha512-lLyIuXKRLSXvdpOBEhNDsBwsf2NApEsvpxKQ+oGhL8jL0W9xzkqv35zcRTiPAAPreHQa1imY8OqpZ6h9nMoU5w==}
     peerDependencies:
@@ -36184,6 +37860,26 @@ packages:
       redux-actions: 2.6.5
     dev: false
 
+  /redux-connect@10.0.0(prop-types@15.7.2)(react-redux@8.1.2)(react-router-config@5.1.1)(react-router-dom@5.2.0)(react-router@5.2.0)(react@18.2.0)(redux-actions@3.0.0):
+    resolution: {integrity: sha512-lLyIuXKRLSXvdpOBEhNDsBwsf2NApEsvpxKQ+oGhL8jL0W9xzkqv35zcRTiPAAPreHQa1imY8OqpZ6h9nMoU5w==}
+    peerDependencies:
+      prop-types: 15.x.x
+      react: ^16.8.4
+      react-redux: 7.x.x
+      react-router: 5.x.x
+      react-router-config: 5.x.x
+      react-router-dom: 5.x.x
+      redux-actions: 2.x.x
+    dependencies:
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-redux: 8.1.2(@types/react-dom@18.2.19)(@types/react@18.2.60)(react-dom@18.2.0)(react@18.2.0)(redux@4.2.1)
+      react-router: 5.2.0(react@18.2.0)
+      react-router-config: 5.1.1(react-router@5.2.0)(react@18.2.0)
+      react-router-dom: 5.2.0(react@18.2.0)
+      redux-actions: 3.0.0
+    dev: false
+
   /redux-devtools-extension@2.13.8(redux@4.1.0):
     resolution: {integrity: sha512-8qlpooP2QqPtZHQZRhx3x3OP5skEV1py/zUdMY28WNAocbafxdG2tRD1MWE7sp8obGMNYuLWanhhQ7EQvT1FBg==}
     deprecated: Package moved to @redux-devtools/extension.
@@ -36193,12 +37889,27 @@ packages:
       redux: 4.1.0
     dev: false
 
+  /redux-devtools-extension@2.13.9(redux@4.2.1):
+    resolution: {integrity: sha512-cNJ8Q/EtjhQaZ71c8I9+BPySIBVEKssbPpskBfsXqb8HJ002A3KRVHfeRzwRo6mGPqsm7XuHTqNSNeS1Khig0A==}
+    deprecated: Package moved to @redux-devtools/extension.
+    peerDependencies:
+      redux: ^3.1.0 || ^4.0.0
+    dependencies:
+      redux: 4.2.1
+    dev: false
+
   /redux-localstorage-simple@2.3.1:
     resolution: {integrity: sha512-lxzFtkjJMn5Oyi46OpcjtVjwsBJL6/5TWE9YJwSpt+bhJSQ6dlGedydFk2us84h3W9sWrhQ0RO9G3yJlJ2waaw==}
     dependencies:
       object-merge: 2.5.1
     dev: false
 
+  /redux-localstorage-simple@2.5.1:
+    resolution: {integrity: sha512-8HbqBzHoZ4nfL8qyELt4hLd9hNmESCvmXTEBk2mGT23lX8/miJbXz4ZGIF7Eoa1UHikjv+bne3pjC95ub737vA==}
+    dependencies:
+      merge: 2.1.1
+    dev: false
+
   /redux-mock-store@1.5.4:
     resolution: {integrity: sha512-xmcA0O/tjCLXhh9Fuiq6pMrJCwFRaouA8436zcikdIpYWWCjU76CRk+i2bHx8EeiSiMGnB85/lZdU3wIJVXHTA==}
     dependencies:
@@ -36213,11 +37924,25 @@ packages:
       redux: 4.1.0
     dev: false
 
+  /redux-thunk@2.4.2(redux@4.2.1):
+    resolution: {integrity: sha512-+P3TjtnP0k/FEjcBL5FZpoovtvrTNT/UXd4/sluaSyrURlSlhLSzEdfsTBW7WsKB6yPvgd7q/iZPICFjW4o57Q==}
+    peerDependencies:
+      redux: ^4
+    dependencies:
+      redux: 4.2.1
+    dev: false
+
   /redux@4.1.0:
     resolution: {integrity: sha512-uI2dQN43zqLWCt6B/BMGRMY6db7TTY4qeHHfGeKb3EOhmOKjU3KdWvNLJyqaHRksv/ErdNH7cFZWg9jXtewy4g==}
     dependencies:
       '@babel/runtime': 7.20.6
 
+  /redux@4.2.1:
+    resolution: {integrity: sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w==}
+    dependencies:
+      '@babel/runtime': 7.20.6
+    dev: false
+
   /reflect.getprototypeof@1.0.4:
     resolution: {integrity: sha512-ECkTw8TmJwW60lOTR+ZkODISW6RQ8+2CL3COqtiJKLd6MmB45hN51HprHFziKLGkAuTGQhBb91V8cy+KHlaCjw==}
     engines: {node: '>= 0.4'}
@@ -37085,7 +38810,7 @@ packages:
       neo-async: 2.6.2
       sass: 1.69.5
       schema-utils: 3.3.0
-      semver: 7.6.0
+      semver: 7.5.4
       webpack: 5.90.1
     dev: false
 
@@ -37220,31 +38945,54 @@ packages:
       prop-types: 15.7.2
       react: 17.0.2
       react-dom: 17.0.2(react@17.0.2)
-      react-is: 16.13.1
+      react-is: 17.0.2
       react-popper: 2.3.0(@popperjs/core@2.11.8)(react-dom@17.0.2)(react@17.0.2)
       shallowequal: 1.1.0
     dev: false
 
-  /semantic-ui-react@2.1.5(react-dom@17.0.2)(react@17.0.2):
+  /semantic-ui-react@2.0.3(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-a0hGN6XXw64sRSKwWqMCKSI/AGLohxNeWuErS39eswvBbUnLjBij8ZoEdiqDiz/PuWpwYIRjgmQVrut+7h3b2g==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0
+      react-dom: ^16.8.0 || ^17.0.0
+    dependencies:
+      '@babel/runtime': 7.20.6
+      '@fluentui/react-component-event-listener': 0.51.7(react-dom@18.2.0)(react@18.2.0)
+      '@fluentui/react-component-ref': 0.51.7(react-dom@18.2.0)(react@18.2.0)
+      '@popperjs/core': 2.11.8
+      '@semantic-ui-react/event-stack': 3.1.3(react-dom@18.2.0)(react@18.2.0)
+      clsx: 1.2.1
+      keyboard-key: 1.1.0
+      lodash: 4.17.21
+      lodash-es: 4.17.21
+      prop-types: 15.7.2
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-is: 17.0.2
+      react-popper: 2.3.0(@popperjs/core@2.11.8)(react-dom@18.2.0)(react@18.2.0)
+      shallowequal: 1.1.0
+    dev: false
+
+  /semantic-ui-react@2.1.5(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-nIqmmUNpFHfovEb+RI2w3E2/maZQutd8UIWyRjf1SLse+XF51hI559xbz/sLN3O6RpLjr/echLOOXwKCirPy3Q==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
     dependencies:
       '@babel/runtime': 7.20.6
-      '@fluentui/react-component-event-listener': 0.63.1(react-dom@17.0.2)(react@17.0.2)
-      '@fluentui/react-component-ref': 0.63.1(react-dom@17.0.2)(react@17.0.2)
+      '@fluentui/react-component-event-listener': 0.63.1(react-dom@18.2.0)(react@18.2.0)
+      '@fluentui/react-component-ref': 0.63.1(react-dom@18.2.0)(react@18.2.0)
       '@popperjs/core': 2.11.8
-      '@semantic-ui-react/event-stack': 3.1.3(react-dom@17.0.2)(react@17.0.2)
+      '@semantic-ui-react/event-stack': 3.1.3(react-dom@18.2.0)(react@18.2.0)
       clsx: 1.2.1
       keyboard-key: 1.1.0
       lodash: 4.17.21
       lodash-es: 4.17.21
       prop-types: 15.7.2
-      react: 17.0.2
-      react-dom: 17.0.2(react@17.0.2)
-      react-is: 16.13.1
-      react-popper: 2.3.0(@popperjs/core@2.11.8)(react-dom@17.0.2)(react@17.0.2)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      react-is: 18.2.0
+      react-popper: 2.3.0(@popperjs/core@2.11.8)(react-dom@18.2.0)(react@18.2.0)
       shallowequal: 1.1.0
     dev: false
 
@@ -37263,7 +39011,7 @@ packages:
     resolution: {integrity: sha512-0Ju4+6A8iOnpL/Thra7dZsSlOHYAHIeMxfhWQRI1/VLcT3WDBZKKtQt/QkBOsiIN9ZpuvHE6cGZ0x4glCMmfiA==}
     engines: {node: '>=12'}
     dependencies:
-      semver: 7.6.0
+      semver: 7.5.4
     dev: true
 
   /semver@5.7.2:
@@ -37557,7 +39305,7 @@ packages:
     resolution: {integrity: sha512-a2B9Y0KlNXl9u/vsW6sTIu9vGEpfKu2wRV6l1H3XEas/0gUIzGzBoP/IouTcUQbm9JWZLH3COxyn03TYlFax6w==}
     engines: {node: '>=10'}
     dependencies:
-      semver: 7.6.0
+      semver: 7.5.4
     dev: true
 
   /sinon@10.0.1:
@@ -37644,6 +39392,27 @@ packages:
       tiny-invariant: 1.0.6
     dev: false
 
+  /slate-react@0.98.4(react-dom@18.2.0)(react@18.2.0)(slate@0.100.0):
+    resolution: {integrity: sha512-8Of3v9hFuX8rIRc86LuuBhU9t8ps+9ARKL4yyhCrKQYZ93Ep/LFA3GvPGvtf3zYuVadZ8tkhRH8tbHOGNAndLw==}
+    peerDependencies:
+      react: '>=16.8.0'
+      react-dom: '>=16.8.0'
+      slate: '>=0.65.3'
+    dependencies:
+      '@juggle/resize-observer': 3.4.0
+      '@types/is-hotkey': 0.1.9
+      '@types/lodash': 4.14.201
+      direction: 1.0.4
+      is-hotkey: 0.1.8
+      is-plain-object: 5.0.0
+      lodash: 4.17.21
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      scroll-into-view-if-needed: 2.2.31
+      slate: 0.100.0
+      tiny-invariant: 1.0.6
+    dev: false
+
   /slate@0.100.0:
     resolution: {integrity: sha512-cK+xwLBrbQof4rEfTzgC8loBWsDFEXq8nOBY7QahwY59Zq4bsBNcwiMw2VIzTv+WGNsmyHp4eAk/HJbz2aAUkQ==}
     dependencies:
@@ -37829,6 +39598,7 @@ packages:
     dependencies:
       atob: 2.1.2
       decode-uri-component: 0.2.2
+    dev: false
 
   /source-map-support@0.5.21:
     resolution: {integrity: sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==}
@@ -38045,6 +39815,7 @@ packages:
 
   /std-env@3.7.0:
     resolution: {integrity: sha512-JPbdCEQLj1w5GilpiHAx3qJvFndqybBysA3qUOnznweH4QbNYUsW/ea8QzSrnh0vNsezMMw5bcVool8lM0gwzg==}
+    dev: false
 
   /stdin-discarder@0.1.0:
     resolution: {integrity: sha512-xhV7w8S+bUwlPTb4bAOUQhv8/cSS5offJuX8GQGq32ONF0ZtDWKfkdomM3HMRA+LhX6um/FZ0COqlwsjD53LeQ==}
@@ -38102,8 +39873,8 @@ packages:
     engines: {node: '>=10.0.0'}
     dev: false
 
-  /streamx@2.15.8:
-    resolution: {integrity: sha512-6pwMeMY/SuISiRsuS8TeIrAzyFbG5gGPHFQsYjUr/pbBadaL1PCWmzKw+CHZSwainfvcF6Si6cVLq4XTEwswFQ==}
+  /streamx@2.16.1:
+    resolution: {integrity: sha512-m9QYj6WygWyWa3H1YY69amr4nVgy61xfjys7xO7kviL5rfIEc2naf+ewFiOA+aEJD7y0JO3h2GoiUv4TDwEGzQ==}
     dependencies:
       fast-fifo: 1.3.2
       queue-tick: 1.0.1
@@ -38930,7 +40701,7 @@ packages:
     dependencies:
       b4a: 1.6.6
       fast-fifo: 1.3.2
-      streamx: 2.15.8
+      streamx: 2.16.1
     dev: false
 
   /tar@6.2.0:
@@ -39049,7 +40820,7 @@ packages:
       schema-utils: 3.3.0
       serialize-javascript: 5.0.1
       source-map: 0.6.1
-      terser: 5.27.0
+      terser: 5.24.0
       webpack: 5.90.1
       webpack-sources: 1.4.3
     transitivePeerDependencies:
@@ -39076,7 +40847,7 @@ packages:
       jest-worker: 27.5.1
       schema-utils: 3.3.0
       serialize-javascript: 6.0.1
-      terser: 5.27.0
+      terser: 5.28.1
       webpack: 5.90.1
 
   /terser-webpack-plugin@5.3.6(webpack@5.90.1):
@@ -39099,9 +40870,8 @@ packages:
       jest-worker: 27.5.1
       schema-utils: 3.3.0
       serialize-javascript: 6.0.1
-      terser: 5.27.0
+      terser: 5.24.0
       webpack: 5.90.1
-    dev: false
 
   /terser@4.8.1:
     resolution: {integrity: sha512-4GnLC0x667eJG0ewJTa6z/yXrbLGv80D9Ru6HIpCQmO+Q4PfEtBFi0ObSckqwL6VyQv/7ENJieXHo2ANmdQwgw==}
@@ -39113,8 +40883,18 @@ packages:
       source-map: 0.6.1
       source-map-support: 0.5.21
 
-  /terser@5.27.0:
-    resolution: {integrity: sha512-bi1HRwVRskAjheeYl291n3JC4GgO/Ty4z1nVs5AAsmonJulGxpSektecnNedrwK9C7vpvVtcX3cw00VSLt7U2A==}
+  /terser@5.24.0:
+    resolution: {integrity: sha512-ZpGR4Hy3+wBEzVEnHvstMvqpD/nABNelQn/z2r0fjVWGQsN3bpOLzQlqDxmb4CDZnXq5lpjnQ+mHQLAOpfM5iw==}
+    engines: {node: '>=10'}
+    hasBin: true
+    dependencies:
+      '@jridgewell/source-map': 0.3.5
+      acorn: 8.11.2
+      commander: 2.20.3
+      source-map-support: 0.5.21
+
+  /terser@5.28.1:
+    resolution: {integrity: sha512-wM+bZp54v/E9eRRGXb5ZFDvinrJIOaTapx3WUokyVGZu5ucVCK55zEgGd5Dl2fSr3jUo5sDiERErUWLY6QPFyA==}
     engines: {node: '>=10'}
     hasBin: true
     dependencies:
@@ -39797,6 +41577,10 @@ packages:
   /ufo@1.3.2:
     resolution: {integrity: sha512-o+ORpgGwaYQXgqGDwd+hkS4PuZ3QnmqMMxRuajK/a38L6fTpcE5GPIfrf+L/KemFzfUpeUQc1rRS1iDBozvnFA==}
 
+  /ufo@1.4.0:
+    resolution: {integrity: sha512-Hhy+BhRBleFjpJ2vchUNN40qgkh0366FWJGqVLYBHev0vpHTrXSA0ryT+74UiW6KWsldNurQMKGqCm1M2zBciQ==}
+    dev: false
+
   /uglify-js@3.17.4:
     resolution: {integrity: sha512-T9q82TJI9e/C1TAxYvfb16xO120tMVFZrGA3f9/P4424DNu6ypK103y0GPFVa17yotwSyZW5iYXgjYHkGrJW/g==}
     engines: {node: '>=0.8.0'}
@@ -39850,7 +41634,7 @@ packages:
       defu: 6.1.3
       mime: 3.0.0
       node-fetch-native: 1.6.2
-      pathe: 1.1.2
+      pathe: 1.1.1
     dev: false
 
   /unfetch@4.2.0:
@@ -39922,7 +41706,7 @@ packages:
       local-pkg: 0.5.0
       magic-string: 0.30.5
       mlly: 1.4.2
-      pathe: 1.1.2
+      pathe: 1.1.1
       pkg-types: 1.0.3
       scule: 1.3.0
       strip-literal: 1.3.0
@@ -40131,7 +41915,7 @@ packages:
   /unplugin@1.5.1:
     resolution: {integrity: sha512-0QkvG13z6RD+1L1FoibQqnvTwVBXvS4XSPwAyinVgoOCl2jAgwzdUKmEj05o4Lt8xwQI85Hb6mSyYkcAGwZPew==}
     dependencies:
-      acorn: 8.11.3
+      acorn: 8.11.2
       chokidar: 3.5.3
       webpack-sources: 3.2.3
       webpack-virtual-modules: 0.6.1
@@ -40189,10 +41973,10 @@ packages:
     dependencies:
       anymatch: 3.1.3
       chokidar: 3.5.3
-      destr: 2.0.2
+      destr: 2.0.3
       h3: 1.10.1
       ioredis: 5.3.2
-      listhen: 1.6.0
+      listhen: 1.7.2
       lru-cache: 10.0.2
       mri: 1.2.0
       node-fetch-native: 1.4.1
@@ -40200,6 +41984,7 @@ packages:
       ufo: 1.3.2
     transitivePeerDependencies:
       - supports-color
+      - uWebSockets.js
     dev: false
 
   /untildify@2.1.0:
@@ -40279,7 +42064,7 @@ packages:
       is-yarn-global: 0.4.1
       latest-version: 7.0.0
       pupa: 3.1.0
-      semver: 7.6.0
+      semver: 7.5.4
       semver-diff: 4.0.0
       xdg-basedir: 5.1.0
     dev: true
@@ -40297,7 +42082,7 @@ packages:
       is-npm: 6.0.0
       latest-version: 7.0.0
       pupa: 3.1.0
-      semver: 7.6.0
+      semver: 7.5.4
       semver-diff: 4.0.0
       xdg-basedir: 5.1.0
     dev: true
@@ -40411,6 +42196,17 @@ packages:
       react: 17.0.2
     dev: false
 
+  /use-deep-compare-effect@1.8.1(react@18.2.0):
+    resolution: {integrity: sha512-kbeNVZ9Zkc0RFGpfMN3MNfaKNvcLNyxOAAd9O4CBZ+kCBXXscn9s/4I+8ytUER4RDpEYs5+O6Rs4PqiZ+rHr5Q==}
+    engines: {node: '>=10', npm: '>=6'}
+    peerDependencies:
+      react: '>=16.13'
+    dependencies:
+      '@babel/runtime': 7.20.6
+      dequal: 2.0.3
+      react: 18.2.0
+    dev: false
+
   /use-isomorphic-layout-effect@1.1.2(react@17.0.2):
     resolution: {integrity: sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==}
     peerDependencies:
@@ -40444,6 +42240,14 @@ packages:
       react: 17.0.2
     dev: false
 
+  /use-memo-one@1.1.3(react@18.2.0):
+    resolution: {integrity: sha512-g66/K7ZQGYrI6dy8GLpVcMsBp4s17xNkYJVSMvTEevGy3nDxHOfE6z8BVE22+5G5x7t3+bhzrlTDB7ObrEE0cQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /use-resize-observer@9.1.0(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-R25VqO9Wb3asSD4eqtcxk8sJalvIOYBqS8MNZlpDSQ4l4xMQxC/J7Id9HoTqPq8FwULIn0PVW+OAqF2dyYbjow==}
     peerDependencies:
@@ -40658,7 +42462,7 @@ packages:
       vfile-message: 3.1.4
     dev: true
 
-  /vinxi@0.2.1(preact@10.19.4):
+  /vinxi@0.2.1(preact@10.19.6):
     resolution: {integrity: sha512-zrgFO2XuKpdoW5VwlbieeQ0YhzMuuYCJyFWFyj41h9BnymHZ5dnKElALvFQn5JVzHhyrsdmlm8GU7tIuH786hw==}
     hasBin: true
     dependencies:
@@ -40668,10 +42472,10 @@ packages:
       '@types/micromatch': 4.0.6
       '@types/serve-static': 1.15.5
       '@types/ws': 8.5.9
-      '@vinxi/devtools': 0.2.0(@babel/core@7.23.9)(preact@10.19.4)(vite@4.5.0)
+      '@vinxi/devtools': 0.2.0(@babel/core@7.23.9)(preact@10.19.6)(vite@4.5.0)
       '@vinxi/listhen': 1.5.6
       boxen: 7.1.1
-      c12: 1.8.0
+      c12: 1.9.0
       chokidar: 3.5.3
       citty: 0.1.6
       consola: 3.2.3
@@ -40735,6 +42539,7 @@ packages:
       - sugarss
       - supports-color
       - terser
+      - uWebSockets.js
       - utf-8-validate
       - xml2js
     dev: false
@@ -40768,11 +42573,11 @@ packages:
       cac: 6.7.14
       debug: 4.3.4(supports-color@8.1.1)
       mlly: 1.4.2
-      pathe: 1.1.2
+      pathe: 1.1.1
       picocolors: 1.0.0
       source-map: 0.6.1
       source-map-support: 0.5.21
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
     transitivePeerDependencies:
       - '@types/node'
       - less
@@ -40784,7 +42589,7 @@ packages:
       - terser
     dev: true
 
-  /vite-node@0.34.6(@types/node@20.9.0):
+  /vite-node@0.34.6(@types/node@20.9.0)(lightningcss@1.24.0):
     resolution: {integrity: sha512-nlBMJ9x6n7/Amaz6F3zJ97EBwR2FkzhBRxF5e+jE6LA3yi6Wtc2lyTij1OnDMIr34v5g/tVQtsVAzhT0jc5ygA==}
     engines: {node: '>=v14.18.0'}
     hasBin: true
@@ -40794,29 +42599,7 @@ packages:
       mlly: 1.4.2
       pathe: 1.1.1
       picocolors: 1.0.0
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
-    transitivePeerDependencies:
-      - '@types/node'
-      - less
-      - lightningcss
-      - sass
-      - stylus
-      - sugarss
-      - supports-color
-      - terser
-    dev: true
-
-  /vite-node@0.34.6(@types/node@20.9.0)(lightningcss@1.23.0):
-    resolution: {integrity: sha512-nlBMJ9x6n7/Amaz6F3zJ97EBwR2FkzhBRxF5e+jE6LA3yi6Wtc2lyTij1OnDMIr34v5g/tVQtsVAzhT0jc5ygA==}
-    engines: {node: '>=v14.18.0'}
-    hasBin: true
-    dependencies:
-      cac: 6.7.14
-      debug: 4.3.4(supports-color@8.1.1)
-      mlly: 1.5.0
-      pathe: 1.1.2
-      picocolors: 1.0.0
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
     transitivePeerDependencies:
       - '@types/node'
       - less
@@ -40835,7 +42618,7 @@ packages:
     dependencies:
       cac: 6.7.14
       debug: 4.3.4(supports-color@8.1.1)
-      pathe: 1.1.2
+      pathe: 1.1.1
       picocolors: 1.0.0
       vite: 5.1.4
     transitivePeerDependencies:
@@ -40875,7 +42658,7 @@ packages:
       debug: 4.3.4(supports-color@8.1.1)
       kolorist: 1.8.0
       typescript: 5.2.2
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
       vue-tsc: 1.8.24(typescript@5.2.2)
     transitivePeerDependencies:
       - '@types/node'
@@ -40964,7 +42747,7 @@ packages:
       fsevents: 2.3.3
     dev: false
 
-  /vite@4.5.1(@types/node@20.9.0)(lightningcss@1.23.0):
+  /vite@4.5.1(@types/node@20.9.0)(lightningcss@1.24.0):
     resolution: {integrity: sha512-AXXFaAJ8yebyqzoNB9fu2pHoo/nWX+xZlaRwoeYUxEqBO+Zj4msE5G+BhGBll9lYEKv9Hfks52PAF2X7qDYXQA==}
     engines: {node: ^14.18.0 || >=16.0.0}
     hasBin: true
@@ -40994,7 +42777,7 @@ packages:
     dependencies:
       '@types/node': 20.9.0
       esbuild: 0.18.20
-      lightningcss: 1.23.0
+      lightningcss: 1.24.0
       postcss: 8.4.31
       rollup: 3.29.4
     optionalDependencies:
@@ -41058,7 +42841,7 @@ packages:
       dom-accessibility-api: 0.5.16
       lodash-es: 4.17.21
       redent: 3.0.0
-      vitest: 0.34.6(jsdom@22.1.0)(lightningcss@1.23.0)
+      vitest: 0.34.6(jsdom@22.1.0)(lightningcss@1.24.0)
     dev: true
 
   /vitest@0.28.5(jsdom@21.1.2):
@@ -41105,7 +42888,7 @@ packages:
       tinybench: 2.5.1
       tinypool: 0.3.1
       tinyspy: 1.1.1
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
       vite-node: 0.28.5(@types/node@20.9.0)
       why-is-node-running: 2.2.2
     transitivePeerDependencies:
@@ -41171,8 +42954,8 @@ packages:
       strip-literal: 1.3.0
       tinybench: 2.5.1
       tinypool: 0.7.0
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
-      vite-node: 0.34.6(@types/node@20.9.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
+      vite-node: 0.34.6(@types/node@20.9.0)(lightningcss@1.24.0)
       why-is-node-running: 2.2.2
     transitivePeerDependencies:
       - less
@@ -41184,7 +42967,7 @@ packages:
       - terser
     dev: true
 
-  /vitest@0.34.6(jsdom@22.1.0)(lightningcss@1.23.0):
+  /vitest@0.34.6(jsdom@22.1.0)(lightningcss@1.24.0):
     resolution: {integrity: sha512-+5CALsOvbNKnS+ZHMXtuUC7nL8/7F1F2DnHGjSsszX8zCjWSSviphCb/NuS9Nzf4Q03KyyDRBAXhF/8lffME4Q==}
     engines: {node: '>=v14.18.0'}
     hasBin: true
@@ -41237,8 +43020,8 @@ packages:
       strip-literal: 1.3.0
       tinybench: 2.5.1
       tinypool: 0.7.0
-      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.23.0)
-      vite-node: 0.34.6(@types/node@20.9.0)(lightningcss@1.23.0)
+      vite: 4.5.1(@types/node@20.9.0)(lightningcss@1.24.0)
+      vite-node: 0.34.6(@types/node@20.9.0)(lightningcss@1.24.0)
       why-is-node-running: 2.2.2
     transitivePeerDependencies:
       - less
@@ -41286,9 +43069,9 @@ packages:
       execa: 8.0.1
       local-pkg: 0.5.0
       magic-string: 0.30.5
-      pathe: 1.1.2
+      pathe: 1.1.1
       picocolors: 1.0.0
-      std-env: 3.7.0
+      std-env: 3.5.0
       strip-literal: 2.0.0
       tinybench: 2.5.1
       tinypool: 0.8.2
@@ -41320,7 +43103,7 @@ packages:
     dependencies:
       '@volar/typescript': 1.11.1
       '@vue/language-core': 1.8.24(typescript@5.2.2)
-      semver: 7.6.0
+      semver: 7.5.4
       typescript: 5.2.2
     dev: true
 
@@ -41647,7 +43430,7 @@ packages:
       '@webassemblyjs/wasm-parser': 1.11.6
       acorn: 8.11.2
       acorn-import-assertions: 1.9.0(acorn@8.11.2)
-      browserslist: 4.22.1
+      browserslist: 4.23.0
       chrome-trace-event: 1.0.3
       enhanced-resolve: 5.15.0
       es-module-lexer: 1.4.1
@@ -42307,12 +44090,12 @@ packages:
       commander: 9.5.0
     dev: true
 
-  /zip-stream@5.0.1:
-    resolution: {integrity: sha512-UfZ0oa0C8LI58wJ+moL46BDIMgCQbnsb+2PoiJYtonhBsMh2bq1eRBVkvjfVsqbEHd9/EgKPUuL9saSSsec8OA==}
+  /zip-stream@5.0.2:
+    resolution: {integrity: sha512-LfOdrUvPB8ZoXtvOBz6DlNClfvi//b5d56mSWyJi7XbH/HfhOHfUhOqxhT/rUiR7yiktlunqRo+jY6y/cWC/5g==}
     engines: {node: '>= 12.0.0'}
     dependencies:
       archiver-utils: 4.0.1
-      compress-commons: 5.0.1
+      compress-commons: 5.0.3
       readable-stream: 3.6.2
     dev: false