@instructure/ui-select 8.18.0 → 8.18.1-snapshot.0

package/LICENSE.md

@@ -0,0 +1,27 @@
+---
+title: The MIT License (MIT)
+category: Getting Started
+order: 9
+---
+
+# The MIT License (MIT)
+
+Copyright (c) 2015 Instructure, Inc.
+
+**Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions.**
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/es/Select/index.js

@@ -69,6 +69,8 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
     this._optionHeight = 36;
 
     this.handleInputRef = node => {
+      var _this$props$inputRef, _this$props;
+
       // ensures list is positioned with respect to input if list is open on mount
       if (!this.state.hasInputRef) {
         this.setState({
@@ -77,11 +79,13 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
       }
 
       this.ref = node;
-      this.props.inputRef?.(node);
+      (_this$props$inputRef = (_this$props = this.props).inputRef) === null || _this$props$inputRef === void 0 ? void 0 : _this$props$inputRef.call(_this$props, node);
     };
 
     this.handleListRef = node => {
-      this.props.listRef?.(node); // store option height to calculate list maxHeight
+      var _this$props$listRef, _this$props2;
+
+      (_this$props$listRef = (_this$props2 = this.props).listRef) === null || _this$props$listRef === void 0 ? void 0 : _this$props$listRef.call(_this$props2, node); // store option height to calculate list maxHeight
 
       if (node && node.querySelector('[role="option"]')) {
         this._optionHeight = node.querySelector('[role="option"]').offsetHeight;
@@ -94,11 +98,15 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
   }
 
   componentDidMount() {
-    this.props.makeStyles?.();
+    var _this$props$makeStyle, _this$props3;
+
+    (_this$props$makeStyle = (_this$props3 = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props3);
   }
 
   componentDidUpdate() {
-    this.props.makeStyles?.(); // scroll option into view if needed
+    var _this$props$makeStyle2, _this$props4;
+
+    (_this$props$makeStyle2 = (_this$props4 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props4); // scroll option into view if needed
 
     this.scrollToOption(this.highlightedOptionId);
   }
@@ -211,23 +219,23 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
     const onRequestHighlightOption = this.props.onRequestHighlightOption;
 
     if (id) {
-      onRequestHighlightOption?.(event, {
+      onRequestHighlightOption === null || onRequestHighlightOption === void 0 ? void 0 : onRequestHighlightOption(event, {
         id
       });
     }
   }
 
   getEventHandlers() {
-    const _this$props = this.props,
-          isShowingOptions = _this$props.isShowingOptions,
-          onRequestShowOptions = _this$props.onRequestShowOptions,
-          onRequestHideOptions = _this$props.onRequestHideOptions,
-          onRequestSelectOption = _this$props.onRequestSelectOption;
+    const _this$props5 = this.props,
+          isShowingOptions = _this$props5.isShowingOptions,
+          onRequestShowOptions = _this$props5.onRequestShowOptions,
+          onRequestHideOptions = _this$props5.onRequestHideOptions,
+          onRequestSelectOption = _this$props5.onRequestSelectOption;
     const highlightedOptionId = this.highlightedOptionId;
     const selectedOptionId = this.selectedOptionId;
     return this.interaction === 'enabled' ? {
       onRequestShowOptions: event => {
-        onRequestShowOptions?.(event);
+        onRequestShowOptions === null || onRequestShowOptions === void 0 ? void 0 : onRequestShowOptions(event);
 
         if (selectedOptionId && !Array.isArray(selectedOptionId)) {
           // highlight selected option on show
@@ -235,7 +243,7 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
         }
       },
       onRequestHideOptions: event => {
-        onRequestHideOptions?.(event);
+        onRequestHideOptions === null || onRequestHideOptions === void 0 ? void 0 : onRequestHideOptions(event);
       },
       onRequestHighlightOption: (event, _ref) => {
         let id = _ref.id,
@@ -272,7 +280,7 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
 
         if (id && this._optionIds.indexOf(id) !== -1) {
           // only select if id exists as a valid option
-          onRequestSelectOption?.(event, {
+          onRequestSelectOption === null || onRequestSelectOption === void 0 ? void 0 : onRequestSelectOption(event, {
             id
           });
         }
@@ -377,12 +385,12 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
     const getListProps = data.getListProps,
           getOptionProps = data.getOptionProps,
           getDisabledOptionProps = data.getDisabledOptionProps;
-    const _this$props2 = this.props,
-          isShowingOptions = _this$props2.isShowingOptions,
-          optionsMaxWidth = _this$props2.optionsMaxWidth,
-          optionsMaxHeight = _this$props2.optionsMaxHeight,
-          visibleOptionsCount = _this$props2.visibleOptionsCount,
-          children = _this$props2.children;
+    const _this$props6 = this.props,
+          isShowingOptions = _this$props6.isShowingOptions,
+          optionsMaxWidth = _this$props6.optionsMaxWidth,
+          optionsMaxHeight = _this$props6.optionsMaxHeight,
+          visibleOptionsCount = _this$props6.visibleOptionsCount,
+          children = _this$props6.children;
     let lastWasGroup = false;
     const viewProps = isShowingOptions ? {
       display: 'block',
@@ -428,11 +436,11 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
   }
 
   renderIcon() {
-    const _this$props3 = this.props,
-          styles = _this$props3.styles,
-          isShowingOptions = _this$props3.isShowingOptions;
+    const _this$props7 = this.props,
+          styles = _this$props7.styles,
+          isShowingOptions = _this$props7.isShowingOptions;
     return jsx("span", {
-      css: styles?.icon
+      css: styles === null || styles === void 0 ? void 0 : styles.icon
     }, isShowingOptions ? _IconArrowOpenUpLine || (_IconArrowOpenUpLine = jsx(IconArrowOpenUpLine, {
       inline: false
     })) : _IconArrowOpenDownLin || (_IconArrowOpenDownLin = jsx(IconArrowOpenDownLine, {
@@ -444,24 +452,24 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
     const getInputProps = data.getInputProps,
           getTriggerProps = data.getTriggerProps;
 
-    const _this$props4 = this.props,
-          renderLabel = _this$props4.renderLabel,
-          inputValue = _this$props4.inputValue,
-          placeholder = _this$props4.placeholder,
-          isRequired = _this$props4.isRequired,
-          shouldNotWrap = _this$props4.shouldNotWrap,
-          size = _this$props4.size,
-          isInline = _this$props4.isInline,
-          width = _this$props4.width,
-          htmlSize = _this$props4.htmlSize,
-          messages = _this$props4.messages,
-          renderBeforeInput = _this$props4.renderBeforeInput,
-          renderAfterInput = _this$props4.renderAfterInput,
-          onFocus = _this$props4.onFocus,
-          onBlur = _this$props4.onBlur,
-          onInputChange = _this$props4.onInputChange,
-          onRequestHideOptions = _this$props4.onRequestHideOptions,
-          rest = _objectWithoutProperties(_this$props4, _excluded2);
+    const _this$props8 = this.props,
+          renderLabel = _this$props8.renderLabel,
+          inputValue = _this$props8.inputValue,
+          placeholder = _this$props8.placeholder,
+          isRequired = _this$props8.isRequired,
+          shouldNotWrap = _this$props8.shouldNotWrap,
+          size = _this$props8.size,
+          isInline = _this$props8.isInline,
+          width = _this$props8.width,
+          htmlSize = _this$props8.htmlSize,
+          messages = _this$props8.messages,
+          renderBeforeInput = _this$props8.renderBeforeInput,
+          renderAfterInput = _this$props8.renderAfterInput,
+          onFocus = _this$props8.onFocus,
+          onBlur = _this$props8.onBlur,
+          onInputChange = _this$props8.onInputChange,
+          onRequestHideOptions = _this$props8.onRequestHideOptions,
+          rest = _objectWithoutProperties(_this$props8, _excluded2);
 
     const interaction = this.interaction;
     const passthroughProps = omitProps(rest, Select.allowedProps);
@@ -515,13 +523,13 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
   }
 
   render() {
-    const _this$props5 = this.props,
-          constrain = _this$props5.constrain,
-          placement = _this$props5.placement,
-          mountNode = _this$props5.mountNode,
-          assistiveText = _this$props5.assistiveText,
-          isShowingOptions = _this$props5.isShowingOptions,
-          styles = _this$props5.styles; // clear temporary option store
+    const _this$props9 = this.props,
+          constrain = _this$props9.constrain,
+          placement = _this$props9.placement,
+          mountNode = _this$props9.mountNode,
+          assistiveText = _this$props9.assistiveText,
+          isShowingOptions = _this$props9.isShowingOptions,
+          styles = _this$props9.styles; // clear temporary option store
 
     this._optionIds = [];
     const highlightedOptionId = this.highlightedOptionId;
@@ -539,12 +547,12 @@ let Select = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, gen
           getDisabledOptionProps = _ref3.getDisabledOptionProps,
           getDescriptionProps = _ref3.getDescriptionProps;
       return jsx("span", getRootProps({
-        css: styles?.select
+        css: styles === null || styles === void 0 ? void 0 : styles.select
       }), this.renderInput({
         getInputProps,
         getTriggerProps
       }), jsx("span", Object.assign({}, getDescriptionProps(), {
-        css: styles?.assistiveText
+        css: styles === null || styles === void 0 ? void 0 : styles.assistiveText
       }), assistiveText), jsx(Popover, {
         constrain: constrain,
         placement: placement,

package/es/Select/theme.js

@@ -31,14 +31,14 @@ const generateComponentTheme = theme => {
   const colors = theme.colors,
         typography = theme.typography;
   const componentVariables = {
-    fontSize: typography?.fontSizeMedium,
-    fontFamily: typography?.fontFamily,
-    fontWeight: typography?.fontWeightNormal,
-    smallIconSize: typography?.fontSizeXSmall,
-    mediumIconSize: typography?.fontSizeSmall,
-    largeIconSize: typography?.fontSizeMedium,
-    color: colors?.textDarkest,
-    background: colors?.backgroundLightest
+    fontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
+    fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
+    fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
+    smallIconSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeXSmall,
+    mediumIconSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
+    largeIconSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
+    color: colors === null || colors === void 0 ? void 0 : colors.textDarkest,
+    background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest
   };
   return { ...componentVariables
   };

package/lib/Select/index.js

@@ -82,6 +82,8 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
     this._optionHeight = 36;
 
     this.handleInputRef = node => {
+      var _this$props$inputRef, _this$props;
+
       // ensures list is positioned with respect to input if list is open on mount
       if (!this.state.hasInputRef) {
         this.setState({
@@ -90,11 +92,13 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
       }
 
       this.ref = node;
-      this.props.inputRef?.(node);
+      (_this$props$inputRef = (_this$props = this.props).inputRef) === null || _this$props$inputRef === void 0 ? void 0 : _this$props$inputRef.call(_this$props, node);
     };
 
     this.handleListRef = node => {
-      this.props.listRef?.(node); // store option height to calculate list maxHeight
+      var _this$props$listRef, _this$props2;
+
+      (_this$props$listRef = (_this$props2 = this.props).listRef) === null || _this$props$listRef === void 0 ? void 0 : _this$props$listRef.call(_this$props2, node); // store option height to calculate list maxHeight
 
       if (node && node.querySelector('[role="option"]')) {
         this._optionHeight = node.querySelector('[role="option"]').offsetHeight;
@@ -107,11 +111,15 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
   }
 
   componentDidMount() {
-    this.props.makeStyles?.();
+    var _this$props$makeStyle, _this$props3;
+
+    (_this$props$makeStyle = (_this$props3 = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props3);
   }
 
   componentDidUpdate() {
-    this.props.makeStyles?.(); // scroll option into view if needed
+    var _this$props$makeStyle2, _this$props4;
+
+    (_this$props$makeStyle2 = (_this$props4 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props4); // scroll option into view if needed
 
     this.scrollToOption(this.highlightedOptionId);
   }
@@ -224,23 +232,23 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
     const onRequestHighlightOption = this.props.onRequestHighlightOption;
 
     if (id) {
-      onRequestHighlightOption?.(event, {
+      onRequestHighlightOption === null || onRequestHighlightOption === void 0 ? void 0 : onRequestHighlightOption(event, {
         id
       });
     }
   }
 
   getEventHandlers() {
-    const _this$props = this.props,
-          isShowingOptions = _this$props.isShowingOptions,
-          onRequestShowOptions = _this$props.onRequestShowOptions,
-          onRequestHideOptions = _this$props.onRequestHideOptions,
-          onRequestSelectOption = _this$props.onRequestSelectOption;
+    const _this$props5 = this.props,
+          isShowingOptions = _this$props5.isShowingOptions,
+          onRequestShowOptions = _this$props5.onRequestShowOptions,
+          onRequestHideOptions = _this$props5.onRequestHideOptions,
+          onRequestSelectOption = _this$props5.onRequestSelectOption;
     const highlightedOptionId = this.highlightedOptionId;
     const selectedOptionId = this.selectedOptionId;
     return this.interaction === 'enabled' ? {
       onRequestShowOptions: event => {
-        onRequestShowOptions?.(event);
+        onRequestShowOptions === null || onRequestShowOptions === void 0 ? void 0 : onRequestShowOptions(event);
 
         if (selectedOptionId && !Array.isArray(selectedOptionId)) {
           // highlight selected option on show
@@ -248,7 +256,7 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
         }
       },
       onRequestHideOptions: event => {
-        onRequestHideOptions?.(event);
+        onRequestHideOptions === null || onRequestHideOptions === void 0 ? void 0 : onRequestHideOptions(event);
       },
       onRequestHighlightOption: (event, _ref) => {
         let id = _ref.id,
@@ -285,7 +293,7 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
 
         if (id && this._optionIds.indexOf(id) !== -1) {
           // only select if id exists as a valid option
-          onRequestSelectOption?.(event, {
+          onRequestSelectOption === null || onRequestSelectOption === void 0 ? void 0 : onRequestSelectOption(event, {
             id
           });
         }
@@ -388,12 +396,12 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
     const getListProps = data.getListProps,
           getOptionProps = data.getOptionProps,
           getDisabledOptionProps = data.getDisabledOptionProps;
-    const _this$props2 = this.props,
-          isShowingOptions = _this$props2.isShowingOptions,
-          optionsMaxWidth = _this$props2.optionsMaxWidth,
-          optionsMaxHeight = _this$props2.optionsMaxHeight,
-          visibleOptionsCount = _this$props2.visibleOptionsCount,
-          children = _this$props2.children;
+    const _this$props6 = this.props,
+          isShowingOptions = _this$props6.isShowingOptions,
+          optionsMaxWidth = _this$props6.optionsMaxWidth,
+          optionsMaxHeight = _this$props6.optionsMaxHeight,
+          visibleOptionsCount = _this$props6.visibleOptionsCount,
+          children = _this$props6.children;
     let lastWasGroup = false;
     const viewProps = isShowingOptions ? {
       display: 'block',
@@ -439,11 +447,11 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
   }
 
   renderIcon() {
-    const _this$props3 = this.props,
-          styles = _this$props3.styles,
-          isShowingOptions = _this$props3.isShowingOptions;
+    const _this$props7 = this.props,
+          styles = _this$props7.styles,
+          isShowingOptions = _this$props7.isShowingOptions;
     return (0, _emotion.jsx)("span", {
-      css: styles?.icon
+      css: styles === null || styles === void 0 ? void 0 : styles.icon
     }, isShowingOptions ? _IconArrowOpenUpLine || (_IconArrowOpenUpLine = (0, _emotion.jsx)(_IconArrowOpenUpLine2.IconArrowOpenUpLine, {
       inline: false
     })) : _IconArrowOpenDownLin || (_IconArrowOpenDownLin = (0, _emotion.jsx)(_IconArrowOpenDownLine.IconArrowOpenDownLine, {
@@ -454,24 +462,24 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
   renderInput(data) {
     const getInputProps = data.getInputProps,
           getTriggerProps = data.getTriggerProps;
-    const _this$props4 = this.props,
-          renderLabel = _this$props4.renderLabel,
-          inputValue = _this$props4.inputValue,
-          placeholder = _this$props4.placeholder,
-          isRequired = _this$props4.isRequired,
-          shouldNotWrap = _this$props4.shouldNotWrap,
-          size = _this$props4.size,
-          isInline = _this$props4.isInline,
-          width = _this$props4.width,
-          htmlSize = _this$props4.htmlSize,
-          messages = _this$props4.messages,
-          renderBeforeInput = _this$props4.renderBeforeInput,
-          renderAfterInput = _this$props4.renderAfterInput,
-          onFocus = _this$props4.onFocus,
-          onBlur = _this$props4.onBlur,
-          onInputChange = _this$props4.onInputChange,
-          onRequestHideOptions = _this$props4.onRequestHideOptions,
-          rest = (0, _objectWithoutProperties2.default)(_this$props4, _excluded2);
+    const _this$props8 = this.props,
+          renderLabel = _this$props8.renderLabel,
+          inputValue = _this$props8.inputValue,
+          placeholder = _this$props8.placeholder,
+          isRequired = _this$props8.isRequired,
+          shouldNotWrap = _this$props8.shouldNotWrap,
+          size = _this$props8.size,
+          isInline = _this$props8.isInline,
+          width = _this$props8.width,
+          htmlSize = _this$props8.htmlSize,
+          messages = _this$props8.messages,
+          renderBeforeInput = _this$props8.renderBeforeInput,
+          renderAfterInput = _this$props8.renderAfterInput,
+          onFocus = _this$props8.onFocus,
+          onBlur = _this$props8.onBlur,
+          onInputChange = _this$props8.onInputChange,
+          onRequestHideOptions = _this$props8.onRequestHideOptions,
+          rest = (0, _objectWithoutProperties2.default)(_this$props8, _excluded2);
     const interaction = this.interaction;
     const passthroughProps = (0, _omitProps.omitProps)(rest, Select.allowedProps);
 
@@ -524,13 +532,13 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
   }
 
   render() {
-    const _this$props5 = this.props,
-          constrain = _this$props5.constrain,
-          placement = _this$props5.placement,
-          mountNode = _this$props5.mountNode,
-          assistiveText = _this$props5.assistiveText,
-          isShowingOptions = _this$props5.isShowingOptions,
-          styles = _this$props5.styles; // clear temporary option store
+    const _this$props9 = this.props,
+          constrain = _this$props9.constrain,
+          placement = _this$props9.placement,
+          mountNode = _this$props9.mountNode,
+          assistiveText = _this$props9.assistiveText,
+          isShowingOptions = _this$props9.isShowingOptions,
+          styles = _this$props9.styles; // clear temporary option store
 
     this._optionIds = [];
     const highlightedOptionId = this.highlightedOptionId;
@@ -548,12 +556,12 @@ let Select = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0
           getDisabledOptionProps = _ref3.getDisabledOptionProps,
           getDescriptionProps = _ref3.getDescriptionProps;
       return (0, _emotion.jsx)("span", getRootProps({
-        css: styles?.select
+        css: styles === null || styles === void 0 ? void 0 : styles.select
       }), this.renderInput({
         getInputProps,
         getTriggerProps
       }), (0, _emotion.jsx)("span", Object.assign({}, getDescriptionProps(), {
-        css: styles?.assistiveText
+        css: styles === null || styles === void 0 ? void 0 : styles.assistiveText
       }), assistiveText), (0, _emotion.jsx)(_Popover.Popover, {
         constrain: constrain,
         placement: placement,

package/lib/Select/theme.js

@@ -38,14 +38,14 @@ const generateComponentTheme = theme => {
   const colors = theme.colors,
         typography = theme.typography;
   const componentVariables = {
-    fontSize: typography?.fontSizeMedium,
-    fontFamily: typography?.fontFamily,
-    fontWeight: typography?.fontWeightNormal,
-    smallIconSize: typography?.fontSizeXSmall,
-    mediumIconSize: typography?.fontSizeSmall,
-    largeIconSize: typography?.fontSizeMedium,
-    color: colors?.textDarkest,
-    background: colors?.backgroundLightest
+    fontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
+    fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
+    fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
+    smallIconSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeXSmall,
+    mediumIconSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
+    largeIconSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
+    color: colors === null || colors === void 0 ? void 0 : colors.textDarkest,
+    background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest
   };
   return { ...componentVariables
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-select",
-  "version": "8.18.0",
+  "version": "8.18.1-snapshot.0+435c9ae79",
   "description": "A component for select and autocomplete behavior.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,30 +23,30 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.18.0",
-    "@instructure/ui-color-utils": "8.18.0",
-    "@instructure/ui-test-locator": "8.18.0",
-    "@instructure/ui-test-utils": "8.18.0",
-    "@instructure/ui-themes": "8.18.0"
+    "@instructure/ui-babel-preset": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-color-utils": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-test-locator": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-test-utils": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-themes": "8.18.1-snapshot.0+435c9ae79"
   },
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/emotion": "8.18.0",
-    "@instructure/shared-types": "8.18.0",
-    "@instructure/ui-dom-utils": "8.18.0",
-    "@instructure/ui-form-field": "8.18.0",
-    "@instructure/ui-icons": "8.18.0",
-    "@instructure/ui-options": "8.18.0",
-    "@instructure/ui-popover": "8.18.0",
-    "@instructure/ui-position": "8.18.0",
-    "@instructure/ui-prop-types": "8.18.0",
-    "@instructure/ui-react-utils": "8.18.0",
-    "@instructure/ui-selectable": "8.18.0",
-    "@instructure/ui-testable": "8.18.0",
-    "@instructure/ui-text-input": "8.18.0",
-    "@instructure/ui-utils": "8.18.0",
-    "@instructure/ui-view": "8.18.0",
-    "@instructure/uid": "8.18.0",
+    "@instructure/emotion": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/shared-types": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-dom-utils": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-form-field": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-icons": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-options": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-popover": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-position": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-prop-types": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-react-utils": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-selectable": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-testable": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-text-input": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-utils": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-view": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/uid": "8.18.1-snapshot.0+435c9ae79",
     "prop-types": "^15"
   },
   "peerDependencies": {
@@ -55,5 +55,6 @@
   "publishConfig": {
     "access": "public"
   },
-  "sideEffects": false
+  "sideEffects": false,
+  "gitHead": "435c9ae794c15e2bd103f700f8c4e946d91c1b59"
 }