@instructure/ui-text-input 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/TextInput/index.js

@@ -113,15 +113,21 @@ let TextInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
   }
 
   componentDidMount() {
-    this.props.makeStyles?.(this.makeStyleProps());
+    var _this$props$makeStyle, _this$props;
+
+    (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, this.makeStyleProps());
   }
 
   componentDidUpdate() {
-    this.props.makeStyles?.(this.makeStyleProps());
+    var _this$props$makeStyle2, _this$props2;
+
+    (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, this.makeStyleProps());
   }
 
   focus() {
-    this._input?.focus();
+    var _this$_input;
+
+    (_this$_input = this._input) === null || _this$_input === void 0 ? void 0 : _this$_input.focus();
   }
 
   get interaction() {
@@ -145,7 +151,9 @@ let TextInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
   }
 
   get value() {
-    return this._input?.value;
+    var _this$_input2;
+
+    return (_this$_input2 = this._input) === null || _this$_input2 === void 0 ? void 0 : _this$_input2.value;
   }
 
   get id() {
@@ -153,17 +161,19 @@ let TextInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
   }
 
   renderInput() {
-    const _this$props = this.props,
-          type = _this$props.type,
-          size = _this$props.size,
-          htmlSize = _this$props.htmlSize,
-          display = _this$props.display,
-          textAlign = _this$props.textAlign,
-          placeholder = _this$props.placeholder,
-          value = _this$props.value,
-          defaultValue = _this$props.defaultValue,
-          isRequired = _this$props.isRequired,
-          rest = _objectWithoutProperties(_this$props, _excluded);
+    var _this$props$styles;
+
+    const _this$props3 = this.props,
+          type = _this$props3.type,
+          size = _this$props3.size,
+          htmlSize = _this$props3.htmlSize,
+          display = _this$props3.display,
+          textAlign = _this$props3.textAlign,
+          placeholder = _this$props3.placeholder,
+          value = _this$props3.value,
+          defaultValue = _this$props3.defaultValue,
+          isRequired = _this$props3.isRequired,
+          rest = _objectWithoutProperties(_this$props3, _excluded);
 
     const props = passthroughProps(rest);
     const interaction = this.interaction;
@@ -178,7 +188,7 @@ let TextInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
     }
 
     return jsx("input", Object.assign({}, props, {
-      css: this.props.styles?.textInput,
+      css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.textInput,
       defaultValue: defaultValue,
       value: value,
       placeholder: placeholder,
@@ -198,15 +208,15 @@ let TextInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
   }
 
   render() {
-    const _this$props2 = this.props,
-          width = _this$props2.width,
-          display = _this$props2.display,
-          renderLabel = _this$props2.renderLabel,
-          renderBeforeInput = _this$props2.renderBeforeInput,
-          renderAfterInput = _this$props2.renderAfterInput,
-          messages = _this$props2.messages,
-          inputContainerRef = _this$props2.inputContainerRef,
-          styles = _this$props2.styles;
+    const _this$props4 = this.props,
+          width = _this$props4.width,
+          display = _this$props4.display,
+          renderLabel = _this$props4.renderLabel,
+          renderBeforeInput = _this$props4.renderBeforeInput,
+          renderAfterInput = _this$props4.renderAfterInput,
+          messages = _this$props4.messages,
+          inputContainerRef = _this$props4.inputContainerRef,
+          styles = _this$props4.styles;
     const hasBeforeElement = renderBeforeInput && callRenderProp(renderBeforeInput);
     const hasAfterElement = renderAfterInput && callRenderProp(renderAfterInput);
     const renderBeforeOrAfter = hasBeforeElement || hasAfterElement;
@@ -221,19 +231,19 @@ let TextInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
       layout: this.props.layout,
       elementRef: this.handleRef
     }, jsx("span", {
-      css: styles?.facade
+      css: styles === null || styles === void 0 ? void 0 : styles.facade
     }, renderBeforeOrAfter ? jsx("div", null, jsx("span", {
-      css: styles?.layout
+      css: styles === null || styles === void 0 ? void 0 : styles.layout
     }, hasBeforeElement && jsx("span", {
-      css: styles?.beforeElement
+      css: styles === null || styles === void 0 ? void 0 : styles.beforeElement
     }, callRenderProp(renderBeforeInput)), jsx("span", {
-      css: styles?.innerWrapper
+      css: styles === null || styles === void 0 ? void 0 : styles.innerWrapper
     }, jsx("span", {
-      css: styles?.inputLayout
+      css: styles === null || styles === void 0 ? void 0 : styles.inputLayout
     }, jsx("span", {
-      css: styles?.innerWrapper
+      css: styles === null || styles === void 0 ? void 0 : styles.innerWrapper
     }, this.renderInput()), hasAfterElement && jsx("span", {
-      css: styles?.afterElement
+      css: styles === null || styles === void 0 ? void 0 : styles.afterElement
     }, callRenderProp(renderAfterInput)))))) :
     /* If no prepended or appended content, don't render Flex layout */
     this.renderInput()));

package/es/TextInput/theme.js

@@ -41,27 +41,27 @@ const generateComponentTheme = theme => {
     }
   };
   const componentVariables = {
-    fontFamily: typography?.fontFamily,
-    fontWeight: typography?.fontWeightNormal,
-    borderWidth: borders?.widthSmall,
-    borderStyle: borders?.style,
-    borderColor: colors?.borderMedium,
-    borderRadius: borders?.radiusMedium,
-    color: colors?.textDarkest,
-    background: colors?.backgroundLightest,
-    padding: spacing?.small,
-    focusOutlineWidth: borders?.widthMedium,
-    focusOutlineStyle: borders?.style,
-    focusOutlineColor: colors?.borderBrand,
-    errorBorderColor: colors?.borderDanger,
-    errorOutlineColor: colors?.borderDanger,
-    placeholderColor: colors?.textDark,
-    smallFontSize: typography?.fontSizeSmall,
-    smallHeight: forms?.inputHeightSmall,
-    mediumFontSize: typography?.fontSizeMedium,
-    mediumHeight: forms?.inputHeightMedium,
-    largeFontSize: typography?.fontSizeLarge,
-    largeHeight: forms?.inputHeightLarge
+    fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
+    fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
+    borderWidth: borders === null || borders === void 0 ? void 0 : borders.widthSmall,
+    borderStyle: borders === null || borders === void 0 ? void 0 : borders.style,
+    borderColor: colors === null || colors === void 0 ? void 0 : colors.borderMedium,
+    borderRadius: borders === null || borders === void 0 ? void 0 : borders.radiusMedium,
+    color: colors === null || colors === void 0 ? void 0 : colors.textDarkest,
+    background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
+    padding: spacing === null || spacing === void 0 ? void 0 : spacing.small,
+    focusOutlineWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
+    focusOutlineStyle: borders === null || borders === void 0 ? void 0 : borders.style,
+    focusOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderBrand,
+    errorBorderColor: colors === null || colors === void 0 ? void 0 : colors.borderDanger,
+    errorOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderDanger,
+    placeholderColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
+    smallFontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
+    smallHeight: forms === null || forms === void 0 ? void 0 : forms.inputHeightSmall,
+    mediumFontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
+    mediumHeight: forms === null || forms === void 0 ? void 0 : forms.inputHeightMedium,
+    largeFontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeLarge,
+    largeHeight: forms === null || forms === void 0 ? void 0 : forms.inputHeightLarge
   };
   return { ...componentVariables,
     ...themeSpecificStyle[themeName]

package/lib/TextInput/index.js

@@ -114,15 +114,21 @@ let TextInput = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 =
   }
 
   componentDidMount() {
-    this.props.makeStyles?.(this.makeStyleProps());
+    var _this$props$makeStyle, _this$props;
+
+    (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, this.makeStyleProps());
   }
 
   componentDidUpdate() {
-    this.props.makeStyles?.(this.makeStyleProps());
+    var _this$props$makeStyle2, _this$props2;
+
+    (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, this.makeStyleProps());
   }
 
   focus() {
-    this._input?.focus();
+    var _this$_input;
+
+    (_this$_input = this._input) === null || _this$_input === void 0 ? void 0 : _this$_input.focus();
   }
 
   get interaction() {
@@ -146,7 +152,9 @@ let TextInput = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 =
   }
 
   get value() {
-    return this._input?.value;
+    var _this$_input2;
+
+    return (_this$_input2 = this._input) === null || _this$_input2 === void 0 ? void 0 : _this$_input2.value;
   }
 
   get id() {
@@ -154,17 +162,19 @@ let TextInput = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 =
   }
 
   renderInput() {
-    const _this$props = this.props,
-          type = _this$props.type,
-          size = _this$props.size,
-          htmlSize = _this$props.htmlSize,
-          display = _this$props.display,
-          textAlign = _this$props.textAlign,
-          placeholder = _this$props.placeholder,
-          value = _this$props.value,
-          defaultValue = _this$props.defaultValue,
-          isRequired = _this$props.isRequired,
-          rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
+    var _this$props$styles;
+
+    const _this$props3 = this.props,
+          type = _this$props3.type,
+          size = _this$props3.size,
+          htmlSize = _this$props3.htmlSize,
+          display = _this$props3.display,
+          textAlign = _this$props3.textAlign,
+          placeholder = _this$props3.placeholder,
+          value = _this$props3.value,
+          defaultValue = _this$props3.defaultValue,
+          isRequired = _this$props3.isRequired,
+          rest = (0, _objectWithoutProperties2.default)(_this$props3, _excluded);
     const props = (0, _passthroughProps.passthroughProps)(rest);
     const interaction = this.interaction;
     let descriptionIds = '';
@@ -178,7 +188,7 @@ let TextInput = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 =
     }
 
     return (0, _emotion.jsx)("input", Object.assign({}, props, {
-      css: this.props.styles?.textInput,
+      css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.textInput,
       defaultValue: defaultValue,
       value: value,
       placeholder: placeholder,
@@ -198,15 +208,15 @@ let TextInput = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 =
   }
 
   render() {
-    const _this$props2 = this.props,
-          width = _this$props2.width,
-          display = _this$props2.display,
-          renderLabel = _this$props2.renderLabel,
-          renderBeforeInput = _this$props2.renderBeforeInput,
-          renderAfterInput = _this$props2.renderAfterInput,
-          messages = _this$props2.messages,
-          inputContainerRef = _this$props2.inputContainerRef,
-          styles = _this$props2.styles;
+    const _this$props4 = this.props,
+          width = _this$props4.width,
+          display = _this$props4.display,
+          renderLabel = _this$props4.renderLabel,
+          renderBeforeInput = _this$props4.renderBeforeInput,
+          renderAfterInput = _this$props4.renderAfterInput,
+          messages = _this$props4.messages,
+          inputContainerRef = _this$props4.inputContainerRef,
+          styles = _this$props4.styles;
     const hasBeforeElement = renderBeforeInput && (0, _callRenderProp.callRenderProp)(renderBeforeInput);
     const hasAfterElement = renderAfterInput && (0, _callRenderProp.callRenderProp)(renderAfterInput);
     const renderBeforeOrAfter = hasBeforeElement || hasAfterElement;
@@ -221,19 +231,19 @@ let TextInput = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 =
       layout: this.props.layout,
       elementRef: this.handleRef
     }, (0, _emotion.jsx)("span", {
-      css: styles?.facade
+      css: styles === null || styles === void 0 ? void 0 : styles.facade
     }, renderBeforeOrAfter ? (0, _emotion.jsx)("div", null, (0, _emotion.jsx)("span", {
-      css: styles?.layout
+      css: styles === null || styles === void 0 ? void 0 : styles.layout
     }, hasBeforeElement && (0, _emotion.jsx)("span", {
-      css: styles?.beforeElement
+      css: styles === null || styles === void 0 ? void 0 : styles.beforeElement
     }, (0, _callRenderProp.callRenderProp)(renderBeforeInput)), (0, _emotion.jsx)("span", {
-      css: styles?.innerWrapper
+      css: styles === null || styles === void 0 ? void 0 : styles.innerWrapper
     }, (0, _emotion.jsx)("span", {
-      css: styles?.inputLayout
+      css: styles === null || styles === void 0 ? void 0 : styles.inputLayout
     }, (0, _emotion.jsx)("span", {
-      css: styles?.innerWrapper
+      css: styles === null || styles === void 0 ? void 0 : styles.innerWrapper
     }, this.renderInput()), hasAfterElement && (0, _emotion.jsx)("span", {
-      css: styles?.afterElement
+      css: styles === null || styles === void 0 ? void 0 : styles.afterElement
     }, (0, _callRenderProp.callRenderProp)(renderAfterInput)))))) :
     /* If no prepended or appended content, don't render Flex layout */
     this.renderInput()));

package/lib/TextInput/theme.js

@@ -48,27 +48,27 @@ const generateComponentTheme = theme => {
     }
   };
   const componentVariables = {
-    fontFamily: typography?.fontFamily,
-    fontWeight: typography?.fontWeightNormal,
-    borderWidth: borders?.widthSmall,
-    borderStyle: borders?.style,
-    borderColor: colors?.borderMedium,
-    borderRadius: borders?.radiusMedium,
-    color: colors?.textDarkest,
-    background: colors?.backgroundLightest,
-    padding: spacing?.small,
-    focusOutlineWidth: borders?.widthMedium,
-    focusOutlineStyle: borders?.style,
-    focusOutlineColor: colors?.borderBrand,
-    errorBorderColor: colors?.borderDanger,
-    errorOutlineColor: colors?.borderDanger,
-    placeholderColor: colors?.textDark,
-    smallFontSize: typography?.fontSizeSmall,
-    smallHeight: forms?.inputHeightSmall,
-    mediumFontSize: typography?.fontSizeMedium,
-    mediumHeight: forms?.inputHeightMedium,
-    largeFontSize: typography?.fontSizeLarge,
-    largeHeight: forms?.inputHeightLarge
+    fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
+    fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
+    borderWidth: borders === null || borders === void 0 ? void 0 : borders.widthSmall,
+    borderStyle: borders === null || borders === void 0 ? void 0 : borders.style,
+    borderColor: colors === null || colors === void 0 ? void 0 : colors.borderMedium,
+    borderRadius: borders === null || borders === void 0 ? void 0 : borders.radiusMedium,
+    color: colors === null || colors === void 0 ? void 0 : colors.textDarkest,
+    background: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
+    padding: spacing === null || spacing === void 0 ? void 0 : spacing.small,
+    focusOutlineWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
+    focusOutlineStyle: borders === null || borders === void 0 ? void 0 : borders.style,
+    focusOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderBrand,
+    errorBorderColor: colors === null || colors === void 0 ? void 0 : colors.borderDanger,
+    errorOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderDanger,
+    placeholderColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
+    smallFontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
+    smallHeight: forms === null || forms === void 0 ? void 0 : forms.inputHeightSmall,
+    mediumFontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
+    mediumHeight: forms === null || forms === void 0 ? void 0 : forms.inputHeightMedium,
+    largeFontSize: typography === null || typography === void 0 ? void 0 : typography.fontSizeLarge,
+    largeHeight: forms === null || forms === void 0 ? void 0 : forms.inputHeightLarge
   };
   return { ...componentVariables,
     ...themeSpecificStyle[themeName]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-text-input",
-  "version": "8.18.0",
+  "version": "8.18.1-snapshot.0+435c9ae79",
   "description": "A styled HTML text input component.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,23 +23,23 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.18.0",
-    "@instructure/ui-badge": "8.18.0",
-    "@instructure/ui-color-utils": "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-badge": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-color-utils": "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-prop-types": "8.18.0",
-    "@instructure/ui-react-utils": "8.18.0",
-    "@instructure/ui-tag": "8.18.0",
-    "@instructure/ui-testable": "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-prop-types": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-react-utils": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-tag": "8.18.1-snapshot.0+435c9ae79",
+    "@instructure/ui-testable": "8.18.1-snapshot.0+435c9ae79",
     "prop-types": "^15"
   },
   "peerDependencies": {
@@ -48,5 +48,6 @@
   "publishConfig": {
     "access": "public"
   },
-  "sideEffects": false
+  "sideEffects": false,
+  "gitHead": "435c9ae794c15e2bd103f700f8c4e946d91c1b59"
 }