@react-spectrum/numberfield 3.6.2 → 3.7.0

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.
package/dist/import.mjs CHANGED
@@ -3,12 +3,12 @@ import {useStyleProps as $k6K00$useStyleProps, useFocusableRef as $k6K00$useFocu
3
3
  import {Field as $k6K00$Field} from "@react-spectrum/label";
4
4
  import {FocusRing as $k6K00$FocusRing} from "@react-aria/focus";
5
5
  import {mergeProps as $k6K00$mergeProps} from "@react-aria/utils";
6
+ import {useNumberFieldState as $k6K00$useNumberFieldState} from "@react-stately/numberfield";
6
7
  import $k6K00$react, {useRef as $k6K00$useRef} from "react";
7
8
  import {TextFieldBase as $k6K00$TextFieldBase} from "@react-spectrum/textfield";
8
9
  import {useHover as $k6K00$useHover} from "@react-aria/interactions";
9
10
  import {useLocale as $k6K00$useLocale} from "@react-aria/i18n";
10
11
  import {useNumberField as $k6K00$useNumberField} from "@react-aria/numberfield";
11
- import {useNumberFieldState as $k6K00$useNumberFieldState} from "@react-stately/numberfield";
12
12
  import {useProviderProps as $k6K00$useProviderProps, useProvider as $k6K00$useProvider} from "@react-spectrum/provider";
13
13
  import $k6K00$spectrumiconsworkflowAdd from "@spectrum-icons/workflow/Add";
14
14
  import $k6K00$spectrumiconsuiChevronDownSmall from "@spectrum-icons/ui/ChevronDownSmall";
@@ -48,6 +48,7 @@ function $parcel$export(e, n, v, s) {
48
48
 
49
49
 
50
50
 
51
+
51
52
  /*
52
53
  * Copyright 2020 Adobe. All rights reserved.
53
54
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
@@ -223,7 +224,6 @@ function $7f00b388e0d3b2f6$var$StepButton(props, ref) {
223
224
 
224
225
 
225
226
 
226
-
227
227
  function $48b879bdd771eb85$var$NumberField(props, ref) {
228
228
  props = (0, $k6K00$useProviderProps)(props);
229
229
  let provider = (0, $k6K00$useProvider)();
@@ -270,11 +270,12 @@ function $48b879bdd771eb85$var$NumberField(props, ref) {
270
270
  incrementProps: incrementButtonProps,
271
271
  decrementProps: decrementButtonProps,
272
272
  className: className,
273
- style: style
273
+ style: style,
274
+ state: state
274
275
  }));
275
276
  }
276
277
  const $48b879bdd771eb85$var$NumberFieldInput = /*#__PURE__*/ (0, $k6K00$react).forwardRef(function NumberFieldInput(props, ref) {
277
- let { groupProps: groupProps , inputProps: inputProps , inputRef: inputRef , incrementProps: incrementProps , decrementProps: decrementProps , className: className , style: style , autoFocus: autoFocus , isQuiet: isQuiet , isDisabled: isDisabled , hideStepper: hideStepper , validationState: validationState } = props;
278
+ let { groupProps: groupProps , inputProps: inputProps , inputRef: inputRef , incrementProps: incrementProps , decrementProps: decrementProps , className: className , style: style , autoFocus: autoFocus , isQuiet: isQuiet , isDisabled: isDisabled , hideStepper: hideStepper , validationState: validationState , name: name , state: state } = props;
278
279
  let showStepper = !hideStepper;
279
280
  return /*#__PURE__*/ (0, $k6K00$react).createElement((0, $k6K00$FocusRing), {
280
281
  within: true,
@@ -305,7 +306,11 @@ const $48b879bdd771eb85$var$NumberFieldInput = /*#__PURE__*/ (0, $k6K00$react).f
305
306
  direction: "down",
306
307
  isQuiet: isQuiet,
307
308
  ...decrementProps
308
- }))));
309
+ })), name && /*#__PURE__*/ (0, $k6K00$react).createElement("input", {
310
+ type: "hidden",
311
+ name: name,
312
+ value: isNaN(state.numberValue) ? "" : state.numberValue
313
+ })));
309
314
  });
310
315
  /**
311
316
  * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.
package/dist/main.css CHANGED
@@ -1 +1 @@
1
- :root{font-synthesis:weight}.spectrum-Button_8890ad,.spectrum-ActionButton_8890ad,.spectrum-LogicButton_8890ad,.spectrum-FieldButton_8890ad,.spectrum-ClearButton_8890ad,.spectrum-Stepper-button_8890ad{font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.spectrum-Button_8890ad:lang(ar),.spectrum-ActionButton_8890ad:lang(ar),.spectrum-LogicButton_8890ad:lang(ar),.spectrum-FieldButton_8890ad:lang(ar),.spectrum-ClearButton_8890ad:lang(ar),.spectrum-Stepper-button_8890ad:lang(ar){font-family:myriad-arabic,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.spectrum-Button_8890ad:lang(he),.spectrum-ActionButton_8890ad:lang(he),.spectrum-LogicButton_8890ad:lang(he),.spectrum-FieldButton_8890ad:lang(he),.spectrum-ClearButton_8890ad:lang(he),.spectrum-Stepper-button_8890ad:lang(he){font-family:myriad-hebrew,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.spectrum-Button_8890ad:lang(zh),.spectrum-ActionButton_8890ad:lang(zh),.spectrum-LogicButton_8890ad:lang(zh),.spectrum-FieldButton_8890ad:lang(zh),.spectrum-ClearButton_8890ad:lang(zh),.spectrum-Stepper-button_8890ad:lang(zh){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Heiti TC Light,sans-serif}.spectrum-Button_8890ad:lang(zh-Hans),.spectrum-ActionButton_8890ad:lang(zh-Hans),.spectrum-LogicButton_8890ad:lang(zh-Hans),.spectrum-FieldButton_8890ad:lang(zh-Hans),.spectrum-ClearButton_8890ad:lang(zh-Hans),.spectrum-Stepper-button_8890ad:lang(zh-Hans){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.spectrum-Button_8890ad:lang(zh-Hant),.spectrum-ActionButton_8890ad:lang(zh-Hant),.spectrum-LogicButton_8890ad:lang(zh-Hant),.spectrum-FieldButton_8890ad:lang(zh-Hant),.spectrum-ClearButton_8890ad:lang(zh-Hant),.spectrum-Stepper-button_8890ad:lang(zh-Hant){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Microsoft JhengHei UI,Microsoft JhengHei,Heiti TC Light,sans-serif}.spectrum-Button_8890ad:lang(zh-SG),.spectrum-ActionButton_8890ad:lang(zh-SG),.spectrum-LogicButton_8890ad:lang(zh-SG),.spectrum-FieldButton_8890ad:lang(zh-SG),.spectrum-ClearButton_8890ad:lang(zh-SG),.spectrum-Stepper-button_8890ad:lang(zh-SG),.spectrum-Button_8890ad:lang(zh-CN),.spectrum-ActionButton_8890ad:lang(zh-CN),.spectrum-LogicButton_8890ad:lang(zh-CN),.spectrum-FieldButton_8890ad:lang(zh-CN),.spectrum-ClearButton_8890ad:lang(zh-CN),.spectrum-Stepper-button_8890ad:lang(zh-CN){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.spectrum-Button_8890ad:lang(ko),.spectrum-ActionButton_8890ad:lang(ko),.spectrum-LogicButton_8890ad:lang(ko),.spectrum-FieldButton_8890ad:lang(ko),.spectrum-ClearButton_8890ad:lang(ko),.spectrum-Stepper-button_8890ad:lang(ko){font-family:adobe-clean-han-korean,source-han-korean,Malgun Gothic,Apple Gothic,sans-serif}.spectrum-Button_8890ad:lang(ja),.spectrum-ActionButton_8890ad:lang(ja),.spectrum-LogicButton_8890ad:lang(ja),.spectrum-FieldButton_8890ad:lang(ja),.spectrum-ClearButton_8890ad:lang(ja),.spectrum-Stepper-button_8890ad:lang(ja){font-family:adobe-clean-han-japanese,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN W3,Osaka,YuGothic,Yu Gothic,メイリオ,Meiryo,MS Pゴシック,MS PGothic,sans-serif}.spectrum-Button_8890ad,.spectrum-ActionButton_8890ad,.spectrum-LogicButton_8890ad,.spectrum-FieldButton_8890ad,.spectrum-ClearButton_8890ad,.spectrum-Stepper_8890ad{--spectrum-focus-ring-border-radius:var(--spectrum-textfield-border-radius,var(--spectrum-alias-border-radius-regular));--spectrum-focus-ring-gap:var(--spectrum-alias-input-focusring-gap);--spectrum-focus-ring-size:var(--spectrum-alias-input-focusring-size);--spectrum-focus-ring-border-size:0px;--spectrum-focus-ring-color:var(--spectrum-high-contrast-focus-ring-color,var(--spectrum-alias-focus-ring-color,var(--spectrum-alias-focus-color)))}.spectrum-Button_8890ad:after,.spectrum-ActionButton_8890ad:after,.spectrum-LogicButton_8890ad:after,.spectrum-FieldButton_8890ad:after,.spectrum-ClearButton_8890ad:after,.spectrum-Stepper_8890ad:after{border-radius:calc(var(--spectrum-focus-ring-border-radius) + var(--spectrum-focus-ring-gap));content:"";margin:calc(-1*var(--spectrum-focus-ring-border-size));pointer-events:none;transition:box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-out,margin var(--spectrum-global-animation-duration-100,.13s)ease-out;display:block;position:absolute;top:0;bottom:0;left:0;right:0}.spectrum-Button_8890ad.focus-ring_8890ad:after,.spectrum-ActionButton_8890ad.focus-ring_8890ad:after,.spectrum-LogicButton_8890ad.focus-ring_8890ad:after,.spectrum-FieldButton_8890ad.focus-ring_8890ad:after,.spectrum-ClearButton_8890ad.focus-ring_8890ad:after,.spectrum-Stepper_8890ad.focus-ring_8890ad:after{margin:calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size));box-shadow:0 0 0 var(--spectrum-focus-ring-size)var(--spectrum-focus-ring-color)}.spectrum-FieldButton--quiet_8890ad:after,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:after{border-radius:0}.spectrum-FieldButton--quiet_8890ad.focus-ring_8890ad:after,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad:after{margin:0 0 calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size))0;box-shadow:0 var(--spectrum-focus-ring-size)0 var(--spectrum-focus-ring-color)}.spectrum-Button_8890ad,.spectrum-ActionButton_8890ad,.spectrum-LogicButton_8890ad,.spectrum-FieldButton_8890ad,.spectrum-ClearButton_8890ad,.spectrum-Stepper-button_8890ad{box-sizing:border-box;border-radius:var(--spectrum-button-border-radius);border-style:solid;border-width:var(--spectrum-button-border-width);--spectrum-focus-ring-border-radius:var(--spectrum-button-border-radius);--spectrum-focus-ring-border-size:var(--spectrum-button-border-width);--spectrum-focus-ring-gap:var(--spectrum-alias-focus-ring-gap,var(--spectrum-global-dimension-static-size-25));--spectrum-focus-ring-size:var(--spectrum-button-primary-focus-ring-size-key-focus,var(--spectrum-alias-focus-ring-size));text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s)ease-out,border-color var(--spectrum-global-animation-duration-100,.13s)ease-out,color var(--spectrum-global-animation-duration-100,.13s)ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-out;-webkit-user-select:none;user-select:none;-ms-touch-action:none;touch-action:none;cursor:default;isolation:isolate;justify-content:center;align-items:center;margin:0;line-height:1.3;text-decoration:none;display:inline-flex;position:relative;overflow:visible}button.spectrum-Button_8890ad,button.spectrum-ActionButton_8890ad,button.spectrum-LogicButton_8890ad,button.spectrum-FieldButton_8890ad,button.spectrum-ClearButton_8890ad,button.spectrum-Stepper-button_8890ad{-webkit-appearance:button}.spectrum-Button_8890ad:focus,.spectrum-ActionButton_8890ad:focus,.spectrum-LogicButton_8890ad:focus,.spectrum-FieldButton_8890ad:focus,.spectrum-ClearButton_8890ad:focus,.spectrum-Stepper-button_8890ad:focus{outline:none}.spectrum-Button_8890ad.focus-ring_8890ad,.spectrum-ActionButton_8890ad.focus-ring_8890ad,.spectrum-LogicButton_8890ad.focus-ring_8890ad,.spectrum-FieldButton_8890ad.focus-ring_8890ad,.spectrum-ClearButton_8890ad.focus-ring_8890ad,.spectrum-Stepper-button_8890ad.focus-ring_8890ad{z-index:3}.spectrum-Button_8890ad::-moz-focus-inner,.spectrum-ActionButton_8890ad::-moz-focus-inner,.spectrum-LogicButton_8890ad::-moz-focus-inner,.spectrum-FieldButton_8890ad::-moz-focus-inner,.spectrum-ClearButton_8890ad::-moz-focus-inner,.spectrum-Stepper-button_8890ad::-moz-focus-inner{border:0;margin-top:-2px;margin-bottom:-2px;padding:0}.spectrum-Button_8890ad:disabled,.spectrum-ActionButton_8890ad:disabled,.spectrum-LogicButton_8890ad:disabled,.spectrum-FieldButton_8890ad:disabled,.spectrum-ClearButton_8890ad:disabled,.spectrum-Stepper-button_8890ad:disabled{cursor:default}.spectrum-Button_8890ad .spectrum-Icon_8890ad,.spectrum-ActionButton_8890ad .spectrum-Icon_8890ad,.spectrum-LogicButton_8890ad .spectrum-Icon_8890ad,.spectrum-FieldButton_8890ad .spectrum-Icon_8890ad,.spectrum-ClearButton_8890ad .spectrum-Icon_8890ad,.spectrum-Stepper-button_8890ad .spectrum-Icon_8890ad{max-height:100%;transition:background var(--spectrum-global-animation-duration-100,.13s)ease-out,fill var(--spectrum-global-animation-duration-100,.13s)ease-out;box-sizing:initial;flex-shrink:0;order:0}.spectrum-Button_8890ad{--spectrum-button-border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-alias-border-radius-large));--spectrum-button-border-width:var(--spectrum-button-primary-border-size,var(--spectrum-alias-border-size-thick));min-height:var(--spectrum-button-primary-height,var(--spectrum-alias-single-line-height));height:0%;min-width:var(--spectrum-button-primary-min-width);padding:var(--spectrum-global-dimension-size-50)calc(var(--spectrum-button-primary-padding-x,var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size,var(--spectrum-alias-border-size-thick)));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + 1px);padding-top:calc(var(--spectrum-global-dimension-size-50) - 1px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-alias-pill-button-text-size));font-weight:var(--spectrum-button-primary-text-font-weight,var(--spectrum-global-font-weight-bold));border-style:solid}.spectrum-Button_8890ad.is-hovered_8890ad,.spectrum-Button_8890ad:active{box-shadow:none}[dir=ltr] .spectrum-Button_8890ad .spectrum-Icon_8890ad+.spectrum-Button-label_8890ad{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}[dir=rtl] .spectrum-Button_8890ad .spectrum-Icon_8890ad+.spectrum-Button-label_8890ad,[dir=ltr] .spectrum-Button_8890ad .spectrum-Button-label_8890ad+.spectrum-Icon_8890ad{margin-right:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}[dir=rtl] .spectrum-Button_8890ad .spectrum-Button-label_8890ad+.spectrum-Icon_8890ad{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}.spectrum-Button_8890ad.spectrum-Button--iconOnly_8890ad{min-width:unset;padding:var(--spectrum-global-dimension-size-65)}a.spectrum-Button_8890ad,a.spectrum-ActionButton_8890ad{-webkit-appearance:none;-webkit-user-select:none;user-select:none;cursor:pointer}.spectrum-ActionButton_8890ad{height:var(--spectrum-actionbutton-height,var(--spectrum-alias-single-line-height));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));--spectrum-button-border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-alias-border-radius-regular));--spectrum-button-border-width:var(--spectrum-actionbutton-border-size,var(--spectrum-alias-border-size-thin));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-text-font-weight,var(--spectrum-alias-body-text-font-weight));padding:0;position:relative}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad{padding-right:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad{padding-right:var(--spectrum-actionbutton-text-padding-x,var(--spectrum-global-dimension-size-150))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad{padding-left:var(--spectrum-actionbutton-text-padding-x,var(--spectrum-global-dimension-size-150))}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad+.spectrum-ActionButton-label_8890ad{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad+.spectrum-ActionButton-label_8890ad,[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad:not([hidden])+.spectrum-Icon_8890ad{padding-right:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad:not([hidden])+.spectrum-Icon_8890ad{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad:only-child,[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-hold_8890ad+.spectrum-ActionButton-label_8890ad:last-child{padding-left:var(--spectrum-actionbutton-text-padding-x,var(--spectrum-global-dimension-size-150))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad:only-child,[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-hold_8890ad+.spectrum-ActionButton-label_8890ad:last-child{padding-right:var(--spectrum-actionbutton-text-padding-x,var(--spectrum-global-dimension-size-150))}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad:only-child,[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-hold_8890ad+.spectrum-Icon_8890ad:last-child{padding-right:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad:only-child,[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-hold_8890ad+.spectrum-Icon_8890ad:last-child{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=ltr] .spectrum-ActionButton-hold_8890ad{right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40))}[dir=rtl] .spectrum-ActionButton-hold_8890ad{left:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40))}.spectrum-ActionButton-hold_8890ad{bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));position:absolute}[dir=rtl] .spectrum-ActionButton-hold_8890ad{transform:rotate(90deg)}.spectrum-ActionButton-label_8890ad,.spectrum-Button-label_8890ad{-ms-grid-row-align:center;text-align:center;width:100%;order:1;place-self:center}.spectrum-ActionButton-label_8890ad:empty,.spectrum-Button-label_8890ad:empty{display:none}.spectrum-ActionButton-label_8890ad{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.spectrum-ActionButton--quiet_8890ad{border-width:var(--spectrum-actionbutton-quiet-border-size,var(--spectrum-alias-border-size-thin));border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,var(--spectrum-alias-body-text-font-weight))}.spectrum-LogicButton_8890ad{height:var(--spectrum-logicbutton-and-height,24px);padding:var(--spectrum-logicbutton-and-padding-x,var(--spectrum-global-dimension-size-100));--spectrum-button-border-width:var(--spectrum-logicbutton-and-border-size,var(--spectrum-alias-border-size-thick));--spectrum-button-border-radius:var(--spectrum-logicbutton-and-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-logicbutton-and-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-logicbutton-and-text-font-weight,var(--spectrum-global-font-weight-bold));line-height:0}.spectrum-FieldButton_8890ad{height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-alias-font-size-default));-webkit-font-smoothing:initial;cursor:default;--spectrum-focus-ring-gap:var(--spectrum-alias-input-focusring-gap);--spectrum-focus-ring-size:var(--spectrum-alias-input-focusring-size);padding-top:0;padding-bottom:0;padding-left:var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));padding-right:var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));--spectrum-button-border-width:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin));--spectrum-button-border-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50));transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);border-style:solid;outline:none;margin:0;line-height:normal;position:relative}.spectrum-FieldButton_8890ad:disabled,.spectrum-FieldButton_8890ad.is-disabled_8890ad{cursor:default;border-width:0}.spectrum-FieldButton_8890ad.is-open_8890ad{border-width:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin))}.spectrum-FieldButton--quiet_8890ad{--spectrum-button-border-width:0;--spectrum-button-border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0px);--spectrum-focus-ring-size:var(--spectrum-alias-focus-ring-size,var(--spectrum-global-dimension-static-size-25));margin:0;padding:0}.spectrum-FieldButton--quiet_8890ad:disabled.focus-ring_8890ad,.spectrum-FieldButton--quiet_8890ad.is-disabled_8890ad.focus-ring_8890ad{box-shadow:none}.spectrum-ClearButton_8890ad{width:var(--spectrum-clearbutton-medium-width,var(--spectrum-alias-single-line-height));height:var(--spectrum-clearbutton-medium-height,var(--spectrum-alias-single-line-height));--spectrum-button-border-radius:100%;--spectrum-button-border-width:0px;border:none;margin:0;padding:0}.spectrum-ClearButton_8890ad>.spectrum-Icon_8890ad{margin:0 auto}@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){.spectrum-ClearButton_8890ad>.spectrum-Icon_8890ad{margin:0}}.spectrum-ClearButton--small_8890ad{width:var(--spectrum-clearbutton-small-width,var(--spectrum-global-dimension-size-300));height:var(--spectrum-clearbutton-small-height,var(--spectrum-global-dimension-size-300))}.spectrum-Stepper_8890ad{display:-ms-inline-grid;height:max-content;width:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))*4);transition:border-color var(--spectrum-global-animation-duration-100,.13s)ease-in-out,box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-in-out;line-height:0;display:inline-grid;position:relative}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad){-ms-grid-rows:auto auto;-ms-grid-columns:1fr auto;grid-template:"field increment""field decrement"/1fr auto}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{padding-top:calc(var(--spectrum-global-dimension-size-50) + 1px);padding-bottom:calc(var(--spectrum-global-dimension-size-50) - .5px)}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px)}.spectrum-Stepper_8890ad.spectrum-Stepper--isMobile_8890ad{width:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))*5);-ms-grid-rows:auto;-ms-grid-columns:auto 1fr auto;grid-template:"decrement field increment"/auto 1fr auto}.spectrum-Stepper_8890ad .spectrum-Stepper-field_8890ad{width:unset;min-width:var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400));grid-area:field}[dir=ltr] .spectrum-Stepper_8890ad .spectrum-Stepper-icon_8890ad{padding-right:0}[dir=rtl] .spectrum-Stepper_8890ad .spectrum-Stepper-icon_8890ad{padding-left:0}.spectrum-Stepper_8890ad .spectrum-Stepper-button--stepUp_8890ad{grid-area:increment}.spectrum-Stepper_8890ad .spectrum-Stepper-button--stepDown_8890ad{grid-area:decrement}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad){border-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-icon_8890ad{right:var(--spectrum-global-dimension-size-100)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-icon_8890ad{left:var(--spectrum-global-dimension-size-100)}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):not(.spectrum-Stepper--showStepper_8890ad):not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{height:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))/2);width:24px}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):not(.spectrum-Stepper--showStepper_8890ad).spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button_8890ad{height:var(--spectrum-textfield-height,var(--spectrum-alias-single-line-height));width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-input_8890ad{border-top-right-radius:0}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-input_8890ad{border-top-left-radius:0}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-input_8890ad{border-bottom-right-radius:0}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-input_8890ad{border-bottom-left-radius:0}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{border-left-width:0}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{border-right-width:0}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{height:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))/2);width:24px}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-bottom-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-bottom-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-right-width:var(--spectrum-alias-input-border-size)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-left-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-top-width:1px;border-bottom-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-right-width:var(--spectrum-alias-input-border-size)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-left-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-top-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-top-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-top-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-input_8890ad{border-radius:0}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button_8890ad{height:var(--spectrum-textfield-height,var(--spectrum-alias-single-line-height));width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-left-width:var(--spectrum-alias-input-border-size)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-right-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-top-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-top-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-bottom-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-bottom-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-top-width:var(--spectrum-alias-input-border-size);border-bottom-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-right-width:var(--spectrum-alias-input-border-size)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-left-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-top-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-top-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-bottom-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-bottom-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-top-width:var(--spectrum-alias-input-border-size);border-bottom-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-icon_8890ad{right:0}[dir=rtl] .spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-icon_8890ad{left:0}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:not(.spectrum-Stepper--showStepper_8890ad):not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{height:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))/2);width:24px}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:not(.spectrum-Stepper--showStepper_8890ad):not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-bottom-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:not(.spectrum-Stepper--showStepper_8890ad).spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button_8890ad{height:var(--spectrum-textfield-height,var(--spectrum-alias-single-line-height));width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));border-bottom-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{height:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))/2);width:24px}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-bottom-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button_8890ad{height:var(--spectrum-textfield-height,var(--spectrum-alias-single-line-height));width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));border-bottom-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper-container_8890ad.spectrum-Stepper-container_8890ad{--spectrum-field-default-width:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))*4)}.spectrum-Stepper-container_8890ad.spectrum-Stepper-container--isMobile_8890ad{--spectrum-field-default-width:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))*5)}.spectrum-Stepper-button_8890ad{border-width:0}.spectrum-Stepper-button_8890ad.is-hovered_8890ad,.spectrum-Stepper-button_8890ad:active{box-shadow:none}.spectrum-Stepper-button_8890ad .spectrum-Stepper-button-icon_8890ad{max-height:100%;transition:background var(--spectrum-global-animation-duration-100,.13s)ease-out,fill var(--spectrum-global-animation-duration-100,.13s)ease-out;box-sizing:initial;flex-shrink:0}.spectrum-Stepper_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-actionbutton-icon-color,var(--spectrum-alias-icon-color))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-input_8890ad{border-color:var(--spectrum-textfield-border-color,var(--spectrum-alias-border-color))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad{background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border-color:var(--spectrum-textfield-border-color,var(--spectrum-alias-border-color));color:var(--spectrum-actionbutton-text-color,var(--spectrum-alias-text-color))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-hovered_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-hover,var(--spectrum-alias-border-color-hover))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-active_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):active .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-active_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):active .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):focus .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-focused_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):focus .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-disabled_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):disabled .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-disabled_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):disabled .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-disabled,var(--spectrum-alias-border-color-transparent))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-error,var(--spectrum-semantic-negative-color-default))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-error-hover,var(--spectrum-semantic-negative-color-state-hover))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad:active .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad:active .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-error-down,var(--spectrum-semantic-negative-color-state-down))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.is-focused_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-input_8890ad{border-color:var(--spectrum-textfield-quiet-border-color,var(--spectrum-alias-border-color))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad{background-color:unset;border-color:var(--spectrum-textfield-quiet-border-color,var(--spectrum-alias-border-color));color:var(--spectrum-actionbutton-text-color,var(--spectrum-alias-text-color))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-hover,var(--spectrum-alias-border-color-hover))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-active_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:active .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-active_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:active .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-disabled_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:disabled .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-disabled_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:disabled .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-disabled,var(--spectrum-alias-border-color-mid))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-error,var(--spectrum-semantic-negative-color-default))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-error-hover,var(--spectrum-semantic-negative-color-state-hover))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad:active .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad:active .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-error-down,var(--spectrum-semantic-negative-color-state-down))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad.is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad.is-focused_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-hovered_8890ad,.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-hovered_8890ad{color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-hovered_8890ad .spectrum-Stepper-button-icon_8890ad,.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-hovered_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-alias-icon-color-hover))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-active_8890ad{color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-alias-text-color-down))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-active_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-actionbutton-text-color-down,var(--spectrum-alias-text-color-down))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad:disabled,.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-disabled_8890ad{color:var(--spectrum-textfield-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad:disabled .spectrum-Stepper-button-icon_8890ad,.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-disabled_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-textfield-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad.is-hovered_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad.is-hovered_8890ad{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad.is-active_8890ad{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad:disabled,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad.is-disabled_8890ad{background-color:var(--spectrum-textfield-background-color-disabled,var(--spectrum-global-color-gray-200))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad:disabled,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad.is-disabled_8890ad{color:var(--spectrum-textfield-quiet-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad:disabled .spectrum-Stepper-button-icon_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad.is-disabled_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-textfield-quiet-text-color-disabled,var(--spectrum-alias-text-color-disabled))}@media (forced-colors:active){.spectrum-Stepper_8890ad{--spectrum-textfield-border-color-disabled:GrayText;--spectrum-textfield-border-color-error:Highlight;--spectrum-textfield-border-color-hover:Highlight;--spectrum-textfield-border-color-key-focus:Highlight;--spectrum-textfield-quiet-border-color-disabled:GrayText;--spectrum-textfield-quiet-border-color-error:Highlight;--spectrum-textfield-quiet-border-color-hover:Highlight;--spectrum-textfield-quiet-border-color-key-focus:Highlight;--spectrum-textfield-quiet-border-color:ButtonText;--spectrum-textfield-quiet-text-color-disabled:GrayText;--spectrum-textfield-text-color-disabled:GrayText}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-focused_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):focus{outline:2px solid Highlight}.spectrum-Stepper_8890ad.spectrum-Stepper--readonly_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color,var(--spectrum-alias-border-color))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad{forced-color-adjust:none;box-shadow:0 1px 0 0 var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad{forced-color-adjust:auto;border-color:var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}}
1
+ :root{font-synthesis:weight}.spectrum-Button_8890ad,.spectrum-ActionButton_8890ad,.spectrum-LogicButton_8890ad,.spectrum-FieldButton_8890ad,.spectrum-ClearButton_8890ad,.spectrum-Stepper-button_8890ad{font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.spectrum-Button_8890ad:lang(ar),.spectrum-ActionButton_8890ad:lang(ar),.spectrum-LogicButton_8890ad:lang(ar),.spectrum-FieldButton_8890ad:lang(ar),.spectrum-ClearButton_8890ad:lang(ar),.spectrum-Stepper-button_8890ad:lang(ar){font-family:myriad-arabic,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.spectrum-Button_8890ad:lang(he),.spectrum-ActionButton_8890ad:lang(he),.spectrum-LogicButton_8890ad:lang(he),.spectrum-FieldButton_8890ad:lang(he),.spectrum-ClearButton_8890ad:lang(he),.spectrum-Stepper-button_8890ad:lang(he){font-family:myriad-hebrew,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.spectrum-Button_8890ad:lang(zh),.spectrum-ActionButton_8890ad:lang(zh),.spectrum-LogicButton_8890ad:lang(zh),.spectrum-FieldButton_8890ad:lang(zh),.spectrum-ClearButton_8890ad:lang(zh),.spectrum-Stepper-button_8890ad:lang(zh){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Heiti TC Light,sans-serif}.spectrum-Button_8890ad:lang(zh-Hans),.spectrum-ActionButton_8890ad:lang(zh-Hans),.spectrum-LogicButton_8890ad:lang(zh-Hans),.spectrum-FieldButton_8890ad:lang(zh-Hans),.spectrum-ClearButton_8890ad:lang(zh-Hans),.spectrum-Stepper-button_8890ad:lang(zh-Hans){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.spectrum-Button_8890ad:lang(zh-Hant),.spectrum-ActionButton_8890ad:lang(zh-Hant),.spectrum-LogicButton_8890ad:lang(zh-Hant),.spectrum-FieldButton_8890ad:lang(zh-Hant),.spectrum-ClearButton_8890ad:lang(zh-Hant),.spectrum-Stepper-button_8890ad:lang(zh-Hant){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Microsoft JhengHei UI,Microsoft JhengHei,Heiti TC Light,sans-serif}.spectrum-Button_8890ad:lang(zh-SG),.spectrum-ActionButton_8890ad:lang(zh-SG),.spectrum-LogicButton_8890ad:lang(zh-SG),.spectrum-FieldButton_8890ad:lang(zh-SG),.spectrum-ClearButton_8890ad:lang(zh-SG),.spectrum-Stepper-button_8890ad:lang(zh-SG),.spectrum-Button_8890ad:lang(zh-CN),.spectrum-ActionButton_8890ad:lang(zh-CN),.spectrum-LogicButton_8890ad:lang(zh-CN),.spectrum-FieldButton_8890ad:lang(zh-CN),.spectrum-ClearButton_8890ad:lang(zh-CN),.spectrum-Stepper-button_8890ad:lang(zh-CN){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.spectrum-Button_8890ad:lang(ko),.spectrum-ActionButton_8890ad:lang(ko),.spectrum-LogicButton_8890ad:lang(ko),.spectrum-FieldButton_8890ad:lang(ko),.spectrum-ClearButton_8890ad:lang(ko),.spectrum-Stepper-button_8890ad:lang(ko){font-family:adobe-clean-han-korean,source-han-korean,Malgun Gothic,Apple Gothic,sans-serif}.spectrum-Button_8890ad:lang(ja),.spectrum-ActionButton_8890ad:lang(ja),.spectrum-LogicButton_8890ad:lang(ja),.spectrum-FieldButton_8890ad:lang(ja),.spectrum-ClearButton_8890ad:lang(ja),.spectrum-Stepper-button_8890ad:lang(ja){font-family:adobe-clean-han-japanese,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN W3,Osaka,YuGothic,Yu Gothic,メイリオ,Meiryo,MS Pゴシック,MS PGothic,sans-serif}.spectrum-Button_8890ad,.spectrum-ActionButton_8890ad,.spectrum-LogicButton_8890ad,.spectrum-FieldButton_8890ad,.spectrum-ClearButton_8890ad,.spectrum-Stepper_8890ad{--spectrum-focus-ring-border-radius:var(--spectrum-textfield-border-radius,var(--spectrum-alias-border-radius-regular));--spectrum-focus-ring-gap:var(--spectrum-alias-input-focusring-gap);--spectrum-focus-ring-size:var(--spectrum-alias-input-focusring-size);--spectrum-focus-ring-border-size:0px;--spectrum-focus-ring-color:var(--spectrum-high-contrast-focus-ring-color,var(--spectrum-alias-focus-ring-color,var(--spectrum-alias-focus-color)))}.spectrum-Button_8890ad:after,.spectrum-ActionButton_8890ad:after,.spectrum-LogicButton_8890ad:after,.spectrum-FieldButton_8890ad:after,.spectrum-ClearButton_8890ad:after,.spectrum-Stepper_8890ad:after{border-radius:calc(var(--spectrum-focus-ring-border-radius) + var(--spectrum-focus-ring-gap));content:"";margin:calc(-1*var(--spectrum-focus-ring-border-size));pointer-events:none;transition:box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-out,margin var(--spectrum-global-animation-duration-100,.13s)ease-out;display:block;position:absolute;top:0;bottom:0;left:0;right:0}.spectrum-Button_8890ad.focus-ring_8890ad:after,.spectrum-ActionButton_8890ad.focus-ring_8890ad:after,.spectrum-LogicButton_8890ad.focus-ring_8890ad:after,.spectrum-FieldButton_8890ad.focus-ring_8890ad:after,.spectrum-ClearButton_8890ad.focus-ring_8890ad:after,.spectrum-Stepper_8890ad.focus-ring_8890ad:after{margin:calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size));box-shadow:0 0 0 var(--spectrum-focus-ring-size)var(--spectrum-focus-ring-color)}.spectrum-FieldButton--quiet_8890ad:after,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:after{border-radius:0}.spectrum-FieldButton--quiet_8890ad.focus-ring_8890ad:after,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad:after{margin:0 0 calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size))0;box-shadow:0 var(--spectrum-focus-ring-size)0 var(--spectrum-focus-ring-color)}.spectrum-Button_8890ad,.spectrum-ActionButton_8890ad,.spectrum-LogicButton_8890ad,.spectrum-FieldButton_8890ad,.spectrum-ClearButton_8890ad,.spectrum-Stepper-button_8890ad{box-sizing:border-box;border-radius:var(--spectrum-button-border-radius);border-style:solid;border-width:var(--spectrum-button-border-width);--spectrum-focus-ring-border-radius:var(--spectrum-button-border-radius);--spectrum-focus-ring-border-size:var(--spectrum-button-border-width);--spectrum-focus-ring-gap:var(--spectrum-alias-focus-ring-gap,var(--spectrum-global-dimension-static-size-25));--spectrum-focus-ring-size:var(--spectrum-button-primary-focus-ring-size-key-focus,var(--spectrum-alias-focus-ring-size));text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s)ease-out,border-color var(--spectrum-global-animation-duration-100,.13s)ease-out,color var(--spectrum-global-animation-duration-100,.13s)ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-out;-webkit-user-select:none;user-select:none;-ms-touch-action:none;touch-action:none;cursor:default;isolation:isolate;justify-content:center;align-items:center;margin:0;line-height:1.3;text-decoration:none;display:inline-flex;position:relative;overflow:visible}button.spectrum-Button_8890ad,button.spectrum-ActionButton_8890ad,button.spectrum-LogicButton_8890ad,button.spectrum-FieldButton_8890ad,button.spectrum-ClearButton_8890ad,button.spectrum-Stepper-button_8890ad{-webkit-appearance:button}.spectrum-Button_8890ad:focus,.spectrum-ActionButton_8890ad:focus,.spectrum-LogicButton_8890ad:focus,.spectrum-FieldButton_8890ad:focus,.spectrum-ClearButton_8890ad:focus,.spectrum-Stepper-button_8890ad:focus{outline:none}.spectrum-Button_8890ad.focus-ring_8890ad,.spectrum-ActionButton_8890ad.focus-ring_8890ad,.spectrum-LogicButton_8890ad.focus-ring_8890ad,.spectrum-FieldButton_8890ad.focus-ring_8890ad,.spectrum-ClearButton_8890ad.focus-ring_8890ad,.spectrum-Stepper-button_8890ad.focus-ring_8890ad{z-index:3}.spectrum-Button_8890ad::-moz-focus-inner,.spectrum-ActionButton_8890ad::-moz-focus-inner,.spectrum-LogicButton_8890ad::-moz-focus-inner,.spectrum-FieldButton_8890ad::-moz-focus-inner,.spectrum-ClearButton_8890ad::-moz-focus-inner,.spectrum-Stepper-button_8890ad::-moz-focus-inner{border:0;margin-top:-2px;margin-bottom:-2px;padding:0}.spectrum-Button_8890ad:disabled,.spectrum-ActionButton_8890ad:disabled,.spectrum-LogicButton_8890ad:disabled,.spectrum-FieldButton_8890ad:disabled,.spectrum-ClearButton_8890ad:disabled,.spectrum-Stepper-button_8890ad:disabled{cursor:default}.spectrum-Button_8890ad .spectrum-Icon_8890ad,.spectrum-ActionButton_8890ad .spectrum-Icon_8890ad,.spectrum-LogicButton_8890ad .spectrum-Icon_8890ad,.spectrum-FieldButton_8890ad .spectrum-Icon_8890ad,.spectrum-ClearButton_8890ad .spectrum-Icon_8890ad,.spectrum-Stepper-button_8890ad .spectrum-Icon_8890ad{max-height:100%;transition:background var(--spectrum-global-animation-duration-100,.13s)ease-out,fill var(--spectrum-global-animation-duration-100,.13s)ease-out;box-sizing:initial;flex-shrink:0;order:0}.spectrum-Button_8890ad{--spectrum-button-border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-alias-border-radius-large));--spectrum-button-border-width:var(--spectrum-button-primary-border-size,var(--spectrum-alias-border-size-thick));min-height:var(--spectrum-button-primary-height,var(--spectrum-alias-single-line-height));height:0%;min-width:var(--spectrum-button-primary-min-width);padding:var(--spectrum-global-dimension-size-50)calc(var(--spectrum-button-primary-padding-x,var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size,var(--spectrum-alias-border-size-thick)));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + 1px);padding-top:calc(var(--spectrum-global-dimension-size-50) - 1px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-alias-pill-button-text-size));font-weight:var(--spectrum-button-primary-text-font-weight,var(--spectrum-global-font-weight-bold));border-style:solid}.spectrum-Button_8890ad.is-hovered_8890ad,.spectrum-Button_8890ad:active{box-shadow:none}[dir=ltr] .spectrum-Button_8890ad .spectrum-Icon_8890ad+.spectrum-Button-label_8890ad{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}[dir=rtl] .spectrum-Button_8890ad .spectrum-Icon_8890ad+.spectrum-Button-label_8890ad,[dir=ltr] .spectrum-Button_8890ad .spectrum-Button-label_8890ad+.spectrum-Icon_8890ad{margin-right:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}[dir=rtl] .spectrum-Button_8890ad .spectrum-Button-label_8890ad+.spectrum-Icon_8890ad{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}.spectrum-Button_8890ad.spectrum-Button--iconOnly_8890ad{min-width:unset;padding:var(--spectrum-global-dimension-size-65)}a.spectrum-Button_8890ad,a.spectrum-ActionButton_8890ad{-webkit-appearance:none;-webkit-user-select:none;user-select:none;cursor:pointer}.spectrum-ActionButton_8890ad{height:var(--spectrum-actionbutton-height,var(--spectrum-alias-single-line-height));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));--spectrum-button-border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-alias-border-radius-regular));--spectrum-button-border-width:var(--spectrum-actionbutton-border-size,var(--spectrum-alias-border-size-thin));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-text-font-weight,var(--spectrum-alias-body-text-font-weight));padding:0;position:relative}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad{padding-right:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad{padding-right:var(--spectrum-actionbutton-text-padding-x,var(--spectrum-global-dimension-size-150))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad{padding-left:var(--spectrum-actionbutton-text-padding-x,var(--spectrum-global-dimension-size-150))}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad+.spectrum-ActionButton-label_8890ad{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad+.spectrum-ActionButton-label_8890ad,[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad:not([hidden])+.spectrum-Icon_8890ad{padding-right:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad:not([hidden])+.spectrum-Icon_8890ad{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad:only-child,[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-hold_8890ad+.spectrum-ActionButton-label_8890ad:last-child{padding-left:var(--spectrum-actionbutton-text-padding-x,var(--spectrum-global-dimension-size-150))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-label_8890ad:only-child,[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-hold_8890ad+.spectrum-ActionButton-label_8890ad:last-child{padding-right:var(--spectrum-actionbutton-text-padding-x,var(--spectrum-global-dimension-size-150))}[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad:only-child,[dir=ltr] .spectrum-ActionButton_8890ad .spectrum-ActionButton-hold_8890ad+.spectrum-Icon_8890ad:last-child{padding-right:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-Icon_8890ad:only-child,[dir=rtl] .spectrum-ActionButton_8890ad .spectrum-ActionButton-hold_8890ad+.spectrum-Icon_8890ad:last-child{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85))}[dir=ltr] .spectrum-ActionButton-hold_8890ad{right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40))}[dir=rtl] .spectrum-ActionButton-hold_8890ad{left:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40))}.spectrum-ActionButton-hold_8890ad{bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));position:absolute}[dir=rtl] .spectrum-ActionButton-hold_8890ad{transform:rotate(90deg)}.spectrum-ActionButton-label_8890ad,.spectrum-Button-label_8890ad{-ms-grid-row-align:center;text-align:center;width:100%;order:1;place-self:center}.spectrum-ActionButton-label_8890ad:empty,.spectrum-Button-label_8890ad:empty{display:none}.spectrum-ActionButton-label_8890ad{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.spectrum-ActionButton--quiet_8890ad{border-width:var(--spectrum-actionbutton-quiet-border-size,var(--spectrum-alias-border-size-thin));border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,var(--spectrum-alias-body-text-font-weight))}.spectrum-LogicButton_8890ad{height:var(--spectrum-logicbutton-and-height,24px);padding:var(--spectrum-logicbutton-and-padding-x,var(--spectrum-global-dimension-size-100));--spectrum-button-border-width:var(--spectrum-logicbutton-and-border-size,var(--spectrum-alias-border-size-thick));--spectrum-button-border-radius:var(--spectrum-logicbutton-and-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-logicbutton-and-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-logicbutton-and-text-font-weight,var(--spectrum-global-font-weight-bold));line-height:0}.spectrum-FieldButton_8890ad{height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-alias-font-size-default));-webkit-font-smoothing:initial;cursor:default;--spectrum-focus-ring-gap:var(--spectrum-alias-input-focusring-gap);--spectrum-focus-ring-size:var(--spectrum-alias-input-focusring-size);padding-top:0;padding-bottom:0;padding-left:var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));padding-right:var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));--spectrum-button-border-width:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin));--spectrum-button-border-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50));transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);border-style:solid;outline:none;margin:0;line-height:normal;position:relative}.spectrum-FieldButton_8890ad:disabled,.spectrum-FieldButton_8890ad.is-disabled_8890ad{cursor:default;border-width:0}.spectrum-FieldButton_8890ad.is-open_8890ad{border-width:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin))}.spectrum-FieldButton--quiet_8890ad{--spectrum-button-border-width:0;--spectrum-button-border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0px);--spectrum-focus-ring-size:var(--spectrum-alias-focus-ring-size,var(--spectrum-global-dimension-static-size-25));margin:0;padding:0}.spectrum-FieldButton--quiet_8890ad:disabled.focus-ring_8890ad,.spectrum-FieldButton--quiet_8890ad.is-disabled_8890ad.focus-ring_8890ad{box-shadow:none}.spectrum-ClearButton_8890ad{width:var(--spectrum-clearbutton-medium-width,var(--spectrum-alias-single-line-height));height:var(--spectrum-clearbutton-medium-height,var(--spectrum-alias-single-line-height));--spectrum-button-border-radius:100%;--spectrum-button-border-width:0px;border:none;margin:0;padding:0}.spectrum-ClearButton_8890ad>.spectrum-Icon_8890ad{margin:0 auto}@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){.spectrum-ClearButton_8890ad>.spectrum-Icon_8890ad{margin:0}}.spectrum-ClearButton--small_8890ad{width:var(--spectrum-clearbutton-small-width,var(--spectrum-global-dimension-size-300));height:var(--spectrum-clearbutton-small-height,var(--spectrum-global-dimension-size-300))}.spectrum-Stepper_8890ad{display:-ms-inline-grid;height:max-content;--spectrum-stepper-width:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))*4);width:var(--spectrum-stepper-width);transition:border-color var(--spectrum-global-animation-duration-100,.13s)ease-in-out,box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-in-out;line-height:0;display:inline-grid;position:relative}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad){-ms-grid-rows:auto auto;-ms-grid-columns:1fr auto;grid-template:"field increment""field decrement"/1fr auto}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{padding-top:calc(var(--spectrum-global-dimension-size-50) + 1px);padding-bottom:calc(var(--spectrum-global-dimension-size-50) - .5px)}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px)}.spectrum-Stepper_8890ad.spectrum-Stepper--isMobile_8890ad{--spectrum-stepper-width:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))*5);-ms-grid-rows:auto;-ms-grid-columns:auto 1fr auto;grid-template:"decrement field increment"/auto 1fr auto}.spectrum-Stepper_8890ad .spectrum-Stepper-field_8890ad{width:unset;min-width:var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400));grid-area:field}[dir=ltr] .spectrum-Stepper_8890ad .spectrum-Stepper-icon_8890ad{padding-right:0}[dir=rtl] .spectrum-Stepper_8890ad .spectrum-Stepper-icon_8890ad{padding-left:0}.spectrum-Stepper_8890ad .spectrum-Stepper-button--stepUp_8890ad{grid-area:increment}.spectrum-Stepper_8890ad .spectrum-Stepper-button--stepDown_8890ad{grid-area:decrement}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad){border-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-icon_8890ad{right:var(--spectrum-global-dimension-size-100)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-icon_8890ad{left:var(--spectrum-global-dimension-size-100)}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):not(.spectrum-Stepper--showStepper_8890ad):not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{height:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))/2);width:24px}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):not(.spectrum-Stepper--showStepper_8890ad).spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button_8890ad{height:var(--spectrum-textfield-height,var(--spectrum-alias-single-line-height));width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-input_8890ad{border-top-right-radius:0}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-input_8890ad{border-top-left-radius:0}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-input_8890ad{border-bottom-right-radius:0}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-input_8890ad{border-bottom-left-radius:0}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{border-left-width:0}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{border-right-width:0}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{height:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))/2);width:24px}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-bottom-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-bottom-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-right-width:var(--spectrum-alias-input-border-size)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-left-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-top-width:1px;border-bottom-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-right-width:var(--spectrum-alias-input-border-size)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-left-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-top-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-top-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepUp_8890ad{border-top-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-input_8890ad{border-radius:0}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button_8890ad{height:var(--spectrum-textfield-height,var(--spectrum-alias-single-line-height));width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-left-width:var(--spectrum-alias-input-border-size)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-right-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-top-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-top-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-bottom-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-bottom-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepDown_8890ad{border-top-width:var(--spectrum-alias-input-border-size);border-bottom-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-right-width:var(--spectrum-alias-input-border-size)}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-left-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-top-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-top-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=ltr] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-bottom-right-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}[dir=rtl] .spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-bottom-left-radius:var(--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button--stepUp_8890ad{border-top-width:var(--spectrum-alias-input-border-size);border-bottom-width:var(--spectrum-alias-input-border-size)}[dir=ltr] .spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-icon_8890ad{right:0}[dir=rtl] .spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-icon_8890ad{left:0}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:not(.spectrum-Stepper--showStepper_8890ad):not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{height:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))/2);width:24px}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:not(.spectrum-Stepper--showStepper_8890ad):not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-bottom-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:not(.spectrum-Stepper--showStepper_8890ad).spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button_8890ad{height:var(--spectrum-textfield-height,var(--spectrum-alias-single-line-height));width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));border-bottom-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button_8890ad{height:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))/2);width:24px}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.spectrum-Stepper--showStepper_8890ad:not(.spectrum-Stepper--isMobile_8890ad) .spectrum-Stepper-button--stepDown_8890ad{border-bottom-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.spectrum-Stepper--showStepper_8890ad.spectrum-Stepper--isMobile_8890ad .spectrum-Stepper-button_8890ad{height:var(--spectrum-textfield-height,var(--spectrum-alias-single-line-height));width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));border-bottom-width:var(--spectrum-alias-input-border-size)}.spectrum-Stepper-container_8890ad.spectrum-Stepper-container_8890ad{--spectrum-field-default-width:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))*4)}.spectrum-Stepper-container_8890ad.spectrum-Stepper-container--isMobile_8890ad{--spectrum-field-default-width:calc(var(--spectrum-alias-single-line-height,var(--spectrum-global-dimension-size-400))*5)}.spectrum-Stepper-button_8890ad{border-width:0}.spectrum-Stepper-button_8890ad.is-hovered_8890ad,.spectrum-Stepper-button_8890ad:active{box-shadow:none}.spectrum-Stepper-button_8890ad .spectrum-Stepper-button-icon_8890ad{max-height:100%;transition:background var(--spectrum-global-animation-duration-100,.13s)ease-out,fill var(--spectrum-global-animation-duration-100,.13s)ease-out;box-sizing:initial;flex-shrink:0}.spectrum-Stepper_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-actionbutton-icon-color,var(--spectrum-alias-icon-color))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-input_8890ad{border-color:var(--spectrum-textfield-border-color,var(--spectrum-alias-border-color))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad{background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border-color:var(--spectrum-textfield-border-color,var(--spectrum-alias-border-color));color:var(--spectrum-actionbutton-text-color,var(--spectrum-alias-text-color))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-hovered_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-hover,var(--spectrum-alias-border-color-hover))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-active_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):active .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-active_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):active .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):focus .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-focused_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):focus .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-disabled_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):disabled .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-disabled_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):disabled .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-disabled,var(--spectrum-alias-border-color-transparent))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-error,var(--spectrum-semantic-negative-color-default))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-error-hover,var(--spectrum-semantic-negative-color-state-hover))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad:active .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad:active .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-error-down,var(--spectrum-semantic-negative-color-state-down))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-invalid_8890ad.is-focused_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-input_8890ad{border-color:var(--spectrum-textfield-quiet-border-color,var(--spectrum-alias-border-color))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad{background-color:unset;border-color:var(--spectrum-textfield-quiet-border-color,var(--spectrum-alias-border-color));color:var(--spectrum-actionbutton-text-color,var(--spectrum-alias-text-color))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-hover,var(--spectrum-alias-border-color-hover))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-active_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:active .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-active_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:active .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-disabled_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:disabled .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-disabled_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:disabled .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-disabled,var(--spectrum-alias-border-color-mid))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-error,var(--spectrum-semantic-negative-color-default))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-error-hover,var(--spectrum-semantic-negative-color-state-hover))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad:active .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad:active .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-error-down,var(--spectrum-semantic-negative-color-state-down))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad.is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-invalid_8890ad.is-focused_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-hovered_8890ad,.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-hovered_8890ad{color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-hovered_8890ad .spectrum-Stepper-button-icon_8890ad,.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-hovered_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-alias-icon-color-hover))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-active_8890ad{color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-alias-text-color-down))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-active_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-actionbutton-text-color-down,var(--spectrum-alias-text-color-down))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad:disabled,.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-disabled_8890ad{color:var(--spectrum-textfield-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad:disabled .spectrum-Stepper-button-icon_8890ad,.spectrum-Stepper_8890ad .spectrum-Stepper-button_8890ad.is-disabled_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-textfield-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad.is-hovered_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad.is-hovered_8890ad{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad.is-active_8890ad{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200))}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad:disabled,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad) .spectrum-Stepper-button_8890ad.is-disabled_8890ad{background-color:var(--spectrum-textfield-background-color-disabled,var(--spectrum-global-color-gray-200))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad:disabled,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad.is-disabled_8890ad{color:var(--spectrum-textfield-quiet-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad:disabled .spectrum-Stepper-button-icon_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad.is-disabled_8890ad .spectrum-Stepper-button-icon_8890ad{fill:var(--spectrum-textfield-quiet-text-color-disabled,var(--spectrum-alias-text-color-disabled))}@media (forced-colors:active){.spectrum-Stepper_8890ad{--spectrum-textfield-border-color-disabled:GrayText;--spectrum-textfield-border-color-error:Highlight;--spectrum-textfield-border-color-hover:Highlight;--spectrum-textfield-border-color-key-focus:Highlight;--spectrum-textfield-quiet-border-color-disabled:GrayText;--spectrum-textfield-quiet-border-color-error:Highlight;--spectrum-textfield-quiet-border-color-hover:Highlight;--spectrum-textfield-quiet-border-color-key-focus:Highlight;--spectrum-textfield-quiet-border-color:ButtonText;--spectrum-textfield-quiet-text-color-disabled:GrayText;--spectrum-textfield-text-color-disabled:GrayText}.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad).is-focused_8890ad,.spectrum-Stepper_8890ad:not(.spectrum-Stepper--isQuiet_8890ad):focus{outline:2px solid Highlight}.spectrum-Stepper_8890ad.spectrum-Stepper--readonly_8890ad.spectrum-Stepper--isQuiet_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color,var(--spectrum-alias-border-color))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad{forced-color-adjust:none;box-shadow:0 1px 0 0 var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-focused_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad:focus .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.focus-ring_8890ad .spectrum-Stepper-button_8890ad{forced-color-adjust:auto;border-color:var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-input_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad,.spectrum-Stepper_8890ad.spectrum-Stepper--isQuiet_8890ad.is-hovered_8890ad .spectrum-Stepper-button_8890ad{border-color:var(--spectrum-textfield-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus))}}
package/dist/main.js CHANGED
@@ -3,12 +3,12 @@ var $i8sTE$reactspectrumutils = require("@react-spectrum/utils");
3
3
  var $i8sTE$reactspectrumlabel = require("@react-spectrum/label");
4
4
  var $i8sTE$reactariafocus = require("@react-aria/focus");
5
5
  var $i8sTE$reactariautils = require("@react-aria/utils");
6
+ var $i8sTE$reactstatelynumberfield = require("@react-stately/numberfield");
6
7
  var $i8sTE$react = require("react");
7
8
  var $i8sTE$reactspectrumtextfield = require("@react-spectrum/textfield");
8
9
  var $i8sTE$reactariainteractions = require("@react-aria/interactions");
9
10
  var $i8sTE$reactariai18n = require("@react-aria/i18n");
10
11
  var $i8sTE$reactarianumberfield = require("@react-aria/numberfield");
11
- var $i8sTE$reactstatelynumberfield = require("@react-stately/numberfield");
12
12
  var $i8sTE$reactspectrumprovider = require("@react-spectrum/provider");
13
13
  var $i8sTE$spectrumiconsworkflowAdd = require("@spectrum-icons/workflow/Add");
14
14
  var $i8sTE$spectrumiconsuiChevronDownSmall = require("@spectrum-icons/ui/ChevronDownSmall");
@@ -50,6 +50,7 @@ $parcel$export(module.exports, "NumberField", () => $9b3df9c012d62e52$export$63c
50
50
 
51
51
 
52
52
 
53
+
53
54
  /*
54
55
  * Copyright 2020 Adobe. All rights reserved.
55
56
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
@@ -225,7 +226,6 @@ function $2f3cded204daae76$var$StepButton(props, ref) {
225
226
 
226
227
 
227
228
 
228
-
229
229
  function $9b3df9c012d62e52$var$NumberField(props, ref) {
230
230
  props = (0, $i8sTE$reactspectrumprovider.useProviderProps)(props);
231
231
  let provider = (0, $i8sTE$reactspectrumprovider.useProvider)();
@@ -272,11 +272,12 @@ function $9b3df9c012d62e52$var$NumberField(props, ref) {
272
272
  incrementProps: incrementButtonProps,
273
273
  decrementProps: decrementButtonProps,
274
274
  className: className,
275
- style: style
275
+ style: style,
276
+ state: state
276
277
  }));
277
278
  }
278
279
  const $9b3df9c012d62e52$var$NumberFieldInput = /*#__PURE__*/ (0, ($parcel$interopDefault($i8sTE$react))).forwardRef(function NumberFieldInput(props, ref) {
279
- let { groupProps: groupProps , inputProps: inputProps , inputRef: inputRef , incrementProps: incrementProps , decrementProps: decrementProps , className: className , style: style , autoFocus: autoFocus , isQuiet: isQuiet , isDisabled: isDisabled , hideStepper: hideStepper , validationState: validationState } = props;
280
+ let { groupProps: groupProps , inputProps: inputProps , inputRef: inputRef , incrementProps: incrementProps , decrementProps: decrementProps , className: className , style: style , autoFocus: autoFocus , isQuiet: isQuiet , isDisabled: isDisabled , hideStepper: hideStepper , validationState: validationState , name: name , state: state } = props;
280
281
  let showStepper = !hideStepper;
281
282
  return /*#__PURE__*/ (0, ($parcel$interopDefault($i8sTE$react))).createElement((0, $i8sTE$reactariafocus.FocusRing), {
282
283
  within: true,
@@ -307,7 +308,11 @@ const $9b3df9c012d62e52$var$NumberFieldInput = /*#__PURE__*/ (0, ($parcel$intero
307
308
  direction: "down",
308
309
  isQuiet: isQuiet,
309
310
  ...decrementProps
310
- }))));
311
+ })), name && /*#__PURE__*/ (0, ($parcel$interopDefault($i8sTE$react))).createElement("input", {
312
+ type: "hidden",
313
+ name: name,
314
+ value: isNaN(state.numberValue) ? "" : state.numberValue
315
+ })));
311
316
  });
312
317
  /**
313
318
  * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.
package/dist/main.js.map CHANGED
@@ -1 +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 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 {useNumberFieldState} from '@react-stately/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 </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}\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 } = 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 </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"}
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"}
package/dist/module.js CHANGED
@@ -3,12 +3,12 @@ import {useStyleProps as $k6K00$useStyleProps, useFocusableRef as $k6K00$useFocu
3
3
  import {Field as $k6K00$Field} from "@react-spectrum/label";
4
4
  import {FocusRing as $k6K00$FocusRing} from "@react-aria/focus";
5
5
  import {mergeProps as $k6K00$mergeProps} from "@react-aria/utils";
6
+ import {useNumberFieldState as $k6K00$useNumberFieldState} from "@react-stately/numberfield";
6
7
  import $k6K00$react, {useRef as $k6K00$useRef} from "react";
7
8
  import {TextFieldBase as $k6K00$TextFieldBase} from "@react-spectrum/textfield";
8
9
  import {useHover as $k6K00$useHover} from "@react-aria/interactions";
9
10
  import {useLocale as $k6K00$useLocale} from "@react-aria/i18n";
10
11
  import {useNumberField as $k6K00$useNumberField} from "@react-aria/numberfield";
11
- import {useNumberFieldState as $k6K00$useNumberFieldState} from "@react-stately/numberfield";
12
12
  import {useProviderProps as $k6K00$useProviderProps, useProvider as $k6K00$useProvider} from "@react-spectrum/provider";
13
13
  import $k6K00$spectrumiconsworkflowAdd from "@spectrum-icons/workflow/Add";
14
14
  import $k6K00$spectrumiconsuiChevronDownSmall from "@spectrum-icons/ui/ChevronDownSmall";
@@ -48,6 +48,7 @@ function $parcel$export(e, n, v, s) {
48
48
 
49
49
 
50
50
 
51
+
51
52
  /*
52
53
  * Copyright 2020 Adobe. All rights reserved.
53
54
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
@@ -223,7 +224,6 @@ function $7f00b388e0d3b2f6$var$StepButton(props, ref) {
223
224
 
224
225
 
225
226
 
226
-
227
227
  function $48b879bdd771eb85$var$NumberField(props, ref) {
228
228
  props = (0, $k6K00$useProviderProps)(props);
229
229
  let provider = (0, $k6K00$useProvider)();
@@ -270,11 +270,12 @@ function $48b879bdd771eb85$var$NumberField(props, ref) {
270
270
  incrementProps: incrementButtonProps,
271
271
  decrementProps: decrementButtonProps,
272
272
  className: className,
273
- style: style
273
+ style: style,
274
+ state: state
274
275
  }));
275
276
  }
276
277
  const $48b879bdd771eb85$var$NumberFieldInput = /*#__PURE__*/ (0, $k6K00$react).forwardRef(function NumberFieldInput(props, ref) {
277
- let { groupProps: groupProps , inputProps: inputProps , inputRef: inputRef , incrementProps: incrementProps , decrementProps: decrementProps , className: className , style: style , autoFocus: autoFocus , isQuiet: isQuiet , isDisabled: isDisabled , hideStepper: hideStepper , validationState: validationState } = props;
278
+ let { groupProps: groupProps , inputProps: inputProps , inputRef: inputRef , incrementProps: incrementProps , decrementProps: decrementProps , className: className , style: style , autoFocus: autoFocus , isQuiet: isQuiet , isDisabled: isDisabled , hideStepper: hideStepper , validationState: validationState , name: name , state: state } = props;
278
279
  let showStepper = !hideStepper;
279
280
  return /*#__PURE__*/ (0, $k6K00$react).createElement((0, $k6K00$FocusRing), {
280
281
  within: true,
@@ -305,7 +306,11 @@ const $48b879bdd771eb85$var$NumberFieldInput = /*#__PURE__*/ (0, $k6K00$react).f
305
306
  direction: "down",
306
307
  isQuiet: isQuiet,
307
308
  ...decrementProps
308
- }))));
309
+ })), name && /*#__PURE__*/ (0, $k6K00$react).createElement("input", {
310
+ type: "hidden",
311
+ name: name,
312
+ value: isNaN(state.numberValue) ? "" : state.numberValue
313
+ })));
309
314
  });
310
315
  /**
311
316
  * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.
@@ -1 +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 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 {useNumberFieldState} from '@react-stately/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 </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}\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 } = 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 </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"}
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"}
@@ -1 +1 @@
1
- {"mappings":";;ACmLA;;GAEG;AACH,OAAA,IAAI,uKAA4C,CAAC;ACvKjD,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"}
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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-spectrum/numberfield",
3
- "version": "3.6.2",
3
+ "version": "3.7.0",
4
4
  "description": "Spectrum UI components in React",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/main.js",
@@ -36,23 +36,23 @@
36
36
  "url": "https://github.com/adobe/react-spectrum"
37
37
  },
38
38
  "dependencies": {
39
- "@react-aria/button": "^3.7.2",
40
- "@react-aria/focus": "^3.12.1",
41
- "@react-aria/i18n": "^3.7.2",
42
- "@react-aria/interactions": "^3.15.1",
43
- "@react-aria/numberfield": "^3.5.1",
44
- "@react-aria/utils": "^3.17.0",
45
- "@react-spectrum/button": "^3.12.2",
46
- "@react-spectrum/label": "^3.12.1",
47
- "@react-spectrum/textfield": "^3.10.2",
48
- "@react-spectrum/utils": "^3.9.2",
49
- "@react-stately/numberfield": "^3.4.2",
50
- "@react-types/button": "^3.7.3",
51
- "@react-types/numberfield": "^3.4.2",
52
- "@react-types/shared": "^3.18.1",
53
- "@spectrum-icons/ui": "^3.5.2",
54
- "@spectrum-icons/workflow": "^4.2.1",
55
- "@swc/helpers": "^0.4.14"
39
+ "@react-aria/button": "^3.8.1",
40
+ "@react-aria/focus": "^3.14.0",
41
+ "@react-aria/i18n": "^3.8.1",
42
+ "@react-aria/interactions": "^3.17.0",
43
+ "@react-aria/numberfield": "^3.7.0",
44
+ "@react-aria/utils": "^3.19.0",
45
+ "@react-spectrum/button": "^3.12.4",
46
+ "@react-spectrum/label": "^3.13.1",
47
+ "@react-spectrum/textfield": "^3.10.4",
48
+ "@react-spectrum/utils": "^3.10.1",
49
+ "@react-stately/numberfield": "^3.6.0",
50
+ "@react-types/button": "^3.7.4",
51
+ "@react-types/numberfield": "^3.5.0",
52
+ "@react-types/shared": "^3.19.0",
53
+ "@spectrum-icons/ui": "^3.5.4",
54
+ "@spectrum-icons/workflow": "^4.2.3",
55
+ "@swc/helpers": "^0.5.0"
56
56
  },
57
57
  "devDependencies": {
58
58
  "@adobe/spectrum-css-temp": "3.0.0-alpha.1",
@@ -66,5 +66,5 @@
66
66
  "publishConfig": {
67
67
  "access": "public"
68
68
  },
69
- "gitHead": "5911ed21de4b76d66f6254c02302519e02d50e16"
69
+ "gitHead": "d4dfe4bb842a914f10045ee63fc6b92f034c5b30"
70
70
  }
@@ -16,6 +16,7 @@ import {Field} from '@react-spectrum/label';
16
16
  import {FocusableRef} from '@react-types/shared';
17
17
  import {FocusRing} from '@react-aria/focus';
18
18
  import {mergeProps} from '@react-aria/utils';
19
+ import {NumberFieldState, useNumberFieldState} from '@react-stately/numberfield';
19
20
  import React, {HTMLAttributes, InputHTMLAttributes, RefObject, useRef} from 'react';
20
21
  import {SpectrumNumberFieldProps} from '@react-types/numberfield';
21
22
  import {StepButton} from './StepButton';
@@ -24,7 +25,6 @@ import {TextFieldBase} from '@react-spectrum/textfield';
24
25
  import {useHover} from '@react-aria/interactions';
25
26
  import {useLocale} from '@react-aria/i18n';
26
27
  import {useNumberField} from '@react-aria/numberfield';
27
- import {useNumberFieldState} from '@react-stately/numberfield';
28
28
  import {useProvider, useProviderProps} from '@react-spectrum/provider';
29
29
 
30
30
  function NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElement>) {
@@ -96,7 +96,8 @@ function NumberField(props: SpectrumNumberFieldProps, ref: FocusableRef<HTMLElem
96
96
  incrementProps={incrementButtonProps}
97
97
  decrementProps={decrementButtonProps}
98
98
  className={className}
99
- style={style} />
99
+ style={style}
100
+ state={state} />
100
101
  </Field>
101
102
  );
102
103
  }
@@ -109,7 +110,8 @@ interface NumberFieldInputProps extends SpectrumNumberFieldProps {
109
110
  incrementProps: AriaButtonProps,
110
111
  decrementProps: AriaButtonProps,
111
112
  className?: string,
112
- style?: React.CSSProperties
113
+ style?: React.CSSProperties,
114
+ state: NumberFieldState
113
115
  }
114
116
 
115
117
  const NumberFieldInput = React.forwardRef(function NumberFieldInput(props: NumberFieldInputProps, ref: RefObject<HTMLElement>) {
@@ -125,7 +127,9 @@ const NumberFieldInput = React.forwardRef(function NumberFieldInput(props: Numbe
125
127
  isQuiet,
126
128
  isDisabled,
127
129
  hideStepper,
128
- validationState
130
+ validationState,
131
+ name,
132
+ state
129
133
  } = props;
130
134
  let showStepper = !hideStepper;
131
135
 
@@ -172,6 +176,7 @@ const NumberFieldInput = React.forwardRef(function NumberFieldInput(props: Numbe
172
176
  <StepButton direction="down" isQuiet={isQuiet} {...decrementProps} />
173
177
  </>
174
178
  }
179
+ {name && <input type="hidden" name={name} value={isNaN(state.numberValue) ? '' : state.numberValue} />}
175
180
  </div>
176
181
  </FocusRing>
177
182
  );