dropdown closes when esc key... (#254)
Co-authored-by: Makhmudjon Inadullaev <makhmudjon@Makhmudjons-MacBook-Pro-2.local> Co-authored-by: Makhmudjon Inadullaev <makhmudjon@MakhmudjonsMBP2.home>
Makhmudjon Inadullaev committed
Oct 27, 2022 at 20:18 UTC
5f3fbe17c3b1e543df35be14ccffb05f4c79f338
1 file changed
+12
-1
theme/src/components/variant-select.js
+12
-1
@@ -54,8 +54,19 @@ function VariantSelect(props) {
54
);
55
});
56
57
+ /**
58
+ * We should use '@primer/react' package as '@primer/components' package depricated and moved to '@primer/react'.
59
+ * We have no closing/opening control with current '@primer/components' package, so document.body click event used for closing purpose.
60
+ */
61
+ // TODO: We should use 'setOpen' function returned by the useDetails hook when we move to '@primer/react' package. https://primer.style/react/deprecated/Dropdown
62
+ function onDropDownKeyDown (event) {
63
+ if (event.key === 'Escape') {
64
+ document.body.click()
65
+ }
66
+ }
67
+
68
return (
58
- <Dropdown overlay={props.overlay}>
69
+ <Dropdown onKeyDown={onDropDownKeyDown} overlay={props.overlay}>
70
<Dropdown.Button>{selectedItem.variant.title}</Dropdown.Button>
71
<VariantSelect.Menu direction={props.direction} width={props.menuWidth}>
72
{items}