Bluesky app fork with some witchin' additions 馃挮
witchsky.app
bluesky
fork
client
1import {Pressable} from 'react-native'
2import Animated, {
3 Extrapolation,
4 interpolate,
5 type SharedValue,
6 useAnimatedStyle,
7} from 'react-native-reanimated'
8import {msg} from '@lingui/core/macro'
9import {useLingui} from '@lingui/react'
10
11import {atoms as a, useTheme} from '#/alf'
12import {useContextMenuContext} from './context'
13
14export function Backdrop({
15 animation,
16 intensity = 50,
17 onPress,
18}: {
19 animation: SharedValue<number>
20 intensity?: number
21 onPress?: () => void
22}) {
23 const t = useTheme()
24 const {_} = useLingui()
25 const {mode} = useContextMenuContext()
26
27 const reduced = mode === 'auxiliary-only'
28
29 const target = reduced ? 0.05 : intensity / 100
30
31 const animatedStyle = useAnimatedStyle(() => ({
32 opacity: interpolate(
33 animation.get(),
34 [0, 1],
35 [0, target],
36 Extrapolation.CLAMP,
37 ),
38 }))
39
40 return (
41 <Animated.View
42 style={[a.absolute, a.inset_0, t.atoms.bg_contrast_975, animatedStyle]}>
43 <Pressable
44 style={a.flex_1}
45 accessibilityLabel={_(msg`Close menu`)}
46 accessibilityHint={_(msg`Tap to close context menu`)}
47 onPress={onPress}
48 />
49 </Animated.View>
50 )
51}