diff --git a/react-components/package.json b/react-components/package.json
index fe558db03a3..6caeae45572 100644
--- a/react-components/package.json
+++ b/react-components/package.json
@@ -44,7 +44,7 @@
   "devDependencies": {
     "@cognite/cdf-i18n-utils": "^0.7.5",
     "@cognite/cdf-utilities": "^3.6.0",
-    "@cognite/cogs-lab": "^9.0.0-alpha.113",
+    "@cognite/cogs-lab": "^9.0.0-alpha.130",
     "@cognite/cogs.js": "^10.25.0",
     "@cognite/reveal": "^4.22.0",
     "@cognite/sdk": "^9.13.0",
diff --git a/react-components/src/components/Architecture/DropdownButton.tsx b/react-components/src/components/Architecture/DropdownButton.tsx
index 2dd440ccb87..1f23933a989 100644
--- a/react-components/src/components/Architecture/DropdownButton.tsx
+++ b/react-components/src/components/Architecture/DropdownButton.tsx
@@ -97,8 +97,6 @@ const DropdownElement = ({
       onOpenChange={(open: boolean) => {
         setOpen(open);
       }}
-      hideOnSelect={true}
-      appendTo={'parent'}
       placement={'bottom-start'}
       renderTrigger={(props: any) => (
         <CogsTooltip
@@ -171,10 +169,9 @@ function createMenuItem(command: BaseCommand, t: TranslateDelegate): ReactElemen
   return (
     <Menu.ItemToggled
       key={command.uniqueId}
-      icon={command.icon}
+      trailingContent={command.icon}
       disabled={!command.isEnabled}
       toggled={command.isChecked}
-      iconPlacement="left"
       label={command.getLabel(t)}
       onClick={() => {
         command.invoke();
diff --git a/react-components/src/components/Architecture/FilterButton.tsx b/react-components/src/components/Architecture/FilterButton.tsx
index 68d0c75ee59..e6b90076dcb 100644
--- a/react-components/src/components/Architecture/FilterButton.tsx
+++ b/react-components/src/components/Architecture/FilterButton.tsx
@@ -80,7 +80,6 @@ export const FilterButton = ({
       command={command}
       isAllChecked={isAllChecked}
       isSomeChecked={isSomeChecked}
-      label={label}
     />
   );
 
@@ -181,7 +180,7 @@ const FilterDropdown = ({
   return (
     <StyledDropdownRow>
       <label>{label}</label>
-      <StyledSelectPanel appendTo={'parent'} placement={'right-end'} hideOnOutsideClick>
+      <StyledSelectPanel appendTo={document.body} placement={'right-end'} hideOnOutsideClick>
         <SelectPanel.Trigger>
           <Button
             color="#000044"
@@ -212,11 +211,9 @@ const FilterDropdown = ({
 const FilterSelectPanelContent = ({
   command,
   isAllChecked,
-  isSomeChecked,
-  label
+  isSomeChecked
 }: {
   command: BaseFilterCommand;
-  label: string;
   isAllChecked: boolean;
   isSomeChecked: boolean;
 }): ReactElement => {
@@ -239,7 +236,7 @@ const FilterSelectPanelContent = ({
           {BaseFilterCommand.getAllString(t)}
         </SelectPanel.Item>
       </SelectPanel.Section>
-      <SelectPanel.Body label={label} style={{ maxHeight: '300px' }}>
+      <SelectPanel.Body style={{ maxHeight: '300px' }}>
         <SelectPanel.Section>
           {children?.map((child, _index): ReactElement => {
             return <FilterItem key={child.uniqueId} command={child} />;
diff --git a/react-components/src/components/Architecture/SettingsButton.tsx b/react-components/src/components/Architecture/SettingsButton.tsx
index 5f128b32d50..9991a4f99e1 100644
--- a/react-components/src/components/Architecture/SettingsButton.tsx
+++ b/react-components/src/components/Architecture/SettingsButton.tsx
@@ -72,7 +72,7 @@ export const SettingsButton = ({
   const children = command.children;
   return (
     <StyledMenu
-      hideOnSelect={false}
+      disableCloseOnClickInside
       onOpenChange={(open: boolean) => {
         for (const child of children) {
           child.update();
@@ -80,13 +80,11 @@ export const SettingsButton = ({
         setOpen(open);
       }}
       floatingProps={{ middleware: [offset(TOOLBAR_HORIZONTAL_PANEL_OFFSET)] }}
-      container={'parent'}
       placement="right-end"
       style={{
         flexDirection,
         padding: DEFAULT_PADDING
       }}
-      disableCloseOnClickInside
       renderTrigger={(props: any) => (
         <CogsTooltip
           content={<LabelWithShortcut label={label} command={command} />}
@@ -204,14 +202,12 @@ function createToggle(command: BaseCommand, t: TranslateDelegate): ReactNode {
 
 function createButton(command: BaseCommand, t: TranslateDelegate): ReactNode {
   // @update-ui-component-pattern
-  const [isChecked, setChecked] = useState(false);
   const [isEnabled, setEnabled] = useState(true);
   const [isVisible, setVisible] = useState(true);
   const [uniqueId, setUniqueId] = useState(0);
   const [icon, setIcon] = useState<IconName>(undefined);
 
   useOnUpdate(command, () => {
-    setChecked(command.isChecked);
     setEnabled(command.isEnabled);
     setVisible(command.isVisible);
     setUniqueId(command.uniqueId);
@@ -228,15 +224,12 @@ function createButton(command: BaseCommand, t: TranslateDelegate): ReactNode {
     <Menu.ItemAction
       key={uniqueId}
       disabled={!isEnabled}
-      toggled={isChecked}
       icon={<IconComponent iconName={icon} />}
-      iconPlacement="left"
       style={{ padding: DEFAULT_PADDING }}
       shortcutKeys={command.getShortCutKeys()}
       label={label}
       onClick={() => {
         command.invoke();
-        setChecked(command.isChecked);
       }}
     />
   );
diff --git a/react-components/src/components/RevealToolbar/LayersButton/LayersButton.tsx b/react-components/src/components/RevealToolbar/LayersButton/LayersButton.tsx
index 563a156ee74..f1f120d509e 100644
--- a/react-components/src/components/RevealToolbar/LayersButton/LayersButton.tsx
+++ b/react-components/src/components/RevealToolbar/LayersButton/LayersButton.tsx
@@ -51,11 +51,7 @@ export const LayersButton = ({
 
   return (
     <>
-      <SelectPanel
-        placement="right"
-        appendTo={'parent'}
-        hideOnOutsideClick
-        offset={TOOLBAR_HORIZONTAL_PANEL_OFFSET}>
+      <SelectPanel placement="right" hideOnOutsideClick offset={TOOLBAR_HORIZONTAL_PANEL_OFFSET}>
         <SelectPanel.Trigger>
           <Tooltip
             content={<LabelWithShortcut label={t({ key: 'LAYERS_FILTER_TOOLTIP' })} />}
@@ -105,11 +101,7 @@ const ModelLayerSelection = ({
   }, [update]);
 
   return (
-    <SelectPanel
-      placement="right"
-      appendTo={'parent'}
-      hideOnOutsideClick={true}
-      openOnHover={!isDisabled}>
+    <SelectPanel placement="right" hideOnOutsideClick={true} openOnHover={!isDisabled}>
       <SelectPanel.Trigger>
         <WholeLayerVisibilitySelectItem
           label={label}
diff --git a/react-components/src/components/RevealToolbar/RuleBasedOutputsButton.tsx b/react-components/src/components/RevealToolbar/RuleBasedOutputsButton.tsx
index e0cd2b053ec..4718fb89f05 100644
--- a/react-components/src/components/RevealToolbar/RuleBasedOutputsButton.tsx
+++ b/react-components/src/components/RevealToolbar/RuleBasedOutputsButton.tsx
@@ -128,7 +128,6 @@ export const RuleBasedOutputsButton = ({
   return (
     <Menu
       placement="right-start"
-      disabled={disabled}
       style={{
         maxHeight: 300,
         overflow: 'auto',
diff --git a/react-components/src/components/RevealToolbar/SettingsButton.tsx b/react-components/src/components/RevealToolbar/SettingsButton.tsx
index 97505246ba0..01f66195008 100644
--- a/react-components/src/components/RevealToolbar/SettingsButton.tsx
+++ b/react-components/src/components/RevealToolbar/SettingsButton.tsx
@@ -30,7 +30,6 @@ export const SettingsButton = ({
   return (
     <StyledMenu
       placement="right"
-      container={'parent'}
       floatingProps={{ middleware: [offset(TOOLBAR_HORIZONTAL_PANEL_OFFSET)] }}
       disableCloseOnClickInside
       renderTrigger={(props: any) => (
diff --git a/react-components/yarn.lock b/react-components/yarn.lock
index 4c3d6126b6a..aaae3cf95ce 100644
--- a/react-components/yarn.lock
+++ b/react-components/yarn.lock
@@ -483,7 +483,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@cognite/cogs-core@npm:^10.25.0, @cognite/cogs-core@npm:^10.25.2":
+"@cognite/cogs-core@npm:^10.25.0":
   version: 10.25.2
   resolution: "@cognite/cogs-core@npm:10.25.2"
   dependencies:
@@ -517,6 +517,41 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@cognite/cogs-core@npm:^10.32.0":
+  version: 10.32.0
+  resolution: "@cognite/cogs-core@npm:10.32.0"
+  dependencies:
+    "@cognite/cogs-icons": "npm:^10.32.0"
+    "@cognite/cogs-utils": "npm:^10.32.0"
+    "@emotion/react": "npm:^11.11.3"
+    "@emotion/styled": "npm:^11.11.0"
+    "@mui/base": "npm:^5.0.0-beta.33"
+    "@mui/joy": "npm:5.0.0-beta.48"
+    "@mui/material": "npm:^5.15.5"
+    "@mui/utils": "npm:^5.15.6"
+    "@mui/x-date-pickers": "npm:^6.19.3"
+    "@mui/x-date-pickers-pro": "npm:^6.19.3"
+    "@mui/x-license-pro": "npm:^6.10.2"
+    "@tippyjs/react": "npm:4.2.6"
+    classnames: "npm:^2.5.1"
+    color: "npm:4.2.3"
+    core-js: "npm:^3.6.5"
+    csstype: "npm:2.6.10"
+    dayjs: "npm:^1.11.7"
+    framer-motion: "npm:^11.0.3"
+    lodash: "npm:4.17.21"
+    rc-slider: "npm:9.5.4"
+    react-select: "npm:3.2.0"
+    react-transition-group: "npm:^4.4.5"
+    tslib: "npm:^2.6.2"
+  peerDependencies:
+    "@types/react": 18.3.4
+    react: ^18
+    react-dom: ^18
+  checksum: 10/18de4197ef4cb021ca019f742ae0964326b70d857479365ad6dd634026a8751687f4d5881c79b3283a39eeecf848e1caafbefacf6c69fd7008dce8b82ba02c52
+  languageName: node
+  linkType: hard
+
 "@cognite/cogs-icons@npm:^10.25.0, @cognite/cogs-icons@npm:^10.25.2":
   version: 10.25.2
   resolution: "@cognite/cogs-icons@npm:10.25.2"
@@ -532,14 +567,29 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@cognite/cogs-lab@npm:^9.0.0-alpha.113":
-  version: 9.0.0-alpha.113
-  resolution: "@cognite/cogs-lab@npm:9.0.0-alpha.113"
+"@cognite/cogs-icons@npm:^10.32.0":
+  version: 10.32.0
+  resolution: "@cognite/cogs-icons@npm:10.32.0"
+  dependencies:
+    classnames: "npm:^2.5.1"
+    core-js: "npm:^3.6.5"
+    tslib: "npm:^2.6.2"
+  peerDependencies:
+    "@types/react": 18.3.4
+    react: ^18
+    react-dom: ^18
+  checksum: 10/25be8e114de083100c6c1a935254e3035c839e59c605538441f3228cc2e860f6551d657eaff13ee4746eb739c4a9fd47b8e70a9f91cf867e03686f62e35f049d
+  languageName: node
+  linkType: hard
+
+"@cognite/cogs-lab@npm:^9.0.0-alpha.130":
+  version: 9.0.0-alpha.140
+  resolution: "@cognite/cogs-lab@npm:9.0.0-alpha.140"
   dependencies:
     "@babel/runtime": "npm:^7.23.2"
-    "@cognite/cogs-core": "npm:^10.25.2"
-    "@cognite/cogs-icons": "npm:^10.25.2"
-    "@cognite/cogs-utils": "npm:^10.25.2"
+    "@cognite/cogs-core": "npm:^10.32.0"
+    "@cognite/cogs-icons": "npm:^10.32.0"
+    "@cognite/cogs-utils": "npm:^10.32.0"
     "@floating-ui/react": "npm:^0.26.6"
     "@mui/base": "npm:^5.0.0-beta.33"
     "@mui/material": "npm:^5.15.5"
@@ -557,8 +607,10 @@ __metadata:
     react-toastify: "npm:9.1.3"
     tslib: "npm:^2.6.2"
   peerDependencies:
+    "@types/react": 18.3.4
     react: ^18
-  checksum: 10/a1848ba5eca0d13f2457e0bcff81c4e97ecf071c43b78579e7eb00f834c3a391d147aa61c37e7a961cfcea6a589e8db69310aea509dfbeffd656723fc944dea3
+    react-dom: ^18
+  checksum: 10/671b724ce80c466c150c1d92f2fd68257037b53efd67b2ed92b334aaea8cd2d164cd015de35d0aecd50e2638eb1a94135e18a01ff656286afae5fac081cef00c
   languageName: node
   linkType: hard
 
@@ -581,6 +633,27 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@cognite/cogs-utils@npm:^10.32.0":
+  version: 10.32.0
+  resolution: "@cognite/cogs-utils@npm:10.32.0"
+  dependencies:
+    "@babel/runtime": "npm:^7.23.2"
+    "@testing-library/react": "npm:16.0.1"
+    classnames: "npm:^2.5.1"
+    color: "npm:4.2.3"
+    core-js: "npm:^3.6.5"
+    jest-axe: "npm:^8.0.0"
+    lodash: "npm:4.17.21"
+    resize-observer-polyfill: "npm:1.5.1"
+    tslib: "npm:^2.6.2"
+  peerDependencies:
+    "@types/react": 18.3.4
+    react: ^18
+    react-dom: ^18
+  checksum: 10/86e6aab3e7d762572f3a2f7505946ee2e0112b002ed7953fc2accf53e75e86381bc1d8056ffa571527216d315b65f275cae62b9a3f4a1a7dc8c0789c304e7372
+  languageName: node
+  linkType: hard
+
 "@cognite/cogs.js@npm:^10.25.0":
   version: 10.25.0
   resolution: "@cognite/cogs.js@npm:10.25.0"
@@ -598,7 +671,7 @@ __metadata:
   dependencies:
     "@cognite/cdf-i18n-utils": "npm:^0.7.5"
     "@cognite/cdf-utilities": "npm:^3.6.0"
-    "@cognite/cogs-lab": "npm:^9.0.0-alpha.113"
+    "@cognite/cogs-lab": "npm:^9.0.0-alpha.130"
     "@cognite/cogs.js": "npm:^10.25.0"
     "@cognite/reveal": "npm:^4.22.0"
     "@cognite/sdk": "npm:^9.13.0"