diff --git a/.changeset/forty-gifts-attack.md b/.changeset/forty-gifts-attack.md
new file mode 100644
index 0000000..b168939
--- /dev/null
+++ b/.changeset/forty-gifts-attack.md
@@ -0,0 +1,6 @@
+---
+'@itwin/itwinui-layouts-css': minor
+'@itwin/itwinui-layouts-react': minor
+---
+
+Added support for `@itwin/itwinui-react` v3 and removed dependency on `@itwin/itwinui-variables`.
diff --git a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-1366x768.png b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-1366x768.png
index 8212e63..34616e0 100755
Binary files a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-1366x768.png and b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-1366x768.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-1920x1080.png b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-1920x1080.png
index 4fa8ef7..2f97df9 100755
Binary files a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-1920x1080.png and b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-1920x1080.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-3440x1440.png b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-3440x1440.png
index f177c94..53a789f 100755
Binary files a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-3440x1440.png and b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-3440x1440.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-360x640.png b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-360x640.png
index 2f1f170..3b44b61 100755
Binary files a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-360x640.png and b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-360x640.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-3840x2160.png b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-3840x2160.png
index b6a1a7c..0ebc065 100755
Binary files a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-3840x2160.png and b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-3840x2160.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-640x360.png b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-640x360.png
index d59f898..951d865 100755
Binary files a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-640x360.png and b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-640x360.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-820x1024.png b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-820x1024.png
index 36d248f..10f55d0 100755
Binary files a/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-820x1024.png and b/demo/cypress-visual-screenshots/baseline/FluidGridDemo.spec.tsx-basic-820x1024.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-1366x768.png b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-1366x768.png
index 8e22221..5e06795 100755
Binary files a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-1366x768.png and b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-1366x768.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-1920x1080.png b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-1920x1080.png
index b6306d9..7f72aa9 100755
Binary files a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-1920x1080.png and b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-1920x1080.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-3440x1440.png b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-3440x1440.png
index f8b8626..89d0e07 100755
Binary files a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-3440x1440.png and b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-3440x1440.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-360x640.png b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-360x640.png
index dc01578..c08246d 100755
Binary files a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-360x640.png and b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-360x640.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-3840x2160.png b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-3840x2160.png
index 29031c7..1192a95 100755
Binary files a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-3840x2160.png and b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-3840x2160.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-640x360.png b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-640x360.png
index 9f3e909..f951457 100755
Binary files a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-640x360.png and b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-640x360.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-820x1024.png b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-820x1024.png
index e9ff470..1d65d75 100755
Binary files a/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-820x1024.png and b/demo/cypress-visual-screenshots/baseline/GridDemo.spec.tsx-basic-820x1024.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-1366x768.png b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-1366x768.png
index 05b466f..bbad72a 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-1366x768.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-1366x768.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-1920x1080.png b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-1920x1080.png
index 9ff19e4..0e5bda2 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-1920x1080.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-1920x1080.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-3440x1440.png b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-3440x1440.png
index b60a8cb..609d880 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-3440x1440.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-3440x1440.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-360x640.png b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-360x640.png
index 5543a04..60af04a 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-360x640.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-360x640.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-3840x2160.png b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-3840x2160.png
index ef82e66..1ab4486 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-3840x2160.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-3840x2160.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-640x360.png b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-640x360.png
index ca0b62f..e7da897 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-640x360.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-640x360.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-820x1024.png b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-820x1024.png
index 39b9d10..fa63155 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-820x1024.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutDemo.spec.tsx-basic-820x1024.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-1366x768.png b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-1366x768.png
index c2ff1c6..6417bbd 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-1366x768.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-1366x768.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-1920x1080.png b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-1920x1080.png
index 78e4ff7..6b38063 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-1920x1080.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-1920x1080.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-3440x1440.png b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-3440x1440.png
index 6520b67..6a1e206 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-3440x1440.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-3440x1440.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-360x640.png b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-360x640.png
index 9b5a006..860b0dc 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-360x640.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-360x640.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-3840x2160.png b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-3840x2160.png
index 546ba8a..aa22f48 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-3840x2160.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-3840x2160.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-640x360.png b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-640x360.png
index fbfc1ba..9487699 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-640x360.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-640x360.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-820x1024.png b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-820x1024.png
index 349728a..9147df4 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-820x1024.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutPaddedDemo.spec.tsx-basic-820x1024.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-1366x768.png b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-1366x768.png
index 7a2f0e7..7f815e9 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-1366x768.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-1366x768.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-1920x1080.png b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-1920x1080.png
index 41c2ded..55dced1 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-1920x1080.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-1920x1080.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-3440x1440.png b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-3440x1440.png
index 6f7bca2..150c4e5 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-3440x1440.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-3440x1440.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-360x640.png b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-360x640.png
index 4714e74..9a3fca2 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-360x640.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-360x640.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-3840x2160.png b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-3840x2160.png
index 464a7ec..ef4437b 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-3840x2160.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-3840x2160.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-640x360.png b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-640x360.png
index 1cafe2e..c923867 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-640x360.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-640x360.png differ
diff --git a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-820x1024.png b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-820x1024.png
index 428a1cd..55ef970 100755
Binary files a/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-820x1024.png and b/demo/cypress-visual-screenshots/baseline/PageLayoutStickyBarDemo.spec.tsx-basic-820x1024.png differ
diff --git a/demo/package.json b/demo/package.json
index f3921bf..73dfea9 100644
--- a/demo/package.json
+++ b/demo/package.json
@@ -35,7 +35,7 @@
     "@itwin/itwinui-icons-react": "^1.7.0",
     "@itwin/itwinui-layouts-css": "workspace:*",
     "@itwin/itwinui-layouts-react": "workspace:*",
-    "@itwin/itwinui-react": "^2.0.0",
+    "@itwin/itwinui-react": "^3.0.0",
     "prism-react-renderer": "^1.3.3",
     "react-router-dom": "6",
     "vite-plugin-svgr": "^1.0.1"
diff --git a/demo/src/App.scss b/demo/src/App.scss
index d0e949b..6c14333 100644
--- a/demo/src/App.scss
+++ b/demo/src/App.scss
@@ -2,7 +2,6 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-@import '@itwin/itwinui-variables';
 
 .app {
   padding: var(--iui-size-l) unquote('max(var(--iui-size-l), var(--iui-size-l) + env(safe-area-inset-right))') var(--iui-size-l) unquote('max(var(--iui-size-l), var(--iui-size-l) + env(safe-area-inset-left))');
diff --git a/demo/src/common/CodeSample.scss b/demo/src/common/CodeSample.scss
index 230c933..bf4f532 100644
--- a/demo/src/common/CodeSample.scss
+++ b/demo/src/common/CodeSample.scss
@@ -2,7 +2,6 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-@import '@itwin/itwinui-variables';
 
 .code-sample {
   text-align: left;
diff --git a/demo/src/common/DemoHeader.tsx b/demo/src/common/DemoHeader.tsx
index b5fb06f..04be3d8 100644
--- a/demo/src/common/DemoHeader.tsx
+++ b/demo/src/common/DemoHeader.tsx
@@ -11,11 +11,11 @@ import {
   MenuDivider,
   MenuExtraContent,
   MenuItem,
-  UserIcon,
   IconButton,
   DropdownMenu,
   Select,
   Text,
+  Avatar,
 } from '@itwin/itwinui-react';
 import {
   SvgCheckmark,
@@ -66,14 +66,14 @@ export const DemoHeader = ({ isSlim = false }: DemoHeaderProps) => {
                 <MenuItem
                   key='projectA'
                   sublabel='0x0123456789'
-                  icon={
+                  startIcon={
                     <img
                       src='https://itwinplatformcdn.azureedge.net/iTwinUI/stadium.png'
                       alt='Project thumbnail'
                       draggable='false'
                     />
                   }
-                  badge={<SvgCheckmark />}
+                  endIcon={<SvgCheckmark />}
                   isSelected
                 >
                   Project Alpha
@@ -81,14 +81,14 @@ export const DemoHeader = ({ isSlim = false }: DemoHeaderProps) => {
                 <MenuItem
                   key='projectB'
                   sublabel='0x0987654321'
-                  icon={<SvgProject />}
+                  startIcon={<SvgProject />}
                 >
                   Project Beta
                 </MenuItem>,
                 <MenuItem
                   key='projectC'
                   sublabel='0x0001337420'
-                  icon={<SvgProject />}
+                  startIcon={<SvgProject />}
                 >
                   Project Charlie
                 </MenuItem>,
@@ -107,23 +107,23 @@ export const DemoHeader = ({ isSlim = false }: DemoHeaderProps) => {
                 <MenuItem
                   key='iModelA'
                   sublabel='0x0123456789'
-                  icon={<SvgModel />}
+                  startIcon={<SvgModel />}
                 >
                   iModel Alpha
                 </MenuItem>,
                 <MenuItem
                   key='iModelB'
                   sublabel='0x0987654321'
-                  icon={<SvgModel />}
+                  startIcon={<SvgModel />}
                   isSelected
-                  badge={<SvgCheckmark />}
+                  endIcon={<SvgCheckmark />}
                 >
                   iModel Beta
                 </MenuItem>,
                 <MenuItem
                   key='iModelC'
                   sublabel='0x0001337420'
-                  icon={<SvgModel />}
+                  startIcon={<SvgModel />}
                 >
                   iModel Charlie
                 </MenuItem>,
@@ -150,8 +150,6 @@ export const DemoHeader = ({ isSlim = false }: DemoHeaderProps) => {
             <SvgHelpCircular />
           </IconButton>
         </DropdownMenu>,
-      ]}
-      userIcon={
         <DropdownMenu
           key='profile'
           role='menu'
@@ -174,13 +172,13 @@ export const DemoHeader = ({ isSlim = false }: DemoHeaderProps) => {
             </MenuExtraContent>,
             <MenuDivider key={1} />,
             <MenuItem key='view-profile'>View profile</MenuItem>,
-            <MenuItem key='sign-out' badge={<SvgExit />}>
+            <MenuItem key='sign-out' endIcon={<SvgExit />}>
               Sign out
             </MenuItem>,
           ]}
         >
           <IconButton styleType='borderless'>
-            <UserIcon
+            <Avatar
               size='medium'
               image={
                 <img
@@ -190,19 +188,19 @@ export const DemoHeader = ({ isSlim = false }: DemoHeaderProps) => {
               }
             />
           </IconButton>
-        </DropdownMenu>
-      }
+        </DropdownMenu>,
+      ]}
       menuItems={() => [
-        <MenuItem key='settings' icon={<SvgSettings />}>
+        <MenuItem key='settings' startIcon={<SvgSettings />}>
           Settings
         </MenuItem>,
-        <MenuItem key='feedback' icon={<SvgSmileyHappy />}>
+        <MenuItem key='feedback' startIcon={<SvgSmileyHappy />}>
           Feedback
         </MenuItem>,
-        <MenuItem key='whats-new' icon={<SvgNews />}>
+        <MenuItem key='whats-new' startIcon={<SvgNews />}>
           {`What's new`}
         </MenuItem>,
-        <MenuItem key='about' icon={<SvgInfoCircular />}>
+        <MenuItem key='about' startIcon={<SvgInfoCircular />}>
           About
         </MenuItem>,
       ]}
diff --git a/demo/src/common/DemoHomePageInfoCard.scss b/demo/src/common/DemoHomePageInfoCard.scss
index d968365..3955ad7 100644
--- a/demo/src/common/DemoHomePageInfoCard.scss
+++ b/demo/src/common/DemoHomePageInfoCard.scss
@@ -1,6 +1,5 @@
 // Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 // See LICENSE.md in the project root for license terms and full copyright notice.
-@import '@itwin/itwinui-variables';
 
 .demo-home-page-info-card {
   display: flex;
diff --git a/demo/src/common/DemoSideNav.tsx b/demo/src/common/DemoSideNav.tsx
index 90c7a12..0875e4f 100644
--- a/demo/src/common/DemoSideNav.tsx
+++ b/demo/src/common/DemoSideNav.tsx
@@ -14,7 +14,6 @@ import { SidenavButton, SideNavigation } from '@itwin/itwinui-react';
 export const DemoSideNav = ({ activeItemKey = 'Home' }) => {
   return (
     <SideNavigation
-      className='app-sidenav'
       expanderPlacement='bottom'
       items={[
         <SidenavButton
@@ -44,6 +43,9 @@ export const DemoSideNav = ({ activeItemKey = 'Home' }) => {
           Configuration
         </SidenavButton>,
       ]}
+      wrapperProps={{
+        className: 'app-sidenav',
+      }}
     />
   );
 };
diff --git a/demo/src/common/DemoSurfaceCard.scss b/demo/src/common/DemoSurfaceCard.scss
index cf309fc..a4f12b8 100644
--- a/demo/src/common/DemoSurfaceCard.scss
+++ b/demo/src/common/DemoSurfaceCard.scss
@@ -1,6 +1,5 @@
 // Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 // See LICENSE.md in the project root for license terms and full copyright notice.
-@import '@itwin/itwinui-variables';
 
 .demo-surface-card {
   height: 100%;
diff --git a/demo/src/common/DemoTemplate.scss b/demo/src/common/DemoTemplate.scss
index 817104c..ff607f9 100644
--- a/demo/src/common/DemoTemplate.scss
+++ b/demo/src/common/DemoTemplate.scss
@@ -1,6 +1,5 @@
 // Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 // See LICENSE.md in the project root for license terms and full copyright notice.
-@import '@itwin/itwinui-variables';
 
 .demo-template-container {
   display: flex;
diff --git a/demo/src/common/DemoTemplate.tsx b/demo/src/common/DemoTemplate.tsx
index 3ae9b4f..14cc56c 100644
--- a/demo/src/common/DemoTemplate.tsx
+++ b/demo/src/common/DemoTemplate.tsx
@@ -9,7 +9,6 @@ import {
   ButtonGroup,
   Button,
   Text,
-  ThemeType,
   InformationPanel,
   InformationPanelHeader,
   InformationPanelWrapper,
@@ -18,7 +17,6 @@ import {
 import { SvgDeveloper } from '@itwin/itwinui-icons-react';
 import { ThemeButton } from '../common/ThemeButton';
 import { Link } from 'react-router-dom';
-import { ThemeContext } from './ThemeContext';
 import CodeSample from './CodeSample';
 
 export type DemoTemplateProps = {
@@ -36,11 +34,6 @@ export const DemoTemplate = (props: DemoTemplateProps) => {
 
   const [showCodeDemo, setShowCodeDemo] = React.useState(false);
   const [copyTooltipVisible, setCopyTooltipVisible] = React.useState(false);
-  const [theme, setTheme] = React.useState<ThemeType>(() =>
-    window.matchMedia('(prefers-color-scheme: dark)').matches
-      ? 'dark'
-      : 'light',
-  );
 
   const showCopiedTooltip = () => {
     setCopyTooltipVisible(true);
@@ -49,62 +42,60 @@ export const DemoTemplate = (props: DemoTemplateProps) => {
     }, 500);
   };
   return (
-    <ThemeContext.Provider value={{ theme, setTheme }}>
-      <InformationPanelWrapper>
-        <div className='demo-template-container'>
-          <div className='demo-template-content'>
-            {children}
-            {!isTestRun() && (
-              <ButtonGroup className='demo-template-button-overlay'>
-                <ThemeButton />
-                <IconButton onClick={() => setShowCodeDemo((f) => !f)}>
-                  <SvgDeveloper />
-                </IconButton>
-              </ButtonGroup>
-            )}
-          </div>
+    <InformationPanelWrapper>
+      <div className='demo-template-container'>
+        <div className='demo-template-content'>
+          {children}
+          {!isTestRun() && (
+            <ButtonGroup className='demo-template-button-overlay'>
+              <ThemeButton />
+              <IconButton onClick={() => setShowCodeDemo((f) => !f)}>
+                <SvgDeveloper />
+              </IconButton>
+            </ButtonGroup>
+          )}
+        </div>
 
-          <InformationPanel style={{ width: '40%' }} isOpen={showCodeDemo}>
-            <InformationPanelHeader
-              actions={
-                <div className='demo-template-code-header-actions'>
-                  <Tooltip
-                    content='Copied to clipboard'
-                    visible={copyTooltipVisible}
+        <InformationPanel style={{ width: '40%' }} isOpen={showCodeDemo}>
+          <InformationPanelHeader
+            actions={
+              <div className='demo-template-code-header-actions'>
+                <Tooltip
+                  content='Copied to clipboard'
+                  visible={copyTooltipVisible}
+                >
+                  <Button
+                    onClick={() => {
+                      navigator.clipboard.writeText(codeExample);
+                      showCopiedTooltip();
+                    }}
+                    styleType='high-visibility'
                   >
-                    <Button
-                      onClick={() => {
-                        navigator.clipboard.writeText(codeExample);
-                        showCopiedTooltip();
-                      }}
-                      styleType='high-visibility'
-                    >
-                      Copy
-                    </Button>
-                  </Tooltip>
-                </div>
-              }
+                    Copy
+                  </Button>
+                </Tooltip>
+              </div>
+            }
+          >
+            <Link to='../' className='iui-anchor'>
+              ..
+            </Link>
+            <Text
+              as='h1'
+              variant='title'
+              className='demo-template-code-header-title'
             >
-              <Link to='../' className='iui-anchor'>
-                ..
-              </Link>
-              <Text
-                as='h1'
-                variant='title'
-                className='demo-template-code-header-title'
-              >
-                {title}
-              </Text>
-            </InformationPanelHeader>
-            <CodeSample
-              showLineNumbers
-              style={{ height: '100%', border: 'none', margin: '0' }}
-              code={codeExample}
-            />
-          </InformationPanel>
-        </div>
-      </InformationPanelWrapper>
-    </ThemeContext.Provider>
+              {title}
+            </Text>
+          </InformationPanelHeader>
+          <CodeSample
+            showLineNumbers
+            style={{ height: '100%', border: 'none', margin: '0' }}
+            code={codeExample}
+          />
+        </InformationPanel>
+      </div>
+    </InformationPanelWrapper>
   );
 };
 
diff --git a/demo/src/common/ThemeButton.tsx b/demo/src/common/ThemeButton.tsx
index 94cf0db..2a13c35 100644
--- a/demo/src/common/ThemeButton.tsx
+++ b/demo/src/common/ThemeButton.tsx
@@ -3,23 +3,22 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
-import { useTheme, IconButton } from '@itwin/itwinui-react';
+import { IconButton } from '@itwin/itwinui-react';
 import { SvgSun, SvgMoon } from '@itwin/itwinui-icons-react';
 import { useThemeContext } from './ThemeContext';
 
 export const ThemeButton = () => {
   const { theme, setTheme } = useThemeContext();
-
-  useTheme(theme);
-
   const changeTheme = () => {
     setTheme(theme === 'light' ? 'dark' : 'light');
   };
 
   return (
-    <IconButton styleType='default' onClick={changeTheme}>
-      {theme === 'light' ? <SvgMoon /> : <SvgSun />}
-    </IconButton>
+    <>
+      <IconButton styleType='default' onClick={changeTheme}>
+        {theme === 'light' ? <SvgMoon /> : <SvgSun />}
+      </IconButton>
+    </>
   );
 };
 
diff --git a/demo/src/demos/Grid/FluidGridDemo.tsx b/demo/src/demos/Grid/FluidGridDemo.tsx
index 639289f..30f7c1d 100644
--- a/demo/src/demos/Grid/FluidGridDemo.tsx
+++ b/demo/src/demos/Grid/FluidGridDemo.tsx
@@ -124,7 +124,6 @@ export const GridLayoutDemo = () => {
             right={
               <LabeledInput
                 key='search'
-                iconDisplayStyle='inline'
                 placeholder='Search…'
                 svgIcon={<SvgSearch />}
               />
diff --git a/demo/src/index.scss b/demo/src/index.scss
index 043474b..dcc0050 100644
--- a/demo/src/index.scss
+++ b/demo/src/index.scss
@@ -2,10 +2,8 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
+.custom-theme {
+  height: 100dvh;
 }
 
 html,
diff --git a/demo/src/main.tsx b/demo/src/main.tsx
index 3425623..a722749 100644
--- a/demo/src/main.tsx
+++ b/demo/src/main.tsx
@@ -8,18 +8,43 @@ import { HashRouter, Route, Routes } from 'react-router-dom';
 import './index.scss';
 import App from './App';
 import { DEMOS_LIST } from './demos/list';
+import '@itwin/itwinui-react/styles.css';
+import { ThemeProvider, ThemeType } from '@itwin/itwinui-react';
+import { ThemeContext } from './common/ThemeContext';
+
+export const CustomThemeProvider = ({
+  children,
+}: {
+  children: React.ReactNode;
+}) => {
+  const [theme, setTheme] = React.useState<ThemeType>(() =>
+    window.matchMedia('(prefers-color-scheme: dark)').matches
+      ? 'dark'
+      : 'light',
+  );
+
+  return (
+    <ThemeContext.Provider value={{ theme, setTheme }}>
+      <ThemeProvider theme={theme} className='custom-theme'>
+        {children}
+      </ThemeProvider>
+    </ThemeContext.Provider>
+  );
+};
 
 createRoot(document.getElementById('root') as HTMLElement).render(
   <React.StrictMode>
     <HashRouter>
-      <Routes>
-        <Route path='/' element={<App />} />
-        {DEMOS_LIST.map(({ layouts }) =>
-          layouts.map(({ path, component: Component }) => (
-            <Route key={path} path={path} element={<Component />} />
-          )),
-        )}
-      </Routes>
+      <CustomThemeProvider>
+        <Routes>
+          <Route path='/' element={<App />} />
+          {DEMOS_LIST.map(({ layouts }) =>
+            layouts.map(({ path, component: Component }) => (
+              <Route key={path} path={path} element={<Component />} />
+            )),
+          )}
+        </Routes>
+      </CustomThemeProvider>
     </HashRouter>
   </React.StrictMode>,
 );
diff --git a/packages/layouts-css/package.json b/packages/layouts-css/package.json
index ac15777..62407b7 100644
--- a/packages/layouts-css/package.json
+++ b/packages/layouts-css/package.json
@@ -38,9 +38,6 @@
     "itwin",
     "itwinui"
   ],
-  "dependencies": {
-    "@itwin/itwinui-variables": "1.0.0"
-  },
   "devDependencies": {
     "autoprefixer": "^10.4.2",
     "chokidar-cli": "^3.0.0",
diff --git a/packages/layouts-css/src/styles.scss b/packages/layouts-css/src/styles.scss
index 2fef44d..1a892c0 100644
--- a/packages/layouts-css/src/styles.scss
+++ b/packages/layouts-css/src/styles.scss
@@ -1,6 +1,5 @@
 // Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 // See LICENSE.md in the project root for license terms and full copyright notice.
-@import '@itwin/itwinui-variables';
 @import 'page';
 @import 'fluid-grid';
 @import 'grid';
diff --git a/yarn.lock b/yarn.lock
index 8b0fa42..983472f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -795,6 +795,58 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@floating-ui/core@npm:^1.4.2":
+  version: 1.5.0
+  resolution: "@floating-ui/core@npm:1.5.0"
+  dependencies:
+    "@floating-ui/utils": ^0.1.3
+  checksum: 54b4fe26b3c228746ac5589f97303abf158b80aa5f8b99027259decd68d1c2030c4c637648ebd33dfe78a4212699453bc2bd7537fd5a594d3bd3e63d362f666f
+  languageName: node
+  linkType: hard
+
+"@floating-ui/dom@npm:^1.5.1":
+  version: 1.5.3
+  resolution: "@floating-ui/dom@npm:1.5.3"
+  dependencies:
+    "@floating-ui/core": ^1.4.2
+    "@floating-ui/utils": ^0.1.3
+  checksum: 00053742064aac70957f0bd5c1542caafb3bfe9716588bfe1d409fef72a67ed5e60450d08eb492a77f78c22ed1ce4f7955873cc72bf9f9caf2b0f43ae3561c21
+  languageName: node
+  linkType: hard
+
+"@floating-ui/react-dom@npm:^2.0.2":
+  version: 2.0.3
+  resolution: "@floating-ui/react-dom@npm:2.0.3"
+  dependencies:
+    "@floating-ui/dom": ^1.5.1
+  peerDependencies:
+    react: ">=16.8.0"
+    react-dom: ">=16.8.0"
+  checksum: 86212b9001b4ad20469798c66ec2d84ccf84f0c8bc33ab9bb9cf1b5cd74d7a7c897108ef3da76b44e4fffbafc170dc5abc84e1fe27b7d74d63e3e21fae026aaa
+  languageName: node
+  linkType: hard
+
+"@floating-ui/react@npm:^0.25.4":
+  version: 0.25.4
+  resolution: "@floating-ui/react@npm:0.25.4"
+  dependencies:
+    "@floating-ui/react-dom": ^2.0.2
+    "@floating-ui/utils": ^0.1.1
+    tabbable: ^6.0.1
+  peerDependencies:
+    react: ">=16.8.0"
+    react-dom: ">=16.8.0"
+  checksum: 816a0aa5bfc122c147e073563c0888333bdf58e79972757e37095c788323c8e87ace18d9196d95be8b8f4fe11d90cdeec36b23e5373a791a71a7873bf805590f
+  languageName: node
+  linkType: hard
+
+"@floating-ui/utils@npm:^0.1.1, @floating-ui/utils@npm:^0.1.3":
+  version: 0.1.6
+  resolution: "@floating-ui/utils@npm:0.1.6"
+  checksum: b34d4b5470869727f52e312e08272edef985ba5a450a76de0917ba0a9c6f5df2bdbeb99448e2c60f39b177fb8981c772ff1831424e75123471a27ebd5b52c1eb
+  languageName: node
+  linkType: hard
+
 "@fontsource/noto-sans-mono@npm:^4.5.12":
   version: 4.5.12
   resolution: "@fontsource/noto-sans-mono@npm:4.5.12"
@@ -841,13 +893,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@itwin/itwinui-css@npm:^1.0.0":
-  version: 1.0.0
-  resolution: "@itwin/itwinui-css@npm:1.0.0"
-  checksum: e3e3c8266e77c37789724d782797030da6ac520669606d538da6781d94778eb3e4163695f0f05c663280174f81f615989f976d7ec0f7a1d6c54451b08e48ec59
-  languageName: node
-  linkType: hard
-
 "@itwin/itwinui-icons-react@npm:^1.7.0":
   version: 1.8.0
   resolution: "@itwin/itwinui-icons-react@npm:1.8.0"
@@ -858,21 +903,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@itwin/itwinui-illustrations-react@npm:^2.0.0":
-  version: 2.0.0
-  resolution: "@itwin/itwinui-illustrations-react@npm:2.0.0"
-  peerDependencies:
-    react: ">=16.8.6"
-    react-dom: ">=16.8.6"
-  checksum: fdfa33106030f92d0ad0a1e3e820f4dfbb5290acae2739fbd3c9f1b8e3ab07561ff85def627cd6c979fa9514be63e9d12a7f4132e77dc21b7b396b3378ca162e
-  languageName: node
-  linkType: hard
-
 "@itwin/itwinui-layouts-css@workspace:*, @itwin/itwinui-layouts-css@workspace:packages/layouts-css":
   version: 0.0.0-use.local
   resolution: "@itwin/itwinui-layouts-css@workspace:packages/layouts-css"
   dependencies:
-    "@itwin/itwinui-variables": 1.0.0
     autoprefixer: ^10.4.2
     chokidar-cli: ^3.0.0
     postcss: ^8.4.31
@@ -891,7 +925,7 @@ __metadata:
     "@itwin/itwinui-icons-react": ^1.7.0
     "@itwin/itwinui-layouts-css": "workspace:*"
     "@itwin/itwinui-layouts-react": "workspace:*"
-    "@itwin/itwinui-react": ^2.0.0
+    "@itwin/itwinui-react": ^3.0.0
     "@types/react": ^18.0.0
     "@types/react-dom": ^18.0.0
     "@vitejs/plugin-react": ^4.2.0
@@ -950,30 +984,23 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@itwin/itwinui-react@npm:^2.0.0":
-  version: 2.0.0
-  resolution: "@itwin/itwinui-react@npm:2.0.0"
-  dependencies:
-    "@itwin/itwinui-css": ^1.0.0
-    "@itwin/itwinui-illustrations-react": ^2.0.0
-    "@itwin/itwinui-variables": ^1.0.0
-    "@tippyjs/react": ^4.2.6
-    "@types/react-table": ^7.0.18
-    classnames: ^2.2.6
-    react-table: ^7.1.0
-    react-transition-group: ^4.4.2
-    tippy.js: ^6.3.7
+"@itwin/itwinui-react@npm:^3.0.0":
+  version: 3.0.3
+  resolution: "@itwin/itwinui-react@npm:3.0.3"
+  dependencies:
+    "@floating-ui/react": ^0.25.4
+    classnames: ^2.3.2
+    react-table: ^7.8.0
+    react-transition-group: ^4.4.5
+    tslib: ^2.6.0
   peerDependencies:
-    react: ">=16.8.6 < 19.0.0"
-    react-dom: ">=16.8.6 < 19.0.0"
-  checksum: 133621af8f906aa6e523fd59750c1b656b66058c27878f9d7dc8823731a7d8c30266e411a43b5194f23679e773b802707352b64d1510d4437f6c8ccb0d56946d
-  languageName: node
-  linkType: hard
-
-"@itwin/itwinui-variables@npm:1.0.0, @itwin/itwinui-variables@npm:^1.0.0":
-  version: 1.0.0
-  resolution: "@itwin/itwinui-variables@npm:1.0.0"
-  checksum: 6b0efdb7b44522ad3c68020c0e44d85b50a813b25527d59f92a97705756d8159cec9cf6cdd7a02707312b0d6bbd6e96417898ce6378d8599f2fe804073d3a644
+    "@itwin/itwinui-illustrations-react": ^2.1.0
+    react: ">= 17.0.0 < 19.0.0"
+    react-dom: ">=17.0.0 < 19.0.0"
+  peerDependenciesMeta:
+    "@itwin/itwinui-illustrations-react":
+      optional: true
+  checksum: 8a50bddd679cadc24f1c1098510208159f20fb5499e679ea05137c0737f58fd9446bf57eefcb096b2eaaecbafe2b2e27466d500d7bdbe3c733534859301591a7
   languageName: node
   linkType: hard
 
@@ -1106,13 +1133,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@popperjs/core@npm:^2.9.0":
-  version: 2.11.2
-  resolution: "@popperjs/core@npm:2.11.2"
-  checksum: 5695bf020eda54636e16a62dc9b5fdd92beaf7b2d19f62fcef049d57c5cff92773562d80cbf760b217c3ec928da310eb24994ab6a00fd39dffa0af9b5dfc01a6
-  languageName: node
-  linkType: hard
-
 "@rollup/rollup-android-arm-eabi@npm:4.6.1":
   version: 4.6.1
   resolution: "@rollup/rollup-android-arm-eabi@npm:4.6.1"
@@ -1322,18 +1342,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@tippyjs/react@npm:^4.2.6":
-  version: 4.2.6
-  resolution: "@tippyjs/react@npm:4.2.6"
-  dependencies:
-    tippy.js: ^6.3.1
-  peerDependencies:
-    react: ">=16.8"
-    react-dom: ">=16.8"
-  checksum: 8f0fba591c9dae2e1af1ae632bbc775ba5c9dd4498e50e242be70302b4c27115c6740eec44e885e294b27cb28515777b52af5b34aac9d4bab627d948add938ae
-  languageName: node
-  linkType: hard
-
 "@tootallnate/once@npm:1":
   version: 1.1.2
   resolution: "@tootallnate/once@npm:1.1.2"
@@ -1458,15 +1466,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/react-table@npm:^7.0.18":
-  version: 7.7.9
-  resolution: "@types/react-table@npm:7.7.9"
-  dependencies:
-    "@types/react": "*"
-  checksum: 3f6c847c8e904479875bb249af02b70e271c5480d0f8b94f7da96eb3980a83cf011d7e558e885259851e3af8defb6493deb147227242766ebca37c9cb630c306
-  languageName: node
-  linkType: hard
-
 "@types/react@npm:*, @types/react@npm:^18.0.0":
   version: 18.0.9
   resolution: "@types/react@npm:18.0.9"
@@ -2389,13 +2388,20 @@ __metadata:
   languageName: node
   linkType: hard
 
-"classnames@npm:^2.2.6, classnames@npm:^2.3.1":
+"classnames@npm:^2.3.1":
   version: 2.3.1
   resolution: "classnames@npm:2.3.1"
   checksum: 14db8889d56c267a591f08b0834989fe542d47fac659af5a539e110cc4266694e8de86e4e3bbd271157dbd831361310a8293e0167141e80b0f03a0f175c80960
   languageName: node
   linkType: hard
 
+"classnames@npm:^2.3.2":
+  version: 2.3.2
+  resolution: "classnames@npm:2.3.2"
+  checksum: 2c62199789618d95545c872787137262e741f9db13328e216b093eea91c85ef2bfb152c1f9e63027204e2559a006a92eb74147d46c800a9f96297ae1d9f96f4e
+  languageName: node
+  linkType: hard
+
 "clean-stack@npm:^2.0.0":
   version: 2.2.0
   resolution: "clean-stack@npm:2.2.0"
@@ -6611,16 +6617,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-table@npm:^7.1.0":
-  version: 7.7.0
-  resolution: "react-table@npm:7.7.0"
+"react-table@npm:^7.8.0":
+  version: 7.8.0
+  resolution: "react-table@npm:7.8.0"
   peerDependencies:
-    react: ^16.8.3 || ^17.0.0-0
-  checksum: a679edecc76d3e51311b095528395b38ac85a1ffa371716bea01559a5fdc75af9a6abb9bb907c63190c8e77da22b11f7b05065b3a45d190d8f43cb83e4366206
+    react: ^16.8.3 || ^17.0.0-0 || ^18.0.0
+  checksum: 44ca0fb848c6869cd793cede8dc33072b38ebb8f8d2833565afe7cf3eac5d1fa455ac5fb9d06838b16fab0523d5d03e3e82f7645032f71245096e67b892313b9
   languageName: node
   linkType: hard
 
-"react-transition-group@npm:^4.4.2":
+"react-transition-group@npm:^4.4.5":
   version: 4.4.5
   resolution: "react-transition-group@npm:4.4.5"
   dependencies:
@@ -7767,6 +7773,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"tabbable@npm:^6.0.1":
+  version: 6.2.0
+  resolution: "tabbable@npm:6.2.0"
+  checksum: f8440277d223949272c74bb627a3371be21735ca9ad34c2570f7e1752bd646ccfc23a9d8b1ee65d6561243f4134f5fbbf1ad6b39ac3c4b586554accaff4a1300
+  languageName: node
+  linkType: hard
+
 "table@npm:^6.8.1":
   version: 6.8.1
   resolution: "table@npm:6.8.1"
@@ -7829,15 +7842,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tippy.js@npm:^6.3.1, tippy.js@npm:^6.3.7":
-  version: 6.3.7
-  resolution: "tippy.js@npm:6.3.7"
-  dependencies:
-    "@popperjs/core": ^2.9.0
-  checksum: cac955318a65288e8d2dca05059878b003c6e66f92c94f7810f5bc5448eb6646abdf7dacc9bd00020e2611592598d0aae3a28ec9a45349a159603c3fdddce5fb
-  languageName: node
-  linkType: hard
-
 "titleize@npm:^3.0.0":
   version: 3.0.0
   resolution: "titleize@npm:3.0.0"