diff --git a/src/terminal/Terminal.tsx b/src/terminal/Terminal.tsx index 1cd621eb..2ccc0105 100644 --- a/src/terminal/Terminal.tsx +++ b/src/terminal/Terminal.tsx @@ -2,7 +2,7 @@ // Copyright (c) 2020-2021 The Pybricks Authors import { - ContextMenuTarget, + ContextMenu, Menu, MenuDivider, MenuItem, @@ -33,7 +33,6 @@ interface DispatchProps { type TerminalProps = StateProps & DispatchProps & WithI18nProps; -@ContextMenuTarget class Terminal extends React.Component { private xterm: XTerm; private fitAddon: FitAddon; @@ -119,7 +118,34 @@ class Terminal extends React.Component { : 'rgba(181,213,255,0.5)', // this should match AceEditor theme }); return ( -
+
{ + // istanbul ignore if: not expected + if (e.defaultPrevented) { + return; + } + + e.preventDefault(); + const menu = this.renderContextMenu(); + const listener = (e: KeyboardEvent) => { + if (e.key === 'Escape') { + // istanbul ignore if: not expected + if (e.defaultPrevented) { + return; + } + + e.preventDefault(); + ContextMenu.hide(); + } + }; + window.addEventListener('keydown', listener); + ContextMenu.show(menu, { left: e.clientX, top: e.clientY }, () => { + window.removeEventListener('keydown', listener); + this.onContextMenuClose(); + }); + }} + > this.fitAddon.fit()}>