@instructure/ui-text-input 11.7.8 → 11.7.9-snapshot-1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/lib/TextInput/v1/index.js +16 -21
  3. package/lib/TextInput/v2/index.js +11 -16
  4. package/package.json +13 -13
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [11.7.9-snapshot-1](https://github.com/instructure/instructure-ui/compare/v11.7.8...v11.7.9-snapshot-1) (2026-10-06)
7
+
8
+ **Note:** Version bump only for package @instructure/ui-text-input
9
+
10
+
11
+
12
+
13
+
6
14
  ## [11.7.8](https://github.com/instructure/instructure-ui/compare/v11.7.7...v11.7.8) (2026-10-02)
7
15
 
8
16
  ### Bug Fixes
package/lib/TextInput/v1/index.js CHANGED
@@ -6,16 +6,11 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.default = exports.TextInput = void 0;
8
8
  var _react = require("react");
9
- var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
10
- var _getInteraction = require("@instructure/ui-react-utils/lib/getInteraction.js");
11
- var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
12
- var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
13
- var _isActiveElement = require("@instructure/ui-dom-utils/lib/isActiveElement.js");
14
- var _addEventListener = require("@instructure/ui-dom-utils/lib/addEventListener.js");
15
- var _getCSSStyleDeclaration = require("@instructure/ui-dom-utils/lib/getCSSStyleDeclaration.js");
9
+ var _uiReactUtils = require("@instructure/ui-react-utils");
10
+ var _uiDomUtils = require("@instructure/ui-dom-utils");
16
11
  var _v11_ = require("@instructure/ui-form-field/v11_6");
17
12
  var _emotion = require("@instructure/emotion");
18
- var _hasVisibleChildren = require("@instructure/ui-a11y-utils/lib/hasVisibleChildren.js");
13
+ var _uiA11yUtils = require("@instructure/ui-a11y-utils");
19
14
  var _styles = _interopRequireDefault(require("./styles.js"));
20
15
  var _theme = _interopRequireDefault(require("./theme.js"));
21
16
  var _props = require("./props.js");
@@ -50,7 +45,7 @@ category: components
50
45
  tags: form, field
51
46
  ---
52
47
  **/
53
- let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = _dec2(_class = class TextInput extends _react.Component {
48
+ let TextInput = exports.TextInput = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = _dec2(_class = class TextInput extends _react.Component {
54
49
  static displayName = 'TextInput';
55
50
  static componentId = 'TextInput';
56
51
  static allowedProps = _props.allowedProps;
@@ -91,7 +86,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
91
86
  };
92
87
  componentDidMount() {
93
88
  if (this._input) {
94
- this._focusListener = (0, _addEventListener.addEventListener)(this._input, 'focus', this.handleFocus);
89
+ this._focusListener = (0, _uiDomUtils.addEventListener)(this._input, 'focus', this.handleFocus);
95
90
  this.setState({
96
91
  afterElementHasWidth: this.getElementHasWidth(this._afterElement)
97
92
  });
@@ -110,9 +105,9 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
110
105
  afterElementHasWidth: this.getElementHasWidth(this._afterElement)
111
106
  });
112
107
  }
113
- if ((0, _getInteraction.getInteraction)({
108
+ if ((0, _uiReactUtils.getInteraction)({
114
109
  props: prevProps
115
- }) !== 'disabled' && (0, _getInteraction.getInteraction)({
110
+ }) !== 'disabled' && (0, _uiReactUtils.getInteraction)({
116
111
  props: this.props
117
112
  }) === 'disabled') {
118
113
  this.setState({
@@ -146,7 +141,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
146
141
  hasFocus,
147
142
  afterElementHasWidth
148
143
  } = this.state;
149
- const beforeElement = this.props.renderBeforeInput ? (0, _callRenderProp.callRenderProp)(this.props.renderBeforeInput) : null;
144
+ const beforeElement = this.props.renderBeforeInput ? (0, _uiReactUtils.callRenderProp)(this.props.renderBeforeInput) : null;
150
145
  return {
151
146
  disabled: interaction === 'disabled',
152
147
  invalid: this.invalid,
@@ -159,7 +154,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
159
154
  this._input?.focus();
160
155
  }
161
156
  get interaction() {
162
- return (0, _getInteraction.getInteraction)({
157
+ return (0, _uiReactUtils.getInteraction)({
163
158
  props: this.props
164
159
  });
165
160
  }
@@ -172,7 +167,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
172
167
  }) >= 0;
173
168
  }
174
169
  get focused() {
175
- return (0, _isActiveElement.isActiveElement)(this._input);
170
+ return (0, _uiDomUtils.isActiveElement)(this._input);
176
171
  }
177
172
  get value() {
178
173
  return this._input?.value;
@@ -221,7 +216,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
221
216
  onFocus,
222
217
  ...rest
223
218
  } = this.props;
224
- const props = (0, _passthroughProps.passthroughProps)(rest);
219
+ const props = (0, _uiReactUtils.passthroughProps)(rest);
225
220
  const {
226
221
  interaction
227
222
  } = this;
@@ -252,7 +247,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
252
247
  if (!element) {
253
248
  return undefined;
254
249
  }
255
- const computedStyle = (0, _getCSSStyleDeclaration.getCSSStyleDeclaration)(element);
250
+ const computedStyle = (0, _uiDomUtils.getCSSStyleDeclaration)(element);
256
251
  if (!computedStyle) {
257
252
  return undefined;
258
253
  }
@@ -283,11 +278,11 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
283
278
  isRequired,
284
279
  styles
285
280
  } = this.props;
286
- const beforeElement = renderBeforeInput ? (0, _callRenderProp.callRenderProp)(renderBeforeInput) : null;
287
- const afterElement = renderAfterInput ? (0, _callRenderProp.callRenderProp)(renderAfterInput) : null;
281
+ const beforeElement = renderBeforeInput ? (0, _uiReactUtils.callRenderProp)(renderBeforeInput) : null;
282
+ const afterElement = renderAfterInput ? (0, _uiReactUtils.callRenderProp)(renderAfterInput) : null;
288
283
  const renderBeforeOrAfter = !!beforeElement || !!afterElement || renderBeforeInput !== undefined || renderAfterInput !== undefined;
289
- const rawLabel = (0, _callRenderProp.callRenderProp)(renderLabel);
290
- const label = (0, _hasVisibleChildren.hasVisibleChildren)(rawLabel) ? (0, _jsxRuntime.jsxs)(_react.Fragment, {
284
+ const rawLabel = (0, _uiReactUtils.callRenderProp)(renderLabel);
285
+ const label = (0, _uiA11yUtils.hasVisibleChildren)(rawLabel) ? (0, _jsxRuntime.jsxs)(_react.Fragment, {
291
286
  children: [rawLabel, isRequired && (0, _jsxRuntime.jsxs)("span", {
292
287
  css: this.invalid ? styles?.requiredInvalid : {},
293
288
  "aria-hidden": true,
package/lib/TextInput/v2/index.js CHANGED
@@ -6,13 +6,8 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.default = exports.TextInput = void 0;
8
8
  var _react = require("react");
9
- var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
10
- var _getInteraction = require("@instructure/ui-react-utils/lib/getInteraction.js");
11
- var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
12
- var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
13
- var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
14
- var _isActiveElement = require("@instructure/ui-dom-utils/lib/isActiveElement.js");
15
- var _addEventListener = require("@instructure/ui-dom-utils/lib/addEventListener.js");
9
+ var _uiReactUtils = require("@instructure/ui-react-utils");
10
+ var _uiDomUtils = require("@instructure/ui-dom-utils");
16
11
  var _latest = require("@instructure/ui-form-field/latest");
17
12
  var _emotion = require("@instructure/emotion");
18
13
  var _styles = _interopRequireDefault(require("./styles.js"));
@@ -48,7 +43,7 @@ category: components
48
43
  tags: form, field, input
49
44
  ---
50
45
  **/
51
- let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyleNew)(_styles.default), _dec(_class = _dec2(_class = class TextInput extends _react.Component {
46
+ let TextInput = exports.TextInput = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec2 = (0, _emotion.withStyleNew)(_styles.default), _dec(_class = _dec2(_class = class TextInput extends _react.Component {
52
47
  static displayName = 'TextInput';
53
48
  static componentId = 'TextInput';
54
49
  static allowedProps = _props.allowedProps;
@@ -88,7 +83,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
88
83
  };
89
84
  componentDidMount() {
90
85
  if (this._input) {
91
- this._focusListener = (0, _addEventListener.addEventListener)(this._input, 'focus', this.handleFocus);
86
+ this._focusListener = (0, _uiDomUtils.addEventListener)(this._input, 'focus', this.handleFocus);
92
87
  }
93
88
  this.props.makeStyles?.(this.makeStyleProps());
94
89
  }
@@ -104,7 +99,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
104
99
  if (!elementToRender) {
105
100
  return null;
106
101
  }
107
- const rendered = (0, _callRenderProp.callRenderProp)(elementToRender);
102
+ const rendered = (0, _uiReactUtils.callRenderProp)(elementToRender);
108
103
  // Map sizes to Lucide icon semantic size tokens
109
104
  const linkSizeToIconSize = {
110
105
  small: 'sm',
@@ -113,14 +108,14 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
113
108
  };
114
109
  const iconSize = linkSizeToIconSize[this.props.size || 'medium'];
115
110
  if (/*#__PURE__*/(0, _react.isValidElement)(elementToRender) && elementToRender.type?.name === 'WrappedIcon') {
116
- return (0, _safeCloneElement.safeCloneElement)(rendered, {
111
+ return (0, _uiReactUtils.safeCloneElement)(rendered, {
117
112
  size: iconSize
118
113
  });
119
114
  }
120
115
  return rendered;
121
116
  }
122
117
  makeStyleProps = () => {
123
- const beforeElement = this.props.renderBeforeInput ? (0, _callRenderProp.callRenderProp)(this.props.renderBeforeInput) : null;
118
+ const beforeElement = this.props.renderBeforeInput ? (0, _uiReactUtils.callRenderProp)(this.props.renderBeforeInput) : null;
124
119
  const success = !!this.props.messages && this.props.messages.some(message => message.type === 'success');
125
120
  return {
126
121
  interaction: this.interaction,
@@ -133,7 +128,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
133
128
  this._input?.focus();
134
129
  }
135
130
  get interaction() {
136
- return (0, _getInteraction.getInteraction)({
131
+ return (0, _uiReactUtils.getInteraction)({
137
132
  props: this.props
138
133
  });
139
134
  }
@@ -146,7 +141,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
146
141
  }) >= 0;
147
142
  }
148
143
  get focused() {
149
- return (0, _isActiveElement.isActiveElement)(this._input);
144
+ return (0, _uiDomUtils.isActiveElement)(this._input);
150
145
  }
151
146
  get value() {
152
147
  return this._input?.value;
@@ -190,7 +185,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
190
185
  onFocus,
191
186
  ...rest
192
187
  } = this.props;
193
- const props = (0, _passthroughProps.passthroughProps)(rest);
188
+ const props = (0, _uiReactUtils.passthroughProps)(rest);
194
189
  const {
195
190
  interaction
196
191
  } = this;
@@ -241,7 +236,7 @@ let TextInput = exports.TextInput = (_dec = (0, _withDeterministicId.withDetermi
241
236
  const beforeElement = this.renderInstUIIcon(renderBeforeInput);
242
237
  const afterElement = this.renderInstUIIcon(renderAfterInput);
243
238
  const renderBeforeOrAfter = !!beforeElement || !!afterElement || renderBeforeInput !== undefined || renderAfterInput !== undefined;
244
- const label = (0, _callRenderProp.callRenderProp)(renderLabel);
239
+ const label = (0, _uiReactUtils.callRenderProp)(renderLabel);
245
240
  return (0, _jsxRuntime.jsx)(_latest.FormField, {
246
241
  id: this.id,
247
242
  label: label,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-text-input",
3
- "version": "11.7.8",
3
+ "version": "11.7.9-snapshot-1",
4
4
  "description": "A styled HTML text input component.",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -15,21 +15,21 @@
15
15
  "license": "MIT",
16
16
  "devDependencies": {
17
17
  "vitest": "^5.0.0",
18
- "@instructure/ui-axe-check": "11.7.8",
19
- "@instructure/ui-badge": "11.7.8",
20
- "@instructure/ui-color-utils": "11.7.8",
21
- "@instructure/ui-babel-preset": "11.7.8"
18
+ "@instructure/ui-axe-check": "11.7.9-snapshot-1",
19
+ "@instructure/ui-badge": "11.7.9-snapshot-1",
20
+ "@instructure/ui-babel-preset": "11.7.9-snapshot-1",
21
+ "@instructure/ui-color-utils": "11.7.9-snapshot-1"
22
22
  },
23
23
  "dependencies": {
24
24
  "@babel/runtime": "^7.29.7",
25
- "@instructure/emotion": "11.7.8",
26
- "@instructure/ui-dom-utils": "11.7.8",
27
- "@instructure/ui-a11y-utils": "11.7.8",
28
- "@instructure/shared-types": "11.7.8",
29
- "@instructure/ui-form-field": "11.7.8",
30
- "@instructure/ui-tag": "11.7.8",
31
- "@instructure/ui-themes": "11.7.8",
32
- "@instructure/ui-react-utils": "11.7.8"
25
+ "@instructure/emotion": "11.7.9-snapshot-1",
26
+ "@instructure/shared-types": "11.7.9-snapshot-1",
27
+ "@instructure/ui-a11y-utils": "11.7.9-snapshot-1",
28
+ "@instructure/ui-dom-utils": "11.7.9-snapshot-1",
29
+ "@instructure/ui-form-field": "11.7.9-snapshot-1",
30
+ "@instructure/ui-react-utils": "11.7.9-snapshot-1",
31
+ "@instructure/ui-tag": "11.7.9-snapshot-1",
32
+ "@instructure/ui-themes": "11.7.9-snapshot-1"
33
33
  },
34
34
  "peerDependencies": {
35
35
  "react": ">=18 <=19"