@instructure/ui-number-input 10.16.1-snapshot-0 → 10.16.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 (12) hide show
  1. package/CHANGELOG.md +1 -1
  2. package/es/NumberInput/__new-tests__/NumberInput.test.js +21 -21
  3. package/es/NumberInput/index.js +59 -48
  4. package/lib/NumberInput/__new-tests__/NumberInput.test.js +42 -42
  5. package/lib/NumberInput/index.js +58 -48
  6. package/package.json +14 -14
  7. package/src/NumberInput/__new-tests__/NumberInput.test.tsx +0 -1
  8. package/src/NumberInput/index.tsx +4 -5
  9. package/tsconfig.build.tsbuildinfo +1 -1
  10. package/types/NumberInput/__new-tests__/NumberInput.test.d.ts.map +1 -1
  11. package/types/NumberInput/index.d.ts +3 -5
  12. package/types/NumberInput/index.d.ts.map +1 -1
package/CHANGELOG.md CHANGED
@@ -3,7 +3,7 @@
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
- ## [10.16.1-snapshot-0](https://github.com/instructure/instructure-ui/compare/v10.16.0...v10.16.1-snapshot-0) (2025-04-15)
6
+ ## [10.16.1](https://github.com/instructure/instructure-ui/compare/v10.16.0...v10.16.1) (2025-04-22)
7
7
 
8
8
  **Note:** Version bump only for package @instructure/ui-number-input
9
9
 
package/es/NumberInput/__new-tests__/NumberInput.test.js CHANGED
@@ -23,7 +23,6 @@ var _NumberInput, _NumberInput2, _NumberInput3, _NumberInput4, _IconZoomInLine,
23
23
  * SOFTWARE.
24
24
  */
25
25
 
26
- import React from 'react';
27
26
  import { render, screen, waitFor } from '@testing-library/react';
28
27
  import userEvent from '@testing-library/user-event';
29
28
  import { vi } from 'vitest';
@@ -34,6 +33,7 @@ import NumberInputExamples from '../__examples__/NumberInput.examples';
34
33
  // eslint-disable-next-line no-restricted-imports
35
34
  import { generateA11yTests } from '@instructure/ui-scripts/lib/test/generateA11yTests';
36
35
  import { IconZoomInLine, IconZoomOutLine } from '@instructure/ui-icons';
36
+ import { jsx as _jsx } from "@emotion/react/jsx-runtime";
37
37
  describe('<NumberInput />', () => {
38
38
  let consoleWarningMock;
39
39
  let consoleErrorMock;
@@ -48,7 +48,7 @@ describe('<NumberInput />', () => {
48
48
  });
49
49
  it('sets value on the input', async () => {
50
50
  const onChange = vi.fn();
51
- render(/*#__PURE__*/React.createElement(NumberInput, {
51
+ render(_jsx(NumberInput, {
52
52
  renderLabel: "Label",
53
53
  onChange: onChange,
54
54
  value: "42"
@@ -58,7 +58,7 @@ describe('<NumberInput />', () => {
58
58
  });
59
59
  it('should accept a number for the value', async () => {
60
60
  const onChange = vi.fn();
61
- render(/*#__PURE__*/React.createElement(NumberInput, {
61
+ render(_jsx(NumberInput, {
62
62
  renderLabel: "Label",
63
63
  onChange: onChange,
64
64
  value: 42
@@ -67,7 +67,7 @@ describe('<NumberInput />', () => {
67
67
  expect(input).toHaveValue(42);
68
68
  });
69
69
  it('displays the label', async () => {
70
- const _render = render(_NumberInput || (_NumberInput = /*#__PURE__*/React.createElement(NumberInput, {
70
+ const _render = render(_NumberInput || (_NumberInput = _jsx(NumberInput, {
71
71
  renderLabel: "Label"
72
72
  }))),
73
73
  container = _render.container;
@@ -76,7 +76,7 @@ describe('<NumberInput />', () => {
76
76
  });
77
77
  it('passes the input element to inputRef', async () => {
78
78
  const inputRef = vi.fn();
79
- render(/*#__PURE__*/React.createElement(NumberInput, {
79
+ render(_jsx(NumberInput, {
80
80
  renderLabel: "Label",
81
81
  inputRef: inputRef
82
82
  }));
@@ -86,7 +86,7 @@ describe('<NumberInput />', () => {
86
86
  });
87
87
  it('passes change events to onChange handler', async () => {
88
88
  const onChange = vi.fn();
89
- render(/*#__PURE__*/React.createElement(NumberInput, {
89
+ render(_jsx(NumberInput, {
90
90
  renderLabel: "Label",
91
91
  onChange: onChange
92
92
  }));
@@ -102,7 +102,7 @@ describe('<NumberInput />', () => {
102
102
  });
103
103
  it('passes keyboard events to the onKeyDown handler', async () => {
104
104
  const onKeyDown = vi.fn();
105
- render(/*#__PURE__*/React.createElement(NumberInput, {
105
+ render(_jsx(NumberInput, {
106
106
  renderLabel: "Label",
107
107
  onKeyDown: onKeyDown
108
108
  }));
@@ -114,7 +114,7 @@ describe('<NumberInput />', () => {
114
114
  });
115
115
  it('passes blur events to onBlur handler', async () => {
116
116
  const onBlur = vi.fn();
117
- render(/*#__PURE__*/React.createElement(NumberInput, {
117
+ render(_jsx(NumberInput, {
118
118
  renderLabel: "Label",
119
119
  onBlur: onBlur
120
120
  }));
@@ -126,7 +126,7 @@ describe('<NumberInput />', () => {
126
126
  });
127
127
  it('passes focus events to onFocus handler', async () => {
128
128
  const onFocus = vi.fn();
129
- render(/*#__PURE__*/React.createElement(NumberInput, {
129
+ render(_jsx(NumberInput, {
130
130
  renderLabel: "Label",
131
131
  onFocus: onFocus
132
132
  }));
@@ -137,7 +137,7 @@ describe('<NumberInput />', () => {
137
137
  });
138
138
  });
139
139
  it('shows arrow spinbuttons by default', async () => {
140
- const _render2 = render(_NumberInput2 || (_NumberInput2 = /*#__PURE__*/React.createElement(NumberInput, {
140
+ const _render2 = render(_NumberInput2 || (_NumberInput2 = _jsx(NumberInput, {
141
141
  renderLabel: "Label"
142
142
  }))),
143
143
  container = _render2.container;
@@ -145,7 +145,7 @@ describe('<NumberInput />', () => {
145
145
  expect(buttons).toHaveLength(2);
146
146
  });
147
147
  it('hides arrow spinbuttons when showArrows is false', async () => {
148
- const _render3 = render(_NumberInput3 || (_NumberInput3 = /*#__PURE__*/React.createElement(NumberInput, {
148
+ const _render3 = render(_NumberInput3 || (_NumberInput3 = _jsx(NumberInput, {
149
149
  renderLabel: "Label",
150
150
  showArrows: false
151
151
  }))),
@@ -155,7 +155,7 @@ describe('<NumberInput />', () => {
155
155
  });
156
156
  it('calls onIncrement when up arrow spinbutton is clicked', async () => {
157
157
  const onIncrement = vi.fn();
158
- const _render4 = render(/*#__PURE__*/React.createElement(NumberInput, {
158
+ const _render4 = render(_jsx(NumberInput, {
159
159
  renderLabel: "Label",
160
160
  onIncrement: onIncrement
161
161
  })),
@@ -168,7 +168,7 @@ describe('<NumberInput />', () => {
168
168
  });
169
169
  it('does not call onIncrement when `interaction` is set to readonly', async () => {
170
170
  const onIncrement = vi.fn();
171
- const _render5 = render(/*#__PURE__*/React.createElement(NumberInput, {
171
+ const _render5 = render(_jsx(NumberInput, {
172
172
  renderLabel: "Label",
173
173
  interaction: "readonly",
174
174
  onIncrement: onIncrement
@@ -182,7 +182,7 @@ describe('<NumberInput />', () => {
182
182
  });
183
183
  it('does not call onIncrement when `readOnly` is set', async () => {
184
184
  const onIncrement = vi.fn();
185
- const _render6 = render(/*#__PURE__*/React.createElement(NumberInput, {
185
+ const _render6 = render(_jsx(NumberInput, {
186
186
  renderLabel: "Label",
187
187
  readOnly: true,
188
188
  onIncrement: onIncrement
@@ -196,7 +196,7 @@ describe('<NumberInput />', () => {
196
196
  });
197
197
  it('calls onDecrement when down arrow spinbutton is clicked', async () => {
198
198
  const onDecrement = vi.fn();
199
- const _render7 = render(/*#__PURE__*/React.createElement(NumberInput, {
199
+ const _render7 = render(_jsx(NumberInput, {
200
200
  renderLabel: "Label",
201
201
  onDecrement: onDecrement
202
202
  })),
@@ -209,7 +209,7 @@ describe('<NumberInput />', () => {
209
209
  });
210
210
  it('does not call onDecrement when `interaction` is set to readonly', async () => {
211
211
  const onDecrement = vi.fn();
212
- const _render8 = render(/*#__PURE__*/React.createElement(NumberInput, {
212
+ const _render8 = render(_jsx(NumberInput, {
213
213
  renderLabel: "Label",
214
214
  interaction: "readonly",
215
215
  onDecrement: onDecrement
@@ -223,7 +223,7 @@ describe('<NumberInput />', () => {
223
223
  });
224
224
  it('does not call onDecrement when `readOnly` is set', async () => {
225
225
  const onDecrement = vi.fn();
226
- const _render9 = render(/*#__PURE__*/React.createElement(NumberInput, {
226
+ const _render9 = render(_jsx(NumberInput, {
227
227
  renderLabel: "Label",
228
228
  readOnly: true,
229
229
  onDecrement: onDecrement
@@ -236,7 +236,7 @@ describe('<NumberInput />', () => {
236
236
  });
237
237
  });
238
238
  it('puts inputMode prop to input', async () => {
239
- render(_NumberInput4 || (_NumberInput4 = /*#__PURE__*/React.createElement(NumberInput, {
239
+ render(_NumberInput4 || (_NumberInput4 = _jsx(NumberInput, {
240
240
  renderLabel: "Label",
241
241
  inputMode: "decimal"
242
242
  })));
@@ -257,13 +257,13 @@ describe('<NumberInput />', () => {
257
257
  it('renders custom interactive icons', async () => {
258
258
  const onDecrement = vi.fn();
259
259
  const onIncrement = vi.fn();
260
- const _render11 = render(/*#__PURE__*/React.createElement(NumberInput, {
260
+ const _render11 = render(_jsx(NumberInput, {
261
261
  renderLabel: "Label",
262
262
  onIncrement: onIncrement,
263
263
  onDecrement: onDecrement,
264
264
  renderIcons: {
265
- increase: _IconZoomInLine || (_IconZoomInLine = /*#__PURE__*/React.createElement(IconZoomInLine, null)),
266
- decrease: _IconZoomOutLine || (_IconZoomOutLine = /*#__PURE__*/React.createElement(IconZoomOutLine, null))
265
+ increase: _IconZoomInLine || (_IconZoomInLine = _jsx(IconZoomInLine, {})),
266
+ decrease: _IconZoomOutLine || (_IconZoomOutLine = _jsx(IconZoomOutLine, {}))
267
267
  }
268
268
  })),
269
269
  container = _render11.container;
package/es/NumberInput/index.js CHANGED
@@ -23,18 +23,18 @@ var _dec, _dec2, _dec3, _class, _NumberInput, _IconArrowOpenUpLine, _IconArrowOp
23
23
  * SOFTWARE.
24
24
  */
25
25
 
26
- /** @jsx jsx */
27
- import React, { Component } from 'react';
26
+ import { Fragment, Component } from 'react';
28
27
  import keycode from 'keycode';
29
28
  import { FormField } from '@instructure/ui-form-field';
30
29
  import { IconArrowOpenDownLine, IconArrowOpenUpLine } from '@instructure/ui-icons';
31
30
  import { testable } from '@instructure/ui-testable';
32
31
  import { omitProps, pickProps, callRenderProp, getInteraction, withDeterministicId } from '@instructure/ui-react-utils';
33
32
  import { hasVisibleChildren } from '@instructure/ui-a11y-utils';
34
- import { withStyle, jsx } from '@instructure/emotion';
33
+ import { withStyle } from '@instructure/emotion';
35
34
  import generateStyle from './styles';
36
35
  import generateComponentTheme from './theme';
37
36
  import { allowedProps, propTypes } from './props';
37
+ import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
38
38
  /**
39
39
  ---
40
40
  category: components
@@ -152,21 +152,24 @@ let NumberInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle
152
152
  }
153
153
  renderArrows(customIcons) {
154
154
  var _this$props$styles, _this$props$styles2, _this$props$styles3;
155
- return jsx("span", {
156
- css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.arrowContainer
157
- }, jsx("button", {
158
- "aria-hidden": true,
159
- css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.arrow,
160
- onMouseDown: this.handleClickUpArrow,
161
- tabIndex: -1,
162
- type: "button"
163
- }, customIcons !== null && customIcons !== void 0 && customIcons.increase ? callRenderProp(customIcons.increase) : _IconArrowOpenUpLine || (_IconArrowOpenUpLine = jsx(IconArrowOpenUpLine, null))), jsx("button", {
164
- "aria-hidden": true,
165
- css: (_this$props$styles3 = this.props.styles) === null || _this$props$styles3 === void 0 ? void 0 : _this$props$styles3.arrow,
166
- onMouseDown: this.handleClickDownArrow,
167
- tabIndex: -1,
168
- type: "button"
169
- }, customIcons !== null && customIcons !== void 0 && customIcons.decrease ? callRenderProp(customIcons.decrease) : _IconArrowOpenDownLin || (_IconArrowOpenDownLin = jsx(IconArrowOpenDownLine, null))));
155
+ return _jsxs("span", {
156
+ css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.arrowContainer,
157
+ children: [_jsx("button", {
158
+ "aria-hidden": true,
159
+ css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.arrow,
160
+ onMouseDown: this.handleClickUpArrow,
161
+ tabIndex: -1,
162
+ type: "button",
163
+ children: customIcons !== null && customIcons !== void 0 && customIcons.increase ? callRenderProp(customIcons.increase) : _IconArrowOpenUpLine || (_IconArrowOpenUpLine = _jsx(IconArrowOpenUpLine, {}))
164
+ }), _jsx("button", {
165
+ "aria-hidden": true,
166
+ css: (_this$props$styles3 = this.props.styles) === null || _this$props$styles3 === void 0 ? void 0 : _this$props$styles3.arrow,
167
+ onMouseDown: this.handleClickDownArrow,
168
+ tabIndex: -1,
169
+ type: "button",
170
+ children: customIcons !== null && customIcons !== void 0 && customIcons.decrease ? callRenderProp(customIcons.decrease) : _IconArrowOpenDownLin || (_IconArrowOpenDownLin = _jsx(IconArrowOpenDownLine, {}))
171
+ })]
172
+ });
170
173
  }
171
174
  render() {
172
175
  var _this$props$styles4, _this$props$styles5, _this$props$styles6;
@@ -184,40 +187,48 @@ let NumberInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle
184
187
  margin = _this$props4.margin;
185
188
  const interaction = this.interaction;
186
189
  const rawLabel = callRenderProp(renderLabel);
187
- const label = hasVisibleChildren(rawLabel) ? jsx(React.Fragment, null, rawLabel, isRequired && jsx("span", {
188
- css: this.invalid ? styles === null || styles === void 0 ? void 0 : styles.requiredInvalid : {},
189
- "aria-hidden": true
190
- }, ' ', "*")) : rawLabel;
191
- return jsx(FormField, Object.assign({}, pickProps(this.props, FormField.allowedProps), {
190
+ const label = hasVisibleChildren(rawLabel) ? _jsxs(Fragment, {
191
+ children: [rawLabel, isRequired && _jsxs("span", {
192
+ css: this.invalid ? styles === null || styles === void 0 ? void 0 : styles.requiredInvalid : {},
193
+ "aria-hidden": true,
194
+ children: [' ', "*"]
195
+ })]
196
+ }) : rawLabel;
197
+ return _jsx(FormField, {
198
+ ...pickProps(this.props, FormField.allowedProps),
192
199
  label: label,
193
200
  inline: display === 'inline-block',
194
201
  id: this.id,
195
202
  elementRef: this.handleRef,
196
- margin: margin
197
- }), jsx("span", {
198
- css: (_this$props$styles4 = this.props.styles) === null || _this$props$styles4 === void 0 ? void 0 : _this$props$styles4.inputWidth,
199
- style: width ? {
200
- width
201
- } : void 0
202
- }, jsx("span", {
203
- css: (_this$props$styles5 = this.props.styles) === null || _this$props$styles5 === void 0 ? void 0 : _this$props$styles5.inputContainer
204
- }, jsx("input", Object.assign({}, omitProps(this.props, [...FormField.allowedProps, ...NumberInput.allowedProps]), {
205
- css: (_this$props$styles6 = this.props.styles) === null || _this$props$styles6 === void 0 ? void 0 : _this$props$styles6.input,
206
- "aria-invalid": this.invalid ? 'true' : void 0,
207
- id: this.id,
208
- type: allowStringValue ? 'text' : 'number',
209
- inputMode: this.props.inputMode,
210
- placeholder: placeholder,
211
- ref: this.handleInputRef,
212
- required: isRequired,
213
- value: value,
214
- disabled: interaction === 'disabled',
215
- readOnly: interaction === 'readonly',
216
- onFocus: this.handleFocus,
217
- onBlur: this.handleBlur,
218
- onChange: this.handleChange,
219
- onKeyDown: this.handleKeyDown
220
- })), showArrows ? this.renderArrows(renderIcons) : null)));
203
+ margin: margin,
204
+ children: _jsx("span", {
205
+ css: (_this$props$styles4 = this.props.styles) === null || _this$props$styles4 === void 0 ? void 0 : _this$props$styles4.inputWidth,
206
+ style: width ? {
207
+ width
208
+ } : void 0,
209
+ children: _jsxs("span", {
210
+ css: (_this$props$styles5 = this.props.styles) === null || _this$props$styles5 === void 0 ? void 0 : _this$props$styles5.inputContainer,
211
+ children: [_jsx("input", {
212
+ ...omitProps(this.props, [...FormField.allowedProps, ...NumberInput.allowedProps]),
213
+ css: (_this$props$styles6 = this.props.styles) === null || _this$props$styles6 === void 0 ? void 0 : _this$props$styles6.input,
214
+ "aria-invalid": this.invalid ? 'true' : void 0,
215
+ id: this.id,
216
+ type: allowStringValue ? 'text' : 'number',
217
+ inputMode: this.props.inputMode,
218
+ placeholder: placeholder,
219
+ ref: this.handleInputRef,
220
+ required: isRequired,
221
+ value: value,
222
+ disabled: interaction === 'disabled',
223
+ readOnly: interaction === 'readonly',
224
+ onFocus: this.handleFocus,
225
+ onBlur: this.handleBlur,
226
+ onChange: this.handleChange,
227
+ onKeyDown: this.handleKeyDown
228
+ }), showArrows ? this.renderArrows(renderIcons) : null]
229
+ })
230
+ })
231
+ });
221
232
  }
222
233
  }, _NumberInput.displayName = "NumberInput", _NumberInput.componentId = 'NumberInput', _NumberInput.allowedProps = allowedProps, _NumberInput.propTypes = propTypes, _NumberInput.defaultProps = {
223
234
  // Leave interaction default undefined so that `disabled` and `readOnly` can also be supplied
package/lib/NumberInput/__new-tests__/NumberInput.test.js CHANGED
@@ -1,8 +1,7 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- var _react = _interopRequireDefault(require("react"));
5
- var _react2 = require("@testing-library/react");
4
+ var _react = require("@testing-library/react");
6
5
  var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
7
6
  var _vitest = require("vitest");
8
7
  var _runAxeCheck = require("@instructure/ui-axe-check/lib/runAxeCheck.js");
@@ -12,6 +11,7 @@ var _NumberInput5 = _interopRequireDefault(require("../__examples__/NumberInput.
12
11
  var _generateA11yTests = require("@instructure/ui-scripts/lib/test/generateA11yTests");
13
12
  var _IconZoomInLine2 = require("@instructure/ui-icons/lib/IconZoomInLine.js");
14
13
  var _IconZoomOutLine2 = require("@instructure/ui-icons/lib/IconZoomOutLine.js");
14
+ var _jsxRuntime = require("@emotion/react/jsx-runtime");
15
15
  var _NumberInput, _NumberInput2, _NumberInput3, _NumberInput4, _IconZoomInLine, _IconZoomOutLine;
16
16
  /*
17
17
  * The MIT License (MIT)
@@ -51,26 +51,26 @@ describe('<NumberInput />', () => {
51
51
  });
52
52
  it('sets value on the input', async () => {
53
53
  const onChange = _vitest.vi.fn();
54
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
54
+ (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
55
55
  renderLabel: "Label",
56
56
  onChange: onChange,
57
57
  value: "42"
58
58
  }));
59
- const input = _react2.screen.getByRole('spinbutton');
59
+ const input = _react.screen.getByRole('spinbutton');
60
60
  expect(input).toHaveValue(42);
61
61
  });
62
62
  it('should accept a number for the value', async () => {
63
63
  const onChange = _vitest.vi.fn();
64
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
64
+ (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
65
65
  renderLabel: "Label",
66
66
  onChange: onChange,
67
67
  value: 42
68
68
  }));
69
- const input = _react2.screen.getByRole('spinbutton');
69
+ const input = _react.screen.getByRole('spinbutton');
70
70
  expect(input).toHaveValue(42);
71
71
  });
72
72
  it('displays the label', async () => {
73
- const _render = (0, _react2.render)(_NumberInput || (_NumberInput = /*#__PURE__*/_react.default.createElement(_index.NumberInput, {
73
+ const _render = (0, _react.render)(_NumberInput || (_NumberInput = (0, _jsxRuntime.jsx)(_index.NumberInput, {
74
74
  renderLabel: "Label"
75
75
  }))),
76
76
  container = _render.container;
@@ -79,23 +79,23 @@ describe('<NumberInput />', () => {
79
79
  });
80
80
  it('passes the input element to inputRef', async () => {
81
81
  const inputRef = _vitest.vi.fn();
82
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
82
+ (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
83
83
  renderLabel: "Label",
84
84
  inputRef: inputRef
85
85
  }));
86
- const input = _react2.screen.getByRole('spinbutton');
86
+ const input = _react.screen.getByRole('spinbutton');
87
87
  expect(inputRef).toHaveBeenCalledTimes(1);
88
88
  expect(inputRef).toHaveBeenCalledWith(input);
89
89
  });
90
90
  it('passes change events to onChange handler', async () => {
91
91
  const onChange = _vitest.vi.fn();
92
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
92
+ (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
93
93
  renderLabel: "Label",
94
94
  onChange: onChange
95
95
  }));
96
- const input = _react2.screen.getByRole('spinbutton');
96
+ const input = _react.screen.getByRole('spinbutton');
97
97
  _userEvent.default.type(input, '5');
98
- await (0, _react2.waitFor)(() => {
98
+ await (0, _react.waitFor)(() => {
99
99
  const event = onChange.mock.calls[0][0];
100
100
  const args = onChange.mock.calls[0][1];
101
101
  expect(onChange).toHaveBeenCalledTimes(1);
@@ -105,42 +105,42 @@ describe('<NumberInput />', () => {
105
105
  });
106
106
  it('passes keyboard events to the onKeyDown handler', async () => {
107
107
  const onKeyDown = _vitest.vi.fn();
108
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
108
+ (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
109
109
  renderLabel: "Label",
110
110
  onKeyDown: onKeyDown
111
111
  }));
112
- const input = _react2.screen.getByRole('spinbutton');
112
+ const input = _react.screen.getByRole('spinbutton');
113
113
  _userEvent.default.type(input, '5');
114
- await (0, _react2.waitFor)(() => {
114
+ await (0, _react.waitFor)(() => {
115
115
  expect(onKeyDown).toHaveBeenCalledTimes(1);
116
116
  });
117
117
  });
118
118
  it('passes blur events to onBlur handler', async () => {
119
119
  const onBlur = _vitest.vi.fn();
120
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
120
+ (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
121
121
  renderLabel: "Label",
122
122
  onBlur: onBlur
123
123
  }));
124
124
  _userEvent.default.tab();
125
125
  _userEvent.default.tab();
126
- await (0, _react2.waitFor)(() => {
126
+ await (0, _react.waitFor)(() => {
127
127
  expect(onBlur).toHaveBeenCalledTimes(1);
128
128
  });
129
129
  });
130
130
  it('passes focus events to onFocus handler', async () => {
131
131
  const onFocus = _vitest.vi.fn();
132
- (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
132
+ (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
133
133
  renderLabel: "Label",
134
134
  onFocus: onFocus
135
135
  }));
136
- const input = _react2.screen.getByRole('spinbutton');
136
+ const input = _react.screen.getByRole('spinbutton');
137
137
  input.focus();
138
- await (0, _react2.waitFor)(() => {
138
+ await (0, _react.waitFor)(() => {
139
139
  expect(onFocus).toHaveBeenCalledTimes(1);
140
140
  });
141
141
  });
142
142
  it('shows arrow spinbuttons by default', async () => {
143
- const _render2 = (0, _react2.render)(_NumberInput2 || (_NumberInput2 = /*#__PURE__*/_react.default.createElement(_index.NumberInput, {
143
+ const _render2 = (0, _react.render)(_NumberInput2 || (_NumberInput2 = (0, _jsxRuntime.jsx)(_index.NumberInput, {
144
144
  renderLabel: "Label"
145
145
  }))),
146
146
  container = _render2.container;
@@ -148,7 +148,7 @@ describe('<NumberInput />', () => {
148
148
  expect(buttons).toHaveLength(2);
149
149
  });
150
150
  it('hides arrow spinbuttons when showArrows is false', async () => {
151
- const _render3 = (0, _react2.render)(_NumberInput3 || (_NumberInput3 = /*#__PURE__*/_react.default.createElement(_index.NumberInput, {
151
+ const _render3 = (0, _react.render)(_NumberInput3 || (_NumberInput3 = (0, _jsxRuntime.jsx)(_index.NumberInput, {
152
152
  renderLabel: "Label",
153
153
  showArrows: false
154
154
  }))),
@@ -158,20 +158,20 @@ describe('<NumberInput />', () => {
158
158
  });
159
159
  it('calls onIncrement when up arrow spinbutton is clicked', async () => {
160
160
  const onIncrement = _vitest.vi.fn();
161
- const _render4 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
161
+ const _render4 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
162
162
  renderLabel: "Label",
163
163
  onIncrement: onIncrement
164
164
  })),
165
165
  container = _render4.container;
166
166
  const buttons = container.querySelectorAll('button[class$="-numberInput_arrow');
167
167
  _userEvent.default.click(buttons[0]);
168
- await (0, _react2.waitFor)(() => {
168
+ await (0, _react.waitFor)(() => {
169
169
  expect(onIncrement).toHaveBeenCalledTimes(1);
170
170
  });
171
171
  });
172
172
  it('does not call onIncrement when `interaction` is set to readonly', async () => {
173
173
  const onIncrement = _vitest.vi.fn();
174
- const _render5 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
174
+ const _render5 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
175
175
  renderLabel: "Label",
176
176
  interaction: "readonly",
177
177
  onIncrement: onIncrement
@@ -179,13 +179,13 @@ describe('<NumberInput />', () => {
179
179
  container = _render5.container;
180
180
  const buttons = container.querySelectorAll('button[class$="-numberInput_arrow');
181
181
  _userEvent.default.click(buttons[0]);
182
- await (0, _react2.waitFor)(() => {
182
+ await (0, _react.waitFor)(() => {
183
183
  expect(onIncrement).toHaveBeenCalledTimes(0);
184
184
  });
185
185
  });
186
186
  it('does not call onIncrement when `readOnly` is set', async () => {
187
187
  const onIncrement = _vitest.vi.fn();
188
- const _render6 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
188
+ const _render6 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
189
189
  renderLabel: "Label",
190
190
  readOnly: true,
191
191
  onIncrement: onIncrement
@@ -193,26 +193,26 @@ describe('<NumberInput />', () => {
193
193
  container = _render6.container;
194
194
  const buttons = container.querySelectorAll('button[class$="-numberInput_arrow');
195
195
  _userEvent.default.click(buttons[0]);
196
- await (0, _react2.waitFor)(() => {
196
+ await (0, _react.waitFor)(() => {
197
197
  expect(onIncrement).toHaveBeenCalledTimes(0);
198
198
  });
199
199
  });
200
200
  it('calls onDecrement when down arrow spinbutton is clicked', async () => {
201
201
  const onDecrement = _vitest.vi.fn();
202
- const _render7 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
202
+ const _render7 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
203
203
  renderLabel: "Label",
204
204
  onDecrement: onDecrement
205
205
  })),
206
206
  container = _render7.container;
207
207
  const buttons = container.querySelectorAll('button[class$="-numberInput_arrow');
208
208
  _userEvent.default.click(buttons[1]);
209
- await (0, _react2.waitFor)(() => {
209
+ await (0, _react.waitFor)(() => {
210
210
  expect(onDecrement).toHaveBeenCalledTimes(1);
211
211
  });
212
212
  });
213
213
  it('does not call onDecrement when `interaction` is set to readonly', async () => {
214
214
  const onDecrement = _vitest.vi.fn();
215
- const _render8 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
215
+ const _render8 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
216
216
  renderLabel: "Label",
217
217
  interaction: "readonly",
218
218
  onDecrement: onDecrement
@@ -220,13 +220,13 @@ describe('<NumberInput />', () => {
220
220
  container = _render8.container;
221
221
  const buttons = container.querySelectorAll('button[class$="-numberInput_arrow');
222
222
  _userEvent.default.click(buttons[1]);
223
- await (0, _react2.waitFor)(() => {
223
+ await (0, _react.waitFor)(() => {
224
224
  expect(onDecrement).toHaveBeenCalledTimes(0);
225
225
  });
226
226
  });
227
227
  it('does not call onDecrement when `readOnly` is set', async () => {
228
228
  const onDecrement = _vitest.vi.fn();
229
- const _render9 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
229
+ const _render9 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
230
230
  renderLabel: "Label",
231
231
  readOnly: true,
232
232
  onDecrement: onDecrement
@@ -234,23 +234,23 @@ describe('<NumberInput />', () => {
234
234
  container = _render9.container;
235
235
  const buttons = container.querySelectorAll('button[class$="-numberInput_arrow');
236
236
  _userEvent.default.click(buttons[1]);
237
- await (0, _react2.waitFor)(() => {
237
+ await (0, _react.waitFor)(() => {
238
238
  expect(onDecrement).toHaveBeenCalledTimes(0);
239
239
  });
240
240
  });
241
241
  it('puts inputMode prop to input', async () => {
242
- (0, _react2.render)(_NumberInput4 || (_NumberInput4 = /*#__PURE__*/_react.default.createElement(_index.NumberInput, {
242
+ (0, _react.render)(_NumberInput4 || (_NumberInput4 = (0, _jsxRuntime.jsx)(_index.NumberInput, {
243
243
  renderLabel: "Label",
244
244
  inputMode: "decimal"
245
245
  })));
246
- const input = _react2.screen.getByRole('spinbutton');
246
+ const input = _react.screen.getByRole('spinbutton');
247
247
  expect(input).toHaveAttribute('inputMode', 'decimal');
248
248
  });
249
249
  describe('with generated examples', () => {
250
250
  const generatedComponents = (0, _generateA11yTests.generateA11yTests)(_index.NumberInput, _NumberInput5.default);
251
251
  for (const component of generatedComponents) {
252
252
  it(component.description, async () => {
253
- const _render10 = (0, _react2.render)(component.content),
253
+ const _render10 = (0, _react.render)(component.content),
254
254
  container = _render10.container;
255
255
  const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
256
256
  expect(axeCheck).toBe(true);
@@ -260,13 +260,13 @@ describe('<NumberInput />', () => {
260
260
  it('renders custom interactive icons', async () => {
261
261
  const onDecrement = _vitest.vi.fn();
262
262
  const onIncrement = _vitest.vi.fn();
263
- const _render11 = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.NumberInput, {
263
+ const _render11 = (0, _react.render)((0, _jsxRuntime.jsx)(_index.NumberInput, {
264
264
  renderLabel: "Label",
265
265
  onIncrement: onIncrement,
266
266
  onDecrement: onDecrement,
267
267
  renderIcons: {
268
- increase: _IconZoomInLine || (_IconZoomInLine = /*#__PURE__*/_react.default.createElement(_IconZoomInLine2.IconZoomInLine, null)),
269
- decrease: _IconZoomOutLine || (_IconZoomOutLine = /*#__PURE__*/_react.default.createElement(_IconZoomOutLine2.IconZoomOutLine, null))
268
+ increase: _IconZoomInLine || (_IconZoomInLine = (0, _jsxRuntime.jsx)(_IconZoomInLine2.IconZoomInLine, {})),
269
+ decrease: _IconZoomOutLine || (_IconZoomOutLine = (0, _jsxRuntime.jsx)(_IconZoomOutLine2.IconZoomOutLine, {}))
270
270
  }
271
271
  })),
272
272
  container = _render11.container;
@@ -276,11 +276,11 @@ describe('<NumberInput />', () => {
276
276
  expect(zoomOutIcon).toBeInTheDocument();
277
277
  const buttons = container.querySelectorAll('button[class$="-numberInput_arrow');
278
278
  _userEvent.default.click(buttons[0]);
279
- await (0, _react2.waitFor)(() => {
279
+ await (0, _react.waitFor)(() => {
280
280
  expect(onIncrement).toHaveBeenCalledTimes(1);
281
281
  });
282
282
  _userEvent.default.click(buttons[1]);
283
- await (0, _react2.waitFor)(() => {
283
+ await (0, _react.waitFor)(() => {
284
284
  expect(onDecrement).toHaveBeenCalledTimes(1);
285
285
  });
286
286
  });