Close lightbox on web with escape key (#543)
* Close lightbox on web with escape key * Lintzio/stable
parent
afd87a6390
commit
996dba7595
|
@ -1,4 +1,4 @@
|
||||||
import React from 'react'
|
import React, {useCallback, useEffect} from 'react'
|
||||||
import {
|
import {
|
||||||
Image,
|
Image,
|
||||||
TouchableOpacity,
|
TouchableOpacity,
|
||||||
|
@ -73,6 +73,20 @@ function LightboxInner({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const onEscape = useCallback(
|
||||||
|
(e: KeyboardEvent) => {
|
||||||
|
if (e.key === 'Escape') {
|
||||||
|
onClose()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[onClose],
|
||||||
|
)
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
window.addEventListener('keydown', onEscape)
|
||||||
|
return () => window.removeEventListener('keydown', onEscape)
|
||||||
|
}, [onEscape])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View style={styles.mask}>
|
<View style={styles.mask}>
|
||||||
<TouchableWithoutFeedback onPress={onClose}>
|
<TouchableWithoutFeedback onPress={onClose}>
|
||||||
|
|
Loading…
Reference in New Issue