@dhis2-ui/select 10.16.0 → 10.16.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -17,6 +17,7 @@ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object
17
17
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
18
18
  function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
19
19
  // Keycodes for the keypress event handlers
20
+ const TAB_KEY = 9;
20
21
  const ESCAPE_KEY = 27;
21
22
  const SPACE_KEY = 32;
22
23
  const UP_KEY = 38;
@@ -121,7 +122,7 @@ class Select extends _react.Component {
121
122
  keyCode
122
123
  } = e;
123
124
  const shouldOpen = !open && (keyCode === SPACE_KEY || keyCode === UP_KEY || keyCode === DOWN_KEY);
124
- const shouldClose = open && keyCode === ESCAPE_KEY;
125
+ const shouldClose = open && (keyCode === ESCAPE_KEY || keyCode === TAB_KEY);
125
126
 
126
127
  /* Do not block event propagation when the Select is closed unless
127
128
  * the key to open it is pressed, so that other components like
@@ -61,6 +61,12 @@ function useHandleKeyPressOnFilterInput(_ref) {
61
61
  key,
62
62
  altKey
63
63
  } = e;
64
+
65
+ // Filter input stops propagation, so handle Tab here to close the menu.
66
+ if (key === 'Tab') {
67
+ closeMenu();
68
+ return;
69
+ }
64
70
  if (key === 'Escape' || key === 'Enter' || key === 'ArrowUp' && altKey || key === 'ArrowDown' && altKey) {
65
71
  if (value !== options[focussedOptionIndex].value) {
66
72
  selectFocussedOption();
@@ -9,6 +9,7 @@ import { InputWrapper } from './input-wrapper.js';
9
9
  import { MenuWrapper } from './menu-wrapper.js';
10
10
 
11
11
  // Keycodes for the keypress event handlers
12
+ const TAB_KEY = 9;
12
13
  const ESCAPE_KEY = 27;
13
14
  const SPACE_KEY = 32;
14
15
  const UP_KEY = 38;
@@ -113,7 +114,7 @@ export class Select extends Component {
113
114
  keyCode
114
115
  } = e;
115
116
  const shouldOpen = !open && (keyCode === SPACE_KEY || keyCode === UP_KEY || keyCode === DOWN_KEY);
116
- const shouldClose = open && keyCode === ESCAPE_KEY;
117
+ const shouldClose = open && (keyCode === ESCAPE_KEY || keyCode === TAB_KEY);
117
118
 
118
119
  /* Do not block event propagation when the Select is closed unless
119
120
  * the key to open it is pressed, so that other components like
@@ -55,6 +55,12 @@ export function useHandleKeyPressOnFilterInput(_ref) {
55
55
  key,
56
56
  altKey
57
57
  } = e;
58
+
59
+ // Filter input stops propagation, so handle Tab here to close the menu.
60
+ if (key === 'Tab') {
61
+ closeMenu();
62
+ return;
63
+ }
58
64
  if (key === 'Escape' || key === 'Enter' || key === 'ArrowUp' && altKey || key === 'ArrowDown' && altKey) {
59
65
  if (value !== options[focussedOptionIndex].value) {
60
66
  selectFocussedOption();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2-ui/select",
3
- "version": "10.16.0",
3
+ "version": "10.16.1",
4
4
  "description": "UI Select",
5
5
  "repository": {
6
6
  "type": "git",
@@ -33,21 +33,21 @@
33
33
  "styled-jsx": "^4"
34
34
  },
35
35
  "dependencies": {
36
- "@dhis2-ui/box": "10.16.0",
37
- "@dhis2-ui/button": "10.16.0",
38
- "@dhis2-ui/card": "10.16.0",
39
- "@dhis2-ui/checkbox": "10.16.0",
40
- "@dhis2-ui/chip": "10.16.0",
41
- "@dhis2-ui/field": "10.16.0",
42
- "@dhis2-ui/input": "10.16.0",
43
- "@dhis2-ui/layer": "10.16.0",
44
- "@dhis2-ui/loader": "10.16.0",
45
- "@dhis2-ui/popper": "10.16.0",
46
- "@dhis2-ui/status-icon": "10.16.0",
47
- "@dhis2-ui/tooltip": "10.16.0",
36
+ "@dhis2-ui/box": "10.16.1",
37
+ "@dhis2-ui/button": "10.16.1",
38
+ "@dhis2-ui/card": "10.16.1",
39
+ "@dhis2-ui/checkbox": "10.16.1",
40
+ "@dhis2-ui/chip": "10.16.1",
41
+ "@dhis2-ui/field": "10.16.1",
42
+ "@dhis2-ui/input": "10.16.1",
43
+ "@dhis2-ui/layer": "10.16.1",
44
+ "@dhis2-ui/loader": "10.16.1",
45
+ "@dhis2-ui/popper": "10.16.1",
46
+ "@dhis2-ui/status-icon": "10.16.1",
47
+ "@dhis2-ui/tooltip": "10.16.1",
48
48
  "@dhis2/prop-types": "^3.1.2",
49
- "@dhis2/ui-constants": "10.16.0",
50
- "@dhis2/ui-icons": "10.16.0",
49
+ "@dhis2/ui-constants": "10.16.1",
50
+ "@dhis2/ui-icons": "10.16.1",
51
51
  "classnames": "^2.3.1",
52
52
  "prop-types": "^15.7.2"
53
53
  },