diff --git a/packages/fractal/package.json b/packages/fractal/package.json
index eb26606a0..4615fa872 100644
--- a/packages/fractal/package.json
+++ b/packages/fractal/package.json
@@ -126,6 +126,7 @@
     "@radix-ui/react-checkbox": "^1.1.0",
     "@radix-ui/react-compose-refs": "^1.1.0",
     "@radix-ui/react-dialog": "^1.1.1",
+    "@radix-ui/react-dismissable-layer": "^1.1.0",
     "@radix-ui/react-dropdown-menu": "^2.1.1",
     "@radix-ui/react-label": "^2.1.0",
     "@radix-ui/react-popover": "^1.1.1",
diff --git a/packages/fractal/src/components/Autocomplete/Autocomplete.tsx b/packages/fractal/src/components/Autocomplete/Autocomplete.tsx
index 56066c7a7..460291f35 100644
--- a/packages/fractal/src/components/Autocomplete/Autocomplete.tsx
+++ b/packages/fractal/src/components/Autocomplete/Autocomplete.tsx
@@ -1,7 +1,7 @@
 'use client'
 
+import type { DismissableLayerProps } from '@radix-ui/react-dismissable-layer'
 import { Label as RxLabel } from '@radix-ui/react-label'
-import type { DismissableLayerProps } from '@radix-ui/react-select'
 import isEmpty from 'lodash/fp/isEmpty'
 import isFunction from 'lodash/fp/isFunction'
 import omit from 'lodash/fp/omit'
@@ -20,7 +20,10 @@ import {
 } from 'react'
 
 import { Dropdown } from '@/components/Dropdown/Dropdown'
-import type { CombinedRefs as DropdownCombinedRefs } from '@/components/Dropdown/Dropdown.types'
+import type {
+  CombinedRefs as DropdownCombinedRefs,
+  DropdownProps,
+} from '@/components/Dropdown/Dropdown.types'
 import { InputText } from '@/components/InputText'
 import { Typography } from '@/components/Typography/Typography'
 import { PREFIX } from '@/constants'
@@ -133,23 +136,24 @@ export const Autocomplete = forwardRef<CombinedRefs, AutocompleteProps>(
       // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [children, open])
 
-    const handleDropdownInteractOutside: DismissableLayerProps['onInteractOutside'] =
-      (event) => {
-        const { target } = event
-        if (target === window || target === null || target === undefined) {
-          return
-        }
+    const handleDropdownInteractOutside: DropdownProps['onInteractOutside'] = (
+      event,
+    ) => {
+      const { target } = event
+      if (target === window || target === null || target === undefined) {
+        return
+      }
 
-        if (
-          containerRef?.current?.contains(target as Element) ||
-          dropdownRef?.current?.container?.contains(target as Element) ||
-          dropdownRef?.current?.dropdown?.contains(target as Element)
-        ) {
-          event.preventDefault()
-        } else if (isOpen && isFunction(onBlur)) {
-          inputRef.current?.blur()
-        }
+      if (
+        containerRef?.current?.contains(target as Element) ||
+        dropdownRef?.current?.container?.contains(target as Element) ||
+        dropdownRef?.current?.dropdown?.contains(target as Element)
+      ) {
+        event.preventDefault()
+      } else if (isOpen && isFunction(onBlur)) {
+        inputRef.current?.blur()
       }
+    }
 
     const handleDropdownPointerDownOutside: DismissableLayerProps['onPointerDownOutside'] =
       (event) => {
diff --git a/packages/fractal/src/components/Dialog/Dialog.tsx b/packages/fractal/src/components/Dialog/Dialog.tsx
index 887c959db..2230bd829 100644
--- a/packages/fractal/src/components/Dialog/Dialog.tsx
+++ b/packages/fractal/src/components/Dialog/Dialog.tsx
@@ -2,7 +2,7 @@
 
 import CloseIcon from '@iconscout/react-unicons/icons/uil-times'
 import * as RxDialog from '@radix-ui/react-dialog'
-import type { DismissableLayerProps } from '@radix-ui/react-select'
+import type { DismissableLayerProps } from '@radix-ui/react-dismissable-layer'
 import isFunction from 'lodash/fp/isFunction'
 import isString from 'lodash/fp/isString'
 import omit from 'lodash/fp/omit'
diff --git a/packages/fractal/src/components/Dropdown/Dropdown.tsx b/packages/fractal/src/components/Dropdown/Dropdown.tsx
index 88414a7c5..eda03ed5b 100644
--- a/packages/fractal/src/components/Dropdown/Dropdown.tsx
+++ b/packages/fractal/src/components/Dropdown/Dropdown.tsx
@@ -3,7 +3,6 @@
 import AngleDownIcon from '@iconscout/react-unicons/icons/uil-angle-down'
 import * as RxDropdown from '@radix-ui/react-dropdown-menu'
 import * as RxScrollArea from '@radix-ui/react-scroll-area'
-import type { DismissableLayerProps } from '@radix-ui/react-select'
 import isFunction from 'lodash/fp/isFunction'
 import isNumber from 'lodash/fp/isNumber'
 import noop from 'lodash/fp/noop'
@@ -120,24 +119,25 @@ export const Dropdown = forwardRef<CombinedRefs, DropdownProps>(
       // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [children, open])
 
-    const handleDropdownInteractOutside: DismissableLayerProps['onInteractOutside'] =
-      (event) => {
-        const { target } = event
-        if (target === window || target === null || target === undefined) {
-          return
-        }
+    const handleDropdownInteractOutside: DropdownProps['onInteractOutside'] = (
+      event,
+    ) => {
+      const { target } = event
+      if (target === window || target === null || target === undefined) {
+        return
+      }
 
-        if (
-          containerRef?.current?.contains(target as Element) ||
-          dropdownRef?.current?.contains(target as Element)
-        ) {
-          event.preventDefault()
-        }
+      if (
+        containerRef?.current?.contains(target as Element) ||
+        dropdownRef?.current?.contains(target as Element)
+      ) {
+        event.preventDefault()
+      }
 
-        if (isFunction(onInteractOutside)) {
-          onInteractOutside(event)
-        }
+      if (isFunction(onInteractOutside)) {
+        onInteractOutside(event)
       }
+    }
 
     let widthClassNames = 'max-w-[var(--radix-popper-available-width)]'
     let widthStyle: CSSProperties = {}
@@ -353,7 +353,9 @@ perfectionist/sort-objects */
                     className={`${PREFIX}-${GROUP_NAME}__dropdown__scrollarea`}
                     {...(props.dir === undefined
                       ? {}
-                      : { dir: props.dir as RxScrollArea.Direction })}
+                      : {
+                          dir: props.dir as RxScrollArea.ScrollAreaProps['dir'],
+                        })}
                     type="hover"
                   >
                     <RxScrollArea.Viewport
diff --git a/packages/fractal/src/components/Dropdown/SubDropdown.tsx b/packages/fractal/src/components/Dropdown/SubDropdown.tsx
index 2387b498a..01b4bb6a3 100644
--- a/packages/fractal/src/components/Dropdown/SubDropdown.tsx
+++ b/packages/fractal/src/components/Dropdown/SubDropdown.tsx
@@ -3,7 +3,6 @@
 import AngleRightIcon from '@iconscout/react-unicons/icons/uil-angle-right'
 import * as RxDropdownMenu from '@radix-ui/react-dropdown-menu'
 import * as RxScrollArea from '@radix-ui/react-scroll-area'
-import type { DismissableLayerProps } from '@radix-ui/react-select'
 import isFunction from 'lodash/fp/isFunction'
 import omit from 'lodash/fp/omit'
 import {
@@ -22,6 +21,7 @@ import { alternatingBgColorLightClassNames, cj, cn } from '@/styles/helpers'
 
 import { GROUP_NAME } from './Dropdown.constants'
 import type {
+  DropdownProps,
   SubDropdownCombinedRefs,
   SubDropdownProps,
 } from './Dropdown.types'
@@ -116,24 +116,25 @@ export const SubDropdown = forwardRef<
     const isDisabled = disabled || groupDisabled || dropdownDisabled
     const isCondensed = condensed || groupCondensed || dropdownCondensed
 
-    const handleSubMenuInteractOutside: DismissableLayerProps['onInteractOutside'] =
-      (event) => {
-        const { target } = event
-        if (target === window || target === null || target === undefined) {
-          return
-        }
+    const handleSubMenuInteractOutside: DropdownProps['onInteractOutside'] = (
+      event,
+    ) => {
+      const { target } = event
+      if (target === window || target === null || target === undefined) {
+        return
+      }
 
-        if (
-          triggerRef?.current?.contains(target as Element) ||
-          contentRef?.current?.contains(target as Element)
-        ) {
-          event.preventDefault()
-        }
+      if (
+        triggerRef?.current?.contains(target as Element) ||
+        contentRef?.current?.contains(target as Element)
+      ) {
+        event.preventDefault()
+      }
 
-        if (isFunction(onInteractOutside)) {
-          onInteractOutside(event)
-        }
+      if (isFunction(onInteractOutside)) {
+        onInteractOutside(event)
       }
+    }
 
     const contentElement = (
       <Typography
@@ -246,7 +247,7 @@ export const SubDropdown = forwardRef<
                 className={`${PREFIX}-${GROUP_NAME}__sub-menu__content__scrollarea`}
                 {...(props.dir === undefined
                   ? {}
-                  : { dir: props.dir as RxScrollArea.Direction })}
+                  : { dir: props.dir as RxScrollArea.ScrollAreaProps['dir'] })}
                 type="hover"
               >
                 <RxScrollArea.Viewport
diff --git a/packages/fractal/src/components/InputCheckbox/InputCheckbox.types.ts b/packages/fractal/src/components/InputCheckbox/InputCheckbox.types.ts
index 54a376083..7b00690bb 100644
--- a/packages/fractal/src/components/InputCheckbox/InputCheckbox.types.ts
+++ b/packages/fractal/src/components/InputCheckbox/InputCheckbox.types.ts
@@ -1,5 +1,5 @@
 import type {
-  CheckedState,
+  CheckboxProps,
   CheckboxProps as RxCheckboxProps,
 } from '@radix-ui/react-checkbox'
 import type { ReactNode } from 'react'
@@ -12,7 +12,7 @@ export interface InputCheckboxProps extends Omit<RxCheckboxProps, 'asChild'> {
    *
    * Must be used in conjunction with `onCheckedChange`.
    */
-  checked?: CheckedState
+  checked?: CheckboxProps['checked']
   /**
    * The content of the checkbox.
    *
@@ -27,7 +27,7 @@ export interface InputCheckboxProps extends Omit<RxCheckboxProps, 'asChild'> {
    *
    * Use this when you do not need to control its checked state.
    */
-  defaultChecked?: CheckedState
+  defaultChecked?: CheckboxProps['defaultChecked']
   /** Prevents the user from interacting with the checkbox. */
   disabled?: boolean
   /** Indicates if the checkbox should take all the available width. */
@@ -69,7 +69,7 @@ export interface InputCheckboxProps extends Omit<RxCheckboxProps, 'asChild'> {
    */
   name?: string
   /** Event handler called when the checked state of the checkbox changes. */
-  onCheckedChange?: (checked: CheckedState) => void
+  onCheckedChange?: (checked: CheckboxProps['checked']) => void
   /**
    * Prevent the user from interacting with the checkbox but keep a
    * non-disabled visual state.
diff --git a/packages/fractal/src/components/InputRadio/InputRadio.types.ts b/packages/fractal/src/components/InputRadio/InputRadio.types.ts
index a0b83c545..4fd046921 100644
--- a/packages/fractal/src/components/InputRadio/InputRadio.types.ts
+++ b/packages/fractal/src/components/InputRadio/InputRadio.types.ts
@@ -1,6 +1,6 @@
 import {
   RadioGroupProps as RxRadioGroupProps,
-  RadioProps as RxRadioProps,
+  RadioGroupItemProps as RxRadioProps,
 } from '@radix-ui/react-radio-group'
 import type { ReactNode } from 'react'
 
diff --git a/packages/fractal/src/components/Menu/SubMenu.tsx b/packages/fractal/src/components/Menu/SubMenu.tsx
index 2e096dc7b..150d1ccd6 100644
--- a/packages/fractal/src/components/Menu/SubMenu.tsx
+++ b/packages/fractal/src/components/Menu/SubMenu.tsx
@@ -2,7 +2,6 @@
 
 import AngleRightIcon from '@iconscout/react-unicons/icons/uil-angle-right'
 import * as RxScrollArea from '@radix-ui/react-scroll-area'
-import type { DismissableLayerProps } from '@radix-ui/react-select'
 import { useClickOutside } from '@react-hookz/web'
 import constant from 'lodash/fp/constant'
 import isEmpty from 'lodash/fp/isEmpty'
@@ -25,6 +24,7 @@ import { Typography } from '@/components/Typography/Typography'
 import { PREFIX } from '@/constants'
 import { alternatingBgColorLightClassNames, cj, cn } from '@/styles/helpers'
 
+import { PopoverProps } from '../Popover'
 import {
   DEFAULT_SUB_MENU_ELEVATION,
   GROUP_NAME,
@@ -139,24 +139,25 @@ export const SubMenu = forwardRef<SubMenuCombinedRefs, SubMenuProps>(
     const isDisabled = disabled || groupDisabled || menuDisabled
     const isCondensed = condensed || groupCondensed || menuCondensed
 
-    const handleSubMenuInteractOutside: DismissableLayerProps['onInteractOutside'] =
-      (event) => {
-        const { target } = event
-        if (target === window || target === null || target === undefined) {
-          return
-        }
+    const handleSubMenuInteractOutside: PopoverProps['onInteractOutside'] = (
+      event,
+    ) => {
+      const { target } = event
+      if (target === window || target === null || target === undefined) {
+        return
+      }
 
-        if (
-          triggerRef?.current?.contains(target as Element) ||
-          contentRef?.current?.contains(target as Element)
-        ) {
-          event.preventDefault()
-        }
+      if (
+        triggerRef?.current?.contains(target as Element) ||
+        contentRef?.current?.contains(target as Element)
+      ) {
+        event.preventDefault()
+      }
 
-        if (isFunction(onInteractOutside)) {
-          onInteractOutside(event)
-        }
+      if (isFunction(onInteractOutside)) {
+        onInteractOutside(event)
       }
+    }
 
     const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {
       if (isFunction(props.onKeyDown)) {
@@ -288,7 +289,7 @@ export const SubMenu = forwardRef<SubMenuCombinedRefs, SubMenuProps>(
             className={`${PREFIX}-${GROUP_NAME}__sub-menu__content__scrollarea`}
             {...(props.dir === undefined
               ? {}
-              : { dir: props.dir as RxScrollArea.Direction })}
+              : { dir: props.dir as RxScrollArea.ScrollAreaProps['dir'] })}
             type="hover"
           >
             <RxScrollArea.Viewport
diff --git a/packages/fractal/src/components/Popover/Popover.tsx b/packages/fractal/src/components/Popover/Popover.tsx
index 7eeae9c32..e07b8b0f7 100644
--- a/packages/fractal/src/components/Popover/Popover.tsx
+++ b/packages/fractal/src/components/Popover/Popover.tsx
@@ -119,24 +119,25 @@ export const Popover = forwardRef<CombinedRefs, PopoverProps>(
       // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [children, open])
 
-    const handleInteractOutside: RxPopover.DismissableLayerProps['onInteractOutside'] =
-      (event) => {
-        const { target } = event
-        if (target === window || target === null || target === undefined) {
-          return
-        }
+    const handleInteractOutside: PopoverProps['onInteractOutside'] = (
+      event,
+    ) => {
+      const { target } = event
+      if (target === window || target === null || target === undefined) {
+        return
+      }
 
-        if (
-          containerRef?.current?.contains(target as Element) ||
-          contentRef?.current?.contains(target as Element)
-        ) {
-          event.preventDefault()
-        }
+      if (
+        containerRef?.current?.contains(target as Element) ||
+        contentRef?.current?.contains(target as Element)
+      ) {
+        event.preventDefault()
+      }
 
-        if (isFunction(onInteractOutside)) {
-          onInteractOutside(event)
-        }
+      if (isFunction(onInteractOutside)) {
+        onInteractOutside(event)
       }
+    }
 
     let widthClassNames = 'max-w-[var(--radix-popper-available-width)]'
     let widthStyle: CSSProperties = {}
@@ -305,7 +306,9 @@ export const Popover = forwardRef<CombinedRefs, PopoverProps>(
                       className={`${PREFIX}-${GROUP_NAME}__popover__scrollarea`}
                       {...(props.dir === undefined
                         ? {}
-                        : { dir: props.dir as RxScrollArea.Direction })}
+                        : {
+                            dir: props.dir as RxScrollArea.ScrollAreaProps['dir'],
+                          })}
                       type="hover"
                     >
                       <RxScrollArea.Viewport
diff --git a/packages/fractal/src/components/Select/Select.tsx b/packages/fractal/src/components/Select/Select.tsx
index 188e46244..3dbc7d138 100644
--- a/packages/fractal/src/components/Select/Select.tsx
+++ b/packages/fractal/src/components/Select/Select.tsx
@@ -1,6 +1,7 @@
 'use client'
 
 import AngleDownIcon from '@iconscout/react-unicons/icons/uil-angle-down'
+import type { DismissableLayerProps } from '@radix-ui/react-dismissable-layer'
 import { Label as RxLabel } from '@radix-ui/react-label'
 import * as RxScrollArea from '@radix-ui/react-scroll-area'
 import * as RxSelect from '@radix-ui/react-select'
@@ -111,7 +112,7 @@ export const Select = forwardRef<CombinedRefs, SelectProps>(
       handleDropdownToggle(!isOpen)
     }
 
-    const handlePointerDownOutside: RxSelect.DismissableLayerProps['onPointerDownOutside'] =
+    const handlePointerDownOutside: DismissableLayerProps['onPointerDownOutside'] =
       (event) => {
         if (isFunction(dropdown.onPointerDownOutside)) {
           dropdown.onPointerDownOutside(event)
@@ -157,7 +158,7 @@ export const Select = forwardRef<CombinedRefs, SelectProps>(
           className={`${PREFIX}-${GROUP_NAME}__dropdown__scrollarea`}
           {...(props.dir === undefined
             ? {}
-            : { dir: props.dir as RxScrollArea.Direction })}
+            : { dir: props.dir as RxScrollArea.ScrollAreaProps['dir'] })}
           type="hover"
         >
           <RxSelect.Viewport asChild>
@@ -239,7 +240,7 @@ export const Select = forwardRef<CombinedRefs, SelectProps>(
           defaultOpen={autoFocus}
           {...(props.dir === undefined
             ? {}
-            : { dir: props.dir as RxSelect.Direction })}
+            : { dir: props.dir as RxSelect.SelectProps['dir'] })}
           disabled={!writable}
           name={name || uniqueId}
           open={isOpen}
diff --git a/packages/fractal/src/components/ToggleGroup/ToggleGroup.types.ts b/packages/fractal/src/components/ToggleGroup/ToggleGroup.types.ts
index cf688393b..090f43be0 100644
--- a/packages/fractal/src/components/ToggleGroup/ToggleGroup.types.ts
+++ b/packages/fractal/src/components/ToggleGroup/ToggleGroup.types.ts
@@ -1,12 +1,13 @@
 import {
   ToggleGroupItemProps as RxToggleGroupItemProps,
-  ToggleGroupImplProps as RxToggleGroupProps,
+  ToggleGroupMultipleProps as RxToggleGroupProps,
 } from '@radix-ui/react-toggle-group'
 import type { ReactNode } from 'react'
 
 import { Variants } from '@/components/Toggle/Toggle.constants'
 
-export interface ToggleGroupProps extends RxToggleGroupProps {
+export interface ToggleGroupProps
+  extends Omit<RxToggleGroupProps, 'defaultValue' | 'type' | 'value'> {
   /** The toggles to display inside of the toggle group. */
   children: ReactNode
   /**
diff --git a/yarn.lock b/yarn.lock
index 8367936a7..bce190727 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3642,7 +3642,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@radix-ui/react-dismissable-layer@npm:1.1.0":
+"@radix-ui/react-dismissable-layer@npm:1.1.0, @radix-ui/react-dismissable-layer@npm:^1.1.0":
   version: 1.1.0
   resolution: "@radix-ui/react-dismissable-layer@npm:1.1.0"
   dependencies:
@@ -5107,6 +5107,7 @@ __metadata:
     "@radix-ui/react-checkbox": "npm:^1.1.0"
     "@radix-ui/react-compose-refs": "npm:^1.1.0"
     "@radix-ui/react-dialog": "npm:^1.1.1"
+    "@radix-ui/react-dismissable-layer": "npm:^1.1.0"
     "@radix-ui/react-dropdown-menu": "npm:^2.1.1"
     "@radix-ui/react-label": "npm:^2.1.0"
     "@radix-ui/react-popover": "npm:^1.1.1"