@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.
- package/build/cjs/select/select.js +2 -1
- package/build/cjs/simple-single-select/use-handle-key-press/use-handle-key-press-on-filter-input.js +6 -0
- package/build/es/select/select.js +2 -1
- package/build/es/simple-single-select/use-handle-key-press/use-handle-key-press-on-filter-input.js +6 -0
- package/package.json +15 -15
|
@@ -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
|
package/build/cjs/simple-single-select/use-handle-key-press/use-handle-key-press-on-filter-input.js
CHANGED
|
@@ -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
|
package/build/es/simple-single-select/use-handle-key-press/use-handle-key-press-on-filter-input.js
CHANGED
|
@@ -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.
|
|
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.
|
|
37
|
-
"@dhis2-ui/button": "10.16.
|
|
38
|
-
"@dhis2-ui/card": "10.16.
|
|
39
|
-
"@dhis2-ui/checkbox": "10.16.
|
|
40
|
-
"@dhis2-ui/chip": "10.16.
|
|
41
|
-
"@dhis2-ui/field": "10.16.
|
|
42
|
-
"@dhis2-ui/input": "10.16.
|
|
43
|
-
"@dhis2-ui/layer": "10.16.
|
|
44
|
-
"@dhis2-ui/loader": "10.16.
|
|
45
|
-
"@dhis2-ui/popper": "10.16.
|
|
46
|
-
"@dhis2-ui/status-icon": "10.16.
|
|
47
|
-
"@dhis2-ui/tooltip": "10.16.
|
|
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.
|
|
50
|
-
"@dhis2/ui-icons": "10.16.
|
|
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
|
},
|