reduce radix-ui bundle size footprint

src/components/Dialog/index.web.tsx

@@ -19,7 +19,9 @@ import {
 } from 'react-native'
 import {msg} from '@lingui/core/macro'
 import {useLingui} from '@lingui/react'
-import {DismissableLayer, FocusGuards, FocusScope} from 'radix-ui/internal'
+import * as DismissableLayer from '@radix-ui/react-dismissable-layer'
+import * as FocusGuards from '@radix-ui/react-focus-guards'
+import * as FocusScope from '@radix-ui/react-focus-scope'
 import {RemoveScrollBar} from 'react-remove-scroll-bar'
 
 import {logger} from '#/logger'

src/components/EmojiPicker/index.web.tsx

@@ -1,6 +1,6 @@
 import {createContext, useContext, useEffect, useMemo, useRef} from 'react'
 import EmojiPicker from '@emoji-mart/react'
-import {DropdownMenu} from 'radix-ui'
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
 
 import {useA11y} from '#/state/a11y'
 import {textInputWebEmitter} from '#/view/com/composer/text-input/textInputWebEmitter'

src/components/FocusScope/index.web.tsx

@@ -1,4 +1,4 @@
-import {FocusScope as RadixFocusScope} from 'radix-ui/internal'
+import * as RadixFocusScope from '@radix-ui/react-focus-scope'
 
 /*
  * The web version of the FocusScope component is a proper implementation, we

src/components/Lightbox/Lightbox.web.tsx

@@ -2,7 +2,8 @@ import {useCallback, useEffect, useRef, useState} from 'react'
 import {Pressable, ScrollView, StyleSheet, View} from 'react-native'
 import {Image} from 'expo-image'
 import {Trans, useLingui} from '@lingui/react/macro'
-import {FocusGuards, FocusScope} from 'radix-ui/internal'
+import * as FocusGuards from '@radix-ui/react-focus-guards'
+import * as FocusScope from '@radix-ui/react-focus-scope'
 import {RemoveScrollBar} from 'react-remove-scroll-bar'
 
 import {saveImageToMediaLibrary} from '#/lib/media/manip'

src/components/Menu/index.web.tsx

@@ -8,7 +8,7 @@ import {
 } from 'react-native'
 import {msg} from '@lingui/core/macro'
 import {useLingui} from '@lingui/react'
-import {DropdownMenu} from 'radix-ui'
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
 
 import {useA11y} from '#/state/a11y'
 import {atoms as a, flatten, flattenToCSS, useTheme, web} from '#/alf'

src/components/Select/index.web.tsx

@@ -1,6 +1,6 @@
 import {createContext, forwardRef, Fragment, useContext, useMemo} from 'react'
 import {View} from 'react-native'
-import {Select as RadixSelect} from 'radix-ui'
+import * as RadixSelect from '@radix-ui/react-select'
 
 import {useA11y} from '#/state/a11y'
 import {atoms as a, flatten, flattenToCSS, useTheme, web} from '#/alf'

src/components/Tooltip/index.web.tsx

@@ -1,7 +1,7 @@
 import {createContext, useContext, useMemo} from 'react'
 import {View} from 'react-native'
 import {utils} from '@bsky.app/alf'
-import {Popover} from 'radix-ui'
+import * as Popover from '@radix-ui/react-popover'
 
 import {atoms as a, flattenToCSS, useTheme} from '#/alf'
 import {

src/components/WelcomeModal.tsx

@@ -2,7 +2,8 @@ import {useEffect, useEffectEvent, useState} from 'react'
 import {Pressable, View} from 'react-native'
 import {ImageBackground} from 'expo-image'
 import {Trans, useLingui} from '@lingui/react/macro'
-import {FocusGuards, FocusScope} from 'radix-ui/internal'
+import * as FocusGuards from '@radix-ui/react-focus-guards'
+import * as FocusScope from '@radix-ui/react-focus-scope'
 
 import {useLoggedOutViewControls} from '#/state/shell/logged-out'
 import {Logo} from '#/view/icons/Logo'

src/components/dms/EmojiReactionPicker.web.tsx

@@ -1,7 +1,7 @@
 import {useState} from 'react'
 import {Pressable, View} from 'react-native'
 import {useLingui} from '@lingui/react/macro'
-import {DropdownMenu} from 'radix-ui'
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
 
 import {useSession} from '#/state/session'
 import {atoms as a, flatten, useTheme} from '#/alf'

src/view/shell/Composer.web.tsx

@@ -1,5 +1,7 @@
 import {StyleSheet, View} from 'react-native'
-import {DismissableLayer, FocusGuards, FocusScope} from 'radix-ui/internal'
+import * as DismissableLayer from '@radix-ui/react-dismissable-layer'
+import * as FocusGuards from '@radix-ui/react-focus-guards'
+import * as FocusScope from '@radix-ui/react-focus-scope'
 import {RemoveScrollBar} from 'react-remove-scroll-bar'
 
 import {useA11y} from '#/state/a11y'