@dhis2-ui/file-input 8.2.6 → 8.4.0

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.
@@ -0,0 +1,32 @@
1
+ "use strict";
2
+
3
+ var _react = require("@testing-library/react");
4
+
5
+ var _react2 = _interopRequireDefault(require("react"));
6
+
7
+ var _fileInput = require("../file-input.js");
8
+
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+
11
+ describe('<FileInput />', () => {
12
+ it('should call the onKeyDown callback when provided', () => {
13
+ const onKeyDown = jest.fn();
14
+ (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_fileInput.FileInput, {
15
+ name: "foo",
16
+ value: "bar",
17
+ checked: false,
18
+ onKeyDown: onKeyDown
19
+ }));
20
+
21
+ _react.fireEvent.keyDown(_react.screen.getByRole('button'), {});
22
+
23
+ expect(onKeyDown).toHaveBeenCalledTimes(1);
24
+
25
+ const input = _react.screen.getByTestId('dhis2-uicore-fileinput-input');
26
+
27
+ expect(onKeyDown).toHaveBeenCalledWith({
28
+ name: 'foo',
29
+ files: input.files
30
+ }, expect.objectContaining({}));
31
+ });
32
+ });
@@ -60,6 +60,12 @@ class FileInput extends _react.Component {
60
60
  this.props.onFocus(this.createHandlerPayload(), e);
61
61
  }
62
62
  });
63
+
64
+ _defineProperty(this, "handleKeyDown", e => {
65
+ if (this.props.onKeyDown) {
66
+ this.props.onKeyDown(this.createHandlerPayload(), e);
67
+ }
68
+ });
63
69
  }
64
70
 
65
71
  createHandlerPayload() {
@@ -100,6 +106,7 @@ class FileInput extends _react.Component {
100
106
  accept: accept,
101
107
  multiple: multiple,
102
108
  disabled: disabled,
109
+ "data-test": "".concat(dataTest, "-input"),
103
110
  className: _style.default.dynamic([["1746996489", [_uiConstants.spacers.dp8, _uiConstants.spacers.dp4]]])
104
111
  }), /*#__PURE__*/_react.default.createElement(_button.Button, {
105
112
  disabled: disabled,
@@ -111,6 +118,7 @@ class FileInput extends _react.Component {
111
118
  onBlur: this.handleBlur,
112
119
  onClick: this.handleClick,
113
120
  onFocus: this.handleFocus,
121
+ onKeyDown: this.handleKeyDown,
114
122
  small: small,
115
123
  tabIndex: tabIndex,
116
124
  type: "button"
@@ -171,5 +179,8 @@ FileInput.propTypes = {
171
179
  onChange: _propTypes.default.func,
172
180
 
173
181
  /** Called with signature `(object, event)` */
174
- onFocus: _propTypes.default.func
182
+ onFocus: _propTypes.default.func,
183
+
184
+ /** Called with signature `(object, event)` */
185
+ onKeyDown: _propTypes.default.func
175
186
  };
@@ -0,0 +1,33 @@
1
+ "use strict";
2
+
3
+ var _react = require("@testing-library/react");
4
+
5
+ var _react2 = _interopRequireDefault(require("react"));
6
+
7
+ var _fileInputField = require("../file-input-field.js");
8
+
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+
11
+ describe('<FileInputField />', () => {
12
+ it('should call the onKeyDown callback when provided', () => {
13
+ const onKeyDown = jest.fn();
14
+ (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_fileInputField.FileInputField, {
15
+ label: "Label",
16
+ name: "foo",
17
+ value: "bar",
18
+ checked: false,
19
+ onKeyDown: onKeyDown
20
+ }));
21
+
22
+ _react.fireEvent.keyDown(_react.screen.getByRole('button'), {});
23
+
24
+ expect(onKeyDown).toHaveBeenCalledTimes(1);
25
+
26
+ const input = _react.screen.getByTestId('dhis2-uicore-fileinput-input');
27
+
28
+ expect(onKeyDown).toHaveBeenCalledWith({
29
+ name: 'foo',
30
+ files: input.files
31
+ }, expect.objectContaining({}));
32
+ });
33
+ });
@@ -48,6 +48,7 @@ const FileInputField = _ref => {
48
48
  onBlur,
49
49
  onChange,
50
50
  onFocus,
51
+ onKeyDown,
51
52
  placeholder,
52
53
  required,
53
54
  small,
@@ -81,6 +82,7 @@ const FileInputField = _ref => {
81
82
  onBlur: onBlur,
82
83
  onChange: onChange,
83
84
  onFocus: onFocus,
85
+ onKeyDown: onKeyDown,
84
86
  small: small,
85
87
  tabIndex: tabIndex,
86
88
  valid: valid,
@@ -149,5 +151,10 @@ FileInputField.propTypes = {
149
151
 
150
152
  /** Called with signature `({ name: string, files: [] }, event)` */
151
153
  onChange: _propTypes.default.func,
152
- onFocus: _propTypes.default.func
154
+
155
+ /** Called with signature `({ name: string, files: [] }, event)` */
156
+ onFocus: _propTypes.default.func,
157
+
158
+ /** Called with signature `({ name: string, files: [] }, event)` */
159
+ onKeyDown: _propTypes.default.func
153
160
  };
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+
3
+ var _react = require("@testing-library/react");
4
+
5
+ var _react2 = _interopRequireDefault(require("react"));
6
+
7
+ var _fileInputFieldWithList = require("../file-input-field-with-list.js");
8
+
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+
11
+ describe('<FileInputFieldWithList />', () => {
12
+ it('should call the onKeyDown callback when provided', () => {
13
+ const onKeyDown = jest.fn();
14
+ (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_fileInputFieldWithList.FileInputFieldWithList, {
15
+ label: "Label",
16
+ name: "foo",
17
+ value: "bar",
18
+ checked: false,
19
+ onKeyDown: onKeyDown,
20
+ onChange: jest.fn()
21
+ }));
22
+
23
+ _react.fireEvent.keyDown(_react.screen.getByRole('button'), {});
24
+
25
+ expect(onKeyDown).toHaveBeenCalledTimes(1);
26
+
27
+ const input = _react.screen.getByTestId('dhis2-uicore-fileinput-input');
28
+
29
+ expect(onKeyDown).toHaveBeenCalledWith({
30
+ name: 'foo',
31
+ files: input.files
32
+ }, expect.objectContaining({}));
33
+ });
34
+ });
@@ -104,6 +104,7 @@ class FileInputFieldWithList extends _react.Component {
104
104
  name,
105
105
  onBlur,
106
106
  onFocus,
107
+ onKeyDown,
107
108
  placeholder,
108
109
  removeText,
109
110
  required,
@@ -129,6 +130,7 @@ class FileInputFieldWithList extends _react.Component {
129
130
  onBlur: onBlur,
130
131
  onChange: this.handleChange,
131
132
  onFocus: onFocus,
133
+ onKeyDown: onKeyDown,
132
134
  placeholder: translate(placeholder),
133
135
  required: required,
134
136
  small: small,
@@ -211,6 +213,13 @@ FileInputFieldWithList.propTypes = {
211
213
 
212
214
  /** Applies 'warning' styling to the button and validation text. Mutually exclusive with `valid` and `error` props */
213
215
  warning: _uiConstants.sharedPropTypes.statusPropType,
216
+
217
+ /** Called with signature `({ name: string, files: [] }, event)` */
214
218
  onBlur: _propTypes.default.func,
215
- onFocus: _propTypes.default.func
219
+
220
+ /** Called with signature `({ name: string, files: [] }, event)` */
221
+ onFocus: _propTypes.default.func,
222
+
223
+ /** Called with signature `({ name: string, files: [] }, event)` */
224
+ onKeyDown: _propTypes.default.func
216
225
  };
@@ -0,0 +1,21 @@
1
+ import { render, fireEvent, screen } from '@testing-library/react';
2
+ import React from 'react';
3
+ import { FileInput } from '../file-input.js';
4
+ describe('<FileInput />', () => {
5
+ it('should call the onKeyDown callback when provided', () => {
6
+ const onKeyDown = jest.fn();
7
+ render( /*#__PURE__*/React.createElement(FileInput, {
8
+ name: "foo",
9
+ value: "bar",
10
+ checked: false,
11
+ onKeyDown: onKeyDown
12
+ }));
13
+ fireEvent.keyDown(screen.getByRole('button'), {});
14
+ expect(onKeyDown).toHaveBeenCalledTimes(1);
15
+ const input = screen.getByTestId('dhis2-uicore-fileinput-input');
16
+ expect(onKeyDown).toHaveBeenCalledWith({
17
+ name: 'foo',
18
+ files: input.files
19
+ }, expect.objectContaining({}));
20
+ });
21
+ });
@@ -41,6 +41,12 @@ class FileInput extends Component {
41
41
  this.props.onFocus(this.createHandlerPayload(), e);
42
42
  }
43
43
  });
44
+
45
+ _defineProperty(this, "handleKeyDown", e => {
46
+ if (this.props.onKeyDown) {
47
+ this.props.onKeyDown(this.createHandlerPayload(), e);
48
+ }
49
+ });
44
50
  }
45
51
 
46
52
  createHandlerPayload() {
@@ -81,6 +87,7 @@ class FileInput extends Component {
81
87
  accept: accept,
82
88
  multiple: multiple,
83
89
  disabled: disabled,
90
+ "data-test": "".concat(dataTest, "-input"),
84
91
  className: _JSXStyle.dynamic([["1746996489", [spacers.dp8, spacers.dp4]]])
85
92
  }), /*#__PURE__*/React.createElement(Button, {
86
93
  disabled: disabled,
@@ -92,6 +99,7 @@ class FileInput extends Component {
92
99
  onBlur: this.handleBlur,
93
100
  onClick: this.handleClick,
94
101
  onFocus: this.handleFocus,
102
+ onKeyDown: this.handleKeyDown,
95
103
  small: small,
96
104
  tabIndex: tabIndex,
97
105
  type: "button"
@@ -151,6 +159,9 @@ FileInput.propTypes = {
151
159
  onChange: PropTypes.func,
152
160
 
153
161
  /** Called with signature `(object, event)` */
154
- onFocus: PropTypes.func
162
+ onFocus: PropTypes.func,
163
+
164
+ /** Called with signature `(object, event)` */
165
+ onKeyDown: PropTypes.func
155
166
  };
156
167
  export { FileInput };
@@ -0,0 +1,22 @@
1
+ import { render, fireEvent, screen } from '@testing-library/react';
2
+ import React from 'react';
3
+ import { FileInputField } from '../file-input-field.js';
4
+ describe('<FileInputField />', () => {
5
+ it('should call the onKeyDown callback when provided', () => {
6
+ const onKeyDown = jest.fn();
7
+ render( /*#__PURE__*/React.createElement(FileInputField, {
8
+ label: "Label",
9
+ name: "foo",
10
+ value: "bar",
11
+ checked: false,
12
+ onKeyDown: onKeyDown
13
+ }));
14
+ fireEvent.keyDown(screen.getByRole('button'), {});
15
+ expect(onKeyDown).toHaveBeenCalledTimes(1);
16
+ const input = screen.getByTestId('dhis2-uicore-fileinput-input');
17
+ expect(onKeyDown).toHaveBeenCalledWith({
18
+ name: 'foo',
19
+ files: input.files
20
+ }, expect.objectContaining({}));
21
+ });
22
+ });
@@ -32,6 +32,7 @@ const FileInputField = _ref => {
32
32
  onBlur,
33
33
  onChange,
34
34
  onFocus,
35
+ onKeyDown,
35
36
  placeholder,
36
37
  required,
37
38
  small,
@@ -65,6 +66,7 @@ const FileInputField = _ref => {
65
66
  onBlur: onBlur,
66
67
  onChange: onChange,
67
68
  onFocus: onFocus,
69
+ onKeyDown: onKeyDown,
68
70
  small: small,
69
71
  tabIndex: tabIndex,
70
72
  valid: valid,
@@ -132,6 +134,11 @@ FileInputField.propTypes = {
132
134
 
133
135
  /** Called with signature `({ name: string, files: [] }, event)` */
134
136
  onChange: PropTypes.func,
135
- onFocus: PropTypes.func
137
+
138
+ /** Called with signature `({ name: string, files: [] }, event)` */
139
+ onFocus: PropTypes.func,
140
+
141
+ /** Called with signature `({ name: string, files: [] }, event)` */
142
+ onKeyDown: PropTypes.func
136
143
  };
137
144
  export { FileInputField };
@@ -0,0 +1,23 @@
1
+ import { render, fireEvent, screen } from '@testing-library/react';
2
+ import React from 'react';
3
+ import { FileInputFieldWithList } from '../file-input-field-with-list.js';
4
+ describe('<FileInputFieldWithList />', () => {
5
+ it('should call the onKeyDown callback when provided', () => {
6
+ const onKeyDown = jest.fn();
7
+ render( /*#__PURE__*/React.createElement(FileInputFieldWithList, {
8
+ label: "Label",
9
+ name: "foo",
10
+ value: "bar",
11
+ checked: false,
12
+ onKeyDown: onKeyDown,
13
+ onChange: jest.fn()
14
+ }));
15
+ fireEvent.keyDown(screen.getByRole('button'), {});
16
+ expect(onKeyDown).toHaveBeenCalledTimes(1);
17
+ const input = screen.getByTestId('dhis2-uicore-fileinput-input');
18
+ expect(onKeyDown).toHaveBeenCalledWith({
19
+ name: 'foo',
20
+ files: input.files
21
+ }, expect.objectContaining({}));
22
+ });
23
+ });
@@ -85,6 +85,7 @@ class FileInputFieldWithList extends Component {
85
85
  name,
86
86
  onBlur,
87
87
  onFocus,
88
+ onKeyDown,
88
89
  placeholder,
89
90
  removeText,
90
91
  required,
@@ -110,6 +111,7 @@ class FileInputFieldWithList extends Component {
110
111
  onBlur: onBlur,
111
112
  onChange: this.handleChange,
112
113
  onFocus: onFocus,
114
+ onKeyDown: onKeyDown,
113
115
  placeholder: translate(placeholder),
114
116
  required: required,
115
117
  small: small,
@@ -191,7 +193,14 @@ FileInputFieldWithList.propTypes = {
191
193
 
192
194
  /** Applies 'warning' styling to the button and validation text. Mutually exclusive with `valid` and `error` props */
193
195
  warning: sharedPropTypes.statusPropType,
196
+
197
+ /** Called with signature `({ name: string, files: [] }, event)` */
194
198
  onBlur: PropTypes.func,
195
- onFocus: PropTypes.func
199
+
200
+ /** Called with signature `({ name: string, files: [] }, event)` */
201
+ onFocus: PropTypes.func,
202
+
203
+ /** Called with signature `({ name: string, files: [] }, event)` */
204
+ onKeyDown: PropTypes.func
196
205
  };
197
206
  export { FileInputFieldWithList };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2-ui/file-input",
3
- "version": "8.2.6",
3
+ "version": "8.4.0",
4
4
  "description": "UI FileInput",
5
5
  "repository": {
6
6
  "type": "git",
@@ -32,14 +32,14 @@
32
32
  "styled-jsx": "^4"
33
33
  },
34
34
  "dependencies": {
35
- "@dhis2/prop-types": "^3.0.0-beta.1",
36
- "@dhis2-ui/button": "8.2.6",
37
- "@dhis2-ui/field": "8.2.6",
38
- "@dhis2-ui/label": "8.2.6",
39
- "@dhis2-ui/loader": "8.2.6",
40
- "@dhis2-ui/status-icon": "8.2.6",
41
- "@dhis2/ui-constants": "8.2.6",
42
- "@dhis2/ui-icons": "8.2.6",
35
+ "@dhis2/prop-types": "^3.1.2",
36
+ "@dhis2-ui/button": "8.4.0",
37
+ "@dhis2-ui/field": "8.4.0",
38
+ "@dhis2-ui/label": "8.4.0",
39
+ "@dhis2-ui/loader": "8.4.0",
40
+ "@dhis2-ui/status-icon": "8.4.0",
41
+ "@dhis2/ui-constants": "8.4.0",
42
+ "@dhis2/ui-icons": "8.4.0",
43
43
  "classnames": "^2.3.1",
44
44
  "prop-types": "^15.7.2"
45
45
  },