Close lightbox on escape key press

pull/1/head
Daniel Gasienica 7 years ago
parent 86da80fd23
commit d797ede791

@ -55,6 +55,16 @@ const IconButton = ({ onClick, type }: IconButtonProps) => (
);
export class Lightbox extends React.Component<Props, {}> {
public componentDidMount() {
const useCapture = true;
document.addEventListener('keyup', this.onKeyUp, useCapture);
}
public componentWillMount() {
const useCapture = true;
document.removeEventListener('keyup', this.onKeyUp, useCapture);
}
public render() {
const { imageURL } = this.props;
return (
@ -69,4 +79,12 @@ export class Lightbox extends React.Component<Props, {}> {
</div>
);
}
private onKeyUp = (event: KeyboardEvent) => {
if (event.key !== 'Escape') {
return;
}
this.props.close();
}
}

Loading…
Cancel
Save