@instructure/ui-text-input 8.16.1-snapshot.3 → 8.17.1-snapshot.16

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [8.17.0](https://github.com/instructure/instructure-ui/compare/v8.16.0...v8.17.0) (2022-02-07)
+
+### Bug Fixes
+
+- remove type:"commonjs" from package.json files ([0b243be](https://github.com/instructure/instructure-ui/commit/0b243bee389ee14493e6b3dbb30a8b660c295d3d))
+
 # [8.16.0](https://github.com/instructure/instructure-ui/compare/v8.15.0...v8.16.0) (2022-02-03)
 
 **Note:** Version bump only for package @instructure/ui-text-input

package/es/TextInput/index.js

@@ -1,7 +1,7 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 const _excluded = ["type", "size", "htmlSize", "display", "textAlign", "placeholder", "value", "defaultValue", "isRequired"];
 
-var _dec, _dec2, _class, _class2, _temp;
+var _dec, _dec2, _dec3, _class, _class2, _temp;
 
 /*
  * The MIT License (MIT)
@@ -29,10 +29,9 @@ var _dec, _dec2, _class, _class2, _temp;
 
 /** @jsx jsx */
 import React, { Component } from 'react';
-import { callRenderProp, getInteraction, passthroughProps } from '@instructure/ui-react-utils';
+import { callRenderProp, getInteraction, passthroughProps, withDeterministicId } from '@instructure/ui-react-utils';
 import { isActiveElement } from '@instructure/ui-dom-utils';
 import { FormField } from '@instructure/ui-form-field';
-import { uid } from '@instructure/uid';
 import { testable } from '@instructure/ui-testable';
 import { withStyle, jsx } from '@instructure/emotion';
 import generateStyle from './styles';
@@ -46,7 +45,7 @@ tags: form, field
 @tsProps
 **/
 
-let TextInput = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_temp = _class2 = class TextInput extends Component {
+let TextInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, generateComponentTheme), _dec3 = testable(), _dec(_class = _dec2(_class = _dec3(_class = (_temp = _class2 = class TextInput extends Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -109,8 +108,8 @@ let TextInput = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2
     this.state = {
       hasFocus: false
     };
-    this._defaultId = uid('TextInput');
-    this._messagesId = uid('TextInput-messages');
+    this._defaultId = props.deterministicId();
+    this._messagesId = props.deterministicId('TextInput-messages');
   }
 
   componentDidMount() {
@@ -260,6 +259,6 @@ let TextInput = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2
   size: 'medium',
   textAlign: 'start',
   messages: []
-}, _temp)) || _class) || _class);
+}, _temp)) || _class) || _class) || _class);
 export default TextInput;
 export { TextInput };

package/lib/TextInput/index.js

@@ -19,12 +19,12 @@ var _getInteraction = require("@instructure/ui-react-utils/lib/getInteraction.js
 
 var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
 
+var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
+
 var _isActiveElement = require("@instructure/ui-dom-utils/lib/isActiveElement.js");
 
 var _FormField = require("@instructure/ui-form-field/lib/FormField");
 
-var _uid = require("@instructure/uid");
-
 var _testable = require("@instructure/ui-testable/lib/testable.js");
 
 var _emotion = require("@instructure/emotion");
@@ -37,7 +37,7 @@ var _props = require("./props");
 
 const _excluded = ["type", "size", "htmlSize", "display", "textAlign", "placeholder", "value", "defaultValue", "isRequired"];
 
-var _dec, _dec2, _class, _class2, _temp;
+var _dec, _dec2, _dec3, _class, _class2, _temp;
 
 /**
 ---
@@ -46,7 +46,7 @@ tags: form, field
 ---
 @tsProps
 **/
-let TextInput = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_temp = _class2 = class TextInput extends _react.Component {
+let TextInput = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec3 = (0, _testable.testable)(), _dec(_class = _dec2(_class = _dec3(_class = (_temp = _class2 = class TextInput extends _react.Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -109,8 +109,8 @@ let TextInput = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default)
     this.state = {
       hasFocus: false
     };
-    this._defaultId = (0, _uid.uid)('TextInput');
-    this._messagesId = (0, _uid.uid)('TextInput-messages');
+    this._defaultId = props.deterministicId();
+    this._messagesId = props.deterministicId('TextInput-messages');
   }
 
   componentDidMount() {
@@ -259,7 +259,7 @@ let TextInput = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default)
   size: 'medium',
   textAlign: 'start',
   messages: []
-}, _temp)) || _class) || _class);
+}, _temp)) || _class) || _class) || _class);
 exports.TextInput = TextInput;
 var _default = TextInput;
 exports.default = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-text-input",
-  "version": "8.16.1-snapshot.3+4935fa840",
+  "version": "8.17.1-snapshot.16+274440f27",
   "description": "A styled HTML text input component.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,25 +23,23 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-badge": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-color-utils": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-test-utils": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-themes": "8.16.1-snapshot.3+4935fa840"
+    "@instructure/ui-babel-preset": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-badge": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-color-utils": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-test-utils": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-themes": "8.17.1-snapshot.16+274440f27"
   },
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/emotion": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/shared-types": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-dom-utils": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-form-field": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-icons": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-prop-types": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-react-utils": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-tag": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-testable": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/ui-utils": "8.16.1-snapshot.3+4935fa840",
-    "@instructure/uid": "8.16.1-snapshot.3+4935fa840",
+    "@instructure/emotion": "8.17.1-snapshot.16+274440f27",
+    "@instructure/shared-types": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-dom-utils": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-form-field": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-icons": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-prop-types": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-react-utils": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-tag": "8.17.1-snapshot.16+274440f27",
+    "@instructure/ui-testable": "8.17.1-snapshot.16+274440f27",
     "prop-types": "^15"
   },
   "peerDependencies": {
@@ -51,5 +49,5 @@
     "access": "public"
   },
   "sideEffects": false,
-  "gitHead": "4935fa840983f4e6f8333d450e2dc965f8c08dbc"
+  "gitHead": "274440f2739f438237b6fb67919545e2d4e04d59"
 }

package/src/TextInput/index.tsx

@@ -28,11 +28,11 @@ import React, { Component } from 'react'
 import {
   callRenderProp,
   getInteraction,
-  passthroughProps
+  passthroughProps,
+  withDeterministicId
 } from '@instructure/ui-react-utils'
 import { isActiveElement } from '@instructure/ui-dom-utils'
 import { FormField } from '@instructure/ui-form-field'
-import { uid } from '@instructure/uid'
 import { testable } from '@instructure/ui-testable'
 import { withStyle, jsx } from '@instructure/emotion'
 
@@ -52,6 +52,7 @@ tags: form, field
 ---
 @tsProps
 **/
+@withDeterministicId()
 @withStyle(generateStyle, generateComponentTheme)
 @testable()
 class TextInput extends Component<TextInputProps, TextInputState> {
@@ -75,8 +76,8 @@ class TextInput extends Component<TextInputProps, TextInputState> {
   constructor(props: TextInputProps) {
     super(props)
     this.state = { hasFocus: false }
-    this._defaultId = uid('TextInput')
-    this._messagesId = uid('TextInput-messages')
+    this._defaultId = props.deterministicId!()
+    this._messagesId = props.deterministicId!('TextInput-messages')
   }
 
   ref: Element | null = null

package/src/TextInput/props.ts

@@ -36,6 +36,7 @@ import type {
   TextInputTheme
 } from '@instructure/shared-types'
 import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
+import type { WithDeterministicIdProps } from '@instructure/ui-react-utils'
 
 type TextInputOwnProps = {
   /**
@@ -182,7 +183,7 @@ type TextInputProps = TextInputOwnProps &
   > &
   // The component will handle pass this prop to FormField, but it shouldn't be
   // listed as a prop
-  Pick<FormFieldProps, 'layout'>
+  Pick<FormFieldProps, 'layout'> & WithDeterministicIdProps
 
 type TextInputStyle = ComponentStyle<
   | 'textInput'

package/tsconfig.build.json

@@ -21,7 +21,6 @@
     { "path": "../ui-react-utils/tsconfig.build.json" },
     { "path": "../ui-tag/tsconfig.build.json" },
     { "path": "../ui-testable/tsconfig.build.json" },
-    { "path": "../ui-utils/tsconfig.build.json" },
     { "path": "../uid/tsconfig.build.json" }
   ]
 }