forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Fix: emoji picker closes when hitting spacebar (#4422) (#4441)
Co-authored-by: Hailey <me@haileyok.com>
authored by
Michał Gołda
Hailey
and committed by
GitHub
cd9bba4b
a71134f4
+23
-21
+23
-21
src/view/com/composer/text-input/web/EmojiPicker.web.tsx
+23
-21
src/view/com/composer/text-input/web/EmojiPicker.web.tsx
···
1
1
import React from 'react'
2
-
import Picker from '@emoji-mart/react'
3
2
import {
4
-
StyleSheet,
3
+
GestureResponderEvent,
5
4
TouchableWithoutFeedback,
6
5
useWindowDimensions,
7
6
View,
8
7
} from 'react-native'
8
+
import Picker from '@emoji-mart/react'
9
+
10
+
import {atoms as a} from '#/alf'
9
11
import {textInputWebEmitter} from '../TextInput.web'
10
12
11
13
const HEIGHT_OFFSET = 40
···
96
98
97
99
if (!state.isOpen) return null
98
100
101
+
const onPressBackdrop = (e: GestureResponderEvent) => {
102
+
// @ts-ignore web only
103
+
if (e.nativeEvent?.pointerId === -1) return
104
+
close()
105
+
}
106
+
99
107
return (
100
108
<TouchableWithoutFeedback
101
109
accessibilityRole="button"
102
-
onPress={close}
110
+
onPress={onPressBackdrop}
103
111
accessibilityViewIsModal>
104
-
<View style={styles.mask}>
112
+
<View
113
+
style={[
114
+
a.fixed,
115
+
a.w_full,
116
+
a.h_full,
117
+
a.align_center,
118
+
{
119
+
top: 0,
120
+
left: 0,
121
+
right: 0,
122
+
},
123
+
]}>
105
124
{/* eslint-disable-next-line react-native-a11y/has-valid-accessibility-descriptors */}
106
125
<TouchableWithoutFeedback onPress={e => e.stopPropagation()}>
107
126
<View style={[{position: 'absolute'}, position]}>
···
118
137
</TouchableWithoutFeedback>
119
138
)
120
139
}
121
-
122
-
const styles = StyleSheet.create({
123
-
mask: {
124
-
// @ts-ignore web ony
125
-
position: 'fixed',
126
-
top: 0,
127
-
left: 0,
128
-
right: 0,
129
-
width: '100%',
130
-
height: '100%',
131
-
alignItems: 'center',
132
-
},
133
-
picker: {
134
-
marginHorizontal: 'auto',
135
-
paddingRight: 50,
136
-
},
137
-
})