make sure click events on the emoji picker don't bubble up to the mask (#1427)
parent
bcd63e710c
commit
27cb1bd276
|
@ -58,21 +58,27 @@ export function EmojiPicker({close}: {close: () => void}) {
|
||||||
// eslint-disable-next-line react-native-a11y/has-valid-accessibility-descriptors
|
// eslint-disable-next-line react-native-a11y/has-valid-accessibility-descriptors
|
||||||
<TouchableWithoutFeedback onPress={close} accessibilityViewIsModal>
|
<TouchableWithoutFeedback onPress={close} accessibilityViewIsModal>
|
||||||
<View style={styles.mask}>
|
<View style={styles.mask}>
|
||||||
<View
|
{/* eslint-disable-next-line react-native-a11y/has-valid-accessibility-descriptors */}
|
||||||
style={[
|
<TouchableWithoutFeedback
|
||||||
styles.picker,
|
onPress={e => {
|
||||||
{
|
e.stopPropagation() // prevent event from bubbling up to the mask
|
||||||
paddingTop: noPadding ? 0 : reducedPadding ? 150 : 325,
|
}}>
|
||||||
display: noPicker ? 'none' : 'flex',
|
<View
|
||||||
},
|
style={[
|
||||||
]}>
|
styles.picker,
|
||||||
<Picker
|
{
|
||||||
// @ts-ignore we set emojiMartData in `emoji-mart-data.js` file
|
paddingTop: noPadding ? 0 : reducedPadding ? 150 : 325,
|
||||||
data={window.emojiMartData}
|
display: noPicker ? 'none' : 'flex',
|
||||||
onEmojiSelect={onInsert}
|
},
|
||||||
autoFocus={false}
|
]}>
|
||||||
/>
|
<Picker
|
||||||
</View>
|
// @ts-ignore we set emojiMartData in `emoji-mart-data.js` file
|
||||||
|
data={window.emojiMartData}
|
||||||
|
onEmojiSelect={onInsert}
|
||||||
|
autoFocus={false}
|
||||||
|
/>
|
||||||
|
</View>
|
||||||
|
</TouchableWithoutFeedback>
|
||||||
</View>
|
</View>
|
||||||
</TouchableWithoutFeedback>
|
</TouchableWithoutFeedback>
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in New Issue