@ntbjs/react-components 1.1.0-beta.20 → 1.1.0-beta.21

package/{Instructions-dfb20ca2.js → Instructions-98d6fe45.js}

@@ -34,7 +34,8 @@ var Instructions = React__default['default'].forwardRef(function Instructions(_r
       readOnly = _ref.readOnly,
       lightBackground = _ref.lightBackground,
       options = _ref.options,
-      props = defaultTheme._objectWithoutProperties(_ref, ["clickToAdd", "customAddMessage", "selectedOption", "readOnly", "lightBackground", "options"]);
+      onChangeProp = _ref.onChange,
+      props = defaultTheme._objectWithoutProperties(_ref, ["clickToAdd", "customAddMessage", "selectedOption", "readOnly", "lightBackground", "options", "onChange"]);
 
   var filterOptions = function filterOptions(inputValue) {
     return options.filter(function (option) {
@@ -42,6 +43,14 @@ var Instructions = React__default['default'].forwardRef(function Instructions(_r
     });
   };
 
+  var onChange = React.useCallback(function (event) {
+    setCurrentValue(event.target.value);
+
+    if (lodash.isFunction(onChangeProp)) {
+      onChangeProp(event);
+    }
+  }, [onChangeProp]);
+
   var loadOptions = function loadOptions(inputValue, prevOptions) {
     var pageLength = 10;
     var filteredOptions;
@@ -160,6 +169,7 @@ var Instructions = React__default['default'].forwardRef(function Instructions(_r
   return React__default['default'].createElement(Instructions$1, defaultTheme._extends({
     ref: forwardedRef,
     initialHover: initialHover,
+    onChange: onChange,
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave
   }, props), React__default['default'].createElement(TopBarContainer, {
@@ -168,7 +178,7 @@ var Instructions = React__default['default'].forwardRef(function Instructions(_r
   }, React__default['default'].createElement(SelectContainer, null, React__default['default'].createElement(AutocompleteSelect.AutocompleteSelect, {
     warning: true,
     creatable: false,
-    defaultValue: selectedOption,
+    value: selectedOption,
     loadOptions: loadOptionsPromise,
     onChange: handleChange
   }))), React__default['default'].createElement(InstructionsArea, null, React__default['default'].createElement(TextArea.TextArea, {
@@ -193,7 +203,8 @@ Instructions.propTypes = process.env.NODE_ENV !== "production" ? {
   disabled: defaultTheme.PropTypes.bool,
   readOnly: defaultTheme.PropTypes.bool,
   lightBackground: defaultTheme.PropTypes.bool,
-  options: defaultTheme.PropTypes.array
+  options: defaultTheme.PropTypes.array,
+  onChange: defaultTheme.PropTypes.func
 } : {};
 
 exports.Instructions = Instructions;

package/package.json

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

package/widgets/Instructions/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Instructions = require('../../Instructions-dfb20ca2.js');
+var Instructions = require('../../Instructions-98d6fe45.js');
 require('../../defaultTheme-870f7df1.js');
 require('styled-components');
 require('react');

package/widgets/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var AssetGallery = require('../AssetGallery-763861f4.js');
 var ContextMenu = require('../ContextMenu-ccb7a26a.js');
 var AssetPreviewTopBar = require('../AssetPreviewTopBar-020a6f96.js');
-var Instructions = require('../Instructions-dfb20ca2.js');
+var Instructions = require('../Instructions-98d6fe45.js');
 require('../defaultTheme-870f7df1.js');
 require('styled-components');
 require('react');