@react-spectrum/numberfield 3.7.3 → 3.8.1

package/dist/main.css.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/@adobe/spectrum-css-temp/components/stepper/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"main.css.map"}

package/dist/main.js

@@ -1,3 +1,5 @@
+"use client";
+
 require("./main.css");
 var $i8sTE$reactspectrumutils = require("@react-spectrum/utils");
 var $i8sTE$reactspectrumlabel = require("@react-spectrum/label");
@@ -6,6 +8,7 @@ var $i8sTE$reactariautils = require("@react-aria/utils");
 var $i8sTE$reactstatelynumberfield = require("@react-stately/numberfield");
 var $i8sTE$react = require("react");
 var $i8sTE$reactspectrumtextfield = require("@react-spectrum/textfield");
+var $i8sTE$reactspectrumform = require("@react-spectrum/form");
 var $i8sTE$reactariainteractions = require("@react-aria/interactions");
 var $i8sTE$reactariai18n = require("@react-aria/i18n");
 var $i8sTE$reactarianumberfield = require("@react-aria/numberfield");
@@ -16,9 +19,11 @@ var $i8sTE$spectrumiconsuiChevronUpSmall = require("@spectrum-icons/ui/ChevronUp
 var $i8sTE$spectrumiconsworkflowRemove = require("@spectrum-icons/workflow/Remove");
 var $i8sTE$reactariabutton = require("@react-aria/button");
 
+
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
+
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
@@ -256,8 +261,10 @@ function $2f3cded204daae76$var$StepButton(props, ref) {
 
 
 
+
 function $9b3df9c012d62e52$var$NumberField(props, ref) {
     props = (0, $i8sTE$reactspectrumprovider.useProviderProps)(props);
+    props = (0, $i8sTE$reactspectrumform.useFormProps)(props);
     let provider = (0, $i8sTE$reactspectrumprovider.useProvider)();
     let { isQuiet: isQuiet, isReadOnly: isReadOnly, isDisabled: isDisabled, hideStepper: hideStepper } = props;
     let { styleProps: style } = (0, $i8sTE$reactspectrumutils.useStyleProps)(props);
@@ -268,17 +275,18 @@ function $9b3df9c012d62e52$var$NumberField(props, ref) {
     });
     let inputRef = (0, $i8sTE$react.useRef)();
     let domRef = (0, $i8sTE$reactspectrumutils.useFocusableRef)(ref, inputRef);
-    let { groupProps: groupProps, labelProps: labelProps, inputProps: inputProps, incrementButtonProps: incrementButtonProps, decrementButtonProps: decrementButtonProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $i8sTE$reactarianumberfield.useNumberField)(props, state, inputRef);
+    let { groupProps: groupProps, labelProps: labelProps, inputProps: inputProps, incrementButtonProps: incrementButtonProps, decrementButtonProps: decrementButtonProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = (0, $i8sTE$reactarianumberfield.useNumberField)(props, state, inputRef);
     let isMobile = provider.scale === "large";
     let showStepper = !hideStepper;
     let { isHovered: isHovered, hoverProps: hoverProps } = (0, $i8sTE$reactariainteractions.useHover)({
         isDisabled: isDisabled
     });
+    let validationState = props.validationState || (isInvalid ? "invalid" : null);
     let className = (0, $i8sTE$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($3649bcbba015c4d7$exports))), "spectrum-Stepper", {
         "spectrum-Stepper--isQuiet": isQuiet,
         "is-disabled": isDisabled,
         "spectrum-Stepper--readonly": isReadOnly,
-        "is-invalid": props.validationState === "invalid" && !isDisabled,
+        "is-invalid": validationState === "invalid" && !isDisabled,
         "spectrum-Stepper--showStepper": showStepper,
         "spectrum-Stepper--isMobile": isMobile,
         "is-hovered": isHovered,
@@ -289,6 +297,9 @@ function $9b3df9c012d62e52$var$NumberField(props, ref) {
         ...props,
         descriptionProps: descriptionProps,
         errorMessageProps: errorMessageProps,
+        isInvalid: isInvalid,
+        validationErrors: validationErrors,
+        validationDetails: validationDetails,
         labelProps: labelProps,
         ref: domRef,
         wrapperClassName: (0, $i8sTE$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($3649bcbba015c4d7$exports))), "spectrum-Stepper-container", {
@@ -303,7 +314,8 @@ function $9b3df9c012d62e52$var$NumberField(props, ref) {
         decrementProps: decrementButtonProps,
         className: className,
         style: style,
-        state: state
+        state: state,
+        validationState: validationState
     }));
 }
 const $9b3df9c012d62e52$var$NumberFieldInput = /*#__PURE__*/ (0, ($parcel$interopDefault($i8sTE$react))).forwardRef(function NumberFieldInput(props, ref) {

package/dist/main.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/numberfield/src/index.ts","packages/@react-spectrum/numberfield/src/NumberField.tsx","packages/@react-spectrum/numberfield/src/StepButton.tsx","packages/@adobe/spectrum-css-temp/components/stepper/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {NumberField} from './NumberField';\nexport type {SpectrumNumberFieldProps} from '@react-types/numberfield';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '@react-types/button';\nimport {classNames, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {Field} from '@react-spectrum/label';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport {NumberFieldState, useNumberFieldState} from '@react-stately/numberfield';\nimport React, {HTMLAttributes, InputHTMLAttributes, RefObject, useRef} from 'react';\nimport {SpectrumNumberFieldProps} from '@react-types/numberfield';\nimport {StepButton} from './StepButton';\nimport stepperStyle from '@adobe/spectrum-css-temp/components/stepper/vars.css';\nimport {TextFieldBase} from '@react-spectrum/textfield';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale} from '@react-aria/i18n';\nimport {useNumberField} from '@react-aria/numberfield';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\nfunction NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElement>) {\n  props = useProviderProps(props);\n  let provider = useProvider();\n  let {\n    isQuiet,\n    isReadOnly,\n    isDisabled,\n    hideStepper\n  } = props;\n\n  let {styleProps: style} = useStyleProps(props);\n\n  let {locale} = useLocale();\n  let state = useNumberFieldState({...props, locale});\n  let inputRef = useRef<HTMLInputElement>();\n  let domRef = useFocusableRef<HTMLElement>(ref, inputRef);\n  let {\n    groupProps,\n    labelProps,\n    inputProps,\n    incrementButtonProps,\n    decrementButtonProps,\n    descriptionProps,\n    errorMessageProps\n  } = useNumberField(props, state, inputRef);\n  let isMobile = provider.scale === 'large';\n  let showStepper = !hideStepper;\n\n  let {isHovered, hoverProps} = useHover({isDisabled});\n\n  let className =\n    classNames(\n      stepperStyle,\n      'spectrum-Stepper',\n      {\n        'spectrum-Stepper--isQuiet': isQuiet,\n        'is-disabled': isDisabled,\n        'spectrum-Stepper--readonly': isReadOnly,\n        'is-invalid': props.validationState === 'invalid' && !isDisabled,\n        'spectrum-Stepper--showStepper': showStepper,\n        'spectrum-Stepper--isMobile': isMobile,\n        'is-hovered': isHovered,\n        // because FocusRing won't pass along the className from Field, we have to handle that ourselves\n        [style.className]: !props.label && style.className\n      }\n    );\n\n  return (\n    <Field\n      {...props as Omit<SpectrumNumberFieldProps, 'onChange'>}\n      descriptionProps={descriptionProps}\n      errorMessageProps={errorMessageProps}\n      labelProps={labelProps}\n      ref={domRef}\n      wrapperClassName={classNames(\n        stepperStyle,\n        'spectrum-Stepper-container',\n        {\n          'spectrum-Stepper-container--isMobile': isMobile\n        }\n      )}>\n      <NumberFieldInput\n        {...props}\n        groupProps={mergeProps(groupProps, hoverProps)}\n        inputProps={inputProps}\n        inputRef={inputRef}\n        incrementProps={incrementButtonProps}\n        decrementProps={decrementButtonProps}\n        className={className}\n        style={style}\n        state={state} />\n    </Field>\n  );\n}\n\n\ninterface NumberFieldInputProps extends SpectrumNumberFieldProps {\n  groupProps: HTMLAttributes<HTMLDivElement>,\n  inputProps: InputHTMLAttributes<HTMLInputElement>,\n  inputRef: RefObject<HTMLInputElement | HTMLTextAreaElement>,\n  incrementProps: AriaButtonProps,\n  decrementProps: AriaButtonProps,\n  className?: string,\n  style?: React.CSSProperties,\n  state: NumberFieldState\n}\n\nconst NumberFieldInput = React.forwardRef(function NumberFieldInput(props: NumberFieldInputProps, ref: RefObject<HTMLElement>) {\n  let {\n    groupProps,\n    inputProps,\n    inputRef,\n    incrementProps,\n    decrementProps,\n    className,\n    style,\n    autoFocus,\n    isQuiet,\n    isDisabled,\n    hideStepper,\n    validationState,\n    name,\n    state\n  } = props;\n  let showStepper = !hideStepper;\n\n  return (\n    <FocusRing\n      within\n      isTextInput\n      focusClass={classNames(stepperStyle, 'is-focused')}\n      focusRingClass={classNames(stepperStyle, 'focus-ring')}\n      autoFocus={autoFocus}>\n      <div\n        {...groupProps}\n        ref={ref as RefObject<HTMLDivElement>}\n        style={style}\n        className={className}>\n        <TextFieldBase\n          UNSAFE_className={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-field'\n            )\n          }\n          inputClassName={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-input'\n            )\n          }\n          validationIconClassName={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-icon'\n            )\n          }\n          isQuiet={isQuiet}\n          inputRef={inputRef}\n          validationState={validationState}\n          inputProps={inputProps}\n          isDisabled={isDisabled}\n          disableFocusRing />\n        {showStepper &&\n        <>\n          <StepButton direction=\"up\" isQuiet={isQuiet} {...incrementProps} />\n          <StepButton direction=\"down\" isQuiet={isQuiet} {...decrementProps} />\n        </>\n        }\n        {name && <input type=\"hidden\" name={name} value={isNaN(state.numberValue) ? '' : state.numberValue} />}\n      </div>\n    </FocusRing>\n  );\n});\n\n/**\n * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.\n */\nlet _NumberField = React.forwardRef(NumberField);\nexport {_NumberField as NumberField};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport Add from '@spectrum-icons/workflow/Add';\nimport {AriaButtonProps} from '@react-types/button';\nimport ChevronDownSmall from '@spectrum-icons/ui/ChevronDownSmall';\nimport ChevronUpSmall from '@spectrum-icons/ui/ChevronUpSmall';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {RefObject} from 'react';\nimport Remove from '@spectrum-icons/workflow/Remove';\nimport stepperStyle from '@adobe/spectrum-css-temp/components/stepper/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\ninterface StepButtonProps extends AriaButtonProps {\n  isQuiet: boolean,\n  direction: 'up' | 'down'\n}\n\nfunction StepButton(props: StepButtonProps, ref: RefObject<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let {scale} = useProvider();\n  let {direction, isDisabled, isQuiet} = props;\n  /**\n   * Must use div for now because Safari pointer event bugs on disabled form elements.\n   * Link https://bugs.webkit.org/show_bug.cgi?id=219188.\n   */\n  let {buttonProps, isPressed} = useButton({...props, elementType: 'div'}, ref);\n  let {hoverProps, isHovered} = useHover(props);\n  return (\n    <FocusRing focusRingClass={classNames(stepperStyle, 'focus-ring')}>\n      <div\n        className={\n          classNames(\n            stepperStyle,\n            'spectrum-Stepper-button',\n            {\n              'spectrum-Stepper-button--stepUp': direction === 'up',\n              'spectrum-Stepper-button--stepDown': direction === 'down',\n              'spectrum-Stepper-button--isQuiet': isQuiet,\n              'is-hovered': isHovered,\n              'is-active': isPressed,\n              'is-disabled': isDisabled\n            }\n          )\n        }\n        {...mergeProps(hoverProps, buttonProps)}\n        ref={ref}>\n        {direction === 'up' && scale === 'large' &&\n          <Add UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepUpIcon')} size=\"S\" />\n        }\n        {direction === 'up' && scale === 'medium' &&\n          <ChevronUpSmall UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepUpIcon')} />\n        }\n        {direction === 'down' && scale === 'large' &&\n          <Remove UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepDownIcon')} size=\"S\" />\n        }\n        {direction === 'down' && scale === 'medium' &&\n          <ChevronDownSmall UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepDownIcon')} />\n        }\n      </div>\n    </FocusRing>\n  );\n}\n\n/**\n * Buttons for NumberField.\n */\nlet _StepButton = React.forwardRef(StepButton);\nexport {_StepButton as StepButton};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"main.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/numberfield/src/index.ts","packages/@react-spectrum/numberfield/src/NumberField.tsx","packages/@react-spectrum/numberfield/src/StepButton.tsx","packages/@adobe/spectrum-css-temp/components/stepper/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {NumberField} from './NumberField';\nexport type {SpectrumNumberFieldProps} from '@react-types/numberfield';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '@react-types/button';\nimport {classNames, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {Field} from '@react-spectrum/label';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport {NumberFieldState, useNumberFieldState} from '@react-stately/numberfield';\nimport React, {HTMLAttributes, InputHTMLAttributes, RefObject, useRef} from 'react';\nimport {SpectrumNumberFieldProps} from '@react-types/numberfield';\nimport {StepButton} from './StepButton';\nimport stepperStyle from '@adobe/spectrum-css-temp/components/stepper/vars.css';\nimport {TextFieldBase} from '@react-spectrum/textfield';\nimport {useFormProps} from '@react-spectrum/form';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale} from '@react-aria/i18n';\nimport {useNumberField} from '@react-aria/numberfield';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\nfunction NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElement>) {\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  let provider = useProvider();\n  let {\n    isQuiet,\n    isReadOnly,\n    isDisabled,\n    hideStepper\n  } = props;\n\n  let {styleProps: style} = useStyleProps(props);\n\n  let {locale} = useLocale();\n  let state = useNumberFieldState({...props, locale});\n  let inputRef = useRef<HTMLInputElement>();\n  let domRef = useFocusableRef<HTMLElement>(ref, inputRef);\n  let {\n    groupProps,\n    labelProps,\n    inputProps,\n    incrementButtonProps,\n    decrementButtonProps,\n    descriptionProps,\n    errorMessageProps,\n    isInvalid,\n    validationErrors,\n    validationDetails\n  } = useNumberField(props, state, inputRef);\n  let isMobile = provider.scale === 'large';\n  let showStepper = !hideStepper;\n\n  let {isHovered, hoverProps} = useHover({isDisabled});\n\n  let validationState = props.validationState || (isInvalid ? 'invalid' : null);\n  let className =\n    classNames(\n      stepperStyle,\n      'spectrum-Stepper',\n      {\n        'spectrum-Stepper--isQuiet': isQuiet,\n        'is-disabled': isDisabled,\n        'spectrum-Stepper--readonly': isReadOnly,\n        'is-invalid': validationState === 'invalid' && !isDisabled,\n        'spectrum-Stepper--showStepper': showStepper,\n        'spectrum-Stepper--isMobile': isMobile,\n        'is-hovered': isHovered,\n        // because FocusRing won't pass along the className from Field, we have to handle that ourselves\n        [style.className]: !props.label && style.className\n      }\n    );\n\n  return (\n    <Field\n      {...props as Omit<SpectrumNumberFieldProps, 'onChange'>}\n      descriptionProps={descriptionProps}\n      errorMessageProps={errorMessageProps}\n      isInvalid={isInvalid}\n      validationErrors={validationErrors}\n      validationDetails={validationDetails}\n      labelProps={labelProps}\n      ref={domRef}\n      wrapperClassName={classNames(\n        stepperStyle,\n        'spectrum-Stepper-container',\n        {\n          'spectrum-Stepper-container--isMobile': isMobile\n        }\n      )}>\n      <NumberFieldInput\n        {...props}\n        groupProps={mergeProps(groupProps, hoverProps)}\n        inputProps={inputProps}\n        inputRef={inputRef}\n        incrementProps={incrementButtonProps}\n        decrementProps={decrementButtonProps}\n        className={className}\n        style={style}\n        state={state}\n        validationState={validationState} />\n    </Field>\n  );\n}\n\n\ninterface NumberFieldInputProps extends SpectrumNumberFieldProps {\n  groupProps: HTMLAttributes<HTMLDivElement>,\n  inputProps: InputHTMLAttributes<HTMLInputElement>,\n  inputRef: RefObject<HTMLInputElement | HTMLTextAreaElement>,\n  incrementProps: AriaButtonProps,\n  decrementProps: AriaButtonProps,\n  className?: string,\n  style?: React.CSSProperties,\n  state: NumberFieldState\n}\n\nconst NumberFieldInput = React.forwardRef(function NumberFieldInput(props: NumberFieldInputProps, ref: RefObject<HTMLElement>) {\n  let {\n    groupProps,\n    inputProps,\n    inputRef,\n    incrementProps,\n    decrementProps,\n    className,\n    style,\n    autoFocus,\n    isQuiet,\n    isDisabled,\n    hideStepper,\n    validationState,\n    name,\n    state\n  } = props;\n  let showStepper = !hideStepper;\n\n  return (\n    <FocusRing\n      within\n      isTextInput\n      focusClass={classNames(stepperStyle, 'is-focused')}\n      focusRingClass={classNames(stepperStyle, 'focus-ring')}\n      autoFocus={autoFocus}>\n      <div\n        {...groupProps}\n        ref={ref as RefObject<HTMLDivElement>}\n        style={style}\n        className={className}>\n        <TextFieldBase\n          UNSAFE_className={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-field'\n            )\n          }\n          inputClassName={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-input'\n            )\n          }\n          validationIconClassName={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-icon'\n            )\n          }\n          isQuiet={isQuiet}\n          inputRef={inputRef}\n          validationState={validationState}\n          inputProps={inputProps}\n          isDisabled={isDisabled}\n          disableFocusRing />\n        {showStepper &&\n        <>\n          <StepButton direction=\"up\" isQuiet={isQuiet} {...incrementProps} />\n          <StepButton direction=\"down\" isQuiet={isQuiet} {...decrementProps} />\n        </>\n        }\n        {name && <input type=\"hidden\" name={name} value={isNaN(state.numberValue) ? '' : state.numberValue} />}\n      </div>\n    </FocusRing>\n  );\n});\n\n/**\n * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.\n */\nlet _NumberField = React.forwardRef(NumberField);\nexport {_NumberField as NumberField};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport Add from '@spectrum-icons/workflow/Add';\nimport {AriaButtonProps} from '@react-types/button';\nimport ChevronDownSmall from '@spectrum-icons/ui/ChevronDownSmall';\nimport ChevronUpSmall from '@spectrum-icons/ui/ChevronUpSmall';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {RefObject} from 'react';\nimport Remove from '@spectrum-icons/workflow/Remove';\nimport stepperStyle from '@adobe/spectrum-css-temp/components/stepper/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\ninterface StepButtonProps extends AriaButtonProps {\n  isQuiet: boolean,\n  direction: 'up' | 'down'\n}\n\nfunction StepButton(props: StepButtonProps, ref: RefObject<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let {scale} = useProvider();\n  let {direction, isDisabled, isQuiet} = props;\n  /**\n   * Must use div for now because Safari pointer event bugs on disabled form elements.\n   * Link https://bugs.webkit.org/show_bug.cgi?id=219188.\n   */\n  let {buttonProps, isPressed} = useButton({...props, elementType: 'div'}, ref);\n  let {hoverProps, isHovered} = useHover(props);\n  return (\n    <FocusRing focusRingClass={classNames(stepperStyle, 'focus-ring')}>\n      <div\n        className={\n          classNames(\n            stepperStyle,\n            'spectrum-Stepper-button',\n            {\n              'spectrum-Stepper-button--stepUp': direction === 'up',\n              'spectrum-Stepper-button--stepDown': direction === 'down',\n              'spectrum-Stepper-button--isQuiet': isQuiet,\n              'is-hovered': isHovered,\n              'is-active': isPressed,\n              'is-disabled': isDisabled\n            }\n          )\n        }\n        {...mergeProps(hoverProps, buttonProps)}\n        ref={ref}>\n        {direction === 'up' && scale === 'large' &&\n          <Add UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepUpIcon')} size=\"S\" />\n        }\n        {direction === 'up' && scale === 'medium' &&\n          <ChevronUpSmall UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepUpIcon')} />\n        }\n        {direction === 'down' && scale === 'large' &&\n          <Remove UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepDownIcon')} size=\"S\" />\n        }\n        {direction === 'down' && scale === 'medium' &&\n          <ChevronDownSmall UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepDownIcon')} />\n        }\n      </div>\n    </FocusRing>\n  );\n}\n\n/**\n * Buttons for NumberField.\n */\nlet _StepButton = React.forwardRef(StepButton);\nexport {_StepButton as StepButton};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"main.js.map"}

package/dist/module.js

@@ -1,3 +1,5 @@
+"use client";
+
 import "./main.css";
 import {useStyleProps as $k6K00$useStyleProps, useFocusableRef as $k6K00$useFocusableRef, classNames as $k6K00$classNames} from "@react-spectrum/utils";
 import {Field as $k6K00$Field} from "@react-spectrum/label";
@@ -6,6 +8,7 @@ import {mergeProps as $k6K00$mergeProps} from "@react-aria/utils";
 import {useNumberFieldState as $k6K00$useNumberFieldState} from "@react-stately/numberfield";
 import $k6K00$react, {useRef as $k6K00$useRef} from "react";
 import {TextFieldBase as $k6K00$TextFieldBase} from "@react-spectrum/textfield";
+import {useFormProps as $k6K00$useFormProps} from "@react-spectrum/form";
 import {useHover as $k6K00$useHover} from "@react-aria/interactions";
 import {useLocale as $k6K00$useLocale} from "@react-aria/i18n";
 import {useNumberField as $k6K00$useNumberField} from "@react-aria/numberfield";
@@ -16,9 +19,11 @@ import $k6K00$spectrumiconsuiChevronUpSmall from "@spectrum-icons/ui/ChevronUpSm
 import $k6K00$spectrumiconsworkflowRemove from "@spectrum-icons/workflow/Remove";
 import {useButton as $k6K00$useButton} from "@react-aria/button";
 
+
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
+
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
@@ -254,8 +259,10 @@ function $7f00b388e0d3b2f6$var$StepButton(props, ref) {
 
 
 
+
 function $48b879bdd771eb85$var$NumberField(props, ref) {
     props = (0, $k6K00$useProviderProps)(props);
+    props = (0, $k6K00$useFormProps)(props);
     let provider = (0, $k6K00$useProvider)();
     let { isQuiet: isQuiet, isReadOnly: isReadOnly, isDisabled: isDisabled, hideStepper: hideStepper } = props;
     let { styleProps: style } = (0, $k6K00$useStyleProps)(props);
@@ -266,17 +273,18 @@ function $48b879bdd771eb85$var$NumberField(props, ref) {
     });
     let inputRef = (0, $k6K00$useRef)();
     let domRef = (0, $k6K00$useFocusableRef)(ref, inputRef);
-    let { groupProps: groupProps, labelProps: labelProps, inputProps: inputProps, incrementButtonProps: incrementButtonProps, decrementButtonProps: decrementButtonProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $k6K00$useNumberField)(props, state, inputRef);
+    let { groupProps: groupProps, labelProps: labelProps, inputProps: inputProps, incrementButtonProps: incrementButtonProps, decrementButtonProps: decrementButtonProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = (0, $k6K00$useNumberField)(props, state, inputRef);
     let isMobile = provider.scale === "large";
     let showStepper = !hideStepper;
     let { isHovered: isHovered, hoverProps: hoverProps } = (0, $k6K00$useHover)({
         isDisabled: isDisabled
     });
+    let validationState = props.validationState || (isInvalid ? "invalid" : null);
     let className = (0, $k6K00$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($ba58a329f3e1a776$exports))), "spectrum-Stepper", {
         "spectrum-Stepper--isQuiet": isQuiet,
         "is-disabled": isDisabled,
         "spectrum-Stepper--readonly": isReadOnly,
-        "is-invalid": props.validationState === "invalid" && !isDisabled,
+        "is-invalid": validationState === "invalid" && !isDisabled,
         "spectrum-Stepper--showStepper": showStepper,
         "spectrum-Stepper--isMobile": isMobile,
         "is-hovered": isHovered,
@@ -287,6 +295,9 @@ function $48b879bdd771eb85$var$NumberField(props, ref) {
         ...props,
         descriptionProps: descriptionProps,
         errorMessageProps: errorMessageProps,
+        isInvalid: isInvalid,
+        validationErrors: validationErrors,
+        validationDetails: validationDetails,
         labelProps: labelProps,
         ref: domRef,
         wrapperClassName: (0, $k6K00$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($ba58a329f3e1a776$exports))), "spectrum-Stepper-container", {
@@ -301,7 +312,8 @@ function $48b879bdd771eb85$var$NumberField(props, ref) {
         decrementProps: decrementButtonProps,
         className: className,
         style: style,
-        state: state
+        state: state,
+        validationState: validationState
     }));
 }
 const $48b879bdd771eb85$var$NumberFieldInput = /*#__PURE__*/ (0, $k6K00$react).forwardRef(function NumberFieldInput(props, ref) {

package/dist/module.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/numberfield/src/index.ts","packages/@react-spectrum/numberfield/src/NumberField.tsx","packages/@react-spectrum/numberfield/src/StepButton.tsx","packages/@adobe/spectrum-css-temp/components/stepper/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {NumberField} from './NumberField';\nexport type {SpectrumNumberFieldProps} from '@react-types/numberfield';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '@react-types/button';\nimport {classNames, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {Field} from '@react-spectrum/label';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport {NumberFieldState, useNumberFieldState} from '@react-stately/numberfield';\nimport React, {HTMLAttributes, InputHTMLAttributes, RefObject, useRef} from 'react';\nimport {SpectrumNumberFieldProps} from '@react-types/numberfield';\nimport {StepButton} from './StepButton';\nimport stepperStyle from '@adobe/spectrum-css-temp/components/stepper/vars.css';\nimport {TextFieldBase} from '@react-spectrum/textfield';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale} from '@react-aria/i18n';\nimport {useNumberField} from '@react-aria/numberfield';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\nfunction NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElement>) {\n  props = useProviderProps(props);\n  let provider = useProvider();\n  let {\n    isQuiet,\n    isReadOnly,\n    isDisabled,\n    hideStepper\n  } = props;\n\n  let {styleProps: style} = useStyleProps(props);\n\n  let {locale} = useLocale();\n  let state = useNumberFieldState({...props, locale});\n  let inputRef = useRef<HTMLInputElement>();\n  let domRef = useFocusableRef<HTMLElement>(ref, inputRef);\n  let {\n    groupProps,\n    labelProps,\n    inputProps,\n    incrementButtonProps,\n    decrementButtonProps,\n    descriptionProps,\n    errorMessageProps\n  } = useNumberField(props, state, inputRef);\n  let isMobile = provider.scale === 'large';\n  let showStepper = !hideStepper;\n\n  let {isHovered, hoverProps} = useHover({isDisabled});\n\n  let className =\n    classNames(\n      stepperStyle,\n      'spectrum-Stepper',\n      {\n        'spectrum-Stepper--isQuiet': isQuiet,\n        'is-disabled': isDisabled,\n        'spectrum-Stepper--readonly': isReadOnly,\n        'is-invalid': props.validationState === 'invalid' && !isDisabled,\n        'spectrum-Stepper--showStepper': showStepper,\n        'spectrum-Stepper--isMobile': isMobile,\n        'is-hovered': isHovered,\n        // because FocusRing won't pass along the className from Field, we have to handle that ourselves\n        [style.className]: !props.label && style.className\n      }\n    );\n\n  return (\n    <Field\n      {...props as Omit<SpectrumNumberFieldProps, 'onChange'>}\n      descriptionProps={descriptionProps}\n      errorMessageProps={errorMessageProps}\n      labelProps={labelProps}\n      ref={domRef}\n      wrapperClassName={classNames(\n        stepperStyle,\n        'spectrum-Stepper-container',\n        {\n          'spectrum-Stepper-container--isMobile': isMobile\n        }\n      )}>\n      <NumberFieldInput\n        {...props}\n        groupProps={mergeProps(groupProps, hoverProps)}\n        inputProps={inputProps}\n        inputRef={inputRef}\n        incrementProps={incrementButtonProps}\n        decrementProps={decrementButtonProps}\n        className={className}\n        style={style}\n        state={state} />\n    </Field>\n  );\n}\n\n\ninterface NumberFieldInputProps extends SpectrumNumberFieldProps {\n  groupProps: HTMLAttributes<HTMLDivElement>,\n  inputProps: InputHTMLAttributes<HTMLInputElement>,\n  inputRef: RefObject<HTMLInputElement | HTMLTextAreaElement>,\n  incrementProps: AriaButtonProps,\n  decrementProps: AriaButtonProps,\n  className?: string,\n  style?: React.CSSProperties,\n  state: NumberFieldState\n}\n\nconst NumberFieldInput = React.forwardRef(function NumberFieldInput(props: NumberFieldInputProps, ref: RefObject<HTMLElement>) {\n  let {\n    groupProps,\n    inputProps,\n    inputRef,\n    incrementProps,\n    decrementProps,\n    className,\n    style,\n    autoFocus,\n    isQuiet,\n    isDisabled,\n    hideStepper,\n    validationState,\n    name,\n    state\n  } = props;\n  let showStepper = !hideStepper;\n\n  return (\n    <FocusRing\n      within\n      isTextInput\n      focusClass={classNames(stepperStyle, 'is-focused')}\n      focusRingClass={classNames(stepperStyle, 'focus-ring')}\n      autoFocus={autoFocus}>\n      <div\n        {...groupProps}\n        ref={ref as RefObject<HTMLDivElement>}\n        style={style}\n        className={className}>\n        <TextFieldBase\n          UNSAFE_className={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-field'\n            )\n          }\n          inputClassName={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-input'\n            )\n          }\n          validationIconClassName={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-icon'\n            )\n          }\n          isQuiet={isQuiet}\n          inputRef={inputRef}\n          validationState={validationState}\n          inputProps={inputProps}\n          isDisabled={isDisabled}\n          disableFocusRing />\n        {showStepper &&\n        <>\n          <StepButton direction=\"up\" isQuiet={isQuiet} {...incrementProps} />\n          <StepButton direction=\"down\" isQuiet={isQuiet} {...decrementProps} />\n        </>\n        }\n        {name && <input type=\"hidden\" name={name} value={isNaN(state.numberValue) ? '' : state.numberValue} />}\n      </div>\n    </FocusRing>\n  );\n});\n\n/**\n * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.\n */\nlet _NumberField = React.forwardRef(NumberField);\nexport {_NumberField as NumberField};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport Add from '@spectrum-icons/workflow/Add';\nimport {AriaButtonProps} from '@react-types/button';\nimport ChevronDownSmall from '@spectrum-icons/ui/ChevronDownSmall';\nimport ChevronUpSmall from '@spectrum-icons/ui/ChevronUpSmall';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {RefObject} from 'react';\nimport Remove from '@spectrum-icons/workflow/Remove';\nimport stepperStyle from '@adobe/spectrum-css-temp/components/stepper/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\ninterface StepButtonProps extends AriaButtonProps {\n  isQuiet: boolean,\n  direction: 'up' | 'down'\n}\n\nfunction StepButton(props: StepButtonProps, ref: RefObject<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let {scale} = useProvider();\n  let {direction, isDisabled, isQuiet} = props;\n  /**\n   * Must use div for now because Safari pointer event bugs on disabled form elements.\n   * Link https://bugs.webkit.org/show_bug.cgi?id=219188.\n   */\n  let {buttonProps, isPressed} = useButton({...props, elementType: 'div'}, ref);\n  let {hoverProps, isHovered} = useHover(props);\n  return (\n    <FocusRing focusRingClass={classNames(stepperStyle, 'focus-ring')}>\n      <div\n        className={\n          classNames(\n            stepperStyle,\n            'spectrum-Stepper-button',\n            {\n              'spectrum-Stepper-button--stepUp': direction === 'up',\n              'spectrum-Stepper-button--stepDown': direction === 'down',\n              'spectrum-Stepper-button--isQuiet': isQuiet,\n              'is-hovered': isHovered,\n              'is-active': isPressed,\n              'is-disabled': isDisabled\n            }\n          )\n        }\n        {...mergeProps(hoverProps, buttonProps)}\n        ref={ref}>\n        {direction === 'up' && scale === 'large' &&\n          <Add UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepUpIcon')} size=\"S\" />\n        }\n        {direction === 'up' && scale === 'medium' &&\n          <ChevronUpSmall UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepUpIcon')} />\n        }\n        {direction === 'down' && scale === 'large' &&\n          <Remove UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepDownIcon')} size=\"S\" />\n        }\n        {direction === 'down' && scale === 'medium' &&\n          <ChevronDownSmall UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepDownIcon')} />\n        }\n      </div>\n    </FocusRing>\n  );\n}\n\n/**\n * Buttons for NumberField.\n */\nlet _StepButton = React.forwardRef(StepButton);\nexport {_StepButton as StepButton};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"module.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/numberfield/src/index.ts","packages/@react-spectrum/numberfield/src/NumberField.tsx","packages/@react-spectrum/numberfield/src/StepButton.tsx","packages/@adobe/spectrum-css-temp/components/stepper/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {NumberField} from './NumberField';\nexport type {SpectrumNumberFieldProps} from '@react-types/numberfield';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '@react-types/button';\nimport {classNames, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {Field} from '@react-spectrum/label';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport {NumberFieldState, useNumberFieldState} from '@react-stately/numberfield';\nimport React, {HTMLAttributes, InputHTMLAttributes, RefObject, useRef} from 'react';\nimport {SpectrumNumberFieldProps} from '@react-types/numberfield';\nimport {StepButton} from './StepButton';\nimport stepperStyle from '@adobe/spectrum-css-temp/components/stepper/vars.css';\nimport {TextFieldBase} from '@react-spectrum/textfield';\nimport {useFormProps} from '@react-spectrum/form';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale} from '@react-aria/i18n';\nimport {useNumberField} from '@react-aria/numberfield';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\nfunction NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElement>) {\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  let provider = useProvider();\n  let {\n    isQuiet,\n    isReadOnly,\n    isDisabled,\n    hideStepper\n  } = props;\n\n  let {styleProps: style} = useStyleProps(props);\n\n  let {locale} = useLocale();\n  let state = useNumberFieldState({...props, locale});\n  let inputRef = useRef<HTMLInputElement>();\n  let domRef = useFocusableRef<HTMLElement>(ref, inputRef);\n  let {\n    groupProps,\n    labelProps,\n    inputProps,\n    incrementButtonProps,\n    decrementButtonProps,\n    descriptionProps,\n    errorMessageProps,\n    isInvalid,\n    validationErrors,\n    validationDetails\n  } = useNumberField(props, state, inputRef);\n  let isMobile = provider.scale === 'large';\n  let showStepper = !hideStepper;\n\n  let {isHovered, hoverProps} = useHover({isDisabled});\n\n  let validationState = props.validationState || (isInvalid ? 'invalid' : null);\n  let className =\n    classNames(\n      stepperStyle,\n      'spectrum-Stepper',\n      {\n        'spectrum-Stepper--isQuiet': isQuiet,\n        'is-disabled': isDisabled,\n        'spectrum-Stepper--readonly': isReadOnly,\n        'is-invalid': validationState === 'invalid' && !isDisabled,\n        'spectrum-Stepper--showStepper': showStepper,\n        'spectrum-Stepper--isMobile': isMobile,\n        'is-hovered': isHovered,\n        // because FocusRing won't pass along the className from Field, we have to handle that ourselves\n        [style.className]: !props.label && style.className\n      }\n    );\n\n  return (\n    <Field\n      {...props as Omit<SpectrumNumberFieldProps, 'onChange'>}\n      descriptionProps={descriptionProps}\n      errorMessageProps={errorMessageProps}\n      isInvalid={isInvalid}\n      validationErrors={validationErrors}\n      validationDetails={validationDetails}\n      labelProps={labelProps}\n      ref={domRef}\n      wrapperClassName={classNames(\n        stepperStyle,\n        'spectrum-Stepper-container',\n        {\n          'spectrum-Stepper-container--isMobile': isMobile\n        }\n      )}>\n      <NumberFieldInput\n        {...props}\n        groupProps={mergeProps(groupProps, hoverProps)}\n        inputProps={inputProps}\n        inputRef={inputRef}\n        incrementProps={incrementButtonProps}\n        decrementProps={decrementButtonProps}\n        className={className}\n        style={style}\n        state={state}\n        validationState={validationState} />\n    </Field>\n  );\n}\n\n\ninterface NumberFieldInputProps extends SpectrumNumberFieldProps {\n  groupProps: HTMLAttributes<HTMLDivElement>,\n  inputProps: InputHTMLAttributes<HTMLInputElement>,\n  inputRef: RefObject<HTMLInputElement | HTMLTextAreaElement>,\n  incrementProps: AriaButtonProps,\n  decrementProps: AriaButtonProps,\n  className?: string,\n  style?: React.CSSProperties,\n  state: NumberFieldState\n}\n\nconst NumberFieldInput = React.forwardRef(function NumberFieldInput(props: NumberFieldInputProps, ref: RefObject<HTMLElement>) {\n  let {\n    groupProps,\n    inputProps,\n    inputRef,\n    incrementProps,\n    decrementProps,\n    className,\n    style,\n    autoFocus,\n    isQuiet,\n    isDisabled,\n    hideStepper,\n    validationState,\n    name,\n    state\n  } = props;\n  let showStepper = !hideStepper;\n\n  return (\n    <FocusRing\n      within\n      isTextInput\n      focusClass={classNames(stepperStyle, 'is-focused')}\n      focusRingClass={classNames(stepperStyle, 'focus-ring')}\n      autoFocus={autoFocus}>\n      <div\n        {...groupProps}\n        ref={ref as RefObject<HTMLDivElement>}\n        style={style}\n        className={className}>\n        <TextFieldBase\n          UNSAFE_className={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-field'\n            )\n          }\n          inputClassName={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-input'\n            )\n          }\n          validationIconClassName={\n            classNames(\n              stepperStyle,\n              'spectrum-Stepper-icon'\n            )\n          }\n          isQuiet={isQuiet}\n          inputRef={inputRef}\n          validationState={validationState}\n          inputProps={inputProps}\n          isDisabled={isDisabled}\n          disableFocusRing />\n        {showStepper &&\n        <>\n          <StepButton direction=\"up\" isQuiet={isQuiet} {...incrementProps} />\n          <StepButton direction=\"down\" isQuiet={isQuiet} {...decrementProps} />\n        </>\n        }\n        {name && <input type=\"hidden\" name={name} value={isNaN(state.numberValue) ? '' : state.numberValue} />}\n      </div>\n    </FocusRing>\n  );\n});\n\n/**\n * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.\n */\nlet _NumberField = React.forwardRef(NumberField);\nexport {_NumberField as NumberField};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport Add from '@spectrum-icons/workflow/Add';\nimport {AriaButtonProps} from '@react-types/button';\nimport ChevronDownSmall from '@spectrum-icons/ui/ChevronDownSmall';\nimport ChevronUpSmall from '@spectrum-icons/ui/ChevronUpSmall';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {RefObject} from 'react';\nimport Remove from '@spectrum-icons/workflow/Remove';\nimport stepperStyle from '@adobe/spectrum-css-temp/components/stepper/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\ninterface StepButtonProps extends AriaButtonProps {\n  isQuiet: boolean,\n  direction: 'up' | 'down'\n}\n\nfunction StepButton(props: StepButtonProps, ref: RefObject<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let {scale} = useProvider();\n  let {direction, isDisabled, isQuiet} = props;\n  /**\n   * Must use div for now because Safari pointer event bugs on disabled form elements.\n   * Link https://bugs.webkit.org/show_bug.cgi?id=219188.\n   */\n  let {buttonProps, isPressed} = useButton({...props, elementType: 'div'}, ref);\n  let {hoverProps, isHovered} = useHover(props);\n  return (\n    <FocusRing focusRingClass={classNames(stepperStyle, 'focus-ring')}>\n      <div\n        className={\n          classNames(\n            stepperStyle,\n            'spectrum-Stepper-button',\n            {\n              'spectrum-Stepper-button--stepUp': direction === 'up',\n              'spectrum-Stepper-button--stepDown': direction === 'down',\n              'spectrum-Stepper-button--isQuiet': isQuiet,\n              'is-hovered': isHovered,\n              'is-active': isPressed,\n              'is-disabled': isDisabled\n            }\n          )\n        }\n        {...mergeProps(hoverProps, buttonProps)}\n        ref={ref}>\n        {direction === 'up' && scale === 'large' &&\n          <Add UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepUpIcon')} size=\"S\" />\n        }\n        {direction === 'up' && scale === 'medium' &&\n          <ChevronUpSmall UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepUpIcon')} />\n        }\n        {direction === 'down' && scale === 'large' &&\n          <Remove UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepDownIcon')} size=\"S\" />\n        }\n        {direction === 'down' && scale === 'medium' &&\n          <ChevronDownSmall UNSAFE_className={classNames(stepperStyle, 'spectrum-Stepper-button-icon', 'spectrum-Stepper-stepDownIcon')} />\n        }\n      </div>\n    </FocusRing>\n  );\n}\n\n/**\n * Buttons for NumberField.\n */\nlet _StepButton = React.forwardRef(StepButton);\nexport {_StepButton as StepButton};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"module.js.map"}

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"mappings":";;ACwLA;;GAEG;AACH,OAAA,IAAI,uKAA4C,CAAC;AC5KjD,YAAY,EAAC,wBAAwB,EAAC,MAAM,0BAA0B,CAAC","sources":["packages/@react-spectrum/numberfield/src/packages/@react-spectrum/numberfield/src/StepButton.tsx","packages/@react-spectrum/numberfield/src/packages/@react-spectrum/numberfield/src/NumberField.tsx","packages/@react-spectrum/numberfield/src/packages/@react-spectrum/numberfield/src/index.ts","packages/@react-spectrum/numberfield/src/index.ts"],"sourcesContent":[null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {NumberField} from './NumberField';\nexport type {SpectrumNumberFieldProps} from '@react-types/numberfield';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
+{"mappings":";;ACkMA;;GAEG;AACH,OAAA,IAAI,uKAA4C,CAAC;ACtLjD,YAAY,EAAC,wBAAwB,EAAC,MAAM,0BAA0B,CAAC","sources":["packages/@react-spectrum/numberfield/src/packages/@react-spectrum/numberfield/src/StepButton.tsx","packages/@react-spectrum/numberfield/src/packages/@react-spectrum/numberfield/src/NumberField.tsx","packages/@react-spectrum/numberfield/src/packages/@react-spectrum/numberfield/src/index.ts","packages/@react-spectrum/numberfield/src/index.ts"],"sourcesContent":[null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {NumberField} from './NumberField';\nexport type {SpectrumNumberFieldProps} from '@react-types/numberfield';\n"],"names":[],"version":3,"file":"types.d.ts.map"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-spectrum/numberfield",
-  "version": "3.7.3",
+  "version": "3.8.1",
   "description": "Spectrum UI components in React",
   "license": "Apache-2.0",
   "main": "dist/main.js",
@@ -36,22 +36,22 @@
     "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@react-aria/button": "^3.8.4",
-    "@react-aria/focus": "^3.14.3",
-    "@react-aria/i18n": "^3.8.4",
-    "@react-aria/interactions": "^3.19.1",
-    "@react-aria/numberfield": "^3.9.1",
-    "@react-aria/utils": "^3.21.1",
-    "@react-spectrum/button": "^3.14.1",
-    "@react-spectrum/label": "^3.15.1",
-    "@react-spectrum/textfield": "^3.10.7",
-    "@react-spectrum/utils": "^3.11.1",
-    "@react-stately/numberfield": "^3.6.2",
-    "@react-types/button": "^3.9.0",
-    "@react-types/numberfield": "^3.6.1",
-    "@react-types/shared": "^3.21.0",
-    "@spectrum-icons/ui": "^3.6.1",
-    "@spectrum-icons/workflow": "^4.2.6",
+    "@react-aria/button": "^3.9.1",
+    "@react-aria/focus": "^3.16.0",
+    "@react-aria/i18n": "^3.10.0",
+    "@react-aria/interactions": "^3.20.1",
+    "@react-aria/numberfield": "^3.10.1",
+    "@react-aria/utils": "^3.23.0",
+    "@react-spectrum/form": "^3.7.1",
+    "@react-spectrum/label": "^3.16.1",
+    "@react-spectrum/textfield": "^3.11.1",
+    "@react-spectrum/utils": "^3.11.3",
+    "@react-stately/numberfield": "^3.8.0",
+    "@react-types/button": "^3.9.1",
+    "@react-types/numberfield": "^3.7.0",
+    "@react-types/shared": "^3.22.0",
+    "@spectrum-icons/ui": "^3.6.3",
+    "@spectrum-icons/workflow": "^4.2.8",
     "@swc/helpers": "^0.5.0"
   },
   "devDependencies": {
@@ -66,5 +66,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "3ecf62dcceea437cb12df1851636dd491bb6591c"
+  "gitHead": "86b38c87868ce7f262e0df905e5ac4eb2653791d"
 }

package/src/NumberField.tsx

@@ -22,6 +22,7 @@ import {SpectrumNumberFieldProps} from '@react-types/numberfield';
 import {StepButton} from './StepButton';
 import stepperStyle from '@adobe/spectrum-css-temp/components/stepper/vars.css';
 import {TextFieldBase} from '@react-spectrum/textfield';
+import {useFormProps} from '@react-spectrum/form';
 import {useHover} from '@react-aria/interactions';
 import {useLocale} from '@react-aria/i18n';
 import {useNumberField} from '@react-aria/numberfield';
@@ -29,6 +30,7 @@ import {useProvider, useProviderProps} from '@react-spectrum/provider';
 
 function NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElement>) {
   props = useProviderProps(props);
+  props = useFormProps(props);
   let provider = useProvider();
   let {
     isQuiet,
@@ -50,13 +52,17 @@ function NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElem
     incrementButtonProps,
     decrementButtonProps,
     descriptionProps,
-    errorMessageProps
+    errorMessageProps,
+    isInvalid,
+    validationErrors,
+    validationDetails
   } = useNumberField(props, state, inputRef);
   let isMobile = provider.scale === 'large';
   let showStepper = !hideStepper;
 
   let {isHovered, hoverProps} = useHover({isDisabled});
 
+  let validationState = props.validationState || (isInvalid ? 'invalid' : null);
   let className =
     classNames(
       stepperStyle,
@@ -65,7 +71,7 @@ function NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElem
         'spectrum-Stepper--isQuiet': isQuiet,
         'is-disabled': isDisabled,
         'spectrum-Stepper--readonly': isReadOnly,
-        'is-invalid': props.validationState === 'invalid' && !isDisabled,
+        'is-invalid': validationState === 'invalid' && !isDisabled,
         'spectrum-Stepper--showStepper': showStepper,
         'spectrum-Stepper--isMobile': isMobile,
         'is-hovered': isHovered,
@@ -79,6 +85,9 @@ function NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElem
       {...props as Omit<SpectrumNumberFieldProps, 'onChange'>}
       descriptionProps={descriptionProps}
       errorMessageProps={errorMessageProps}
+      isInvalid={isInvalid}
+      validationErrors={validationErrors}
+      validationDetails={validationDetails}
       labelProps={labelProps}
       ref={domRef}
       wrapperClassName={classNames(
@@ -97,7 +106,8 @@ function NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElem
         decrementProps={decrementButtonProps}
         className={className}
         style={style}
-        state={state} />
+        state={state}
+        validationState={validationState} />
     </Field>
   );
 }