@dhis2-ui/input 8.3.1 → 8.4.2

package/build/cjs/input/{input.test.js → __tests__/input.test.js}

@@ -1,10 +1,12 @@
 "use strict";
 
+var _react = require("@testing-library/react");
+
 var _enzyme = require("enzyme");
 
-var _react = _interopRequireDefault(require("react"));
+var _react2 = _interopRequireDefault(require("react"));
 
-var _index = require("./index.js");
+var _input = require("../input.js");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -17,10 +19,26 @@ describe('<Input>', () => {
       max: '10',
       step: '0.5'
     };
-    const wrapper = (0, _enzyme.shallow)( /*#__PURE__*/_react.default.createElement(_index.Input, _extends({
+    const wrapper = (0, _enzyme.shallow)( /*#__PURE__*/_react2.default.createElement(_input.Input, _extends({
       type: "number"
     }, testProps)));
     const inputEl = wrapper.find('input');
     expect(inputEl.props()).toMatchObject(testProps);
   });
+  it('should call the onKeyDown callback when provided', () => {
+    const onKeyDown = jest.fn();
+    (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_input.Input, {
+      name: "foo",
+      value: "bar",
+      onKeyDown: onKeyDown
+    }));
+
+    _react.fireEvent.keyDown(_react.screen.getByRole('textbox'), {});
+
+    expect(onKeyDown).toHaveBeenCalledWith({
+      name: 'foo',
+      value: 'bar'
+    }, expect.objectContaining({}));
+    expect(onKeyDown).toHaveBeenCalledTimes(1);
+  });
 });

package/build/cjs/input/input.js

@@ -51,6 +51,12 @@ class Input extends _react.Component {
         this.props.onFocus(this.createHandlerPayload(e), e);
       }
     });
+
+    _defineProperty(this, "handleKeyDown", e => {
+      if (this.props.onKeyDown) {
+        this.props.onKeyDown(this.createHandlerPayload(e), e);
+      }
+    });
   }
 
   componentDidMount() {
@@ -109,6 +115,7 @@ class Input extends _react.Component {
       onFocus: this.handleFocus,
       onBlur: this.handleBlur,
       onChange: this.handleChange,
+      onKeyDown: this.handleKeyDown,
       className: "jsx-3353877153 " + "jsx-".concat(styles.__hash) + " " + ((0, _classnames.default)({
         dense,
         disabled,
@@ -198,5 +205,8 @@ Input.propTypes = {
   onChange: _propTypes.default.func,
 
   /** Called with signature `({ name: string, value: string }, event)` */
-  onFocus: _propTypes.default.func
+  onFocus: _propTypes.default.func,
+
+  /** Called with signature `({ name: string, value: string }, event)` */
+  onKeyDown: _propTypes.default.func
 };

package/build/cjs/input-field/__tests__/input-field.test.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _react = require("@testing-library/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+var _inputField = require("../input-field.js");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+describe('<Input>', () => {
+  it('should call the onKeyDown callback when provided', () => {
+    const onKeyDown = jest.fn();
+    (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_inputField.InputField, {
+      label: "label",
+      name: "foo",
+      value: "bar",
+      onKeyDown: onKeyDown
+    }));
+
+    _react.fireEvent.keyDown(_react.screen.getByRole('textbox'), {});
+
+    expect(onKeyDown).toHaveBeenCalledWith({
+      name: 'foo',
+      value: 'bar'
+    }, expect.objectContaining({}));
+    expect(onKeyDown).toHaveBeenCalledTimes(1);
+  });
+});

package/build/cjs/input-field/input-field.js

@@ -25,6 +25,7 @@ class InputField extends _react.default.Component {
       className,
       onChange,
       onFocus,
+      onKeyDown,
       onBlur,
       initialFocus,
       type,
@@ -67,6 +68,7 @@ class InputField extends _react.default.Component {
       minWidth: "72px"
     }, /*#__PURE__*/_react.default.createElement(_input.Input, {
       onFocus: onFocus,
+      onKeyDown: onKeyDown,
       onBlur: onBlur,
       onChange: onChange,
       name: name,
@@ -169,5 +171,8 @@ InputField.propTypes = {
   onChange: _propTypes.default.func,
 
   /** Called with signature `({ name: string, value: string }, event)` */
-  onFocus: _propTypes.default.func
+  onFocus: _propTypes.default.func,
+
+  /** Called with signature `({ name: string, value: string }, event)` */
+  onKeyDown: _propTypes.default.func
 };

package/build/es/input/{input.test.js → __tests__/input.test.js}

@@ -1,8 +1,9 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
+import { render, fireEvent, screen } from '@testing-library/react';
 import { shallow } from 'enzyme';
 import React from 'react';
-import { Input } from './index.js';
+import { Input } from '../input.js';
 describe('<Input>', () => {
   it('passes min, max, and step props as attributes to the native <input> element', () => {
     const testProps = {
@@ -16,4 +17,18 @@ describe('<Input>', () => {
     const inputEl = wrapper.find('input');
     expect(inputEl.props()).toMatchObject(testProps);
   });
+  it('should call the onKeyDown callback when provided', () => {
+    const onKeyDown = jest.fn();
+    render( /*#__PURE__*/React.createElement(Input, {
+      name: "foo",
+      value: "bar",
+      onKeyDown: onKeyDown
+    }));
+    fireEvent.keyDown(screen.getByRole('textbox'), {});
+    expect(onKeyDown).toHaveBeenCalledWith({
+      name: 'foo',
+      value: 'bar'
+    }, expect.objectContaining({}));
+    expect(onKeyDown).toHaveBeenCalledTimes(1);
+  });
 });

package/build/es/input/input.js

@@ -32,6 +32,12 @@ export class Input extends Component {
         this.props.onFocus(this.createHandlerPayload(e), e);
       }
     });
+
+    _defineProperty(this, "handleKeyDown", e => {
+      if (this.props.onKeyDown) {
+        this.props.onKeyDown(this.createHandlerPayload(e), e);
+      }
+    });
   }
 
   componentDidMount() {
@@ -90,6 +96,7 @@ export class Input extends Component {
       onFocus: this.handleFocus,
       onBlur: this.handleBlur,
       onChange: this.handleChange,
+      onKeyDown: this.handleKeyDown,
       className: "jsx-3353877153 " + "jsx-".concat(styles.__hash) + " " + (cx({
         dense,
         disabled,
@@ -177,5 +184,8 @@ Input.propTypes = {
   onChange: PropTypes.func,
 
   /** Called with signature `({ name: string, value: string }, event)` */
-  onFocus: PropTypes.func
+  onFocus: PropTypes.func,
+
+  /** Called with signature `({ name: string, value: string }, event)` */
+  onKeyDown: PropTypes.func
 };

package/build/es/input-field/__tests__/input-field.test.js

@@ -0,0 +1,20 @@
+import { render, fireEvent, screen } from '@testing-library/react';
+import React from 'react';
+import { InputField } from '../input-field.js';
+describe('<Input>', () => {
+  it('should call the onKeyDown callback when provided', () => {
+    const onKeyDown = jest.fn();
+    render( /*#__PURE__*/React.createElement(InputField, {
+      label: "label",
+      name: "foo",
+      value: "bar",
+      onKeyDown: onKeyDown
+    }));
+    fireEvent.keyDown(screen.getByRole('textbox'), {});
+    expect(onKeyDown).toHaveBeenCalledWith({
+      name: 'foo',
+      value: 'bar'
+    }, expect.objectContaining({}));
+    expect(onKeyDown).toHaveBeenCalledTimes(1);
+  });
+});

package/build/es/input-field/input-field.js

@@ -11,6 +11,7 @@ class InputField extends React.Component {
       className,
       onChange,
       onFocus,
+      onKeyDown,
       onBlur,
       initialFocus,
       type,
@@ -53,6 +54,7 @@ class InputField extends React.Component {
       minWidth: "72px"
     }, /*#__PURE__*/React.createElement(Input, {
       onFocus: onFocus,
+      onKeyDown: onKeyDown,
       onBlur: onBlur,
       onChange: onChange,
       name: name,
@@ -154,6 +156,9 @@ InputField.propTypes = {
   onChange: PropTypes.func,
 
   /** Called with signature `({ name: string, value: string }, event)` */
-  onFocus: PropTypes.func
+  onFocus: PropTypes.func,
+
+  /** Called with signature `({ name: string, value: string }, event)` */
+  onKeyDown: PropTypes.func
 };
 export { InputField };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@dhis2-ui/input",
-    "version": "8.3.1",
+    "version": "8.4.2",
     "description": "UI Input",
     "repository": {
         "type": "git",
@@ -32,13 +32,13 @@
     },
     "dependencies": {
         "@dhis2/prop-types": "^3.1.2",
-        "@dhis2-ui/box": "8.3.1",
-        "@dhis2-ui/field": "8.3.1",
-        "@dhis2-ui/input": "8.3.1",
-        "@dhis2-ui/loader": "8.3.1",
-        "@dhis2-ui/status-icon": "8.3.1",
-        "@dhis2/ui-constants": "8.3.1",
-        "@dhis2/ui-icons": "8.3.1",
+        "@dhis2-ui/box": "8.4.2",
+        "@dhis2-ui/field": "8.4.2",
+        "@dhis2-ui/input": "8.4.2",
+        "@dhis2-ui/loader": "8.4.2",
+        "@dhis2-ui/status-icon": "8.4.2",
+        "@dhis2/ui-constants": "8.4.2",
+        "@dhis2/ui-icons": "8.4.2",
         "classnames": "^2.3.1",
         "prop-types": "^15.7.2"
     },