@instructure/ui-simple-select 8.33.1-snapshot-1 → 8.33.2-snapshot-5

package/lib/SimpleSelect/__examples__/SimpleSelect.examples.js

@@ -1,16 +1,12 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _SimpleSelect = require("../../SimpleSelect");
-
 /*
  * The MIT License (MIT)
  *

package/lib/SimpleSelect/index.js

@@ -1,44 +1,27 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.SimpleSelect = void 0;
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _testable = require("@instructure/ui-testable/lib/testable.js");
-
 var _matchComponentTypes = require("@instructure/ui-react-utils/lib/matchComponentTypes.js");
-
 var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
-
 var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
-
 var _getInteraction = require("@instructure/ui-react-utils/lib/getInteraction.js");
-
 var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
-
 var _Select = require("@instructure/ui-select/lib/Select");
-
 var _Option = require("./Option");
-
 var _Group = require("./Group");
-
 var _props = require("./props");
-
 const _excluded = ["id", "value", "children", "renderBeforeLabel", "renderAfterLabel"],
-      _excluded2 = ["id", "renderLabel", "children"],
-      _excluded3 = ["renderLabel", "value", "defaultValue", "id", "size", "assistiveText", "placeholder", "interaction", "isRequired", "isInline", "width", "optionsMaxWidth", "optionsMaxHeight", "visibleOptionsCount", "messages", "placement", "constrain", "mountNode", "inputRef", "listRef", "renderEmptyOption", "renderBeforeInput", "renderAfterInput", "onFocus", "onBlur", "onShowOptions", "onHideOptions", "children"];
-
+  _excluded2 = ["id", "renderLabel", "children"],
+  _excluded3 = ["renderLabel", "value", "defaultValue", "id", "size", "assistiveText", "placeholder", "interaction", "isRequired", "isInline", "width", "optionsMaxWidth", "optionsMaxHeight", "visibleOptionsCount", "messages", "placement", "constrain", "mountNode", "inputRef", "listRef", "renderEmptyOption", "renderBeforeInput", "renderAfterInput", "onFocus", "onBlur", "onShowOptions", "onHideOptions", "children"];
 var _dec, _dec2, _class, _class2;
-
 /**
 ---
 category: components
@@ -51,62 +34,48 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
     super(props);
     this.ref = null;
     this._emptyOptionId = void 0;
-
     this.getOption = (field, value) => {
       const children = _react.Children.toArray(this.props.children);
-
       let match;
-
       for (let i = 0; i < children.length; ++i) {
         const child = children[i];
-
         if ((0, _matchComponentTypes.matchComponentTypes)(child, [_Option.Option])) {
           if (child.props[field] === value) {
             match = child;
           }
         } else if ((0, _matchComponentTypes.matchComponentTypes)(child, [_Group.Group])) {
           const groupChildren = _react.Children.toArray(child.props.children);
-
           for (let j = 0; j < groupChildren.length; ++j) {
             const groupChild = groupChildren[j];
-
             if (groupChild.props[field] === value) {
               match = groupChild;
               break;
             }
           }
         }
-
         if (match) break;
       }
-
       return match;
     };
-
     this.handleRef = node => {
       this.ref = node;
     };
-
     this.handleBlur = event => {
       this.setState({
         highlightedOptionId: void 0
       });
-
       if (typeof this.props.onBlur === 'function') {
         this.props.onBlur(event);
       }
     };
-
     this.handleShowOptions = event => {
       this.setState({
         isShowingOptions: true
       });
-
       if (typeof this.props.onShowOptions === 'function') {
         this.props.onShowOptions(event);
       }
     };
-
     this.handleHideOptions = event => {
       this.setState(state => {
         const option = this.getOption('id', state.selectedOptionId);
@@ -116,12 +85,10 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
           inputValue: option ? option.props.children : ''
         };
       });
-
       if (typeof this.props.onHideOptions === 'function') {
         this.props.onHideOptions(event);
       }
     };
-
     this.handleHighlightOption = (event, _ref) => {
       let id = _ref.id;
       if (id === this._emptyOptionId) return;
@@ -133,10 +100,8 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
         inputValue
       });
     };
-
     this.handleSelectOption = (event, _ref2) => {
       let id = _ref2.id;
-
       if (id === this._emptyOptionId) {
         // selected option is the empty option
         this.setState({
@@ -144,10 +109,8 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
         });
         return;
       }
-
       const option = this.getOption('id', id);
       const value = option && option.props.value;
-
       if (this.isControlled) {
         this.setState({
           isShowingOptions: false
@@ -158,24 +121,20 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
           selectedOptionId: id,
           inputValue: option ? option.props.children : state.inputValue
         }));
-      } // fire onChange if selected option changed
-
-
+      }
+      // fire onChange if selected option changed
       if (option && typeof this.props.onChange === 'function') {
         this.props.onChange(event, {
           value,
           id
         });
-      } // hide options list whenever selection is made
-
-
+      }
+      // hide options list whenever selection is made
       if (typeof this.props.onHideOptions === 'function') {
         this.props.onHideOptions(event);
       }
     };
-
     const _option = this.getInitialOption(props);
-
     this.state = {
       inputValue: _option ? _option.props.children : '',
       isShowingOptions: false,
@@ -184,112 +143,87 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
     };
     this._emptyOptionId = props.deterministicId('Select-EmptyOption');
   }
-
   get _select() {
     return this.ref;
   }
-
   focus() {
     this.ref && this.ref.focus();
   }
-
   get focused() {
     return this.ref ? this.ref.focused : false;
   }
-
   get id() {
     return this.ref ? this.ref.id : void 0;
   }
-
   get isControlled() {
     return typeof this.props.value !== 'undefined';
   }
-
   get interaction() {
     return (0, _getInteraction.getInteraction)({
       props: this.props
     });
   }
-
   componentDidUpdate(prevProps) {
     if (this.props.value !== prevProps.value) {
       let option = this.getOption('value', this.props.value);
-
       if (typeof this.props.value === 'undefined') {
         // preserve current value when changing from controlled to uncontrolled
         option = this.getOption('value', prevProps.value);
       }
-
       this.setState({
         inputValue: option ? option.props.children : '',
         selectedOptionId: option ? option.props.id : ''
       });
     }
   }
-
   getInitialOption(props) {
     const value = props.value,
-          defaultValue = props.defaultValue;
+      defaultValue = props.defaultValue;
     const initialValue = value || defaultValue;
-
     if (typeof initialValue === 'string' || typeof initialValue === 'number') {
       // get option based on value or defaultValue, if provided
       return this.getOption('value', initialValue);
-    } // otherwise get the first option
-
-
+    }
+    // otherwise get the first option
     return this.getFirstOption();
   }
-
   getOptionLabelById(id) {
     const option = this.getOption('id', id);
     return option ? option.props.children : '';
   }
-
   getFirstOption() {
     const children = _react.Children.toArray(this.props.children);
-
     let match;
-
     for (let i = 0; i < children.length; i++) {
       const child = children[i];
-
       if ((0, _matchComponentTypes.matchComponentTypes)(child, [_Option.Option])) {
         match = child;
       } else if ((0, _matchComponentTypes.matchComponentTypes)(child, [_Group.Group])) {
         // first child is a group, not an option, find first child in group
         match = _react.Children.toArray(child.props.children)[0];
       }
-
       if (match) {
         break;
       }
     }
-
     return match;
   }
-
   renderChildren() {
     let children = _react.Children.toArray(this.props.children);
-
     children = _react.Children.map(children, child => {
       if ((0, _matchComponentTypes.matchComponentTypes)(child, [_Option.Option])) {
         return this.renderOption(child);
       } else if ((0, _matchComponentTypes.matchComponentTypes)(child, [_Group.Group])) {
         return this.renderGroup(child);
       }
-
       return null;
     }).filter(child => !!child);
-
     if (children.length === 0) {
       // no valid children, render empty option
       return this.renderEmptyOption();
     }
-
     return children;
   }
-
   renderEmptyOption() {
     return /*#__PURE__*/_react.default.createElement(_Select.Select.Option, {
       id: this._emptyOptionId,
@@ -297,22 +231,19 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
       isSelected: false
     }, (0, _callRenderProp.callRenderProp)(this.props.renderEmptyOption));
   }
-
   renderOption(option) {
     const _option$props = option.props,
-          id = _option$props.id,
-          value = _option$props.value,
-          children = _option$props.children,
-          renderBeforeLabel = _option$props.renderBeforeLabel,
-          renderAfterLabel = _option$props.renderAfterLabel,
-          rest = (0, _objectWithoutProperties2.default)(_option$props, _excluded);
+      id = _option$props.id,
+      value = _option$props.value,
+      children = _option$props.children,
+      renderBeforeLabel = _option$props.renderBeforeLabel,
+      renderAfterLabel = _option$props.renderAfterLabel,
+      rest = (0, _objectWithoutProperties2.default)(_option$props, _excluded);
     const isDisabled = option.props.isDisabled;
     const isSelected = id === this.state.selectedOptionId;
     const isHighlighted = id === this.state.highlightedOptionId;
-
     const getRenderLabel = renderLabel => {
       var _renderLabel$prototyp;
-
       return typeof renderLabel === 'function' && !(renderLabel !== null && renderLabel !== void 0 && (_renderLabel$prototyp = renderLabel.prototype) !== null && _renderLabel$prototyp !== void 0 && _renderLabel$prototyp.isReactComponent) ? renderLabel.bind(null, {
         id,
         isDisabled,
@@ -321,7 +252,6 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
         children
       }) : renderLabel;
     };
-
     return /*#__PURE__*/_react.default.createElement(_Select.Select.Option, Object.assign({
       id: id,
       value: value,
@@ -333,50 +263,48 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
       renderAfterLabel: getRenderLabel(renderAfterLabel)
     }, (0, _passthroughProps.passthroughProps)(rest)), children);
   }
-
   renderGroup(group) {
     const _group$props = group.props,
-          id = _group$props.id,
-          renderLabel = _group$props.renderLabel,
-          children = _group$props.children,
-          rest = (0, _objectWithoutProperties2.default)(_group$props, _excluded2);
+      id = _group$props.id,
+      renderLabel = _group$props.renderLabel,
+      children = _group$props.children,
+      rest = (0, _objectWithoutProperties2.default)(_group$props, _excluded2);
     return /*#__PURE__*/_react.default.createElement(_Select.Select.Group, Object.assign({
       renderLabel: renderLabel,
       key: group.key || id
     }, (0, _passthroughProps.passthroughProps)(rest)), _react.Children.map(children, child => this.renderOption(child)));
   }
-
   render() {
     const _this$props = this.props,
-          renderLabel = _this$props.renderLabel,
-          value = _this$props.value,
-          defaultValue = _this$props.defaultValue,
-          id = _this$props.id,
-          size = _this$props.size,
-          assistiveText = _this$props.assistiveText,
-          placeholder = _this$props.placeholder,
-          interaction = _this$props.interaction,
-          isRequired = _this$props.isRequired,
-          isInline = _this$props.isInline,
-          width = _this$props.width,
-          optionsMaxWidth = _this$props.optionsMaxWidth,
-          optionsMaxHeight = _this$props.optionsMaxHeight,
-          visibleOptionsCount = _this$props.visibleOptionsCount,
-          messages = _this$props.messages,
-          placement = _this$props.placement,
-          constrain = _this$props.constrain,
-          mountNode = _this$props.mountNode,
-          inputRef = _this$props.inputRef,
-          listRef = _this$props.listRef,
-          renderEmptyOption = _this$props.renderEmptyOption,
-          renderBeforeInput = _this$props.renderBeforeInput,
-          renderAfterInput = _this$props.renderAfterInput,
-          onFocus = _this$props.onFocus,
-          onBlur = _this$props.onBlur,
-          onShowOptions = _this$props.onShowOptions,
-          onHideOptions = _this$props.onHideOptions,
-          children = _this$props.children,
-          rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded3);
+      renderLabel = _this$props.renderLabel,
+      value = _this$props.value,
+      defaultValue = _this$props.defaultValue,
+      id = _this$props.id,
+      size = _this$props.size,
+      assistiveText = _this$props.assistiveText,
+      placeholder = _this$props.placeholder,
+      interaction = _this$props.interaction,
+      isRequired = _this$props.isRequired,
+      isInline = _this$props.isInline,
+      width = _this$props.width,
+      optionsMaxWidth = _this$props.optionsMaxWidth,
+      optionsMaxHeight = _this$props.optionsMaxHeight,
+      visibleOptionsCount = _this$props.visibleOptionsCount,
+      messages = _this$props.messages,
+      placement = _this$props.placement,
+      constrain = _this$props.constrain,
+      mountNode = _this$props.mountNode,
+      inputRef = _this$props.inputRef,
+      listRef = _this$props.listRef,
+      renderEmptyOption = _this$props.renderEmptyOption,
+      renderBeforeInput = _this$props.renderBeforeInput,
+      renderAfterInput = _this$props.renderAfterInput,
+      onFocus = _this$props.onFocus,
+      onBlur = _this$props.onBlur,
+      onShowOptions = _this$props.onShowOptions,
+      onHideOptions = _this$props.onHideOptions,
+      children = _this$props.children,
+      rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded3);
     return /*#__PURE__*/_react.default.createElement(_Select.Select, Object.assign({
       renderLabel: renderLabel,
       inputValue: this.state.inputValue,
@@ -409,7 +337,6 @@ let SimpleSelect = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
       onRequestSelectOption: this.handleSelectOption
     }, (0, _passthroughProps.passthroughProps)(rest)), this.renderChildren());
   }
-
 }, _class2.displayName = "SimpleSelect", _class2.componentId = 'SimpleSelect', _class2.Option = _Option.Option, _class2.Group = _Group.Group, _class2.allowedProps = _props.allowedProps, _class2.propTypes = _props.propTypes, _class2.defaultProps = {
   size: 'medium',
   isRequired: false,

package/lib/SimpleSelect/locator.js

@@ -10,9 +10,7 @@ Object.defineProperty(exports, "SimpleSelectLocator", {
   }
 });
 exports.default = void 0;
-
 var _SimpleSelectLocator = require("./SimpleSelectLocator");
-
 /*
  * The MIT License (MIT)
  *

package/lib/SimpleSelect/props.js

@@ -1,24 +1,16 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.propTypes = exports.allowedProps = void 0;
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _Children = require("@instructure/ui-prop-types/lib/Children.js");
-
 var _FormPropTypes = require("@instructure/ui-form-field/lib/FormPropTypes.js");
-
 var _PositionPropTypes = require("@instructure/ui-position/lib/PositionPropTypes.js");
-
 var _Group = require("./Group");
-
 var _Option = require("./Option");
-
 /*
  * The MIT License (MIT)
  *
@@ -42,6 +34,7 @@ var _Option = require("./Option");
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 const propTypes = {
   renderLabel: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]).isRequired,
   // TODO: it was using the "controllable" util, in the TS migration mimic that behaviour

package/lib/index.js

@@ -9,5 +9,4 @@ Object.defineProperty(exports, "SimpleSelect", {
     return _SimpleSelect.SimpleSelect;
   }
 });
-
 var _SimpleSelect = require("./SimpleSelect");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-simple-select",
-  "version": "8.33.1-snapshot-1",
+  "version": "8.33.2-snapshot-5",
   "description": "A component for standard select element behavior.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -24,22 +24,22 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/console": "8.33.1-snapshot-1",
-    "@instructure/shared-types": "8.33.1-snapshot-1",
-    "@instructure/ui-form-field": "8.33.1-snapshot-1",
-    "@instructure/ui-position": "8.33.1-snapshot-1",
-    "@instructure/ui-prop-types": "8.33.1-snapshot-1",
-    "@instructure/ui-react-utils": "8.33.1-snapshot-1",
-    "@instructure/ui-select": "8.33.1-snapshot-1",
-    "@instructure/ui-testable": "8.33.1-snapshot-1",
+    "@instructure/console": "8.33.2-snapshot-5",
+    "@instructure/shared-types": "8.33.2-snapshot-5",
+    "@instructure/ui-form-field": "8.33.2-snapshot-5",
+    "@instructure/ui-position": "8.33.2-snapshot-5",
+    "@instructure/ui-prop-types": "8.33.2-snapshot-5",
+    "@instructure/ui-react-utils": "8.33.2-snapshot-5",
+    "@instructure/ui-select": "8.33.2-snapshot-5",
+    "@instructure/ui-testable": "8.33.2-snapshot-5",
     "prop-types": "^15"
   },
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.33.1-snapshot-1",
-    "@instructure/ui-color-utils": "8.33.1-snapshot-1",
-    "@instructure/ui-icons": "8.33.1-snapshot-1",
-    "@instructure/ui-test-locator": "8.33.1-snapshot-1",
-    "@instructure/ui-test-utils": "8.33.1-snapshot-1"
+    "@instructure/ui-babel-preset": "8.33.2-snapshot-5",
+    "@instructure/ui-color-utils": "8.33.2-snapshot-5",
+    "@instructure/ui-icons": "8.33.2-snapshot-5",
+    "@instructure/ui-test-locator": "8.33.2-snapshot-5",
+    "@instructure/ui-test-utils": "8.33.2-snapshot-5"
   },
   "peerDependencies": {
     "react": ">=16.8 <=18"