@ntbjs/react-components 0.0.1-beta.22 → 0.0.1-beta.23

package/{AssetGallery-020b30a7.js → AssetGallery-001e0a96.js}

@@ -7,7 +7,7 @@ var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
 var ActionButton = require('./ActionButton-10a681b9.js');
 require('./Checkbox-791a409f.js');
 require('./Radio-9271a4b6.js');
-require('./TextInput-a4855d3e.js');
+require('./TextInput-4537f957.js');
 require('./Popover-0ff13419.js');
 var Tooltip = require('./Tooltip-85e7d561.js');
 var styled = require('styled-components');

package/{TextInput-a4855d3e.js → TextInput-4537f957.js}

@@ -3,6 +3,7 @@
 var defaultTheme = require('./defaultTheme-18d7c1ee.js');
 var React = require('react');
 var nanoid = require('nanoid');
+var lodash = require('lodash');
 var styled = require('styled-components');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -39,26 +40,45 @@ var TextInput = React__default['default'].forwardRef(function TextInput(_ref, fo
       placeholder = _ref.placeholder,
       required = _ref.required,
       disabled = _ref.disabled,
-      error = _ref.error;
+      error = _ref.error,
+      onChange = _ref.onChange;
 
   var _useState = React.useState(nanoid.nanoid()),
       _useState2 = defaultTheme._slicedToArray(_useState, 1),
       uniqueId = _useState2[0];
 
+  var _useState3 = React.useState(value),
+      _useState4 = defaultTheme._slicedToArray(_useState3, 2),
+      controlledValue = _useState4[0],
+      setControlledValue = _useState4[1];
+
+  React.useEffect(function () {
+    setControlledValue(value);
+  }, [value]);
+
+  var onInputChange = function onInputChange(event) {
+    if (lodash.isFunction(onChange)) {
+      onChange(event.target.value);
+    }
+
+    setControlledValue(event.target.value);
+  };
+
   return React__default['default'].createElement(TextInput$1, {
     disabled: disabled
   }, label && React__default['default'].createElement(TextInputLabel, {
     htmlFor: "text-input-".concat(uniqueId),
     placeholderVisible: Boolean(placeholder),
-    inputValue: value
+    inputValue: controlledValue
   }, label, required && ' *'), React__default['default'].createElement(TextInputField, {
     ref: forwardedRef,
-    value: value,
+    value: controlledValue,
     placeholder: placeholder,
     required: required,
     disabled: disabled,
     error: error,
-    id: "text-input-".concat(uniqueId)
+    id: "text-input-".concat(uniqueId),
+    onChange: onInputChange
   }));
 });
 TextInput.defaultProps = {
@@ -70,7 +90,8 @@ TextInput.propTypes = process.env.NODE_ENV !== "production" ? {
   placeholder: defaultTheme.PropTypes.string,
   required: defaultTheme.PropTypes.bool,
   disabled: defaultTheme.PropTypes.bool,
-  error: defaultTheme.PropTypes.bool
+  error: defaultTheme.PropTypes.bool,
+  onChange: defaultTheme.PropTypes.func
 } : {};
 
 exports.TextInput = TextInput;

package/inputs/TextInput/index.js

@@ -1,10 +1,11 @@
 'use strict';
 
-var TextInput = require('../../TextInput-a4855d3e.js');
+var TextInput = require('../../TextInput-4537f957.js');
 require('../../defaultTheme-18d7c1ee.js');
 require('styled-components');
 require('react');
 require('nanoid');
+require('lodash');
 
 
 

package/inputs/index.js

@@ -5,12 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var ActionButton = require('../ActionButton-10a681b9.js');
 var Checkbox = require('../Checkbox-791a409f.js');
 var Radio = require('../Radio-9271a4b6.js');
-var TextInput = require('../TextInput-a4855d3e.js');
+var TextInput = require('../TextInput-4537f957.js');
 require('../defaultTheme-18d7c1ee.js');
 require('styled-components');
 require('react');
 require('nanoid');
 require('polished');
+require('lodash');
 
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ntbjs/react-components",
-  "version": "0.0.1-beta.22",
+  "version": "0.0.1-beta.23",
   "description": "NTBs common front-end design utilities and React components.",
   "scripts": {
     "build": "cross-env NODE_ENV=production rollup -c",

package/widgets/AssetGallery/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var AssetGallery = require('../../AssetGallery-020b30a7.js');
+var AssetGallery = require('../../AssetGallery-001e0a96.js');
 require('../../defaultTheme-18d7c1ee.js');
 require('styled-components');
 require('react');
@@ -11,7 +11,7 @@ require('../../Checkbox-791a409f.js');
 require('nanoid');
 require('../../Radio-9271a4b6.js');
 require('polished');
-require('../../TextInput-a4855d3e.js');
+require('../../TextInput-4537f957.js');
 require('../../Popover-0ff13419.js');
 require('@tippyjs/react');
 require('../../Tooltip-85e7d561.js');

package/widgets/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var AssetGallery = require('../AssetGallery-020b30a7.js');
+var AssetGallery = require('../AssetGallery-001e0a96.js');
 require('../defaultTheme-18d7c1ee.js');
 require('styled-components');
 require('react');
@@ -13,7 +13,7 @@ require('../Checkbox-791a409f.js');
 require('nanoid');
 require('../Radio-9271a4b6.js');
 require('polished');
-require('../TextInput-a4855d3e.js');
+require('../TextInput-4537f957.js');
 require('../Popover-0ff13419.js');
 require('@tippyjs/react');
 require('../Tooltip-85e7d561.js');