@fluentui/react-spinbutton 9.2.6 → 9.2.8

package/CHANGELOG.json

@@ -2,28 +2,61 @@
   "name": "@fluentui/react-spinbutton",
   "entries": [
     {
-      "date": "Thu, 23 Mar 2023 12:28:45 GMT",
-      "tag": "@fluentui/react-spinbutton_v9.2.6",
-      "version": "9.2.6",
+      "date": "Thu, 06 Apr 2023 23:59:52 GMT",
+      "tag": "@fluentui/react-spinbutton_v9.2.8",
+      "version": "9.2.8",
+      "comments": {
+        "patch": [
+          {
+            "author": "kakrookaran@gmail.com",
+            "package": "@fluentui/react-spinbutton",
+            "commit": "4f7b946067bda04d92953cf5e9ed90059a98a8fb",
+            "comment": "added width 100% to input of spin button"
+          },
+          {
+            "author": "behowell@microsoft.com",
+            "package": "@fluentui/react-spinbutton",
+            "commit": "eee5716e76dc6a5bef9316546a352694bbe5750a",
+            "comment": "chore: Update package version of react-field"
+          },
+          {
+            "author": "behowell@microsoft.com",
+            "package": "@fluentui/react-spinbutton",
+            "commit": "5a8d7a29645b3b500eb7145d2e42ac34fcafc4c6",
+            "comment": "chore: Hook up FieldContext for use inside a Field"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-spinbutton",
+            "comment": "Bump @fluentui/react-field to v9.0.0-beta.1",
+            "commit": "7a46cab3d31a233b89b7188e994b24712af5393c"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 04 Apr 2023 18:44:50 GMT",
+      "tag": "@fluentui/react-spinbutton_v9.2.7",
+      "version": "9.2.7",
       "comments": {
         "patch": [
           {
             "author": "beachball",
             "package": "@fluentui/react-spinbutton",
-            "comment": "Bump @fluentui/react-field to v9.0.0-alpha.28",
-            "commit": "be0ca69899300abe3c8478c435e0f6837138479b"
+            "comment": "Bump @fluentui/react-field to v9.0.0-alpha.29",
+            "commit": "6778d76bbbad7e1975c151c797f28c2708cde2ce"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-spinbutton",
-            "comment": "Bump @fluentui/react-shared-contexts to v9.3.3",
-            "commit": "be0ca69899300abe3c8478c435e0f6837138479b"
+            "comment": "Bump @fluentui/react-utilities to v9.7.3",
+            "commit": "6778d76bbbad7e1975c151c797f28c2708cde2ce"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-spinbutton",
-            "comment": "Bump @fluentui/react-label to v9.1.6",
-            "commit": "be0ca69899300abe3c8478c435e0f6837138479b"
+            "comment": "Bump @fluentui/react-label to v9.1.7",
+            "commit": "6778d76bbbad7e1975c151c797f28c2708cde2ce"
           }
         ]
       }

package/CHANGELOG.md

@@ -1,19 +1,31 @@
 # Change Log - @fluentui/react-spinbutton
 
-This log was last generated on Thu, 23 Mar 2023 12:28:45 GMT and should not be manually modified.
+This log was last generated on Thu, 06 Apr 2023 23:59:52 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [9.2.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v9.2.6)
+## [9.2.8](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v9.2.8)
 
-Thu, 23 Mar 2023 12:28:45 GMT 
-[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinbutton_v9.2.5..@fluentui/react-spinbutton_v9.2.6)
+Thu, 06 Apr 2023 23:59:52 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinbutton_v9.2.7..@fluentui/react-spinbutton_v9.2.8)
 
 ### Patches
 
-- Bump @fluentui/react-field to v9.0.0-alpha.28 ([PR #27286](https://github.com/microsoft/fluentui/pull/27286) by beachball)
-- Bump @fluentui/react-shared-contexts to v9.3.3 ([PR #27286](https://github.com/microsoft/fluentui/pull/27286) by beachball)
-- Bump @fluentui/react-label to v9.1.6 ([PR #27286](https://github.com/microsoft/fluentui/pull/27286) by beachball)
+- added width 100% to input of spin button ([PR #27421](https://github.com/microsoft/fluentui/pull/27421) by kakrookaran@gmail.com)
+- chore: Update package version of react-field ([PR #27458](https://github.com/microsoft/fluentui/pull/27458) by behowell@microsoft.com)
+- chore: Hook up FieldContext for use inside a Field ([PR #27399](https://github.com/microsoft/fluentui/pull/27399) by behowell@microsoft.com)
+- Bump @fluentui/react-field to v9.0.0-beta.1 ([PR #27420](https://github.com/microsoft/fluentui/pull/27420) by beachball)
+
+## [9.2.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v9.2.7)
+
+Tue, 04 Apr 2023 18:44:50 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinbutton_v9.2.5..@fluentui/react-spinbutton_v9.2.7)
+
+### Patches
+
+- Bump @fluentui/react-field to v9.0.0-alpha.29 ([PR #27434](https://github.com/microsoft/fluentui/pull/27434) by beachball)
+- Bump @fluentui/react-utilities to v9.7.3 ([PR #27434](https://github.com/microsoft/fluentui/pull/27434) by beachball)
+- Bump @fluentui/react-label to v9.1.7 ([PR #27434](https://github.com/microsoft/fluentui/pull/27434) by beachball)
 
 ## [9.2.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v9.2.5)
 

package/lib/components/SpinButton/useSpinButton.js

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { useFieldControlProps_unstable } from '@fluentui/react-field';
 import { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useControllableState, useTimeout } from '@fluentui/react-utilities';
 import { ArrowUp, ArrowDown, End, Enter, Escape, Home, PageDown, PageUp } from '@fluentui/keyboard-keys';
 import { calculatePrecision, precisionRound, getBound, clamp } from '../../utils/index';
@@ -21,6 +22,11 @@ const lerp = (start, end, percent) => start + (end - start) * percent;
  * @param ref - reference to root HTMLElement of SpinButton
  */
 export const useSpinButton_unstable = (props, ref) => {
+  // Merge props from surrounding <Field>, if any
+  props = useFieldControlProps_unstable(props, {
+    supportsLabelFor: true,
+    supportsRequired: true
+  });
   const nativeProps = getPartitionedNativeProps({
     props,
     primarySlotTagName: 'input',

package/lib/components/SpinButton/useSpinButton.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getPartitionedNativeProps","mergeCallbacks","resolveShorthand","useControllableState","useTimeout","ArrowUp","ArrowDown","End","Enter","Escape","Home","PageDown","PageUp","calculatePrecision","precisionRound","getBound","clamp","ChevronUp16Regular","ChevronDown16Regular","useOverrides_unstable","useOverrides","DEFAULT_SPIN_DELAY_MS","MIN_SPIN_DELAY_MS","MAX_SPIN_TIME_MS","lerp","start","end","percent","useSpinButton_unstable","props","ref","nativeProps","primarySlotTagName","excludedPropNames","overrides","_overrides_inputDefaultAppearance","value","displayValue","defaultValue","min","max","step","stepPage","precision","precisionFromProps","onChange","size","appearance","inputDefaultAppearance","root","input","incrementButton","decrementButton","useMemo","Math","currentValue","setCurrentValue","state","defaultState","initialState","isControlled","undefined","textValue","setTextValue","useState","keyboardSpinState","setKeyboardSpinState","internalState","useRef","spinState","spinTime","spinDelay","atBound","setStepTimeout","clearStepTimeout","stepValue","e","direction","startFrom","startValue","current","num","parseFloat","isNaN","val","dir","stepSize","stepStart","nullStep","commit","newValue","Number","handleInputChange","previousTextValue","String","target","handleIncrementMouseDown","handleDecrementMouseDown","handleStepMouseUpOrLeave","handleBlur","handleKeyDown","nextKeyboardSpinState","key","preventDefault","shiftKey","handleKeyUp","newDisplayValue","valueChanged","displayValueChanged","roundedValue","nextValue","components","required","defaultProps","autoComplete","role","type","primary","tabIndex","children","createElement","disabled","valueToDisplay","_state_input_ariavaluetext","onBlur","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave"],"sources":["../../../src/components/SpinButton/useSpinButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  getPartitionedNativeProps,\n  mergeCallbacks,\n  resolveShorthand,\n  useControllableState,\n  useTimeout,\n} from '@fluentui/react-utilities';\nimport { ArrowUp, ArrowDown, End, Enter, Escape, Home, PageDown, PageUp } from '@fluentui/keyboard-keys';\nimport {\n  SpinButtonProps,\n  SpinButtonState,\n  SpinButtonSpinState,\n  SpinButtonChangeEvent,\n  SpinButtonBounds,\n} from './SpinButton.types';\nimport { calculatePrecision, precisionRound, getBound, clamp } from '../../utils/index';\nimport { ChevronUp16Regular, ChevronDown16Regular } from '@fluentui/react-icons';\nimport { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\n\ntype InternalState = {\n  value: number | null;\n  spinState: SpinButtonSpinState;\n  spinTime: number;\n  spinDelay: number;\n  previousTextValue?: string;\n  atBound: SpinButtonBounds;\n};\n\nconst DEFAULT_SPIN_DELAY_MS = 150;\nconst MIN_SPIN_DELAY_MS = 80;\nconst MAX_SPIN_TIME_MS = 1000;\n\n// This is here to give an ease for the mouse held down case.\n// Exact easing it to be defined. Once it is we'll likely\n// pull this out into a util function in the SpinButton package.\nconst lerp = (start: number, end: number, percent: number): number => start + (end - start) * percent;\n\n/**\n * Create the state required to render SpinButton.\n *\n * The returned state can be modified with hooks such as useSpinButtonStyles_unstable,\n * before being passed to renderSpinButton_unstable.\n *\n * @param props - props from this instance of SpinButton\n * @param ref - reference to root HTMLElement of SpinButton\n */\nexport const useSpinButton_unstable = (props: SpinButtonProps, ref: React.Ref<HTMLInputElement>): SpinButtonState => {\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'input',\n    excludedPropNames: ['defaultValue', 'max', 'min', 'onChange', 'size', 'value'],\n  });\n\n  const overrides = useOverrides();\n\n  const {\n    value,\n    displayValue,\n    defaultValue,\n    min,\n    max,\n    step = 1,\n    stepPage = 1,\n    precision: precisionFromProps,\n    onChange,\n    size = 'medium',\n    appearance = overrides.inputDefaultAppearance ?? 'outline',\n    root,\n    input,\n    incrementButton,\n    decrementButton,\n  } = props;\n\n  const precision = React.useMemo(() => {\n    return precisionFromProps ?? Math.max(calculatePrecision(step), 0);\n  }, [precisionFromProps, step]);\n\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: value,\n    defaultState: defaultValue,\n    initialState: 0,\n  });\n\n  const isControlled = value !== undefined;\n\n  const [textValue, setTextValue] = React.useState<string | undefined>(undefined);\n  const [keyboardSpinState, setKeyboardSpinState] = React.useState<SpinButtonSpinState>('rest');\n\n  const internalState = React.useRef<InternalState>({\n    value: currentValue,\n    spinState: 'rest',\n    spinTime: 0,\n    spinDelay: DEFAULT_SPIN_DELAY_MS,\n    atBound: currentValue !== null ? getBound(precisionRound(currentValue, precision), min, max) : 'none',\n  });\n\n  const [setStepTimeout, clearStepTimeout] = useTimeout();\n\n  const stepValue = (\n    e: SpinButtonChangeEvent,\n    direction: 'up' | 'down' | 'upPage' | 'downPage',\n    startFrom?: string,\n  ) => {\n    let startValue = internalState.current.value;\n    if (startFrom) {\n      const num = parseFloat(startFrom);\n      if (!isNaN(num)) {\n        startValue = num;\n      }\n    }\n    const val = startValue;\n    const dir = direction === 'up' || direction === 'upPage' ? 1 : -1;\n    const stepSize = direction === 'upPage' || direction === 'downPage' ? stepPage : step;\n\n    if (val === null) {\n      const stepStart = min === undefined ? 0 : min;\n      const nullStep = clamp(stepStart + stepSize * dir, min, max);\n      commit(e, nullStep);\n      return;\n    }\n\n    let newValue = val + stepSize * dir;\n    if (!Number.isNaN(newValue)) {\n      newValue = clamp(newValue, min, max);\n    }\n\n    commit(e, newValue);\n\n    if (internalState.current.spinState !== 'rest') {\n      setStepTimeout(() => {\n        // Ease the step speed a bit\n        internalState.current.spinTime += internalState.current.spinDelay;\n        internalState.current.spinDelay = lerp(\n          DEFAULT_SPIN_DELAY_MS,\n          MIN_SPIN_DELAY_MS,\n          internalState.current.spinTime / MAX_SPIN_TIME_MS,\n        );\n        stepValue(e, direction);\n      }, internalState.current.spinDelay);\n    }\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (!internalState.current.previousTextValue) {\n      internalState.current.previousTextValue = textValue ?? String(currentValue);\n    }\n    const newValue = e.target.value;\n    setTextValue(newValue);\n  };\n\n  const handleIncrementMouseDown = (e: React.MouseEvent<HTMLButtonElement>) => {\n    internalState.current.spinState = 'up';\n    stepValue(e, 'up');\n  };\n\n  const handleDecrementMouseDown = (e: React.MouseEvent<HTMLButtonElement>) => {\n    internalState.current.spinState = 'down';\n    stepValue(e, 'down');\n  };\n\n  const handleStepMouseUpOrLeave = (e: React.MouseEvent<HTMLButtonElement>) => {\n    clearStepTimeout();\n    internalState.current.spinState = 'rest';\n    internalState.current.spinDelay = DEFAULT_SPIN_DELAY_MS;\n    internalState.current.spinTime = 0;\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    commit(e, currentValue, textValue);\n    internalState.current.previousTextValue = undefined;\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    let nextKeyboardSpinState: SpinButtonSpinState = 'rest';\n\n    if (e.key === ArrowUp) {\n      stepValue(e, 'up', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === ArrowDown) {\n      stepValue(e, 'down', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (e.key === PageUp) {\n      e.preventDefault();\n      stepValue(e, 'upPage', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === PageDown) {\n      e.preventDefault();\n      stepValue(e, 'downPage', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === Home && min !== undefined) {\n      commit(e, min);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === End && max !== undefined) {\n      commit(e, max);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Enter) {\n      commit(e, currentValue, textValue);\n      internalState.current.previousTextValue = undefined;\n    } else if (e.key === Escape) {\n      if (internalState.current.previousTextValue) {\n        setTextValue(undefined);\n        internalState.current.previousTextValue = undefined;\n      }\n    }\n\n    if (keyboardSpinState !== nextKeyboardSpinState) {\n      setKeyboardSpinState(nextKeyboardSpinState);\n    }\n  };\n\n  const handleKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (keyboardSpinState !== 'rest') {\n      setKeyboardSpinState('rest');\n      internalState.current.spinState = 'rest';\n    }\n  };\n\n  const commit = (e: SpinButtonChangeEvent, newValue?: number | null, newDisplayValue?: string) => {\n    const valueChanged = newValue !== undefined && currentValue !== newValue;\n    const displayValueChanged =\n      newDisplayValue !== undefined &&\n      internalState.current.previousTextValue !== undefined &&\n      internalState.current.previousTextValue !== newDisplayValue;\n\n    let roundedValue;\n    if (valueChanged) {\n      roundedValue = precisionRound(newValue!, precision);\n      setCurrentValue(roundedValue);\n    } else if (displayValueChanged && !isControlled) {\n      const nextValue = parseFloat(newDisplayValue as string);\n      if (!isNaN(nextValue)) {\n        setCurrentValue(precisionRound(nextValue, precision));\n      }\n    }\n\n    if (valueChanged || displayValueChanged) {\n      onChange?.(e, { value: roundedValue, displayValue: newDisplayValue });\n    }\n\n    setTextValue(undefined);\n  };\n\n  const state: SpinButtonState = {\n    size,\n    appearance,\n    spinState: keyboardSpinState,\n    atBound: internalState.current.atBound,\n\n    components: {\n      root: 'span',\n      input: 'input',\n      incrementButton: 'button',\n      decrementButton: 'button',\n    },\n    root: resolveShorthand(root, {\n      required: true,\n      defaultProps: nativeProps.root,\n    }),\n    input: resolveShorthand(input, {\n      required: true,\n      defaultProps: {\n        ref,\n        autoComplete: 'off',\n        role: 'spinbutton',\n        appearance,\n        type: 'text',\n        ...nativeProps.primary,\n      },\n    }),\n    incrementButton: resolveShorthand(incrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: <ChevronUp16Regular />,\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Increment value',\n        type: 'button',\n      },\n    }),\n    decrementButton: resolveShorthand(decrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: <ChevronDown16Regular />,\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Decrement value',\n        type: 'button',\n      },\n    }),\n  };\n\n  let valueToDisplay;\n  if (textValue !== undefined) {\n    valueToDisplay = textValue;\n  } else if (value === null || currentValue === null) {\n    valueToDisplay = displayValue ?? '';\n    internalState.current.value = null;\n    internalState.current.atBound = 'none';\n  } else {\n    const roundedValue = precisionRound(currentValue, precision);\n    internalState.current.value = roundedValue;\n    internalState.current.atBound = getBound(roundedValue, min, max);\n    if (isControlled) {\n      valueToDisplay = displayValue ?? String(roundedValue);\n    } else {\n      valueToDisplay = String(roundedValue);\n    }\n  }\n\n  state.input.value = valueToDisplay;\n  state.input['aria-valuemin'] = min;\n  state.input['aria-valuemax'] = max;\n  state.input['aria-valuenow'] = currentValue ?? undefined;\n  state.input['aria-valuetext'] = state.input['aria-valuetext'] ?? ((value !== undefined && displayValue) || undefined);\n  state.input.onChange = mergeCallbacks(state.input.onChange, handleInputChange);\n  state.input.onBlur = mergeCallbacks(state.input.onBlur, handleBlur);\n  state.input.onKeyDown = mergeCallbacks(state.input.onKeyDown, handleKeyDown);\n  state.input.onKeyUp = mergeCallbacks(state.input.onKeyUp, handleKeyUp);\n\n  state.incrementButton.onMouseDown = mergeCallbacks(handleIncrementMouseDown, state.incrementButton.onMouseDown);\n  state.incrementButton.onMouseUp = mergeCallbacks(state.incrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.incrementButton.onMouseLeave = mergeCallbacks(state.incrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n\n  state.decrementButton.onMouseDown = mergeCallbacks(handleDecrementMouseDown, state.decrementButton.onMouseDown);\n  state.decrementButton.onMouseUp = mergeCallbacks(state.decrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.decrementButton.onMouseLeave = mergeCallbacks(state.decrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n\n  return state;\n};\n"],"mappings":"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"}
+{"version":3,"names":["React","useFieldControlProps_unstable","getPartitionedNativeProps","mergeCallbacks","resolveShorthand","useControllableState","useTimeout","ArrowUp","ArrowDown","End","Enter","Escape","Home","PageDown","PageUp","calculatePrecision","precisionRound","getBound","clamp","ChevronUp16Regular","ChevronDown16Regular","useOverrides_unstable","useOverrides","DEFAULT_SPIN_DELAY_MS","MIN_SPIN_DELAY_MS","MAX_SPIN_TIME_MS","lerp","start","end","percent","useSpinButton_unstable","props","ref","supportsLabelFor","supportsRequired","nativeProps","primarySlotTagName","excludedPropNames","overrides","_overrides_inputDefaultAppearance","value","displayValue","defaultValue","min","max","step","stepPage","precision","precisionFromProps","onChange","size","appearance","inputDefaultAppearance","root","input","incrementButton","decrementButton","useMemo","Math","currentValue","setCurrentValue","state","defaultState","initialState","isControlled","undefined","textValue","setTextValue","useState","keyboardSpinState","setKeyboardSpinState","internalState","useRef","spinState","spinTime","spinDelay","atBound","setStepTimeout","clearStepTimeout","stepValue","e","direction","startFrom","startValue","current","num","parseFloat","isNaN","val","dir","stepSize","stepStart","nullStep","commit","newValue","Number","handleInputChange","previousTextValue","String","target","handleIncrementMouseDown","handleDecrementMouseDown","handleStepMouseUpOrLeave","handleBlur","handleKeyDown","nextKeyboardSpinState","key","preventDefault","shiftKey","handleKeyUp","newDisplayValue","valueChanged","displayValueChanged","roundedValue","nextValue","components","required","defaultProps","autoComplete","role","type","primary","tabIndex","children","createElement","disabled","valueToDisplay","_state_input_ariavaluetext","onBlur","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave"],"sources":["../../../src/components/SpinButton/useSpinButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport {\n  getPartitionedNativeProps,\n  mergeCallbacks,\n  resolveShorthand,\n  useControllableState,\n  useTimeout,\n} from '@fluentui/react-utilities';\nimport { ArrowUp, ArrowDown, End, Enter, Escape, Home, PageDown, PageUp } from '@fluentui/keyboard-keys';\nimport {\n  SpinButtonProps,\n  SpinButtonState,\n  SpinButtonSpinState,\n  SpinButtonChangeEvent,\n  SpinButtonBounds,\n} from './SpinButton.types';\nimport { calculatePrecision, precisionRound, getBound, clamp } from '../../utils/index';\nimport { ChevronUp16Regular, ChevronDown16Regular } from '@fluentui/react-icons';\nimport { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\n\ntype InternalState = {\n  value: number | null;\n  spinState: SpinButtonSpinState;\n  spinTime: number;\n  spinDelay: number;\n  previousTextValue?: string;\n  atBound: SpinButtonBounds;\n};\n\nconst DEFAULT_SPIN_DELAY_MS = 150;\nconst MIN_SPIN_DELAY_MS = 80;\nconst MAX_SPIN_TIME_MS = 1000;\n\n// This is here to give an ease for the mouse held down case.\n// Exact easing it to be defined. Once it is we'll likely\n// pull this out into a util function in the SpinButton package.\nconst lerp = (start: number, end: number, percent: number): number => start + (end - start) * percent;\n\n/**\n * Create the state required to render SpinButton.\n *\n * The returned state can be modified with hooks such as useSpinButtonStyles_unstable,\n * before being passed to renderSpinButton_unstable.\n *\n * @param props - props from this instance of SpinButton\n * @param ref - reference to root HTMLElement of SpinButton\n */\nexport const useSpinButton_unstable = (props: SpinButtonProps, ref: React.Ref<HTMLInputElement>): SpinButtonState => {\n  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'input',\n    excludedPropNames: ['defaultValue', 'max', 'min', 'onChange', 'size', 'value'],\n  });\n\n  const overrides = useOverrides();\n\n  const {\n    value,\n    displayValue,\n    defaultValue,\n    min,\n    max,\n    step = 1,\n    stepPage = 1,\n    precision: precisionFromProps,\n    onChange,\n    size = 'medium',\n    appearance = overrides.inputDefaultAppearance ?? 'outline',\n    root,\n    input,\n    incrementButton,\n    decrementButton,\n  } = props;\n\n  const precision = React.useMemo(() => {\n    return precisionFromProps ?? Math.max(calculatePrecision(step), 0);\n  }, [precisionFromProps, step]);\n\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: value,\n    defaultState: defaultValue,\n    initialState: 0,\n  });\n\n  const isControlled = value !== undefined;\n\n  const [textValue, setTextValue] = React.useState<string | undefined>(undefined);\n  const [keyboardSpinState, setKeyboardSpinState] = React.useState<SpinButtonSpinState>('rest');\n\n  const internalState = React.useRef<InternalState>({\n    value: currentValue,\n    spinState: 'rest',\n    spinTime: 0,\n    spinDelay: DEFAULT_SPIN_DELAY_MS,\n    atBound: currentValue !== null ? getBound(precisionRound(currentValue, precision), min, max) : 'none',\n  });\n\n  const [setStepTimeout, clearStepTimeout] = useTimeout();\n\n  const stepValue = (\n    e: SpinButtonChangeEvent,\n    direction: 'up' | 'down' | 'upPage' | 'downPage',\n    startFrom?: string,\n  ) => {\n    let startValue = internalState.current.value;\n    if (startFrom) {\n      const num = parseFloat(startFrom);\n      if (!isNaN(num)) {\n        startValue = num;\n      }\n    }\n    const val = startValue;\n    const dir = direction === 'up' || direction === 'upPage' ? 1 : -1;\n    const stepSize = direction === 'upPage' || direction === 'downPage' ? stepPage : step;\n\n    if (val === null) {\n      const stepStart = min === undefined ? 0 : min;\n      const nullStep = clamp(stepStart + stepSize * dir, min, max);\n      commit(e, nullStep);\n      return;\n    }\n\n    let newValue = val + stepSize * dir;\n    if (!Number.isNaN(newValue)) {\n      newValue = clamp(newValue, min, max);\n    }\n\n    commit(e, newValue);\n\n    if (internalState.current.spinState !== 'rest') {\n      setStepTimeout(() => {\n        // Ease the step speed a bit\n        internalState.current.spinTime += internalState.current.spinDelay;\n        internalState.current.spinDelay = lerp(\n          DEFAULT_SPIN_DELAY_MS,\n          MIN_SPIN_DELAY_MS,\n          internalState.current.spinTime / MAX_SPIN_TIME_MS,\n        );\n        stepValue(e, direction);\n      }, internalState.current.spinDelay);\n    }\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (!internalState.current.previousTextValue) {\n      internalState.current.previousTextValue = textValue ?? String(currentValue);\n    }\n    const newValue = e.target.value;\n    setTextValue(newValue);\n  };\n\n  const handleIncrementMouseDown = (e: React.MouseEvent<HTMLButtonElement>) => {\n    internalState.current.spinState = 'up';\n    stepValue(e, 'up');\n  };\n\n  const handleDecrementMouseDown = (e: React.MouseEvent<HTMLButtonElement>) => {\n    internalState.current.spinState = 'down';\n    stepValue(e, 'down');\n  };\n\n  const handleStepMouseUpOrLeave = (e: React.MouseEvent<HTMLButtonElement>) => {\n    clearStepTimeout();\n    internalState.current.spinState = 'rest';\n    internalState.current.spinDelay = DEFAULT_SPIN_DELAY_MS;\n    internalState.current.spinTime = 0;\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    commit(e, currentValue, textValue);\n    internalState.current.previousTextValue = undefined;\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    let nextKeyboardSpinState: SpinButtonSpinState = 'rest';\n\n    if (e.key === ArrowUp) {\n      stepValue(e, 'up', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === ArrowDown) {\n      stepValue(e, 'down', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (e.key === PageUp) {\n      e.preventDefault();\n      stepValue(e, 'upPage', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === PageDown) {\n      e.preventDefault();\n      stepValue(e, 'downPage', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === Home && min !== undefined) {\n      commit(e, min);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === End && max !== undefined) {\n      commit(e, max);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Enter) {\n      commit(e, currentValue, textValue);\n      internalState.current.previousTextValue = undefined;\n    } else if (e.key === Escape) {\n      if (internalState.current.previousTextValue) {\n        setTextValue(undefined);\n        internalState.current.previousTextValue = undefined;\n      }\n    }\n\n    if (keyboardSpinState !== nextKeyboardSpinState) {\n      setKeyboardSpinState(nextKeyboardSpinState);\n    }\n  };\n\n  const handleKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (keyboardSpinState !== 'rest') {\n      setKeyboardSpinState('rest');\n      internalState.current.spinState = 'rest';\n    }\n  };\n\n  const commit = (e: SpinButtonChangeEvent, newValue?: number | null, newDisplayValue?: string) => {\n    const valueChanged = newValue !== undefined && currentValue !== newValue;\n    const displayValueChanged =\n      newDisplayValue !== undefined &&\n      internalState.current.previousTextValue !== undefined &&\n      internalState.current.previousTextValue !== newDisplayValue;\n\n    let roundedValue;\n    if (valueChanged) {\n      roundedValue = precisionRound(newValue!, precision);\n      setCurrentValue(roundedValue);\n    } else if (displayValueChanged && !isControlled) {\n      const nextValue = parseFloat(newDisplayValue as string);\n      if (!isNaN(nextValue)) {\n        setCurrentValue(precisionRound(nextValue, precision));\n      }\n    }\n\n    if (valueChanged || displayValueChanged) {\n      onChange?.(e, { value: roundedValue, displayValue: newDisplayValue });\n    }\n\n    setTextValue(undefined);\n  };\n\n  const state: SpinButtonState = {\n    size,\n    appearance,\n    spinState: keyboardSpinState,\n    atBound: internalState.current.atBound,\n\n    components: {\n      root: 'span',\n      input: 'input',\n      incrementButton: 'button',\n      decrementButton: 'button',\n    },\n    root: resolveShorthand(root, {\n      required: true,\n      defaultProps: nativeProps.root,\n    }),\n    input: resolveShorthand(input, {\n      required: true,\n      defaultProps: {\n        ref,\n        autoComplete: 'off',\n        role: 'spinbutton',\n        appearance,\n        type: 'text',\n        ...nativeProps.primary,\n      },\n    }),\n    incrementButton: resolveShorthand(incrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: <ChevronUp16Regular />,\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Increment value',\n        type: 'button',\n      },\n    }),\n    decrementButton: resolveShorthand(decrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: <ChevronDown16Regular />,\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Decrement value',\n        type: 'button',\n      },\n    }),\n  };\n\n  let valueToDisplay;\n  if (textValue !== undefined) {\n    valueToDisplay = textValue;\n  } else if (value === null || currentValue === null) {\n    valueToDisplay = displayValue ?? '';\n    internalState.current.value = null;\n    internalState.current.atBound = 'none';\n  } else {\n    const roundedValue = precisionRound(currentValue, precision);\n    internalState.current.value = roundedValue;\n    internalState.current.atBound = getBound(roundedValue, min, max);\n    if (isControlled) {\n      valueToDisplay = displayValue ?? String(roundedValue);\n    } else {\n      valueToDisplay = String(roundedValue);\n    }\n  }\n\n  state.input.value = valueToDisplay;\n  state.input['aria-valuemin'] = min;\n  state.input['aria-valuemax'] = max;\n  state.input['aria-valuenow'] = currentValue ?? undefined;\n  state.input['aria-valuetext'] = state.input['aria-valuetext'] ?? ((value !== undefined && displayValue) || undefined);\n  state.input.onChange = mergeCallbacks(state.input.onChange, handleInputChange);\n  state.input.onBlur = mergeCallbacks(state.input.onBlur, handleBlur);\n  state.input.onKeyDown = mergeCallbacks(state.input.onKeyDown, handleKeyDown);\n  state.input.onKeyUp = mergeCallbacks(state.input.onKeyUp, handleKeyUp);\n\n  state.incrementButton.onMouseDown = mergeCallbacks(handleIncrementMouseDown, state.incrementButton.onMouseDown);\n  state.incrementButton.onMouseUp = mergeCallbacks(state.incrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.incrementButton.onMouseLeave = mergeCallbacks(state.incrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n\n  state.decrementButton.onMouseDown = mergeCallbacks(handleDecrementMouseDown, state.decrementButton.onMouseDown);\n  state.decrementButton.onMouseUp = mergeCallbacks(state.decrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.decrementButton.onMouseLeave = mergeCallbacks(state.decrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n\n  return state;\n};\n"],"mappings":"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"}

package/lib/components/SpinButton/useSpinButtonStyles.js

@@ -111,7 +111,7 @@ const useRootStyles = /*#__PURE__*/__styles({
     m: "(forced-colors: active)"
   }]]
 });
-const useInputClassName = /*#__PURE__*/__resetStyles("rekhnij", null, [".rekhnij{grid-column-start:1;grid-column-end:2;grid-row-start:1;grid-row-end:3;outline-style:none;border:0;padding:0;color:var(--colorNeutralForeground1);background-color:transparent;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;}", ".rekhnij::-webkit-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}", ".rekhnij::-moz-placeholder{color:var(--colorNeutralForeground4);opacity:1;}", ".rekhnij:-ms-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}", ".rekhnij::placeholder{color:var(--colorNeutralForeground4);opacity:1;}"]);
+const useInputClassName = /*#__PURE__*/__resetStyles("r1ljrqje", null, [".r1ljrqje{grid-column-start:1;grid-column-end:2;grid-row-start:1;grid-row-end:3;outline-style:none;border:0;padding:0;color:var(--colorNeutralForeground1);background-color:transparent;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;width:100%;}", ".r1ljrqje::-webkit-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}", ".r1ljrqje::-moz-placeholder{color:var(--colorNeutralForeground4);opacity:1;}", ".r1ljrqje:-ms-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}", ".r1ljrqje::placeholder{color:var(--colorNeutralForeground4);opacity:1;}"]);
 const useInputStyles = /*#__PURE__*/__styles({
   disabled: {
     sj55zd: "f1s2aq7o",

package/lib/components/SpinButton/useSpinButtonStyles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","typographyStyles","spinButtonClassNames","root","input","incrementButton","decrementButton","spinButtonExtraClassNames","buttonActive","fieldHeights","small","medium","useRootClassName","useRootStyles","sshi5w","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","uwmqm3","outline","outlineInteractive","Bo3r8zu","Hpvxnh","Bx11ytk","B1rg0w0","Bsg1tlv","Brjw370","xcfy85","Bcc6kan","underline","B0qfbqy","B4f6apu","y0oebl","uvfttm","Budzafs","r59vdv","n07z76","ck0cow","underlineInteractive","B3778ie","d9w3h3","Bl18szs","B4j8arr","filled","Bdkvgpv","m598lv","qa3bma","Bbv0w2i","Bq4z7u6","Bk5zm6e","Bqjgrrk","Bm6vgfq","De3pzq","filledInteractive","B05mzqr","tb9y6h","jcehpj","B23o0hn","invalid","emecyz","lz0pba","Bo1k74p","Ba322q7","disabled","Bceei9c","Cffpyd","hxi8he","Bcuq369","Imo2if","d","h","a","m","useInputClassName","useInputStyles","sj55zd","yvdlaj","useBaseButtonClassName","useButtonStyles","increment","Ijaq50","B7oj6ja","z8tnut","Byoj8tv","decrement","Bbmb7ep","incrementButtonSmall","z189sj","Bqenvij","decrementButtonSmall","r4wkhp","B95qlz1","p743kt","B7xitij","B6siaa6","Ba9qmo4","Dyrjrp","drw0cw","idzz8t","useButtonDisabledStyles","base","eoavqd","useSpinButtonStyles_unstable","state","appearance","atBound","spinState","size","startsWith","rootStyles","buttonStyles","buttonDisabledStyles","inputStyles","className"],"sources":["../../../src/components/SpinButton/useSpinButtonStyles.ts"],"sourcesContent":["import { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SpinButtonSlots, SpinButtonState } from './SpinButton.types';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const spinButtonClassNames: SlotClassNames<SpinButtonSlots> = {\n  root: 'fui-SpinButton',\n  input: 'fui-SpinButton__input',\n  incrementButton: 'fui-SpinButton__incrementButton',\n  decrementButton: 'fui-SpinButton__decrementButton',\n};\n\nconst spinButtonExtraClassNames = {\n  buttonActive: 'fui-SpinButton__button_active',\n};\n\nconst fieldHeights = {\n  small: '24px',\n  medium: '32px',\n};\n\nconst useRootClassName = makeResetStyles({\n  display: 'inline-grid',\n  gridTemplateColumns: `1fr 24px`,\n  gridTemplateRows: '1fr 1fr',\n  columnGap: tokens.spacingHorizontalXS,\n  rowGap: 0,\n  position: 'relative',\n  isolation: 'isolate',\n\n  backgroundColor: tokens.colorNeutralBackground1,\n  minHeight: fieldHeights.medium,\n  padding: `0 0 0 ${tokens.spacingHorizontalMNudge}`,\n  borderRadius: tokens.borderRadiusMedium,\n\n  // Apply border styles on the ::before pseudo element.\n  // We cannot use ::after since that is used for selection.\n  // Using the pseudo element allows us to place the border\n  // above content in the component which ensures the buttons\n  // line up visually with the border as expected. Without this\n  // there is a bit of a gap which can become very noticeable\n  // at high zoom or when OS zoom levels are not divisible by 2\n  // (e.g., 150% on Windows in Firefox)\n  // This is most noticeable on the \"outline\" appearance which is\n  // also the default so it feels worth the extra ceremony to get right.\n  '::before': {\n    content: '\"\"',\n    boxSizing: 'border-box',\n    position: 'absolute',\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0,\n    pointerEvents: 'none',\n    zIndex: 10,\n    border: `1px solid ${tokens.colorNeutralStroke1}`,\n    borderBottomColor: tokens.colorNeutralStrokeAccessible,\n    borderRadius: tokens.borderRadiusMedium,\n  },\n\n  '::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    right: 0,\n    bottom: 0,\n    left: 0,\n    zIndex: 20,\n\n    // Maintaining the correct corner radius:\n    // Use the whole border-radius as the height and only put radii on the bottom corners.\n    // (Otherwise the radius would be automatically reduced to fit available space.)\n    // max() ensures the focus border still shows up even if someone sets tokens.borderRadiusMedium to 0.\n    height: `max(2px, ${tokens.borderRadiusMedium})`,\n    borderBottomLeftRadius: tokens.borderRadiusMedium,\n    borderBottomRightRadius: tokens.borderRadiusMedium,\n\n    // Flat 2px border:\n    // By default borderBottom will cause little \"horns\" on the ends. The clipPath trims them off.\n    // (This could be done without trimming using `background: linear-gradient(...)`, but using\n    // borderBottom makes it easier for people to override the color if needed.)\n    borderBottom: `2px solid ${tokens.colorCompoundBrandStroke}`,\n    clipPath: 'inset(calc(100% - 2px) 0 0 0)',\n\n    // Animation for focus OUT\n    transform: 'scaleX(0)',\n    transitionProperty: 'transform',\n    transitionDuration: tokens.durationUltraFast,\n    transitionDelay: tokens.curveAccelerateMid,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n      transitionDelay: '0.01ms',\n    },\n  },\n\n  ':focus-within::after': {\n    // Animation for focus IN\n    transform: 'scaleX(1)',\n    transitionProperty: 'transform',\n    transitionDuration: tokens.durationNormal,\n    transitionDelay: tokens.curveDecelerateMid,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n      transitionDelay: '0.01ms',\n    },\n  },\n  ':focus-within:active::after': {\n    // This is if the user clicks the field again while it's already focused\n    borderBottomColor: tokens.colorCompoundBrandStrokePressed,\n  },\n  ':focus-within': {\n    outline: '2px solid transparent',\n  },\n});\n\nconst useRootStyles = makeStyles({\n  small: {\n    minHeight: fieldHeights.small,\n    ...typographyStyles.caption1,\n    paddingLeft: tokens.spacingHorizontalS,\n  },\n\n  medium: {\n    // set by useRootClassName\n  },\n\n  outline: {\n    // set by useRootClassName\n  },\n\n  outlineInteractive: {\n    ':hover::before': {\n      ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n      borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n  },\n\n  underline: {\n    '::before': {\n      ...shorthands.borderWidth(0, 0, '1px', 0),\n      ...shorthands.borderRadius(tokens.borderRadiusNone), // corners look strange if rounded\n    },\n  },\n\n  underlineInteractive: {\n    ':hover::before': {\n      borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n    '::after': shorthands.borderRadius(tokens.borderRadiusNone), // remove rounded corners from focus underline\n  },\n\n  filled: {\n    '::before': {\n      ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n    },\n  },\n\n  'filled-darker': {\n    backgroundColor: tokens.colorNeutralBackground3,\n  },\n  'filled-lighter': {\n    backgroundColor: tokens.colorNeutralBackground1,\n  },\n\n  filledInteractive: {\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':hover,:focus-within': {\n      '::before': {\n        // also handles pressed border color (:active)\n        ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n      },\n    },\n  },\n\n  invalid: {\n    ':not(:focus-within),:hover:not(:focus-within)': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorPaletteRedBorder2),\n      },\n    },\n  },\n\n  disabled: {\n    cursor: 'not-allowed',\n    backgroundColor: tokens.colorTransparentBackground,\n    '::before': {\n      ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n\n      '@media (forced-colors: active)': {\n        ...shorthands.borderColor('GrayText'),\n      },\n    },\n  },\n});\n\nconst useInputClassName = makeResetStyles({\n  gridColumnStart: '1',\n  gridColumnEnd: '2',\n  gridRowStart: '1',\n  gridRowEnd: '3',\n  outlineStyle: 'none',\n  border: '0',\n  padding: '0',\n  color: tokens.colorNeutralForeground1,\n  // Use literal \"transparent\" (not from the theme) to always let the color from the root show through\n  backgroundColor: 'transparent',\n  fontFamily: 'inherit',\n  fontSize: 'inherit',\n  fontWeight: 'inherit',\n  lineHeight: 'inherit',\n\n  '::placeholder': {\n    color: tokens.colorNeutralForeground4,\n    opacity: 1, // browser style override\n  },\n});\n\nconst useInputStyles = makeStyles({\n  disabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n    cursor: 'not-allowed',\n    backgroundColor: tokens.colorTransparentBackground,\n    '::placeholder': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\nconst useBaseButtonClassName = makeResetStyles({\n  display: 'inline-flex',\n  width: '24px',\n  alignItems: 'center',\n  justifyContent: 'center',\n  border: '0',\n  position: 'absolute',\n\n  outlineStyle: 'none',\n  height: '16px',\n\n  // Use literal \"transparent\" (not from the theme) to always let the color from the root show through\n  backgroundColor: 'transparent',\n  color: tokens.colorNeutralForeground3,\n\n  // common button layout\n  gridColumnStart: '2',\n  borderRadius: '0',\n  padding: '0 5px 0 5px',\n\n  ':active': {\n    outlineStyle: 'none',\n  },\n\n  ':enabled': {\n    ':hover': {\n      cursor: 'pointer',\n      color: tokens.colorNeutralForeground3Hover,\n      backgroundColor: tokens.colorSubtleBackgroundHover,\n    },\n    ':active': {\n      color: tokens.colorNeutralForeground3Pressed,\n      backgroundColor: tokens.colorSubtleBackgroundPressed,\n    },\n    [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n      color: tokens.colorNeutralForeground3Pressed,\n      backgroundColor: tokens.colorSubtleBackgroundPressed,\n    },\n  },\n\n  ':disabled': {\n    cursor: 'not-allowed',\n    color: tokens.colorNeutralForegroundDisabled,\n  },\n});\n\nconst useButtonStyles = makeStyles({\n  increment: {\n    gridRowStart: '1',\n    borderTopRightRadius: tokens.borderRadiusMedium,\n    paddingTop: '4px',\n    paddingBottom: '1px',\n  },\n  decrement: {\n    gridRowStart: '2',\n    borderBottomRightRadius: tokens.borderRadiusMedium,\n    paddingTop: '1px',\n    paddingBottom: '4px',\n  },\n  // Padding values numbers don't align with design specs\n  // but visually the padding aligns.\n  // The icons are set in a 16x16px square but the artwork is inset from that\n  // so these padding values are computed by hand.\n  // Additionally the design uses fractional values so these are\n  // rounded to the nearest integer.\n  incrementButtonSmall: {\n    ...shorthands.padding('3px', '6px', '0px', '4px'),\n    height: '12px',\n  },\n\n  decrementButtonSmall: {\n    ...shorthands.padding('0px', '6px', '3px', '4px'),\n    height: '12px',\n  },\n\n  outline: {\n    // set by useButtonClassName\n  },\n\n  underline: {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorSubtleBackgroundHover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-darker': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground3Hover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-lighter': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground1Hover,\n      },\n      [`:active,&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground1Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\n// Cannot just disable button as they need to remain\n// exposed to ATs like screen readers.\nconst useButtonDisabledStyles = makeStyles({\n  base: {\n    cursor: 'not-allowed',\n\n    ':hover': {\n      cursor: 'not-allowed',\n    },\n  },\n\n  outline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  underline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-darker': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-lighter': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the SpinButton slots based on the state\n */\nexport const useSpinButtonStyles_unstable = (state: SpinButtonState): SpinButtonState => {\n  const { appearance, atBound, spinState, size } = state;\n  const disabled = state.input.disabled;\n  const invalid = `${state.input['aria-invalid']}` === 'true';\n  const filled = appearance.startsWith('filled');\n\n  const rootStyles = useRootStyles();\n  const buttonStyles = useButtonStyles();\n  const buttonDisabledStyles = useButtonDisabledStyles();\n  const inputStyles = useInputStyles();\n\n  state.root.className = mergeClasses(\n    spinButtonClassNames.root,\n    useRootClassName(),\n    rootStyles[size],\n    rootStyles[appearance],\n    filled && rootStyles.filled,\n    !disabled && appearance === 'outline' && rootStyles.outlineInteractive,\n    !disabled && appearance === 'underline' && rootStyles.underlineInteractive,\n    !disabled && filled && rootStyles.filledInteractive,\n    !disabled && invalid && rootStyles.invalid,\n    disabled && rootStyles.disabled,\n    state.root.className,\n  );\n\n  state.incrementButton.className = mergeClasses(\n    spinButtonClassNames.incrementButton,\n    spinState === 'up' && `${spinButtonExtraClassNames.buttonActive}`,\n    useBaseButtonClassName(),\n    buttonStyles.increment,\n    buttonStyles[appearance],\n    size === 'small' && buttonStyles.incrementButtonSmall,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.incrementButton.className,\n  );\n  state.decrementButton.className = mergeClasses(\n    spinButtonClassNames.decrementButton,\n    spinState === 'down' && `${spinButtonExtraClassNames.buttonActive}`,\n    useBaseButtonClassName(),\n    buttonStyles.decrement,\n    buttonStyles[appearance],\n    size === 'small' && buttonStyles.decrementButtonSmall,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.decrementButton.className,\n  );\n\n  state.input.className = mergeClasses(\n    spinButtonClassNames.input,\n    useInputClassName(),\n    disabled && inputStyles.disabled,\n    state.input.className,\n  );\n\n  return state;\n};\n"],"mappings":"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"}
+{"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","typographyStyles","spinButtonClassNames","root","input","incrementButton","decrementButton","spinButtonExtraClassNames","buttonActive","fieldHeights","small","medium","useRootClassName","useRootStyles","sshi5w","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","uwmqm3","outline","outlineInteractive","Bo3r8zu","Hpvxnh","Bx11ytk","B1rg0w0","Bsg1tlv","Brjw370","xcfy85","Bcc6kan","underline","B0qfbqy","B4f6apu","y0oebl","uvfttm","Budzafs","r59vdv","n07z76","ck0cow","underlineInteractive","B3778ie","d9w3h3","Bl18szs","B4j8arr","filled","Bdkvgpv","m598lv","qa3bma","Bbv0w2i","Bq4z7u6","Bk5zm6e","Bqjgrrk","Bm6vgfq","De3pzq","filledInteractive","B05mzqr","tb9y6h","jcehpj","B23o0hn","invalid","emecyz","lz0pba","Bo1k74p","Ba322q7","disabled","Bceei9c","Cffpyd","hxi8he","Bcuq369","Imo2if","d","h","a","m","useInputClassName","useInputStyles","sj55zd","yvdlaj","useBaseButtonClassName","useButtonStyles","increment","Ijaq50","B7oj6ja","z8tnut","Byoj8tv","decrement","Bbmb7ep","incrementButtonSmall","z189sj","Bqenvij","decrementButtonSmall","r4wkhp","B95qlz1","p743kt","B7xitij","B6siaa6","Ba9qmo4","Dyrjrp","drw0cw","idzz8t","useButtonDisabledStyles","base","eoavqd","useSpinButtonStyles_unstable","state","appearance","atBound","spinState","size","startsWith","rootStyles","buttonStyles","buttonDisabledStyles","inputStyles","className"],"sources":["../../../src/components/SpinButton/useSpinButtonStyles.ts"],"sourcesContent":["import { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SpinButtonSlots, SpinButtonState } from './SpinButton.types';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const spinButtonClassNames: SlotClassNames<SpinButtonSlots> = {\n  root: 'fui-SpinButton',\n  input: 'fui-SpinButton__input',\n  incrementButton: 'fui-SpinButton__incrementButton',\n  decrementButton: 'fui-SpinButton__decrementButton',\n};\n\nconst spinButtonExtraClassNames = {\n  buttonActive: 'fui-SpinButton__button_active',\n};\n\nconst fieldHeights = {\n  small: '24px',\n  medium: '32px',\n};\n\nconst useRootClassName = makeResetStyles({\n  display: 'inline-grid',\n  gridTemplateColumns: `1fr 24px`,\n  gridTemplateRows: '1fr 1fr',\n  columnGap: tokens.spacingHorizontalXS,\n  rowGap: 0,\n  position: 'relative',\n  isolation: 'isolate',\n\n  backgroundColor: tokens.colorNeutralBackground1,\n  minHeight: fieldHeights.medium,\n  padding: `0 0 0 ${tokens.spacingHorizontalMNudge}`,\n  borderRadius: tokens.borderRadiusMedium,\n\n  // Apply border styles on the ::before pseudo element.\n  // We cannot use ::after since that is used for selection.\n  // Using the pseudo element allows us to place the border\n  // above content in the component which ensures the buttons\n  // line up visually with the border as expected. Without this\n  // there is a bit of a gap which can become very noticeable\n  // at high zoom or when OS zoom levels are not divisible by 2\n  // (e.g., 150% on Windows in Firefox)\n  // This is most noticeable on the \"outline\" appearance which is\n  // also the default so it feels worth the extra ceremony to get right.\n  '::before': {\n    content: '\"\"',\n    boxSizing: 'border-box',\n    position: 'absolute',\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0,\n    pointerEvents: 'none',\n    zIndex: 10,\n    border: `1px solid ${tokens.colorNeutralStroke1}`,\n    borderBottomColor: tokens.colorNeutralStrokeAccessible,\n    borderRadius: tokens.borderRadiusMedium,\n  },\n\n  '::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    right: 0,\n    bottom: 0,\n    left: 0,\n    zIndex: 20,\n\n    // Maintaining the correct corner radius:\n    // Use the whole border-radius as the height and only put radii on the bottom corners.\n    // (Otherwise the radius would be automatically reduced to fit available space.)\n    // max() ensures the focus border still shows up even if someone sets tokens.borderRadiusMedium to 0.\n    height: `max(2px, ${tokens.borderRadiusMedium})`,\n    borderBottomLeftRadius: tokens.borderRadiusMedium,\n    borderBottomRightRadius: tokens.borderRadiusMedium,\n\n    // Flat 2px border:\n    // By default borderBottom will cause little \"horns\" on the ends. The clipPath trims them off.\n    // (This could be done without trimming using `background: linear-gradient(...)`, but using\n    // borderBottom makes it easier for people to override the color if needed.)\n    borderBottom: `2px solid ${tokens.colorCompoundBrandStroke}`,\n    clipPath: 'inset(calc(100% - 2px) 0 0 0)',\n\n    // Animation for focus OUT\n    transform: 'scaleX(0)',\n    transitionProperty: 'transform',\n    transitionDuration: tokens.durationUltraFast,\n    transitionDelay: tokens.curveAccelerateMid,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n      transitionDelay: '0.01ms',\n    },\n  },\n\n  ':focus-within::after': {\n    // Animation for focus IN\n    transform: 'scaleX(1)',\n    transitionProperty: 'transform',\n    transitionDuration: tokens.durationNormal,\n    transitionDelay: tokens.curveDecelerateMid,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n      transitionDelay: '0.01ms',\n    },\n  },\n  ':focus-within:active::after': {\n    // This is if the user clicks the field again while it's already focused\n    borderBottomColor: tokens.colorCompoundBrandStrokePressed,\n  },\n  ':focus-within': {\n    outline: '2px solid transparent',\n  },\n});\n\nconst useRootStyles = makeStyles({\n  small: {\n    minHeight: fieldHeights.small,\n    ...typographyStyles.caption1,\n    paddingLeft: tokens.spacingHorizontalS,\n  },\n\n  medium: {\n    // set by useRootClassName\n  },\n\n  outline: {\n    // set by useRootClassName\n  },\n\n  outlineInteractive: {\n    ':hover::before': {\n      ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n      borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n  },\n\n  underline: {\n    '::before': {\n      ...shorthands.borderWidth(0, 0, '1px', 0),\n      ...shorthands.borderRadius(tokens.borderRadiusNone), // corners look strange if rounded\n    },\n  },\n\n  underlineInteractive: {\n    ':hover::before': {\n      borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n    '::after': shorthands.borderRadius(tokens.borderRadiusNone), // remove rounded corners from focus underline\n  },\n\n  filled: {\n    '::before': {\n      ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n    },\n  },\n\n  'filled-darker': {\n    backgroundColor: tokens.colorNeutralBackground3,\n  },\n  'filled-lighter': {\n    backgroundColor: tokens.colorNeutralBackground1,\n  },\n\n  filledInteractive: {\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':hover,:focus-within': {\n      '::before': {\n        // also handles pressed border color (:active)\n        ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n      },\n    },\n  },\n\n  invalid: {\n    ':not(:focus-within),:hover:not(:focus-within)': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorPaletteRedBorder2),\n      },\n    },\n  },\n\n  disabled: {\n    cursor: 'not-allowed',\n    backgroundColor: tokens.colorTransparentBackground,\n    '::before': {\n      ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n\n      '@media (forced-colors: active)': {\n        ...shorthands.borderColor('GrayText'),\n      },\n    },\n  },\n});\n\nconst useInputClassName = makeResetStyles({\n  gridColumnStart: '1',\n  gridColumnEnd: '2',\n  gridRowStart: '1',\n  gridRowEnd: '3',\n  outlineStyle: 'none',\n  border: '0',\n  padding: '0',\n  color: tokens.colorNeutralForeground1,\n  // Use literal \"transparent\" (not from the theme) to always let the color from the root show through\n  backgroundColor: 'transparent',\n  fontFamily: 'inherit',\n  fontSize: 'inherit',\n  fontWeight: 'inherit',\n  lineHeight: 'inherit',\n  width: '100%',\n\n  '::placeholder': {\n    color: tokens.colorNeutralForeground4,\n    opacity: 1, // browser style override\n  },\n});\n\nconst useInputStyles = makeStyles({\n  disabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n    cursor: 'not-allowed',\n    backgroundColor: tokens.colorTransparentBackground,\n    '::placeholder': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\nconst useBaseButtonClassName = makeResetStyles({\n  display: 'inline-flex',\n  width: '24px',\n  alignItems: 'center',\n  justifyContent: 'center',\n  border: '0',\n  position: 'absolute',\n\n  outlineStyle: 'none',\n  height: '16px',\n\n  // Use literal \"transparent\" (not from the theme) to always let the color from the root show through\n  backgroundColor: 'transparent',\n  color: tokens.colorNeutralForeground3,\n\n  // common button layout\n  gridColumnStart: '2',\n  borderRadius: '0',\n  padding: '0 5px 0 5px',\n\n  ':active': {\n    outlineStyle: 'none',\n  },\n\n  ':enabled': {\n    ':hover': {\n      cursor: 'pointer',\n      color: tokens.colorNeutralForeground3Hover,\n      backgroundColor: tokens.colorSubtleBackgroundHover,\n    },\n    ':active': {\n      color: tokens.colorNeutralForeground3Pressed,\n      backgroundColor: tokens.colorSubtleBackgroundPressed,\n    },\n    [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n      color: tokens.colorNeutralForeground3Pressed,\n      backgroundColor: tokens.colorSubtleBackgroundPressed,\n    },\n  },\n\n  ':disabled': {\n    cursor: 'not-allowed',\n    color: tokens.colorNeutralForegroundDisabled,\n  },\n});\n\nconst useButtonStyles = makeStyles({\n  increment: {\n    gridRowStart: '1',\n    borderTopRightRadius: tokens.borderRadiusMedium,\n    paddingTop: '4px',\n    paddingBottom: '1px',\n  },\n  decrement: {\n    gridRowStart: '2',\n    borderBottomRightRadius: tokens.borderRadiusMedium,\n    paddingTop: '1px',\n    paddingBottom: '4px',\n  },\n  // Padding values numbers don't align with design specs\n  // but visually the padding aligns.\n  // The icons are set in a 16x16px square but the artwork is inset from that\n  // so these padding values are computed by hand.\n  // Additionally the design uses fractional values so these are\n  // rounded to the nearest integer.\n  incrementButtonSmall: {\n    ...shorthands.padding('3px', '6px', '0px', '4px'),\n    height: '12px',\n  },\n\n  decrementButtonSmall: {\n    ...shorthands.padding('0px', '6px', '3px', '4px'),\n    height: '12px',\n  },\n\n  outline: {\n    // set by useButtonClassName\n  },\n\n  underline: {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorSubtleBackgroundHover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-darker': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground3Hover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-lighter': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground1Hover,\n      },\n      [`:active,&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground1Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\n// Cannot just disable button as they need to remain\n// exposed to ATs like screen readers.\nconst useButtonDisabledStyles = makeStyles({\n  base: {\n    cursor: 'not-allowed',\n\n    ':hover': {\n      cursor: 'not-allowed',\n    },\n  },\n\n  outline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  underline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-darker': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-lighter': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the SpinButton slots based on the state\n */\nexport const useSpinButtonStyles_unstable = (state: SpinButtonState): SpinButtonState => {\n  const { appearance, atBound, spinState, size } = state;\n  const disabled = state.input.disabled;\n  const invalid = `${state.input['aria-invalid']}` === 'true';\n  const filled = appearance.startsWith('filled');\n\n  const rootStyles = useRootStyles();\n  const buttonStyles = useButtonStyles();\n  const buttonDisabledStyles = useButtonDisabledStyles();\n  const inputStyles = useInputStyles();\n\n  state.root.className = mergeClasses(\n    spinButtonClassNames.root,\n    useRootClassName(),\n    rootStyles[size],\n    rootStyles[appearance],\n    filled && rootStyles.filled,\n    !disabled && appearance === 'outline' && rootStyles.outlineInteractive,\n    !disabled && appearance === 'underline' && rootStyles.underlineInteractive,\n    !disabled && filled && rootStyles.filledInteractive,\n    !disabled && invalid && rootStyles.invalid,\n    disabled && rootStyles.disabled,\n    state.root.className,\n  );\n\n  state.incrementButton.className = mergeClasses(\n    spinButtonClassNames.incrementButton,\n    spinState === 'up' && `${spinButtonExtraClassNames.buttonActive}`,\n    useBaseButtonClassName(),\n    buttonStyles.increment,\n    buttonStyles[appearance],\n    size === 'small' && buttonStyles.incrementButtonSmall,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.incrementButton.className,\n  );\n  state.decrementButton.className = mergeClasses(\n    spinButtonClassNames.decrementButton,\n    spinState === 'down' && `${spinButtonExtraClassNames.buttonActive}`,\n    useBaseButtonClassName(),\n    buttonStyles.decrement,\n    buttonStyles[appearance],\n    size === 'small' && buttonStyles.decrementButtonSmall,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.decrementButton.className,\n  );\n\n  state.input.className = mergeClasses(\n    spinButtonClassNames.input,\n    useInputClassName(),\n    disabled && inputStyles.disabled,\n    state.input.className,\n  );\n\n  return state;\n};\n"],"mappings":"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"}

package/lib-commonjs/components/SpinButton/useSpinButton.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "useSpinButton_unstable", {
 });
 const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactField = require("@fluentui/react-field");
 const _reactUtilities = require("@fluentui/react-utilities");
 const _keyboardKeys = require("@fluentui/keyboard-keys");
 const _index = require("../../utils/index");
@@ -21,6 +22,11 @@ const MAX_SPIN_TIME_MS = 1000;
 // pull this out into a util function in the SpinButton package.
 const lerp = (start, end, percent)=>start + (end - start) * percent;
 const useSpinButton_unstable = (props, ref)=>{
+    // Merge props from surrounding <Field>, if any
+    props = (0, _reactField.useFieldControlProps_unstable)(props, {
+        supportsLabelFor: true,
+        supportsRequired: true
+    });
     const nativeProps = (0, _reactUtilities.getPartitionedNativeProps)({
         props,
         primarySlotTagName: 'input',

package/lib-commonjs/components/SpinButton/useSpinButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/SpinButton/useSpinButton.js"],"sourcesContent":["import * as React from 'react';\nimport { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useControllableState, useTimeout } from '@fluentui/react-utilities';\nimport { ArrowUp, ArrowDown, End, Enter, Escape, Home, PageDown, PageUp } from '@fluentui/keyboard-keys';\nimport { calculatePrecision, precisionRound, getBound, clamp } from '../../utils/index';\nimport { ChevronUp16Regular, ChevronDown16Regular } from '@fluentui/react-icons';\nimport { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\nconst DEFAULT_SPIN_DELAY_MS = 150;\nconst MIN_SPIN_DELAY_MS = 80;\nconst MAX_SPIN_TIME_MS = 1000;\n// This is here to give an ease for the mouse held down case.\n// Exact easing it to be defined. Once it is we'll likely\n// pull this out into a util function in the SpinButton package.\nconst lerp = (start, end, percent) => start + (end - start) * percent;\n/**\n * Create the state required to render SpinButton.\n *\n * The returned state can be modified with hooks such as useSpinButtonStyles_unstable,\n * before being passed to renderSpinButton_unstable.\n *\n * @param props - props from this instance of SpinButton\n * @param ref - reference to root HTMLElement of SpinButton\n */\nexport const useSpinButton_unstable = (props, ref) => {\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'input',\n    excludedPropNames: ['defaultValue', 'max', 'min', 'onChange', 'size', 'value']\n  });\n  const overrides = useOverrides();\n  var _overrides_inputDefaultAppearance;\n  const {\n    value,\n    displayValue,\n    defaultValue,\n    min,\n    max,\n    step = 1,\n    stepPage = 1,\n    precision: precisionFromProps,\n    onChange,\n    size = 'medium',\n    appearance = (_overrides_inputDefaultAppearance = overrides.inputDefaultAppearance) !== null && _overrides_inputDefaultAppearance !== void 0 ? _overrides_inputDefaultAppearance : 'outline',\n    root,\n    input,\n    incrementButton,\n    decrementButton\n  } = props;\n  const precision = React.useMemo(() => {\n    return precisionFromProps !== null && precisionFromProps !== void 0 ? precisionFromProps : Math.max(calculatePrecision(step), 0);\n  }, [precisionFromProps, step]);\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: value,\n    defaultState: defaultValue,\n    initialState: 0\n  });\n  const isControlled = value !== undefined;\n  const [textValue, setTextValue] = React.useState(undefined);\n  const [keyboardSpinState, setKeyboardSpinState] = React.useState('rest');\n  const internalState = React.useRef({\n    value: currentValue,\n    spinState: 'rest',\n    spinTime: 0,\n    spinDelay: DEFAULT_SPIN_DELAY_MS,\n    atBound: currentValue !== null ? getBound(precisionRound(currentValue, precision), min, max) : 'none'\n  });\n  const [setStepTimeout, clearStepTimeout] = useTimeout();\n  const stepValue = (e, direction, startFrom) => {\n    let startValue = internalState.current.value;\n    if (startFrom) {\n      const num = parseFloat(startFrom);\n      if (!isNaN(num)) {\n        startValue = num;\n      }\n    }\n    const val = startValue;\n    const dir = direction === 'up' || direction === 'upPage' ? 1 : -1;\n    const stepSize = direction === 'upPage' || direction === 'downPage' ? stepPage : step;\n    if (val === null) {\n      const stepStart = min === undefined ? 0 : min;\n      const nullStep = clamp(stepStart + stepSize * dir, min, max);\n      commit(e, nullStep);\n      return;\n    }\n    let newValue = val + stepSize * dir;\n    if (!Number.isNaN(newValue)) {\n      newValue = clamp(newValue, min, max);\n    }\n    commit(e, newValue);\n    if (internalState.current.spinState !== 'rest') {\n      setStepTimeout(() => {\n        // Ease the step speed a bit\n        internalState.current.spinTime += internalState.current.spinDelay;\n        internalState.current.spinDelay = lerp(DEFAULT_SPIN_DELAY_MS, MIN_SPIN_DELAY_MS, internalState.current.spinTime / MAX_SPIN_TIME_MS);\n        stepValue(e, direction);\n      }, internalState.current.spinDelay);\n    }\n  };\n  const handleInputChange = e => {\n    if (!internalState.current.previousTextValue) {\n      internalState.current.previousTextValue = textValue !== null && textValue !== void 0 ? textValue : String(currentValue);\n    }\n    const newValue = e.target.value;\n    setTextValue(newValue);\n  };\n  const handleIncrementMouseDown = e => {\n    internalState.current.spinState = 'up';\n    stepValue(e, 'up');\n  };\n  const handleDecrementMouseDown = e => {\n    internalState.current.spinState = 'down';\n    stepValue(e, 'down');\n  };\n  const handleStepMouseUpOrLeave = e => {\n    clearStepTimeout();\n    internalState.current.spinState = 'rest';\n    internalState.current.spinDelay = DEFAULT_SPIN_DELAY_MS;\n    internalState.current.spinTime = 0;\n  };\n  const handleBlur = e => {\n    commit(e, currentValue, textValue);\n    internalState.current.previousTextValue = undefined;\n  };\n  const handleKeyDown = e => {\n    let nextKeyboardSpinState = 'rest';\n    if (e.key === ArrowUp) {\n      stepValue(e, 'up', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === ArrowDown) {\n      stepValue(e, 'down', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (e.key === PageUp) {\n      e.preventDefault();\n      stepValue(e, 'upPage', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === PageDown) {\n      e.preventDefault();\n      stepValue(e, 'downPage', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === Home && min !== undefined) {\n      commit(e, min);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === End && max !== undefined) {\n      commit(e, max);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Enter) {\n      commit(e, currentValue, textValue);\n      internalState.current.previousTextValue = undefined;\n    } else if (e.key === Escape) {\n      if (internalState.current.previousTextValue) {\n        setTextValue(undefined);\n        internalState.current.previousTextValue = undefined;\n      }\n    }\n    if (keyboardSpinState !== nextKeyboardSpinState) {\n      setKeyboardSpinState(nextKeyboardSpinState);\n    }\n  };\n  const handleKeyUp = e => {\n    if (keyboardSpinState !== 'rest') {\n      setKeyboardSpinState('rest');\n      internalState.current.spinState = 'rest';\n    }\n  };\n  const commit = (e, newValue, newDisplayValue) => {\n    const valueChanged = newValue !== undefined && currentValue !== newValue;\n    const displayValueChanged = newDisplayValue !== undefined && internalState.current.previousTextValue !== undefined && internalState.current.previousTextValue !== newDisplayValue;\n    let roundedValue;\n    if (valueChanged) {\n      roundedValue = precisionRound(newValue, precision);\n      setCurrentValue(roundedValue);\n    } else if (displayValueChanged && !isControlled) {\n      const nextValue = parseFloat(newDisplayValue);\n      if (!isNaN(nextValue)) {\n        setCurrentValue(precisionRound(nextValue, precision));\n      }\n    }\n    if (valueChanged || displayValueChanged) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(e, {\n        value: roundedValue,\n        displayValue: newDisplayValue\n      });\n    }\n    setTextValue(undefined);\n  };\n  const state = {\n    size,\n    appearance,\n    spinState: keyboardSpinState,\n    atBound: internalState.current.atBound,\n    components: {\n      root: 'span',\n      input: 'input',\n      incrementButton: 'button',\n      decrementButton: 'button'\n    },\n    root: resolveShorthand(root, {\n      required: true,\n      defaultProps: nativeProps.root\n    }),\n    input: resolveShorthand(input, {\n      required: true,\n      defaultProps: {\n        ref,\n        autoComplete: 'off',\n        role: 'spinbutton',\n        appearance,\n        type: 'text',\n        ...nativeProps.primary\n      }\n    }),\n    incrementButton: resolveShorthand(incrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: /*#__PURE__*/React.createElement(ChevronUp16Regular, null),\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Increment value',\n        type: 'button'\n      }\n    }),\n    decrementButton: resolveShorthand(decrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: /*#__PURE__*/React.createElement(ChevronDown16Regular, null),\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Decrement value',\n        type: 'button'\n      }\n    })\n  };\n  let valueToDisplay;\n  if (textValue !== undefined) {\n    valueToDisplay = textValue;\n  } else if (value === null || currentValue === null) {\n    valueToDisplay = displayValue !== null && displayValue !== void 0 ? displayValue : '';\n    internalState.current.value = null;\n    internalState.current.atBound = 'none';\n  } else {\n    const roundedValue = precisionRound(currentValue, precision);\n    internalState.current.value = roundedValue;\n    internalState.current.atBound = getBound(roundedValue, min, max);\n    if (isControlled) {\n      valueToDisplay = displayValue !== null && displayValue !== void 0 ? displayValue : String(roundedValue);\n    } else {\n      valueToDisplay = String(roundedValue);\n    }\n  }\n  state.input.value = valueToDisplay;\n  state.input['aria-valuemin'] = min;\n  state.input['aria-valuemax'] = max;\n  state.input['aria-valuenow'] = currentValue !== null && currentValue !== void 0 ? currentValue : undefined;\n  var _state_input_ariavaluetext;\n  state.input['aria-valuetext'] = (_state_input_ariavaluetext = state.input['aria-valuetext']) !== null && _state_input_ariavaluetext !== void 0 ? _state_input_ariavaluetext : value !== undefined && displayValue || undefined;\n  state.input.onChange = mergeCallbacks(state.input.onChange, handleInputChange);\n  state.input.onBlur = mergeCallbacks(state.input.onBlur, handleBlur);\n  state.input.onKeyDown = mergeCallbacks(state.input.onKeyDown, handleKeyDown);\n  state.input.onKeyUp = mergeCallbacks(state.input.onKeyUp, handleKeyUp);\n  state.incrementButton.onMouseDown = mergeCallbacks(handleIncrementMouseDown, state.incrementButton.onMouseDown);\n  state.incrementButton.onMouseUp = mergeCallbacks(state.incrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.incrementButton.onMouseLeave = mergeCallbacks(state.incrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n  state.decrementButton.onMouseDown = mergeCallbacks(handleDecrementMouseDown, state.decrementButton.onMouseDown);\n  state.decrementButton.onMouseUp = mergeCallbacks(state.decrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.decrementButton.onMouseLeave = mergeCallbacks(state.decrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n  return state;\n};\n//# sourceMappingURL=useSpinButton.js.map"],"names":["useSpinButton_unstable","DEFAULT_SPIN_DELAY_MS","MIN_SPIN_DELAY_MS","MAX_SPIN_TIME_MS","lerp","start","end","percent","props","ref","nativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","overrides","useOverrides","_overrides_inputDefaultAppearance","value","displayValue","defaultValue","min","max","step","stepPage","precision","precisionFromProps","onChange","size","appearance","inputDefaultAppearance","root","input","incrementButton","decrementButton","React","useMemo","Math","calculatePrecision","currentValue","setCurrentValue","useControllableState","state","defaultState","initialState","isControlled","undefined","textValue","setTextValue","useState","keyboardSpinState","setKeyboardSpinState","internalState","useRef","spinState","spinTime","spinDelay","atBound","getBound","precisionRound","setStepTimeout","clearStepTimeout","useTimeout","stepValue","e","direction","startFrom","startValue","current","num","parseFloat","isNaN","val","dir","stepSize","stepStart","nullStep","clamp","commit","newValue","Number","handleInputChange","previousTextValue","String","target","handleIncrementMouseDown","handleDecrementMouseDown","handleStepMouseUpOrLeave","handleBlur","handleKeyDown","nextKeyboardSpinState","key","ArrowUp","ArrowDown","PageUp","preventDefault","PageDown","shiftKey","Home","End","Enter","Escape","handleKeyUp","newDisplayValue","valueChanged","displayValueChanged","roundedValue","nextValue","components","resolveShorthand","required","defaultProps","autoComplete","role","type","primary","tabIndex","children","createElement","ChevronUp16Regular","disabled","ChevronDown16Regular","valueToDisplay","_state_input_ariavaluetext","mergeCallbacks","onBlur","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave"],"mappings":"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"}
+{"version":3,"sources":["../../../lib/components/SpinButton/useSpinButton.js"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useControllableState, useTimeout } from '@fluentui/react-utilities';\nimport { ArrowUp, ArrowDown, End, Enter, Escape, Home, PageDown, PageUp } from '@fluentui/keyboard-keys';\nimport { calculatePrecision, precisionRound, getBound, clamp } from '../../utils/index';\nimport { ChevronUp16Regular, ChevronDown16Regular } from '@fluentui/react-icons';\nimport { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\nconst DEFAULT_SPIN_DELAY_MS = 150;\nconst MIN_SPIN_DELAY_MS = 80;\nconst MAX_SPIN_TIME_MS = 1000;\n// This is here to give an ease for the mouse held down case.\n// Exact easing it to be defined. Once it is we'll likely\n// pull this out into a util function in the SpinButton package.\nconst lerp = (start, end, percent) => start + (end - start) * percent;\n/**\n * Create the state required to render SpinButton.\n *\n * The returned state can be modified with hooks such as useSpinButtonStyles_unstable,\n * before being passed to renderSpinButton_unstable.\n *\n * @param props - props from this instance of SpinButton\n * @param ref - reference to root HTMLElement of SpinButton\n */\nexport const useSpinButton_unstable = (props, ref) => {\n  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, {\n    supportsLabelFor: true,\n    supportsRequired: true\n  });\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'input',\n    excludedPropNames: ['defaultValue', 'max', 'min', 'onChange', 'size', 'value']\n  });\n  const overrides = useOverrides();\n  var _overrides_inputDefaultAppearance;\n  const {\n    value,\n    displayValue,\n    defaultValue,\n    min,\n    max,\n    step = 1,\n    stepPage = 1,\n    precision: precisionFromProps,\n    onChange,\n    size = 'medium',\n    appearance = (_overrides_inputDefaultAppearance = overrides.inputDefaultAppearance) !== null && _overrides_inputDefaultAppearance !== void 0 ? _overrides_inputDefaultAppearance : 'outline',\n    root,\n    input,\n    incrementButton,\n    decrementButton\n  } = props;\n  const precision = React.useMemo(() => {\n    return precisionFromProps !== null && precisionFromProps !== void 0 ? precisionFromProps : Math.max(calculatePrecision(step), 0);\n  }, [precisionFromProps, step]);\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: value,\n    defaultState: defaultValue,\n    initialState: 0\n  });\n  const isControlled = value !== undefined;\n  const [textValue, setTextValue] = React.useState(undefined);\n  const [keyboardSpinState, setKeyboardSpinState] = React.useState('rest');\n  const internalState = React.useRef({\n    value: currentValue,\n    spinState: 'rest',\n    spinTime: 0,\n    spinDelay: DEFAULT_SPIN_DELAY_MS,\n    atBound: currentValue !== null ? getBound(precisionRound(currentValue, precision), min, max) : 'none'\n  });\n  const [setStepTimeout, clearStepTimeout] = useTimeout();\n  const stepValue = (e, direction, startFrom) => {\n    let startValue = internalState.current.value;\n    if (startFrom) {\n      const num = parseFloat(startFrom);\n      if (!isNaN(num)) {\n        startValue = num;\n      }\n    }\n    const val = startValue;\n    const dir = direction === 'up' || direction === 'upPage' ? 1 : -1;\n    const stepSize = direction === 'upPage' || direction === 'downPage' ? stepPage : step;\n    if (val === null) {\n      const stepStart = min === undefined ? 0 : min;\n      const nullStep = clamp(stepStart + stepSize * dir, min, max);\n      commit(e, nullStep);\n      return;\n    }\n    let newValue = val + stepSize * dir;\n    if (!Number.isNaN(newValue)) {\n      newValue = clamp(newValue, min, max);\n    }\n    commit(e, newValue);\n    if (internalState.current.spinState !== 'rest') {\n      setStepTimeout(() => {\n        // Ease the step speed a bit\n        internalState.current.spinTime += internalState.current.spinDelay;\n        internalState.current.spinDelay = lerp(DEFAULT_SPIN_DELAY_MS, MIN_SPIN_DELAY_MS, internalState.current.spinTime / MAX_SPIN_TIME_MS);\n        stepValue(e, direction);\n      }, internalState.current.spinDelay);\n    }\n  };\n  const handleInputChange = e => {\n    if (!internalState.current.previousTextValue) {\n      internalState.current.previousTextValue = textValue !== null && textValue !== void 0 ? textValue : String(currentValue);\n    }\n    const newValue = e.target.value;\n    setTextValue(newValue);\n  };\n  const handleIncrementMouseDown = e => {\n    internalState.current.spinState = 'up';\n    stepValue(e, 'up');\n  };\n  const handleDecrementMouseDown = e => {\n    internalState.current.spinState = 'down';\n    stepValue(e, 'down');\n  };\n  const handleStepMouseUpOrLeave = e => {\n    clearStepTimeout();\n    internalState.current.spinState = 'rest';\n    internalState.current.spinDelay = DEFAULT_SPIN_DELAY_MS;\n    internalState.current.spinTime = 0;\n  };\n  const handleBlur = e => {\n    commit(e, currentValue, textValue);\n    internalState.current.previousTextValue = undefined;\n  };\n  const handleKeyDown = e => {\n    let nextKeyboardSpinState = 'rest';\n    if (e.key === ArrowUp) {\n      stepValue(e, 'up', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === ArrowDown) {\n      stepValue(e, 'down', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (e.key === PageUp) {\n      e.preventDefault();\n      stepValue(e, 'upPage', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === PageDown) {\n      e.preventDefault();\n      stepValue(e, 'downPage', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === Home && min !== undefined) {\n      commit(e, min);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === End && max !== undefined) {\n      commit(e, max);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Enter) {\n      commit(e, currentValue, textValue);\n      internalState.current.previousTextValue = undefined;\n    } else if (e.key === Escape) {\n      if (internalState.current.previousTextValue) {\n        setTextValue(undefined);\n        internalState.current.previousTextValue = undefined;\n      }\n    }\n    if (keyboardSpinState !== nextKeyboardSpinState) {\n      setKeyboardSpinState(nextKeyboardSpinState);\n    }\n  };\n  const handleKeyUp = e => {\n    if (keyboardSpinState !== 'rest') {\n      setKeyboardSpinState('rest');\n      internalState.current.spinState = 'rest';\n    }\n  };\n  const commit = (e, newValue, newDisplayValue) => {\n    const valueChanged = newValue !== undefined && currentValue !== newValue;\n    const displayValueChanged = newDisplayValue !== undefined && internalState.current.previousTextValue !== undefined && internalState.current.previousTextValue !== newDisplayValue;\n    let roundedValue;\n    if (valueChanged) {\n      roundedValue = precisionRound(newValue, precision);\n      setCurrentValue(roundedValue);\n    } else if (displayValueChanged && !isControlled) {\n      const nextValue = parseFloat(newDisplayValue);\n      if (!isNaN(nextValue)) {\n        setCurrentValue(precisionRound(nextValue, precision));\n      }\n    }\n    if (valueChanged || displayValueChanged) {\n      onChange === null || onChange === void 0 ? void 0 : onChange(e, {\n        value: roundedValue,\n        displayValue: newDisplayValue\n      });\n    }\n    setTextValue(undefined);\n  };\n  const state = {\n    size,\n    appearance,\n    spinState: keyboardSpinState,\n    atBound: internalState.current.atBound,\n    components: {\n      root: 'span',\n      input: 'input',\n      incrementButton: 'button',\n      decrementButton: 'button'\n    },\n    root: resolveShorthand(root, {\n      required: true,\n      defaultProps: nativeProps.root\n    }),\n    input: resolveShorthand(input, {\n      required: true,\n      defaultProps: {\n        ref,\n        autoComplete: 'off',\n        role: 'spinbutton',\n        appearance,\n        type: 'text',\n        ...nativeProps.primary\n      }\n    }),\n    incrementButton: resolveShorthand(incrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: /*#__PURE__*/React.createElement(ChevronUp16Regular, null),\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Increment value',\n        type: 'button'\n      }\n    }),\n    decrementButton: resolveShorthand(decrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: /*#__PURE__*/React.createElement(ChevronDown16Regular, null),\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Decrement value',\n        type: 'button'\n      }\n    })\n  };\n  let valueToDisplay;\n  if (textValue !== undefined) {\n    valueToDisplay = textValue;\n  } else if (value === null || currentValue === null) {\n    valueToDisplay = displayValue !== null && displayValue !== void 0 ? displayValue : '';\n    internalState.current.value = null;\n    internalState.current.atBound = 'none';\n  } else {\n    const roundedValue = precisionRound(currentValue, precision);\n    internalState.current.value = roundedValue;\n    internalState.current.atBound = getBound(roundedValue, min, max);\n    if (isControlled) {\n      valueToDisplay = displayValue !== null && displayValue !== void 0 ? displayValue : String(roundedValue);\n    } else {\n      valueToDisplay = String(roundedValue);\n    }\n  }\n  state.input.value = valueToDisplay;\n  state.input['aria-valuemin'] = min;\n  state.input['aria-valuemax'] = max;\n  state.input['aria-valuenow'] = currentValue !== null && currentValue !== void 0 ? currentValue : undefined;\n  var _state_input_ariavaluetext;\n  state.input['aria-valuetext'] = (_state_input_ariavaluetext = state.input['aria-valuetext']) !== null && _state_input_ariavaluetext !== void 0 ? _state_input_ariavaluetext : value !== undefined && displayValue || undefined;\n  state.input.onChange = mergeCallbacks(state.input.onChange, handleInputChange);\n  state.input.onBlur = mergeCallbacks(state.input.onBlur, handleBlur);\n  state.input.onKeyDown = mergeCallbacks(state.input.onKeyDown, handleKeyDown);\n  state.input.onKeyUp = mergeCallbacks(state.input.onKeyUp, handleKeyUp);\n  state.incrementButton.onMouseDown = mergeCallbacks(handleIncrementMouseDown, state.incrementButton.onMouseDown);\n  state.incrementButton.onMouseUp = mergeCallbacks(state.incrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.incrementButton.onMouseLeave = mergeCallbacks(state.incrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n  state.decrementButton.onMouseDown = mergeCallbacks(handleDecrementMouseDown, state.decrementButton.onMouseDown);\n  state.decrementButton.onMouseUp = mergeCallbacks(state.decrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.decrementButton.onMouseLeave = mergeCallbacks(state.decrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n  return state;\n};\n//# sourceMappingURL=useSpinButton.js.map"],"names":["useSpinButton_unstable","DEFAULT_SPIN_DELAY_MS","MIN_SPIN_DELAY_MS","MAX_SPIN_TIME_MS","lerp","start","end","percent","props","ref","useFieldControlProps_unstable","supportsLabelFor","supportsRequired","nativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","overrides","useOverrides","_overrides_inputDefaultAppearance","value","displayValue","defaultValue","min","max","step","stepPage","precision","precisionFromProps","onChange","size","appearance","inputDefaultAppearance","root","input","incrementButton","decrementButton","React","useMemo","Math","calculatePrecision","currentValue","setCurrentValue","useControllableState","state","defaultState","initialState","isControlled","undefined","textValue","setTextValue","useState","keyboardSpinState","setKeyboardSpinState","internalState","useRef","spinState","spinTime","spinDelay","atBound","getBound","precisionRound","setStepTimeout","clearStepTimeout","useTimeout","stepValue","e","direction","startFrom","startValue","current","num","parseFloat","isNaN","val","dir","stepSize","stepStart","nullStep","clamp","commit","newValue","Number","handleInputChange","previousTextValue","String","target","handleIncrementMouseDown","handleDecrementMouseDown","handleStepMouseUpOrLeave","handleBlur","handleKeyDown","nextKeyboardSpinState","key","ArrowUp","ArrowDown","PageUp","preventDefault","PageDown","shiftKey","Home","End","Enter","Escape","handleKeyUp","newDisplayValue","valueChanged","displayValueChanged","roundedValue","nextValue","components","resolveShorthand","required","defaultProps","autoComplete","role","type","primary","tabIndex","children","createElement","ChevronUp16Regular","disabled","ChevronDown16Regular","valueToDisplay","_state_input_ariavaluetext","mergeCallbacks","onBlur","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave"],"mappings":"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"}

package/lib-commonjs/components/SpinButton/useSpinButtonStyles.js

@@ -302,12 +302,12 @@ const useRootStyles = /*#__PURE__*/ (0, _react["__styles"])({
         ]
     ]
 });
-const useInputClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("rekhnij", null, [
-    ".rekhnij{grid-column-start:1;grid-column-end:2;grid-row-start:1;grid-row-end:3;outline-style:none;border:0;padding:0;color:var(--colorNeutralForeground1);background-color:transparent;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;}",
-    ".rekhnij::-webkit-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}",
-    ".rekhnij::-moz-placeholder{color:var(--colorNeutralForeground4);opacity:1;}",
-    ".rekhnij:-ms-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}",
-    ".rekhnij::placeholder{color:var(--colorNeutralForeground4);opacity:1;}"
+const useInputClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("r1ljrqje", null, [
+    ".r1ljrqje{grid-column-start:1;grid-column-end:2;grid-row-start:1;grid-row-end:3;outline-style:none;border:0;padding:0;color:var(--colorNeutralForeground1);background-color:transparent;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;width:100%;}",
+    ".r1ljrqje::-webkit-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}",
+    ".r1ljrqje::-moz-placeholder{color:var(--colorNeutralForeground4);opacity:1;}",
+    ".r1ljrqje:-ms-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}",
+    ".r1ljrqje::placeholder{color:var(--colorNeutralForeground4);opacity:1;}"
 ]);
 const useInputStyles = /*#__PURE__*/ (0, _react["__styles"])({
     disabled: {

package/lib-commonjs/components/SpinButton/useSpinButtonStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/SpinButton/useSpinButtonStyles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const spinButtonClassNames = {\n  root: 'fui-SpinButton',\n  input: 'fui-SpinButton__input',\n  incrementButton: 'fui-SpinButton__incrementButton',\n  decrementButton: 'fui-SpinButton__decrementButton'\n};\nconst spinButtonExtraClassNames = {\n  buttonActive: 'fui-SpinButton__button_active'\n};\nconst fieldHeights = {\n  small: '24px',\n  medium: '32px'\n};\nconst useRootClassName = /*#__PURE__*/__resetStyles(\"rkqmps4\", \"r1trw52p\", [\".rkqmps4{display:inline-grid;grid-template-columns:1fr 24px;grid-template-rows:1fr 1fr;-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);row-gap:0;position:relative;isolation:isolate;background-color:var(--colorNeutralBackground1);min-height:32px;padding:0 0 0 var(--spacingHorizontalMNudge);border-radius:var(--borderRadiusMedium);}\", \".rkqmps4::before{content:\\\"\\\";box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:10;border:1px solid var(--colorNeutralStroke1);border-bottom-color:var(--colorNeutralStrokeAccessible);border-radius:var(--borderRadiusMedium);}\", \".rkqmps4::after{box-sizing:border-box;content:\\\"\\\";position:absolute;right:0;bottom:0;left:0;z-index:20;height:max(2px, var(--borderRadiusMedium));border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-bottom:2px solid var(--colorCompoundBrandStroke);-webkit-clip-path:inset(calc(100% - 2px) 0 0 0);clip-path:inset(calc(100% - 2px) 0 0 0);-webkit-transform:scaleX(0);-moz-transform:scaleX(0);-ms-transform:scaleX(0);transform:scaleX(0);transition-property:transform;transition-duration:var(--durationUltraFast);transition-delay:var(--curveAccelerateMid);}\", \"@media screen and (prefers-reduced-motion: reduce){.rkqmps4::after{transition-duration:0.01ms;transition-delay:0.01ms;}}\", \".rkqmps4:focus-within::after{-webkit-transform:scaleX(1);-moz-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);transition-property:transform;transition-duration:var(--durationNormal);transition-delay:var(--curveDecelerateMid);}\", \"@media screen and (prefers-reduced-motion: reduce){.rkqmps4:focus-within::after{transition-duration:0.01ms;transition-delay:0.01ms;}}\", \".rkqmps4:focus-within:active::after{border-bottom-color:var(--colorCompoundBrandStrokePressed);}\", \".rkqmps4:focus-within{outline:2px solid transparent;}\", \".r1trw52p{display:inline-grid;grid-template-columns:1fr 24px;grid-template-rows:1fr 1fr;-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);row-gap:0;position:relative;isolation:isolate;background-color:var(--colorNeutralBackground1);min-height:32px;padding:0 var(--spacingHorizontalMNudge) 0 0;border-radius:var(--borderRadiusMedium);}\", \".r1trw52p::before{content:\\\"\\\";box-sizing:border-box;position:absolute;top:0;left:0;bottom:0;right:0;pointer-events:none;z-index:10;border:1px solid var(--colorNeutralStroke1);border-bottom-color:var(--colorNeutralStrokeAccessible);border-radius:var(--borderRadiusMedium);}\", \".r1trw52p::after{box-sizing:border-box;content:\\\"\\\";position:absolute;left:0;bottom:0;right:0;z-index:20;height:max(2px, var(--borderRadiusMedium));border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-bottom:2px solid var(--colorCompoundBrandStroke);-webkit-clip-path:inset(calc(100% - 2px) 0 0 0);clip-path:inset(calc(100% - 2px) 0 0 0);-webkit-transform:scaleX(0);-moz-transform:scaleX(0);-ms-transform:scaleX(0);transform:scaleX(0);transition-property:transform;transition-duration:var(--durationUltraFast);transition-delay:var(--curveAccelerateMid);}\", \"@media screen and (prefers-reduced-motion: reduce){.r1trw52p::after{transition-duration:0.01ms;transition-delay:0.01ms;}}\", \".r1trw52p:focus-within::after{-webkit-transform:scaleX(1);-moz-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);transition-property:transform;transition-duration:var(--durationNormal);transition-delay:var(--curveDecelerateMid);}\", \"@media screen and (prefers-reduced-motion: reduce){.r1trw52p:focus-within::after{transition-duration:0.01ms;transition-delay:0.01ms;}}\", \".r1trw52p:focus-within:active::after{border-bottom-color:var(--colorCompoundBrandStrokePressed);}\", \".r1trw52p:focus-within{outline:2px solid transparent;}\"]);\nconst useRootStyles = /*#__PURE__*/__styles({\n  small: {\n    sshi5w: \"f1pha7fy\",\n    Bahqtrf: \"fk6fouc\",\n    Be2twd7: \"fy9rknc\",\n    Bhrd7zp: \"figsok6\",\n    Bg96gwp: \"fwrc4pm\",\n    uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"]\n  },\n  medium: {},\n  outline: {},\n  outlineInteractive: {\n    Bo3r8zu: \"f1w2y1rc\",\n    Hpvxnh: [\"f1gofhvl\", \"f18htlvq\"],\n    Bx11ytk: \"ffcnd28\",\n    B1rg0w0: [\"f18htlvq\", \"f1gofhvl\"],\n    Bsg1tlv: \"f6lmxco\",\n    Brjw370: [\"fcoc0mf\", \"f15r4wkl\"],\n    xcfy85: \"f1ipdth8\",\n    Bcc6kan: [\"f15r4wkl\", \"fcoc0mf\"]\n  },\n  underline: {\n    B0qfbqy: \"f1o236ok\",\n    B4f6apu: [\"faeg28l\", \"f64aojp\"],\n    y0oebl: \"fdw6hkg\",\n    uvfttm: [\"f64aojp\", \"faeg28l\"],\n    Budzafs: [\"f1vk4jnx\", \"f1v3v894\"],\n    r59vdv: [\"f1v3v894\", \"f1vk4jnx\"],\n    n07z76: [\"fzi2j54\", \"f1un0uoc\"],\n    ck0cow: [\"f1un0uoc\", \"fzi2j54\"]\n  },\n  underlineInteractive: {\n    Bx11ytk: \"ffcnd28\",\n    xcfy85: \"f1ipdth8\",\n    B3778ie: [\"f9pmbr4\", \"ffh3ws5\"],\n    d9w3h3: [\"ffh3ws5\", \"f9pmbr4\"],\n    Bl18szs: [\"f19438ov\", \"f1i9y5j\"],\n    B4j8arr: [\"f1i9y5j\", \"f19438ov\"]\n  },\n  filled: {\n    B0qfbqy: \"f1fjh9ub\",\n    B4f6apu: [\"ff9c942\", \"f6rdg5o\"],\n    y0oebl: \"fdw6hkg\",\n    uvfttm: [\"f6rdg5o\", \"ff9c942\"],\n    Bdkvgpv: \"f163fonl\",\n    m598lv: [\"f1yq6w5o\", \"f1jpmc5p\"],\n    qa3bma: \"f11yjt3y\",\n    Bbv0w2i: [\"f1jpmc5p\", \"f1yq6w5o\"],\n    Bq4z7u6: \"f7dgwnz\",\n    Bk5zm6e: [\"f1edeodt\", \"fszsv3f\"],\n    Bqjgrrk: \"f1172wan\",\n    Bm6vgfq: [\"fszsv3f\", \"f1edeodt\"]\n  },\n  \"filled-darker\": {\n    De3pzq: \"f16xq7d1\"\n  },\n  \"filled-lighter\": {\n    De3pzq: \"fxugw4r\"\n  },\n  filledInteractive: {\n    B05mzqr: \"f1xqt08\",\n    tb9y6h: [\"fzt5lgo\", \"f8tv3r9\"],\n    jcehpj: \"fyhrops\",\n    B23o0hn: [\"f8tv3r9\", \"fzt5lgo\"]\n  },\n  invalid: {\n    emecyz: \"fl48pg9\",\n    lz0pba: [\"f1a168p3\", \"f1pvdymy\"],\n    Bo1k74p: \"f11knvgl\",\n    Ba322q7: [\"f1pvdymy\", \"f1a168p3\"]\n  },\n  disabled: {\n    Bceei9c: \"fdrzuqr\",\n    De3pzq: \"f1c21dwh\",\n    Bq4z7u6: \"f1a0lfh7\",\n    Bk5zm6e: [\"f1p2ejm6\", \"fmzytvz\"],\n    Bqjgrrk: \"fas2e61\",\n    Bm6vgfq: [\"fmzytvz\", \"f1p2ejm6\"],\n    Cffpyd: \"flb8es4\",\n    hxi8he: [\"f1lclws\", \"frjp63v\"],\n    Bcuq369: \"f1yv9wnt\",\n    Imo2if: [\"frjp63v\", \"f1lclws\"]\n  }\n}, {\n  d: [\".f1pha7fy{min-height:24px;}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1o236ok::before{border-top-width:0;}\", \".faeg28l::before{border-right-width:0;}\", \".f64aojp::before{border-left-width:0;}\", \".fdw6hkg::before{border-bottom-width:1px;}\", \".f1vk4jnx::before{border-bottom-right-radius:var(--borderRadiusNone);}\", \".f1v3v894::before{border-bottom-left-radius:var(--borderRadiusNone);}\", \".fzi2j54::before{border-top-right-radius:var(--borderRadiusNone);}\", \".f1un0uoc::before{border-top-left-radius:var(--borderRadiusNone);}\", \".f9pmbr4::after{border-bottom-right-radius:var(--borderRadiusNone);}\", \".ffh3ws5::after{border-bottom-left-radius:var(--borderRadiusNone);}\", \".f19438ov::after{border-top-right-radius:var(--borderRadiusNone);}\", \".f1i9y5j::after{border-top-left-radius:var(--borderRadiusNone);}\", \".f1fjh9ub::before{border-top-width:1px;}\", \".ff9c942::before{border-right-width:1px;}\", \".f6rdg5o::before{border-left-width:1px;}\", \".f163fonl::before{border-top-style:solid;}\", \".f1yq6w5o::before{border-right-style:solid;}\", \".f1jpmc5p::before{border-left-style:solid;}\", \".f11yjt3y::before{border-bottom-style:solid;}\", \".f7dgwnz::before{border-top-color:var(--colorTransparentStroke);}\", \".f1edeodt::before{border-right-color:var(--colorTransparentStroke);}\", \".fszsv3f::before{border-left-color:var(--colorTransparentStroke);}\", \".f1172wan::before{border-bottom-color:var(--colorTransparentStroke);}\", \".f16xq7d1{background-color:var(--colorNeutralBackground3);}\", \".fxugw4r{background-color:var(--colorNeutralBackground1);}\", \".fl48pg9:not(:focus-within)::before,.fl48pg9:hover:not(:focus-within)::before{border-top-color:var(--colorPaletteRedBorder2);}\", \".f1a168p3:not(:focus-within)::before,.f1a168p3:hover:not(:focus-within)::before{border-right-color:var(--colorPaletteRedBorder2);}\", \".f1pvdymy:not(:focus-within)::before,.f1pvdymy:hover:not(:focus-within)::before{border-left-color:var(--colorPaletteRedBorder2);}\", \".f11knvgl:not(:focus-within)::before,.f11knvgl:hover:not(:focus-within)::before{border-bottom-color:var(--colorPaletteRedBorder2);}\", \".fdrzuqr{cursor:not-allowed;}\", \".f1c21dwh{background-color:var(--colorTransparentBackground);}\", \".f1a0lfh7::before{border-top-color:var(--colorNeutralStrokeDisabled);}\", \".f1p2ejm6::before{border-right-color:var(--colorNeutralStrokeDisabled);}\", \".fmzytvz::before{border-left-color:var(--colorNeutralStrokeDisabled);}\", \".fas2e61::before{border-bottom-color:var(--colorNeutralStrokeDisabled);}\"],\n  h: [\".f1w2y1rc:hover::before{border-top-color:var(--colorNeutralStroke1Hover);}\", \".f1gofhvl:hover::before{border-right-color:var(--colorNeutralStroke1Hover);}\", \".f18htlvq:hover::before{border-left-color:var(--colorNeutralStroke1Hover);}\", \".ffcnd28:hover::before{border-bottom-color:var(--colorNeutralStrokeAccessibleHover);}\", \".f1xqt08:hover::before,.f1xqt08:focus-within::before{border-top-color:var(--colorTransparentStrokeInteractive);}\", \".fzt5lgo:hover::before,.fzt5lgo:focus-within::before{border-right-color:var(--colorTransparentStrokeInteractive);}\", \".f8tv3r9:hover::before,.f8tv3r9:focus-within::before{border-left-color:var(--colorTransparentStrokeInteractive);}\", \".fyhrops:hover::before,.fyhrops:focus-within::before{border-bottom-color:var(--colorTransparentStrokeInteractive);}\"],\n  a: [\".f6lmxco:active::before,.f6lmxco:focus-within::before{border-top-color:var(--colorNeutralStroke1Pressed);}\", \".fcoc0mf:active::before,.fcoc0mf:focus-within::before{border-right-color:var(--colorNeutralStroke1Pressed);}\", \".f15r4wkl:active::before,.f15r4wkl:focus-within::before{border-left-color:var(--colorNeutralStroke1Pressed);}\", \".f1ipdth8:active::before,.f1ipdth8:focus-within::before{border-bottom-color:var(--colorNeutralStrokeAccessiblePressed);}\"],\n  m: [[\"@media (forced-colors: active){.flb8es4::before{border-top-color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1lclws::before{border-right-color:GrayText;}.frjp63v::before{border-left-color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1yv9wnt::before{border-bottom-color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.frjp63v::before{border-left-color:GrayText;}.f1lclws::before{border-right-color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }]]\n});\nconst useInputClassName = /*#__PURE__*/__resetStyles(\"rekhnij\", null, [\".rekhnij{grid-column-start:1;grid-column-end:2;grid-row-start:1;grid-row-end:3;outline-style:none;border:0;padding:0;color:var(--colorNeutralForeground1);background-color:transparent;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;}\", \".rekhnij::-webkit-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}\", \".rekhnij::-moz-placeholder{color:var(--colorNeutralForeground4);opacity:1;}\", \".rekhnij:-ms-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}\", \".rekhnij::placeholder{color:var(--colorNeutralForeground4);opacity:1;}\"]);\nconst useInputStyles = /*#__PURE__*/__styles({\n  disabled: {\n    sj55zd: \"f1s2aq7o\",\n    Bceei9c: \"fdrzuqr\",\n    De3pzq: \"f1c21dwh\",\n    yvdlaj: \"fahhnxm\"\n  }\n}, {\n  d: [\".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}\", \".fdrzuqr{cursor:not-allowed;}\", \".f1c21dwh{background-color:var(--colorTransparentBackground);}\", \".fahhnxm::-webkit-input-placeholder{color:var(--colorNeutralForegroundDisabled);}\", \".fahhnxm::-moz-placeholder{color:var(--colorNeutralForegroundDisabled);}\"]\n});\nconst useBaseButtonClassName = /*#__PURE__*/__resetStyles(\"r1g4chgs\", null, [\".r1g4chgs{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:24px;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;border:0;position:absolute;outline-style:none;height:16px;background-color:transparent;color:var(--colorNeutralForeground3);grid-column-start:2;border-radius:0;padding:0 5px 0 5px;}\", \".r1g4chgs:active{outline-style:none;}\", \".r1g4chgs:enabled:hover{cursor:pointer;color:var(--colorNeutralForeground3Hover);background-color:var(--colorSubtleBackgroundHover);}\", \".r1g4chgs:enabled:active{color:var(--colorNeutralForeground3Pressed);background-color:var(--colorSubtleBackgroundPressed);}\", \".r1g4chgs:enabled.fui-SpinButton__button_active{color:var(--colorNeutralForeground3Pressed);background-color:var(--colorSubtleBackgroundPressed);}\", \".r1g4chgs:disabled{cursor:not-allowed;color:var(--colorNeutralForegroundDisabled);}\"]);\nconst useButtonStyles = /*#__PURE__*/__styles({\n  increment: {\n    Ijaq50: \"f16hsg94\",\n    B7oj6ja: [\"f1jar5jt\", \"fyu767a\"],\n    z8tnut: \"f10ra9hq\",\n    Byoj8tv: \"f1brlhvm\"\n  },\n  decrement: {\n    Ijaq50: \"faunodf\",\n    Bbmb7ep: [\"f1aa9q02\", \"f16jpd5f\"],\n    z8tnut: \"f1sl3k7w\",\n    Byoj8tv: \"f1y2xyjm\"\n  },\n  incrementButtonSmall: {\n    z8tnut: \"f1khb0e9\",\n    z189sj: [\"f1sgzk6v\", \"f1bg5zqg\"],\n    Byoj8tv: \"f1ov4xf1\",\n    uwmqm3: [\"fycuoez\", \"f8wuabp\"],\n    Bqenvij: \"fvblgha\"\n  },\n  decrementButtonSmall: {\n    z8tnut: \"f1nbblvp\",\n    z189sj: [\"f1sgzk6v\", \"f1bg5zqg\"],\n    Byoj8tv: \"f1jnq6q7\",\n    uwmqm3: [\"fycuoez\", \"f8wuabp\"],\n    Bqenvij: \"fvblgha\"\n  },\n  outline: {},\n  underline: {\n    De3pzq: \"f3rmtva\",\n    sj55zd: \"f11d4kpn\",\n    r4wkhp: \"f1no7wuu\",\n    B95qlz1: \"f1bifk9c\",\n    p743kt: \"fp1zg4s\",\n    B7xitij: \"fo6hitd\",\n    B6siaa6: \"f1wiab75\",\n    Ba9qmo4: \"fj9zm5z\",\n    Dyrjrp: \"f1cqwcg4\"\n  },\n  \"filled-darker\": {\n    De3pzq: \"f3rmtva\",\n    sj55zd: \"f11d4kpn\",\n    r4wkhp: \"f1no7wuu\",\n    B95qlz1: \"fwwxidx\",\n    p743kt: \"fp1zg4s\",\n    B7xitij: \"f14i52sd\",\n    B6siaa6: \"f1wiab75\",\n    Ba9qmo4: \"fwry2ka\",\n    Dyrjrp: \"f1cqwcg4\"\n  },\n  \"filled-lighter\": {\n    De3pzq: \"f3rmtva\",\n    sj55zd: \"f11d4kpn\",\n    r4wkhp: \"f1no7wuu\",\n    B95qlz1: \"f1yywxnv\",\n    drw0cw: \"fzaa11h\",\n    idzz8t: \"f4fpmm9\",\n    Dyrjrp: \"f1cqwcg4\"\n  }\n}, {\n  d: [\".f16hsg94{grid-row-start:1;}\", \".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}\", \".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}\", \".f10ra9hq{padding-top:4px;}\", \".f1brlhvm{padding-bottom:1px;}\", \".faunodf{grid-row-start:2;}\", \".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".f1sl3k7w{padding-top:1px;}\", \".f1y2xyjm{padding-bottom:4px;}\", \".f1khb0e9{padding-top:3px;}\", \".f1sgzk6v{padding-right:6px;}\", \".f1bg5zqg{padding-left:6px;}\", \".f1ov4xf1{padding-bottom:0px;}\", \".fycuoez{padding-left:4px;}\", \".f8wuabp{padding-right:4px;}\", \".fvblgha{height:12px;}\", \".f1nbblvp{padding-top:0px;}\", \".f1jnq6q7{padding-bottom:3px;}\", \".f3rmtva{background-color:transparent;}\", \".f11d4kpn{color:var(--colorNeutralForeground3);}\", \".f1no7wuu:enabled:hover{color:var(--colorNeutralForeground3Hover);}\", \".f1bifk9c:enabled:hover{background-color:var(--colorSubtleBackgroundHover);}\", \".fp1zg4s:enabled:active{color:var(--colorNeutralForeground3Pressed);}\", \".fo6hitd:enabled:active{background-color:var(--colorSubtleBackgroundPressed);}\", \".f1wiab75:enabled.fui-SpinButton__button_active{color:var(--colorNeutralForeground3Pressed);}\", \".fj9zm5z:enabled.fui-SpinButton__button_active{background-color:var(--colorSubtleBackgroundPressed);}\", \".f1cqwcg4:disabled{color:var(--colorNeutralForegroundDisabled);}\", \".fwwxidx:enabled:hover{background-color:var(--colorNeutralBackground3Hover);}\", \".f14i52sd:enabled:active{background-color:var(--colorNeutralBackground3Pressed);}\", \".fwry2ka:enabled.fui-SpinButton__button_active{background-color:var(--colorNeutralBackground3Pressed);}\", \".f1yywxnv:enabled:hover{background-color:var(--colorNeutralBackground1Hover);}\", \".fzaa11h:enabled:active,.fzaa11h:enabled.fui-SpinButton__button_active{color:var(--colorNeutralForeground3Pressed);}\", \".f4fpmm9:enabled:active,.f4fpmm9:enabled.fui-SpinButton__button_active{background-color:var(--colorNeutralBackground1Pressed);}\"]\n});\n// Cannot just disable button as they need to remain\n// exposed to ATs like screen readers.\nconst useButtonDisabledStyles = /*#__PURE__*/__styles({\n  base: {\n    Bceei9c: \"fdrzuqr\",\n    eoavqd: \"fphbwmw\"\n  },\n  outline: {\n    sj55zd: \"f1s2aq7o\",\n    r4wkhp: \"few7wvn\",\n    B95qlz1: \"f110wuh6\",\n    p743kt: \"f9s4mys\",\n    B7xitij: \"f10404rc\",\n    B6siaa6: \"fwzu9cz\",\n    Ba9qmo4: \"f1snwkb6\"\n  },\n  underline: {\n    sj55zd: \"f1s2aq7o\",\n    r4wkhp: \"few7wvn\",\n    B95qlz1: \"f110wuh6\",\n    p743kt: \"f9s4mys\",\n    B7xitij: \"f10404rc\",\n    B6siaa6: \"fwzu9cz\",\n    Ba9qmo4: \"f1snwkb6\"\n  },\n  \"filled-darker\": {\n    sj55zd: \"f1s2aq7o\",\n    r4wkhp: \"few7wvn\",\n    B95qlz1: \"f110wuh6\",\n    p743kt: \"f9s4mys\",\n    B7xitij: \"f10404rc\",\n    B6siaa6: \"fwzu9cz\",\n    Ba9qmo4: \"f1snwkb6\"\n  },\n  \"filled-lighter\": {\n    sj55zd: \"f1s2aq7o\",\n    r4wkhp: \"few7wvn\",\n    B95qlz1: \"f110wuh6\",\n    p743kt: \"f9s4mys\",\n    B7xitij: \"f10404rc\",\n    B6siaa6: \"fwzu9cz\",\n    Ba9qmo4: \"f1snwkb6\"\n  }\n}, {\n  d: [\".fdrzuqr{cursor:not-allowed;}\", \".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}\", \".few7wvn:enabled:hover{color:var(--colorNeutralForegroundDisabled);}\", \".f110wuh6:enabled:hover{background-color:transparent;}\", \".f9s4mys:enabled:active{color:var(--colorNeutralForegroundDisabled);}\", \".f10404rc:enabled:active{background-color:transparent;}\", \".fwzu9cz:enabled.fui-SpinButton__button_active{color:var(--colorNeutralForegroundDisabled);}\", \".f1snwkb6:enabled.fui-SpinButton__button_active{background-color:transparent;}\"],\n  h: [\".fphbwmw:hover{cursor:not-allowed;}\"]\n});\n/**\n * Apply styling to the SpinButton slots based on the state\n */\nexport const useSpinButtonStyles_unstable = state => {\n  const {\n    appearance,\n    atBound,\n    spinState,\n    size\n  } = state;\n  const disabled = state.input.disabled;\n  const invalid = `${state.input['aria-invalid']}` === 'true';\n  const filled = appearance.startsWith('filled');\n  const rootStyles = useRootStyles();\n  const buttonStyles = useButtonStyles();\n  const buttonDisabledStyles = useButtonDisabledStyles();\n  const inputStyles = useInputStyles();\n  state.root.className = mergeClasses(spinButtonClassNames.root, useRootClassName(), rootStyles[size], rootStyles[appearance], filled && rootStyles.filled, !disabled && appearance === 'outline' && rootStyles.outlineInteractive, !disabled && appearance === 'underline' && rootStyles.underlineInteractive, !disabled && filled && rootStyles.filledInteractive, !disabled && invalid && rootStyles.invalid, disabled && rootStyles.disabled, state.root.className);\n  state.incrementButton.className = mergeClasses(spinButtonClassNames.incrementButton, spinState === 'up' && `${spinButtonExtraClassNames.buttonActive}`, useBaseButtonClassName(), buttonStyles.increment, buttonStyles[appearance], size === 'small' && buttonStyles.incrementButtonSmall, (atBound === 'max' || atBound === 'both') && buttonDisabledStyles.base, (atBound === 'max' || atBound === 'both') && buttonDisabledStyles[appearance], state.incrementButton.className);\n  state.decrementButton.className = mergeClasses(spinButtonClassNames.decrementButton, spinState === 'down' && `${spinButtonExtraClassNames.buttonActive}`, useBaseButtonClassName(), buttonStyles.decrement, buttonStyles[appearance], size === 'small' && buttonStyles.decrementButtonSmall, (atBound === 'min' || atBound === 'both') && buttonDisabledStyles.base, (atBound === 'min' || atBound === 'both') && buttonDisabledStyles[appearance], state.decrementButton.className);\n  state.input.className = mergeClasses(spinButtonClassNames.input, useInputClassName(), disabled && inputStyles.disabled, state.input.className);\n  return state;\n};\n//# sourceMappingURL=useSpinButtonStyles.js.map"],"names":["spinButtonClassNames","useSpinButtonStyles_unstable","root","input","incrementButton","decrementButton","spinButtonExtraClassNames","buttonActive","fieldHeights","small","medium","useRootClassName","__resetStyles","useRootStyles","__styles","sshi5w","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","uwmqm3","outline","outlineInteractive","Bo3r8zu","Hpvxnh","Bx11ytk","B1rg0w0","Bsg1tlv","Brjw370","xcfy85","Bcc6kan","underline","B0qfbqy","B4f6apu","y0oebl","uvfttm","Budzafs","r59vdv","n07z76","ck0cow","underlineInteractive","B3778ie","d9w3h3","Bl18szs","B4j8arr","filled","Bdkvgpv","m598lv","qa3bma","Bbv0w2i","Bq4z7u6","Bk5zm6e","Bqjgrrk","Bm6vgfq","De3pzq","filledInteractive","B05mzqr","tb9y6h","jcehpj","B23o0hn","invalid","emecyz","lz0pba","Bo1k74p","Ba322q7","disabled","Bceei9c","Cffpyd","hxi8he","Bcuq369","Imo2if","d","h","a","m","useInputClassName","useInputStyles","sj55zd","yvdlaj","useBaseButtonClassName","useButtonStyles","increment","Ijaq50","B7oj6ja","z8tnut","Byoj8tv","decrement","Bbmb7ep","incrementButtonSmall","z189sj","Bqenvij","decrementButtonSmall","r4wkhp","B95qlz1","p743kt","B7xitij","B6siaa6","Ba9qmo4","Dyrjrp","drw0cw","idzz8t","useButtonDisabledStyles","base","eoavqd","state","appearance","atBound","spinState","size","startsWith","rootStyles","buttonStyles","buttonDisabledStyles","inputStyles","className","mergeClasses"],"mappings":"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"}
+{"version":3,"sources":["../../../lib/components/SpinButton/useSpinButtonStyles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const spinButtonClassNames = {\n  root: 'fui-SpinButton',\n  input: 'fui-SpinButton__input',\n  incrementButton: 'fui-SpinButton__incrementButton',\n  decrementButton: 'fui-SpinButton__decrementButton'\n};\nconst spinButtonExtraClassNames = {\n  buttonActive: 'fui-SpinButton__button_active'\n};\nconst fieldHeights = {\n  small: '24px',\n  medium: '32px'\n};\nconst useRootClassName = /*#__PURE__*/__resetStyles(\"rkqmps4\", \"r1trw52p\", [\".rkqmps4{display:inline-grid;grid-template-columns:1fr 24px;grid-template-rows:1fr 1fr;-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);row-gap:0;position:relative;isolation:isolate;background-color:var(--colorNeutralBackground1);min-height:32px;padding:0 0 0 var(--spacingHorizontalMNudge);border-radius:var(--borderRadiusMedium);}\", \".rkqmps4::before{content:\\\"\\\";box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:10;border:1px solid var(--colorNeutralStroke1);border-bottom-color:var(--colorNeutralStrokeAccessible);border-radius:var(--borderRadiusMedium);}\", \".rkqmps4::after{box-sizing:border-box;content:\\\"\\\";position:absolute;right:0;bottom:0;left:0;z-index:20;height:max(2px, var(--borderRadiusMedium));border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-bottom:2px solid var(--colorCompoundBrandStroke);-webkit-clip-path:inset(calc(100% - 2px) 0 0 0);clip-path:inset(calc(100% - 2px) 0 0 0);-webkit-transform:scaleX(0);-moz-transform:scaleX(0);-ms-transform:scaleX(0);transform:scaleX(0);transition-property:transform;transition-duration:var(--durationUltraFast);transition-delay:var(--curveAccelerateMid);}\", \"@media screen and (prefers-reduced-motion: reduce){.rkqmps4::after{transition-duration:0.01ms;transition-delay:0.01ms;}}\", \".rkqmps4:focus-within::after{-webkit-transform:scaleX(1);-moz-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);transition-property:transform;transition-duration:var(--durationNormal);transition-delay:var(--curveDecelerateMid);}\", \"@media screen and (prefers-reduced-motion: reduce){.rkqmps4:focus-within::after{transition-duration:0.01ms;transition-delay:0.01ms;}}\", \".rkqmps4:focus-within:active::after{border-bottom-color:var(--colorCompoundBrandStrokePressed);}\", \".rkqmps4:focus-within{outline:2px solid transparent;}\", \".r1trw52p{display:inline-grid;grid-template-columns:1fr 24px;grid-template-rows:1fr 1fr;-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);row-gap:0;position:relative;isolation:isolate;background-color:var(--colorNeutralBackground1);min-height:32px;padding:0 var(--spacingHorizontalMNudge) 0 0;border-radius:var(--borderRadiusMedium);}\", \".r1trw52p::before{content:\\\"\\\";box-sizing:border-box;position:absolute;top:0;left:0;bottom:0;right:0;pointer-events:none;z-index:10;border:1px solid var(--colorNeutralStroke1);border-bottom-color:var(--colorNeutralStrokeAccessible);border-radius:var(--borderRadiusMedium);}\", \".r1trw52p::after{box-sizing:border-box;content:\\\"\\\";position:absolute;left:0;bottom:0;right:0;z-index:20;height:max(2px, var(--borderRadiusMedium));border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-bottom:2px solid var(--colorCompoundBrandStroke);-webkit-clip-path:inset(calc(100% - 2px) 0 0 0);clip-path:inset(calc(100% - 2px) 0 0 0);-webkit-transform:scaleX(0);-moz-transform:scaleX(0);-ms-transform:scaleX(0);transform:scaleX(0);transition-property:transform;transition-duration:var(--durationUltraFast);transition-delay:var(--curveAccelerateMid);}\", \"@media screen and (prefers-reduced-motion: reduce){.r1trw52p::after{transition-duration:0.01ms;transition-delay:0.01ms;}}\", \".r1trw52p:focus-within::after{-webkit-transform:scaleX(1);-moz-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);transition-property:transform;transition-duration:var(--durationNormal);transition-delay:var(--curveDecelerateMid);}\", \"@media screen and (prefers-reduced-motion: reduce){.r1trw52p:focus-within::after{transition-duration:0.01ms;transition-delay:0.01ms;}}\", \".r1trw52p:focus-within:active::after{border-bottom-color:var(--colorCompoundBrandStrokePressed);}\", \".r1trw52p:focus-within{outline:2px solid transparent;}\"]);\nconst useRootStyles = /*#__PURE__*/__styles({\n  small: {\n    sshi5w: \"f1pha7fy\",\n    Bahqtrf: \"fk6fouc\",\n    Be2twd7: \"fy9rknc\",\n    Bhrd7zp: \"figsok6\",\n    Bg96gwp: \"fwrc4pm\",\n    uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"]\n  },\n  medium: {},\n  outline: {},\n  outlineInteractive: {\n    Bo3r8zu: \"f1w2y1rc\",\n    Hpvxnh: [\"f1gofhvl\", \"f18htlvq\"],\n    Bx11ytk: \"ffcnd28\",\n    B1rg0w0: [\"f18htlvq\", \"f1gofhvl\"],\n    Bsg1tlv: \"f6lmxco\",\n    Brjw370: [\"fcoc0mf\", \"f15r4wkl\"],\n    xcfy85: \"f1ipdth8\",\n    Bcc6kan: [\"f15r4wkl\", \"fcoc0mf\"]\n  },\n  underline: {\n    B0qfbqy: \"f1o236ok\",\n    B4f6apu: [\"faeg28l\", \"f64aojp\"],\n    y0oebl: \"fdw6hkg\",\n    uvfttm: [\"f64aojp\", \"faeg28l\"],\n    Budzafs: [\"f1vk4jnx\", \"f1v3v894\"],\n    r59vdv: [\"f1v3v894\", \"f1vk4jnx\"],\n    n07z76: [\"fzi2j54\", \"f1un0uoc\"],\n    ck0cow: [\"f1un0uoc\", \"fzi2j54\"]\n  },\n  underlineInteractive: {\n    Bx11ytk: \"ffcnd28\",\n    xcfy85: \"f1ipdth8\",\n    B3778ie: [\"f9pmbr4\", \"ffh3ws5\"],\n    d9w3h3: [\"ffh3ws5\", \"f9pmbr4\"],\n    Bl18szs: [\"f19438ov\", \"f1i9y5j\"],\n    B4j8arr: [\"f1i9y5j\", \"f19438ov\"]\n  },\n  filled: {\n    B0qfbqy: \"f1fjh9ub\",\n    B4f6apu: [\"ff9c942\", \"f6rdg5o\"],\n    y0oebl: \"fdw6hkg\",\n    uvfttm: [\"f6rdg5o\", \"ff9c942\"],\n    Bdkvgpv: \"f163fonl\",\n    m598lv: [\"f1yq6w5o\", \"f1jpmc5p\"],\n    qa3bma: \"f11yjt3y\",\n    Bbv0w2i: [\"f1jpmc5p\", \"f1yq6w5o\"],\n    Bq4z7u6: \"f7dgwnz\",\n    Bk5zm6e: [\"f1edeodt\", \"fszsv3f\"],\n    Bqjgrrk: \"f1172wan\",\n    Bm6vgfq: [\"fszsv3f\", \"f1edeodt\"]\n  },\n  \"filled-darker\": {\n    De3pzq: \"f16xq7d1\"\n  },\n  \"filled-lighter\": {\n    De3pzq: \"fxugw4r\"\n  },\n  filledInteractive: {\n    B05mzqr: \"f1xqt08\",\n    tb9y6h: [\"fzt5lgo\", \"f8tv3r9\"],\n    jcehpj: \"fyhrops\",\n    B23o0hn: [\"f8tv3r9\", \"fzt5lgo\"]\n  },\n  invalid: {\n    emecyz: \"fl48pg9\",\n    lz0pba: [\"f1a168p3\", \"f1pvdymy\"],\n    Bo1k74p: \"f11knvgl\",\n    Ba322q7: [\"f1pvdymy\", \"f1a168p3\"]\n  },\n  disabled: {\n    Bceei9c: \"fdrzuqr\",\n    De3pzq: \"f1c21dwh\",\n    Bq4z7u6: \"f1a0lfh7\",\n    Bk5zm6e: [\"f1p2ejm6\", \"fmzytvz\"],\n    Bqjgrrk: \"fas2e61\",\n    Bm6vgfq: [\"fmzytvz\", \"f1p2ejm6\"],\n    Cffpyd: \"flb8es4\",\n    hxi8he: [\"f1lclws\", \"frjp63v\"],\n    Bcuq369: \"f1yv9wnt\",\n    Imo2if: [\"frjp63v\", \"f1lclws\"]\n  }\n}, {\n  d: [\".f1pha7fy{min-height:24px;}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1o236ok::before{border-top-width:0;}\", \".faeg28l::before{border-right-width:0;}\", \".f64aojp::before{border-left-width:0;}\", \".fdw6hkg::before{border-bottom-width:1px;}\", \".f1vk4jnx::before{border-bottom-right-radius:var(--borderRadiusNone);}\", \".f1v3v894::before{border-bottom-left-radius:var(--borderRadiusNone);}\", \".fzi2j54::before{border-top-right-radius:var(--borderRadiusNone);}\", \".f1un0uoc::before{border-top-left-radius:var(--borderRadiusNone);}\", \".f9pmbr4::after{border-bottom-right-radius:var(--borderRadiusNone);}\", \".ffh3ws5::after{border-bottom-left-radius:var(--borderRadiusNone);}\", \".f19438ov::after{border-top-right-radius:var(--borderRadiusNone);}\", \".f1i9y5j::after{border-top-left-radius:var(--borderRadiusNone);}\", \".f1fjh9ub::before{border-top-width:1px;}\", \".ff9c942::before{border-right-width:1px;}\", \".f6rdg5o::before{border-left-width:1px;}\", \".f163fonl::before{border-top-style:solid;}\", \".f1yq6w5o::before{border-right-style:solid;}\", \".f1jpmc5p::before{border-left-style:solid;}\", \".f11yjt3y::before{border-bottom-style:solid;}\", \".f7dgwnz::before{border-top-color:var(--colorTransparentStroke);}\", \".f1edeodt::before{border-right-color:var(--colorTransparentStroke);}\", \".fszsv3f::before{border-left-color:var(--colorTransparentStroke);}\", \".f1172wan::before{border-bottom-color:var(--colorTransparentStroke);}\", \".f16xq7d1{background-color:var(--colorNeutralBackground3);}\", \".fxugw4r{background-color:var(--colorNeutralBackground1);}\", \".fl48pg9:not(:focus-within)::before,.fl48pg9:hover:not(:focus-within)::before{border-top-color:var(--colorPaletteRedBorder2);}\", \".f1a168p3:not(:focus-within)::before,.f1a168p3:hover:not(:focus-within)::before{border-right-color:var(--colorPaletteRedBorder2);}\", \".f1pvdymy:not(:focus-within)::before,.f1pvdymy:hover:not(:focus-within)::before{border-left-color:var(--colorPaletteRedBorder2);}\", \".f11knvgl:not(:focus-within)::before,.f11knvgl:hover:not(:focus-within)::before{border-bottom-color:var(--colorPaletteRedBorder2);}\", \".fdrzuqr{cursor:not-allowed;}\", \".f1c21dwh{background-color:var(--colorTransparentBackground);}\", \".f1a0lfh7::before{border-top-color:var(--colorNeutralStrokeDisabled);}\", \".f1p2ejm6::before{border-right-color:var(--colorNeutralStrokeDisabled);}\", \".fmzytvz::before{border-left-color:var(--colorNeutralStrokeDisabled);}\", \".fas2e61::before{border-bottom-color:var(--colorNeutralStrokeDisabled);}\"],\n  h: [\".f1w2y1rc:hover::before{border-top-color:var(--colorNeutralStroke1Hover);}\", \".f1gofhvl:hover::before{border-right-color:var(--colorNeutralStroke1Hover);}\", \".f18htlvq:hover::before{border-left-color:var(--colorNeutralStroke1Hover);}\", \".ffcnd28:hover::before{border-bottom-color:var(--colorNeutralStrokeAccessibleHover);}\", \".f1xqt08:hover::before,.f1xqt08:focus-within::before{border-top-color:var(--colorTransparentStrokeInteractive);}\", \".fzt5lgo:hover::before,.fzt5lgo:focus-within::before{border-right-color:var(--colorTransparentStrokeInteractive);}\", \".f8tv3r9:hover::before,.f8tv3r9:focus-within::before{border-left-color:var(--colorTransparentStrokeInteractive);}\", \".fyhrops:hover::before,.fyhrops:focus-within::before{border-bottom-color:var(--colorTransparentStrokeInteractive);}\"],\n  a: [\".f6lmxco:active::before,.f6lmxco:focus-within::before{border-top-color:var(--colorNeutralStroke1Pressed);}\", \".fcoc0mf:active::before,.fcoc0mf:focus-within::before{border-right-color:var(--colorNeutralStroke1Pressed);}\", \".f15r4wkl:active::before,.f15r4wkl:focus-within::before{border-left-color:var(--colorNeutralStroke1Pressed);}\", \".f1ipdth8:active::before,.f1ipdth8:focus-within::before{border-bottom-color:var(--colorNeutralStrokeAccessiblePressed);}\"],\n  m: [[\"@media (forced-colors: active){.flb8es4::before{border-top-color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1lclws::before{border-right-color:GrayText;}.frjp63v::before{border-left-color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1yv9wnt::before{border-bottom-color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.frjp63v::before{border-left-color:GrayText;}.f1lclws::before{border-right-color:GrayText;}}\", {\n    m: \"(forced-colors: active)\"\n  }]]\n});\nconst useInputClassName = /*#__PURE__*/__resetStyles(\"r1ljrqje\", null, [\".r1ljrqje{grid-column-start:1;grid-column-end:2;grid-row-start:1;grid-row-end:3;outline-style:none;border:0;padding:0;color:var(--colorNeutralForeground1);background-color:transparent;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;width:100%;}\", \".r1ljrqje::-webkit-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}\", \".r1ljrqje::-moz-placeholder{color:var(--colorNeutralForeground4);opacity:1;}\", \".r1ljrqje:-ms-input-placeholder{color:var(--colorNeutralForeground4);opacity:1;}\", \".r1ljrqje::placeholder{color:var(--colorNeutralForeground4);opacity:1;}\"]);\nconst useInputStyles = /*#__PURE__*/__styles({\n  disabled: {\n    sj55zd: \"f1s2aq7o\",\n    Bceei9c: \"fdrzuqr\",\n    De3pzq: \"f1c21dwh\",\n    yvdlaj: \"fahhnxm\"\n  }\n}, {\n  d: [\".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}\", \".fdrzuqr{cursor:not-allowed;}\", \".f1c21dwh{background-color:var(--colorTransparentBackground);}\", \".fahhnxm::-webkit-input-placeholder{color:var(--colorNeutralForegroundDisabled);}\", \".fahhnxm::-moz-placeholder{color:var(--colorNeutralForegroundDisabled);}\"]\n});\nconst useBaseButtonClassName = /*#__PURE__*/__resetStyles(\"r1g4chgs\", null, [\".r1g4chgs{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:24px;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;border:0;position:absolute;outline-style:none;height:16px;background-color:transparent;color:var(--colorNeutralForeground3);grid-column-start:2;border-radius:0;padding:0 5px 0 5px;}\", \".r1g4chgs:active{outline-style:none;}\", \".r1g4chgs:enabled:hover{cursor:pointer;color:var(--colorNeutralForeground3Hover);background-color:var(--colorSubtleBackgroundHover);}\", \".r1g4chgs:enabled:active{color:var(--colorNeutralForeground3Pressed);background-color:var(--colorSubtleBackgroundPressed);}\", \".r1g4chgs:enabled.fui-SpinButton__button_active{color:var(--colorNeutralForeground3Pressed);background-color:var(--colorSubtleBackgroundPressed);}\", \".r1g4chgs:disabled{cursor:not-allowed;color:var(--colorNeutralForegroundDisabled);}\"]);\nconst useButtonStyles = /*#__PURE__*/__styles({\n  increment: {\n    Ijaq50: \"f16hsg94\",\n    B7oj6ja: [\"f1jar5jt\", \"fyu767a\"],\n    z8tnut: \"f10ra9hq\",\n    Byoj8tv: \"f1brlhvm\"\n  },\n  decrement: {\n    Ijaq50: \"faunodf\",\n    Bbmb7ep: [\"f1aa9q02\", \"f16jpd5f\"],\n    z8tnut: \"f1sl3k7w\",\n    Byoj8tv: \"f1y2xyjm\"\n  },\n  incrementButtonSmall: {\n    z8tnut: \"f1khb0e9\",\n    z189sj: [\"f1sgzk6v\", \"f1bg5zqg\"],\n    Byoj8tv: \"f1ov4xf1\",\n    uwmqm3: [\"fycuoez\", \"f8wuabp\"],\n    Bqenvij: \"fvblgha\"\n  },\n  decrementButtonSmall: {\n    z8tnut: \"f1nbblvp\",\n    z189sj: [\"f1sgzk6v\", \"f1bg5zqg\"],\n    Byoj8tv: \"f1jnq6q7\",\n    uwmqm3: [\"fycuoez\", \"f8wuabp\"],\n    Bqenvij: \"fvblgha\"\n  },\n  outline: {},\n  underline: {\n    De3pzq: \"f3rmtva\",\n    sj55zd: \"f11d4kpn\",\n    r4wkhp: \"f1no7wuu\",\n    B95qlz1: \"f1bifk9c\",\n    p743kt: \"fp1zg4s\",\n    B7xitij: \"fo6hitd\",\n    B6siaa6: \"f1wiab75\",\n    Ba9qmo4: \"fj9zm5z\",\n    Dyrjrp: \"f1cqwcg4\"\n  },\n  \"filled-darker\": {\n    De3pzq: \"f3rmtva\",\n    sj55zd: \"f11d4kpn\",\n    r4wkhp: \"f1no7wuu\",\n    B95qlz1: \"fwwxidx\",\n    p743kt: \"fp1zg4s\",\n    B7xitij: \"f14i52sd\",\n    B6siaa6: \"f1wiab75\",\n    Ba9qmo4: \"fwry2ka\",\n    Dyrjrp: \"f1cqwcg4\"\n  },\n  \"filled-lighter\": {\n    De3pzq: \"f3rmtva\",\n    sj55zd: \"f11d4kpn\",\n    r4wkhp: \"f1no7wuu\",\n    B95qlz1: \"f1yywxnv\",\n    drw0cw: \"fzaa11h\",\n    idzz8t: \"f4fpmm9\",\n    Dyrjrp: \"f1cqwcg4\"\n  }\n}, {\n  d: [\".f16hsg94{grid-row-start:1;}\", \".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}\", \".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}\", \".f10ra9hq{padding-top:4px;}\", \".f1brlhvm{padding-bottom:1px;}\", \".faunodf{grid-row-start:2;}\", \".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".f1sl3k7w{padding-top:1px;}\", \".f1y2xyjm{padding-bottom:4px;}\", \".f1khb0e9{padding-top:3px;}\", \".f1sgzk6v{padding-right:6px;}\", \".f1bg5zqg{padding-left:6px;}\", \".f1ov4xf1{padding-bottom:0px;}\", \".fycuoez{padding-left:4px;}\", \".f8wuabp{padding-right:4px;}\", \".fvblgha{height:12px;}\", \".f1nbblvp{padding-top:0px;}\", \".f1jnq6q7{padding-bottom:3px;}\", \".f3rmtva{background-color:transparent;}\", \".f11d4kpn{color:var(--colorNeutralForeground3);}\", \".f1no7wuu:enabled:hover{color:var(--colorNeutralForeground3Hover);}\", \".f1bifk9c:enabled:hover{background-color:var(--colorSubtleBackgroundHover);}\", \".fp1zg4s:enabled:active{color:var(--colorNeutralForeground3Pressed);}\", \".fo6hitd:enabled:active{background-color:var(--colorSubtleBackgroundPressed);}\", \".f1wiab75:enabled.fui-SpinButton__button_active{color:var(--colorNeutralForeground3Pressed);}\", \".fj9zm5z:enabled.fui-SpinButton__button_active{background-color:var(--colorSubtleBackgroundPressed);}\", \".f1cqwcg4:disabled{color:var(--colorNeutralForegroundDisabled);}\", \".fwwxidx:enabled:hover{background-color:var(--colorNeutralBackground3Hover);}\", \".f14i52sd:enabled:active{background-color:var(--colorNeutralBackground3Pressed);}\", \".fwry2ka:enabled.fui-SpinButton__button_active{background-color:var(--colorNeutralBackground3Pressed);}\", \".f1yywxnv:enabled:hover{background-color:var(--colorNeutralBackground1Hover);}\", \".fzaa11h:enabled:active,.fzaa11h:enabled.fui-SpinButton__button_active{color:var(--colorNeutralForeground3Pressed);}\", \".f4fpmm9:enabled:active,.f4fpmm9:enabled.fui-SpinButton__button_active{background-color:var(--colorNeutralBackground1Pressed);}\"]\n});\n// Cannot just disable button as they need to remain\n// exposed to ATs like screen readers.\nconst useButtonDisabledStyles = /*#__PURE__*/__styles({\n  base: {\n    Bceei9c: \"fdrzuqr\",\n    eoavqd: \"fphbwmw\"\n  },\n  outline: {\n    sj55zd: \"f1s2aq7o\",\n    r4wkhp: \"few7wvn\",\n    B95qlz1: \"f110wuh6\",\n    p743kt: \"f9s4mys\",\n    B7xitij: \"f10404rc\",\n    B6siaa6: \"fwzu9cz\",\n    Ba9qmo4: \"f1snwkb6\"\n  },\n  underline: {\n    sj55zd: \"f1s2aq7o\",\n    r4wkhp: \"few7wvn\",\n    B95qlz1: \"f110wuh6\",\n    p743kt: \"f9s4mys\",\n    B7xitij: \"f10404rc\",\n    B6siaa6: \"fwzu9cz\",\n    Ba9qmo4: \"f1snwkb6\"\n  },\n  \"filled-darker\": {\n    sj55zd: \"f1s2aq7o\",\n    r4wkhp: \"few7wvn\",\n    B95qlz1: \"f110wuh6\",\n    p743kt: \"f9s4mys\",\n    B7xitij: \"f10404rc\",\n    B6siaa6: \"fwzu9cz\",\n    Ba9qmo4: \"f1snwkb6\"\n  },\n  \"filled-lighter\": {\n    sj55zd: \"f1s2aq7o\",\n    r4wkhp: \"few7wvn\",\n    B95qlz1: \"f110wuh6\",\n    p743kt: \"f9s4mys\",\n    B7xitij: \"f10404rc\",\n    B6siaa6: \"fwzu9cz\",\n    Ba9qmo4: \"f1snwkb6\"\n  }\n}, {\n  d: [\".fdrzuqr{cursor:not-allowed;}\", \".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}\", \".few7wvn:enabled:hover{color:var(--colorNeutralForegroundDisabled);}\", \".f110wuh6:enabled:hover{background-color:transparent;}\", \".f9s4mys:enabled:active{color:var(--colorNeutralForegroundDisabled);}\", \".f10404rc:enabled:active{background-color:transparent;}\", \".fwzu9cz:enabled.fui-SpinButton__button_active{color:var(--colorNeutralForegroundDisabled);}\", \".f1snwkb6:enabled.fui-SpinButton__button_active{background-color:transparent;}\"],\n  h: [\".fphbwmw:hover{cursor:not-allowed;}\"]\n});\n/**\n * Apply styling to the SpinButton slots based on the state\n */\nexport const useSpinButtonStyles_unstable = state => {\n  const {\n    appearance,\n    atBound,\n    spinState,\n    size\n  } = state;\n  const disabled = state.input.disabled;\n  const invalid = `${state.input['aria-invalid']}` === 'true';\n  const filled = appearance.startsWith('filled');\n  const rootStyles = useRootStyles();\n  const buttonStyles = useButtonStyles();\n  const buttonDisabledStyles = useButtonDisabledStyles();\n  const inputStyles = useInputStyles();\n  state.root.className = mergeClasses(spinButtonClassNames.root, useRootClassName(), rootStyles[size], rootStyles[appearance], filled && rootStyles.filled, !disabled && appearance === 'outline' && rootStyles.outlineInteractive, !disabled && appearance === 'underline' && rootStyles.underlineInteractive, !disabled && filled && rootStyles.filledInteractive, !disabled && invalid && rootStyles.invalid, disabled && rootStyles.disabled, state.root.className);\n  state.incrementButton.className = mergeClasses(spinButtonClassNames.incrementButton, spinState === 'up' && `${spinButtonExtraClassNames.buttonActive}`, useBaseButtonClassName(), buttonStyles.increment, buttonStyles[appearance], size === 'small' && buttonStyles.incrementButtonSmall, (atBound === 'max' || atBound === 'both') && buttonDisabledStyles.base, (atBound === 'max' || atBound === 'both') && buttonDisabledStyles[appearance], state.incrementButton.className);\n  state.decrementButton.className = mergeClasses(spinButtonClassNames.decrementButton, spinState === 'down' && `${spinButtonExtraClassNames.buttonActive}`, useBaseButtonClassName(), buttonStyles.decrement, buttonStyles[appearance], size === 'small' && buttonStyles.decrementButtonSmall, (atBound === 'min' || atBound === 'both') && buttonDisabledStyles.base, (atBound === 'min' || atBound === 'both') && buttonDisabledStyles[appearance], state.decrementButton.className);\n  state.input.className = mergeClasses(spinButtonClassNames.input, useInputClassName(), disabled && inputStyles.disabled, state.input.className);\n  return state;\n};\n//# sourceMappingURL=useSpinButtonStyles.js.map"],"names":["spinButtonClassNames","useSpinButtonStyles_unstable","root","input","incrementButton","decrementButton","spinButtonExtraClassNames","buttonActive","fieldHeights","small","medium","useRootClassName","__resetStyles","useRootStyles","__styles","sshi5w","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","uwmqm3","outline","outlineInteractive","Bo3r8zu","Hpvxnh","Bx11ytk","B1rg0w0","Bsg1tlv","Brjw370","xcfy85","Bcc6kan","underline","B0qfbqy","B4f6apu","y0oebl","uvfttm","Budzafs","r59vdv","n07z76","ck0cow","underlineInteractive","B3778ie","d9w3h3","Bl18szs","B4j8arr","filled","Bdkvgpv","m598lv","qa3bma","Bbv0w2i","Bq4z7u6","Bk5zm6e","Bqjgrrk","Bm6vgfq","De3pzq","filledInteractive","B05mzqr","tb9y6h","jcehpj","B23o0hn","invalid","emecyz","lz0pba","Bo1k74p","Ba322q7","disabled","Bceei9c","Cffpyd","hxi8he","Bcuq369","Imo2if","d","h","a","m","useInputClassName","useInputStyles","sj55zd","yvdlaj","useBaseButtonClassName","useButtonStyles","increment","Ijaq50","B7oj6ja","z8tnut","Byoj8tv","decrement","Bbmb7ep","incrementButtonSmall","z189sj","Bqenvij","decrementButtonSmall","r4wkhp","B95qlz1","p743kt","B7xitij","B6siaa6","Ba9qmo4","Dyrjrp","drw0cw","idzz8t","useButtonDisabledStyles","base","eoavqd","state","appearance","atBound","spinState","size","startsWith","rootStyles","buttonStyles","buttonDisabledStyles","inputStyles","className","mergeClasses"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-spinbutton",
-  "version": "9.2.6",
+  "version": "9.2.8",
   "description": "Fluent UI React SpinButton component.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -28,18 +28,18 @@
     "@fluentui/eslint-plugin": "*",
     "@fluentui/react-conformance": "*",
     "@fluentui/react-conformance-griffel": "9.0.0-beta.20",
-    "@fluentui/react-label": "^9.1.6",
+    "@fluentui/react-label": "^9.1.7",
     "@fluentui/scripts-api-extractor": "*",
     "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
     "@griffel/react": "^1.5.2",
     "@fluentui/keyboard-keys": "^9.0.2",
-    "@fluentui/react-field": "9.0.0-alpha.28",
+    "@fluentui/react-field": "9.0.0-beta.1",
     "@fluentui/react-icons": "^2.0.196",
     "@fluentui/react-shared-contexts": "^9.3.3",
     "@fluentui/react-theme": "^9.1.7",
-    "@fluentui/react-utilities": "^9.7.2",
+    "@fluentui/react-utilities": "^9.7.3",
     "@swc/helpers": "^0.4.14"
   },
   "peerDependencies": {