@instructure/ui-number-input 10.16.1-snapshot-0 → 10.16.1

package/lib/NumberInput/index.js

@@ -1,12 +1,11 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.NumberInput = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _keycode = _interopRequireDefault(require("keycode"));
 var _FormField = require("@instructure/ui-form-field/lib/FormField");
 var _IconArrowOpenDownLine = require("@instructure/ui-icons/lib/IconArrowOpenDownLine.js");
@@ -22,6 +21,7 @@ var _emotion = require("@instructure/emotion");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
 var _props = require("./props");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _dec, _dec2, _dec3, _class, _NumberInput, _IconArrowOpenUpLine, _IconArrowOpenDownLin;
 /*
  * The MIT License (MIT)
@@ -46,7 +46,6 @@ var _dec, _dec2, _dec3, _class, _NumberInput, _IconArrowOpenUpLine, _IconArrowOp
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-/** @jsx jsx */
 /**
 ---
 category: components
@@ -164,21 +163,24 @@ let NumberInput = exports.NumberInput = (_dec = (0, _withDeterministicId.withDet
   }
   renderArrows(customIcons) {
     var _this$props$styles, _this$props$styles2, _this$props$styles3;
-    return (0, _emotion.jsx)("span", {
-      css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.arrowContainer
-    }, (0, _emotion.jsx)("button", {
-      "aria-hidden": true,
-      css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.arrow,
-      onMouseDown: this.handleClickUpArrow,
-      tabIndex: -1,
-      type: "button"
-    }, customIcons !== null && customIcons !== void 0 && customIcons.increase ? (0, _callRenderProp.callRenderProp)(customIcons.increase) : _IconArrowOpenUpLine || (_IconArrowOpenUpLine = (0, _emotion.jsx)(_IconArrowOpenUpLine2.IconArrowOpenUpLine, null))), (0, _emotion.jsx)("button", {
-      "aria-hidden": true,
-      css: (_this$props$styles3 = this.props.styles) === null || _this$props$styles3 === void 0 ? void 0 : _this$props$styles3.arrow,
-      onMouseDown: this.handleClickDownArrow,
-      tabIndex: -1,
-      type: "button"
-    }, customIcons !== null && customIcons !== void 0 && customIcons.decrease ? (0, _callRenderProp.callRenderProp)(customIcons.decrease) : _IconArrowOpenDownLin || (_IconArrowOpenDownLin = (0, _emotion.jsx)(_IconArrowOpenDownLine.IconArrowOpenDownLine, null))));
+    return (0, _jsxRuntime.jsxs)("span", {
+      css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.arrowContainer,
+      children: [(0, _jsxRuntime.jsx)("button", {
+        "aria-hidden": true,
+        css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.arrow,
+        onMouseDown: this.handleClickUpArrow,
+        tabIndex: -1,
+        type: "button",
+        children: customIcons !== null && customIcons !== void 0 && customIcons.increase ? (0, _callRenderProp.callRenderProp)(customIcons.increase) : _IconArrowOpenUpLine || (_IconArrowOpenUpLine = (0, _jsxRuntime.jsx)(_IconArrowOpenUpLine2.IconArrowOpenUpLine, {}))
+      }), (0, _jsxRuntime.jsx)("button", {
+        "aria-hidden": true,
+        css: (_this$props$styles3 = this.props.styles) === null || _this$props$styles3 === void 0 ? void 0 : _this$props$styles3.arrow,
+        onMouseDown: this.handleClickDownArrow,
+        tabIndex: -1,
+        type: "button",
+        children: customIcons !== null && customIcons !== void 0 && customIcons.decrease ? (0, _callRenderProp.callRenderProp)(customIcons.decrease) : _IconArrowOpenDownLin || (_IconArrowOpenDownLin = (0, _jsxRuntime.jsx)(_IconArrowOpenDownLine.IconArrowOpenDownLine, {}))
+      })]
+    });
   }
   render() {
     var _this$props$styles4, _this$props$styles5, _this$props$styles6;
@@ -196,40 +198,48 @@ let NumberInput = exports.NumberInput = (_dec = (0, _withDeterministicId.withDet
       margin = _this$props4.margin;
     const interaction = this.interaction;
     const rawLabel = (0, _callRenderProp.callRenderProp)(renderLabel);
-    const label = (0, _hasVisibleChildren.hasVisibleChildren)(rawLabel) ? (0, _emotion.jsx)(_react.default.Fragment, null, rawLabel, isRequired && (0, _emotion.jsx)("span", {
-      css: this.invalid ? styles === null || styles === void 0 ? void 0 : styles.requiredInvalid : {},
-      "aria-hidden": true
-    }, ' ', "*")) : rawLabel;
-    return (0, _emotion.jsx)(_FormField.FormField, Object.assign({}, (0, _pickProps.pickProps)(this.props, _FormField.FormField.allowedProps), {
+    const label = (0, _hasVisibleChildren.hasVisibleChildren)(rawLabel) ? (0, _jsxRuntime.jsxs)(_react.Fragment, {
+      children: [rawLabel, isRequired && (0, _jsxRuntime.jsxs)("span", {
+        css: this.invalid ? styles === null || styles === void 0 ? void 0 : styles.requiredInvalid : {},
+        "aria-hidden": true,
+        children: [' ', "*"]
+      })]
+    }) : rawLabel;
+    return (0, _jsxRuntime.jsx)(_FormField.FormField, {
+      ...(0, _pickProps.pickProps)(this.props, _FormField.FormField.allowedProps),
       label: label,
       inline: display === 'inline-block',
       id: this.id,
       elementRef: this.handleRef,
-      margin: margin
-    }), (0, _emotion.jsx)("span", {
-      css: (_this$props$styles4 = this.props.styles) === null || _this$props$styles4 === void 0 ? void 0 : _this$props$styles4.inputWidth,
-      style: width ? {
-        width
-      } : void 0
-    }, (0, _emotion.jsx)("span", {
-      css: (_this$props$styles5 = this.props.styles) === null || _this$props$styles5 === void 0 ? void 0 : _this$props$styles5.inputContainer
-    }, (0, _emotion.jsx)("input", Object.assign({}, (0, _omitProps.omitProps)(this.props, [..._FormField.FormField.allowedProps, ...NumberInput.allowedProps]), {
-      css: (_this$props$styles6 = this.props.styles) === null || _this$props$styles6 === void 0 ? void 0 : _this$props$styles6.input,
-      "aria-invalid": this.invalid ? 'true' : void 0,
-      id: this.id,
-      type: allowStringValue ? 'text' : 'number',
-      inputMode: this.props.inputMode,
-      placeholder: placeholder,
-      ref: this.handleInputRef,
-      required: isRequired,
-      value: value,
-      disabled: interaction === 'disabled',
-      readOnly: interaction === 'readonly',
-      onFocus: this.handleFocus,
-      onBlur: this.handleBlur,
-      onChange: this.handleChange,
-      onKeyDown: this.handleKeyDown
-    })), showArrows ? this.renderArrows(renderIcons) : null)));
+      margin: margin,
+      children: (0, _jsxRuntime.jsx)("span", {
+        css: (_this$props$styles4 = this.props.styles) === null || _this$props$styles4 === void 0 ? void 0 : _this$props$styles4.inputWidth,
+        style: width ? {
+          width
+        } : void 0,
+        children: (0, _jsxRuntime.jsxs)("span", {
+          css: (_this$props$styles5 = this.props.styles) === null || _this$props$styles5 === void 0 ? void 0 : _this$props$styles5.inputContainer,
+          children: [(0, _jsxRuntime.jsx)("input", {
+            ...(0, _omitProps.omitProps)(this.props, [..._FormField.FormField.allowedProps, ...NumberInput.allowedProps]),
+            css: (_this$props$styles6 = this.props.styles) === null || _this$props$styles6 === void 0 ? void 0 : _this$props$styles6.input,
+            "aria-invalid": this.invalid ? 'true' : void 0,
+            id: this.id,
+            type: allowStringValue ? 'text' : 'number',
+            inputMode: this.props.inputMode,
+            placeholder: placeholder,
+            ref: this.handleInputRef,
+            required: isRequired,
+            value: value,
+            disabled: interaction === 'disabled',
+            readOnly: interaction === 'readonly',
+            onFocus: this.handleFocus,
+            onBlur: this.handleBlur,
+            onChange: this.handleChange,
+            onKeyDown: this.handleKeyDown
+          }), showArrows ? this.renderArrows(renderIcons) : null]
+        })
+      })
+    });
   }
 }, _NumberInput.displayName = "NumberInput", _NumberInput.componentId = 'NumberInput', _NumberInput.allowedProps = _props.allowedProps, _NumberInput.propTypes = _props.propTypes, _NumberInput.defaultProps = {
   // Leave interaction default undefined so that `disabled` and `readOnly` can also be supplied

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-number-input",
-  "version": "10.16.1-snapshot-0",
+  "version": "10.16.1",
   "description": "A UI component library made by Instructure Inc.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "homepage": "https://instructure.github.io/instructure-ui/",
@@ -23,11 +23,11 @@
     "ts:check": "tsc -p tsconfig.build.json --noEmit --emitDeclarationOnly false"
   },
   "devDependencies": {
-    "@instructure/ui-axe-check": "10.16.1-snapshot-0",
-    "@instructure/ui-babel-preset": "10.16.1-snapshot-0",
-    "@instructure/ui-scripts": "10.16.1-snapshot-0",
-    "@instructure/ui-test-utils": "10.16.1-snapshot-0",
-    "@instructure/ui-themes": "10.16.1-snapshot-0",
+    "@instructure/ui-axe-check": "10.16.1",
+    "@instructure/ui-babel-preset": "10.16.1",
+    "@instructure/ui-scripts": "10.16.1",
+    "@instructure/ui-test-utils": "10.16.1",
+    "@instructure/ui-themes": "10.16.1",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.0.1",
     "@testing-library/user-event": "^14.5.2",
@@ -35,14 +35,14 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.26.0",
-    "@instructure/emotion": "10.16.1-snapshot-0",
-    "@instructure/shared-types": "10.16.1-snapshot-0",
-    "@instructure/ui-form-field": "10.16.1-snapshot-0",
-    "@instructure/ui-icons": "10.16.1-snapshot-0",
-    "@instructure/ui-react-utils": "10.16.1-snapshot-0",
-    "@instructure/ui-testable": "10.16.1-snapshot-0",
-    "@instructure/ui-utils": "10.16.1-snapshot-0",
-    "@instructure/uid": "10.16.1-snapshot-0",
+    "@instructure/emotion": "10.16.1",
+    "@instructure/shared-types": "10.16.1",
+    "@instructure/ui-form-field": "10.16.1",
+    "@instructure/ui-icons": "10.16.1",
+    "@instructure/ui-react-utils": "10.16.1",
+    "@instructure/ui-testable": "10.16.1",
+    "@instructure/ui-utils": "10.16.1",
+    "@instructure/uid": "10.16.1",
     "keycode": "^2",
     "prop-types": "^15.8.1"
   },

package/src/NumberInput/__new-tests__/NumberInput.test.tsx

@@ -22,7 +22,6 @@
  * SOFTWARE.
  */
 
-import React from 'react'
 import { render, screen, waitFor } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 import { vi } from 'vitest'

package/src/NumberInput/index.tsx

@@ -22,8 +22,7 @@
  * SOFTWARE.
  */
 
-/** @jsx jsx */
-import React, { Component } from 'react'
+import { Fragment, Component } from 'react'
 import keycode from 'keycode'
 
 import { FormField } from '@instructure/ui-form-field'
@@ -41,7 +40,7 @@ import {
 } from '@instructure/ui-react-utils'
 import { hasVisibleChildren } from '@instructure/ui-a11y-utils'
 
-import { withStyle, jsx } from '@instructure/emotion'
+import { withStyle } from '@instructure/emotion'
 
 import generateStyle from './styles'
 import generateComponentTheme from './theme'
@@ -256,7 +255,7 @@ class NumberInput extends Component<NumberInputProps, NumberInputState> {
 
     const rawLabel = callRenderProp(renderLabel)
     const label = hasVisibleChildren(rawLabel) ? (
-      <React.Fragment>
+      <Fragment>
         {rawLabel}
         {isRequired && (
           <span
@@ -267,7 +266,7 @@ class NumberInput extends Component<NumberInputProps, NumberInputState> {
             *
           </span>
         )}
-      </React.Fragment>
+      </Fragment>
     ) : (
       rawLabel
     )