@fluentui/react-spinbutton 9.2.31 → 9.2.33
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +85 -1
- package/CHANGELOG.md +29 -2
- package/lib/components/SpinButton/SpinButton.js.map +1 -1
- package/lib/components/SpinButton/renderSpinButton.js +8 -2
- package/lib/components/SpinButton/renderSpinButton.js.map +1 -1
- package/lib/components/SpinButton/useSpinButton.js +3 -2
- package/lib/components/SpinButton/useSpinButton.js.map +1 -1
- package/lib/components/SpinButton/useSpinButtonStyles.styles.js.map +1 -1
- package/lib/utils/clamp.js.map +1 -1
- package/lib/utils/getBound.js.map +1 -1
- package/lib/utils/precision.js.map +1 -1
- package/lib-commonjs/SpinButton.js +2 -2
- package/lib-commonjs/SpinButton.js.map +1 -1
- package/lib-commonjs/components/SpinButton/SpinButton.js +9 -7
- package/lib-commonjs/components/SpinButton/SpinButton.js.map +1 -1
- package/lib-commonjs/components/SpinButton/SpinButton.types.js +2 -2
- package/lib-commonjs/components/SpinButton/SpinButton.types.js.map +1 -1
- package/lib-commonjs/components/SpinButton/index.js +6 -6
- package/lib-commonjs/components/SpinButton/index.js.map +1 -1
- package/lib-commonjs/components/SpinButton/renderSpinButton.js +14 -6
- package/lib-commonjs/components/SpinButton/renderSpinButton.js.map +1 -1
- package/lib-commonjs/components/SpinButton/useSpinButton.js +42 -39
- package/lib-commonjs/components/SpinButton/useSpinButton.js.map +1 -1
- package/lib-commonjs/components/SpinButton/useSpinButtonStyles.styles.js +14 -10
- package/lib-commonjs/components/SpinButton/useSpinButtonStyles.styles.js.map +1 -1
- package/lib-commonjs/index.js +16 -6
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/clamp.js +3 -1
- package/lib-commonjs/utils/clamp.js.map +1 -1
- package/lib-commonjs/utils/getBound.js +3 -1
- package/lib-commonjs/utils/getBound.js.map +1 -1
- package/lib-commonjs/utils/index.js +4 -4
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/precision.js +6 -2
- package/lib-commonjs/utils/precision.js.map +1 -1
- package/package.json +12 -12
package/CHANGELOG.json
CHANGED
@@ -2,7 +2,91 @@
|
|
2
2
|
"name": "@fluentui/react-spinbutton",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "
|
5
|
+
"date": "Tue, 05 Sep 2023 13:23:08 GMT",
|
6
|
+
"tag": "@fluentui/react-spinbutton_v9.2.33",
|
7
|
+
"version": "9.2.33",
|
8
|
+
"comments": {
|
9
|
+
"patch": [
|
10
|
+
{
|
11
|
+
"author": "bernardo.sunderhus@gmail.com",
|
12
|
+
"package": "@fluentui/react-spinbutton",
|
13
|
+
"commit": "b93c2ac22355b6cb6f33dd509c6cd9c21f4fffc8",
|
14
|
+
"comment": "bumps @swc/helpers version to 0.5.1"
|
15
|
+
},
|
16
|
+
{
|
17
|
+
"author": "bernardo.sunderhus@gmail.com",
|
18
|
+
"package": "@fluentui/react-spinbutton",
|
19
|
+
"commit": "eea6d93a62249ba4fba3347fb291c67ee1a3fb24",
|
20
|
+
"comment": "chore: migrate package to use JSX importSource"
|
21
|
+
},
|
22
|
+
{
|
23
|
+
"author": "beachball",
|
24
|
+
"package": "@fluentui/react-spinbutton",
|
25
|
+
"comment": "Bump @fluentui/keyboard-keys to v9.0.4",
|
26
|
+
"commit": "0bf811dbcaaa6b78743537d142fe4d348b457045"
|
27
|
+
},
|
28
|
+
{
|
29
|
+
"author": "beachball",
|
30
|
+
"package": "@fluentui/react-spinbutton",
|
31
|
+
"comment": "Bump @fluentui/react-field to v9.1.23",
|
32
|
+
"commit": "0bf811dbcaaa6b78743537d142fe4d348b457045"
|
33
|
+
},
|
34
|
+
{
|
35
|
+
"author": "beachball",
|
36
|
+
"package": "@fluentui/react-spinbutton",
|
37
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.4",
|
38
|
+
"commit": "0bf811dbcaaa6b78743537d142fe4d348b457045"
|
39
|
+
},
|
40
|
+
{
|
41
|
+
"author": "beachball",
|
42
|
+
"package": "@fluentui/react-spinbutton",
|
43
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.7.3",
|
44
|
+
"commit": "0bf811dbcaaa6b78743537d142fe4d348b457045"
|
45
|
+
},
|
46
|
+
{
|
47
|
+
"author": "beachball",
|
48
|
+
"package": "@fluentui/react-spinbutton",
|
49
|
+
"comment": "Bump @fluentui/react-theme to v9.1.12",
|
50
|
+
"commit": "0bf811dbcaaa6b78743537d142fe4d348b457045"
|
51
|
+
},
|
52
|
+
{
|
53
|
+
"author": "beachball",
|
54
|
+
"package": "@fluentui/react-spinbutton",
|
55
|
+
"comment": "Bump @fluentui/react-utilities to v9.13.1",
|
56
|
+
"commit": "0bf811dbcaaa6b78743537d142fe4d348b457045"
|
57
|
+
}
|
58
|
+
]
|
59
|
+
}
|
60
|
+
},
|
61
|
+
{
|
62
|
+
"date": "Tue, 29 Aug 2023 12:57:36 GMT",
|
63
|
+
"tag": "@fluentui/react-spinbutton_v9.2.32",
|
64
|
+
"version": "9.2.32",
|
65
|
+
"comments": {
|
66
|
+
"patch": [
|
67
|
+
{
|
68
|
+
"author": "beachball",
|
69
|
+
"package": "@fluentui/react-spinbutton",
|
70
|
+
"comment": "Bump @fluentui/react-field to v9.1.22",
|
71
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
72
|
+
},
|
73
|
+
{
|
74
|
+
"author": "beachball",
|
75
|
+
"package": "@fluentui/react-spinbutton",
|
76
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.3",
|
77
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
78
|
+
},
|
79
|
+
{
|
80
|
+
"author": "beachball",
|
81
|
+
"package": "@fluentui/react-spinbutton",
|
82
|
+
"comment": "Bump @fluentui/react-utilities to v9.13.0",
|
83
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
84
|
+
}
|
85
|
+
]
|
86
|
+
}
|
87
|
+
},
|
88
|
+
{
|
89
|
+
"date": "Thu, 24 Aug 2023 10:26:35 GMT",
|
6
90
|
"tag": "@fluentui/react-spinbutton_v9.2.31",
|
7
91
|
"version": "9.2.31",
|
8
92
|
"comments": {
|
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,39 @@
|
|
1
1
|
# Change Log - @fluentui/react-spinbutton
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Tue, 05 Sep 2023 13:23:08 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.2.33](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v9.2.33)
|
8
|
+
|
9
|
+
Tue, 05 Sep 2023 13:23:08 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinbutton_v9.2.32..@fluentui/react-spinbutton_v9.2.33)
|
11
|
+
|
12
|
+
### Patches
|
13
|
+
|
14
|
+
- bumps @swc/helpers version to 0.5.1 ([PR #28989](https://github.com/microsoft/fluentui/pull/28989) by bernardo.sunderhus@gmail.com)
|
15
|
+
- chore: migrate package to use JSX importSource ([PR #28959](https://github.com/microsoft/fluentui/pull/28959) by bernardo.sunderhus@gmail.com)
|
16
|
+
- Bump @fluentui/keyboard-keys to v9.0.4 ([PR #27840](https://github.com/microsoft/fluentui/pull/27840) by beachball)
|
17
|
+
- Bump @fluentui/react-field to v9.1.23 ([PR #27840](https://github.com/microsoft/fluentui/pull/27840) by beachball)
|
18
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.4 ([PR #27840](https://github.com/microsoft/fluentui/pull/27840) by beachball)
|
19
|
+
- Bump @fluentui/react-shared-contexts to v9.7.3 ([PR #27840](https://github.com/microsoft/fluentui/pull/27840) by beachball)
|
20
|
+
- Bump @fluentui/react-theme to v9.1.12 ([PR #27840](https://github.com/microsoft/fluentui/pull/27840) by beachball)
|
21
|
+
- Bump @fluentui/react-utilities to v9.13.1 ([PR #27840](https://github.com/microsoft/fluentui/pull/27840) by beachball)
|
22
|
+
|
23
|
+
## [9.2.32](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v9.2.32)
|
24
|
+
|
25
|
+
Tue, 29 Aug 2023 12:57:36 GMT
|
26
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinbutton_v9.2.31..@fluentui/react-spinbutton_v9.2.32)
|
27
|
+
|
28
|
+
### Patches
|
29
|
+
|
30
|
+
- Bump @fluentui/react-field to v9.1.22 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
31
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.3 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
32
|
+
- Bump @fluentui/react-utilities to v9.13.0 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
33
|
+
|
7
34
|
## [9.2.31](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v9.2.31)
|
8
35
|
|
9
|
-
Thu, 24 Aug 2023 10:
|
36
|
+
Thu, 24 Aug 2023 10:26:35 GMT
|
10
37
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinbutton_v9.2.30..@fluentui/react-spinbutton_v9.2.31)
|
11
38
|
|
12
39
|
### Patches
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["SpinButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSpinButton_unstable } from './useSpinButton';\nimport { renderSpinButton_unstable } from './renderSpinButton';\nimport { useSpinButtonStyles_unstable } from './useSpinButtonStyles.styles';\nimport type { SpinButtonProps } from './SpinButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * A SpinButton allows someone to incrementally adjust a value in small steps.\n */\nexport const SpinButton: ForwardRefComponent<SpinButtonProps> = React.forwardRef((props, ref) => {\n const state = useSpinButton_unstable(props, ref);\n\n useSpinButtonStyles_unstable(state);\n\n useCustomStyleHook_unstable('useSpinButtonStyles_unstable')(state);\n\n return renderSpinButton_unstable(state);\n});\n\nSpinButton.displayName = 'SpinButton';\n"],"names":["React","useSpinButton_unstable","renderSpinButton_unstable","useSpinButtonStyles_unstable","useCustomStyleHook_unstable","SpinButton","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,+BAA+B;AAG5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,2BAAmDL,MAAMM,UAAU,CAAC,CAACC,OAAOC
|
1
|
+
{"version":3,"sources":["SpinButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSpinButton_unstable } from './useSpinButton';\nimport { renderSpinButton_unstable } from './renderSpinButton';\nimport { useSpinButtonStyles_unstable } from './useSpinButtonStyles.styles';\nimport type { SpinButtonProps } from './SpinButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * A SpinButton allows someone to incrementally adjust a value in small steps.\n */\nexport const SpinButton: ForwardRefComponent<SpinButtonProps> = React.forwardRef((props, ref) => {\n const state = useSpinButton_unstable(props, ref);\n\n useSpinButtonStyles_unstable(state);\n\n useCustomStyleHook_unstable('useSpinButtonStyles_unstable')(state);\n\n return renderSpinButton_unstable(state);\n});\n\nSpinButton.displayName = 'SpinButton';\n"],"names":["React","useSpinButton_unstable","renderSpinButton_unstable","useSpinButtonStyles_unstable","useCustomStyleHook_unstable","SpinButton","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,+BAA+B;AAG5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,2BAAmDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQR,uBAAuBM,OAAOC;IAE5CL,6BAA6BM;IAE7BL,4BAA4B,gCAAgCK;IAE5D,OAAOP,0BAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}
|
@@ -1,8 +1,14 @@
|
|
1
|
-
/** @jsxRuntime
|
1
|
+
/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
2
2
|
import { assertSlots } from '@fluentui/react-utilities';
|
3
3
|
/**
|
4
4
|
* Render the final JSX of SpinButton
|
5
5
|
*/ export const renderSpinButton_unstable = (state)=>{
|
6
6
|
assertSlots(state);
|
7
|
-
return /*#__PURE__*/
|
7
|
+
return /*#__PURE__*/ _jsxs(state.root, {
|
8
|
+
children: [
|
9
|
+
/*#__PURE__*/ _jsx(state.input, {}),
|
10
|
+
/*#__PURE__*/ _jsx(state.incrementButton, {}),
|
11
|
+
/*#__PURE__*/ _jsx(state.decrementButton, {})
|
12
|
+
]
|
13
|
+
});
|
8
14
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["renderSpinButton.tsx"],"sourcesContent":["/** @jsxRuntime
|
1
|
+
{"version":3,"sources":["renderSpinButton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SpinButtonState, SpinButtonSlots } from './SpinButton.types';\n\n/**\n * Render the final JSX of SpinButton\n */\nexport const renderSpinButton_unstable = (state: SpinButtonState) => {\n assertSlots<SpinButtonSlots>(state);\n\n return (\n <state.root>\n <state.input />\n <state.incrementButton />\n <state.decrementButton />\n </state.root>\n );\n};\n"],"names":["assertSlots","renderSpinButton_unstable","state","root","input","incrementButton","decrementButton"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC;IACxCF,YAA6BE;IAE7B,qBACE,MAACA,MAAMC,IAAI;;0BACT,KAACD,MAAME,KAAK;0BACZ,KAACF,MAAMG,eAAe;0BACtB,KAACH,MAAMI,eAAe;;;AAG5B,EAAE"}
|
@@ -40,7 +40,7 @@ const lerp = (start, end, percent)=>start + (end - start) * percent;
|
|
40
40
|
});
|
41
41
|
const overrides = useOverrides();
|
42
42
|
var _overrides_inputDefaultAppearance;
|
43
|
-
const { value
|
43
|
+
const { value, displayValue, defaultValue, min, max, step = 1, stepPage = 1, precision: precisionFromProps, onChange, size = 'medium', appearance = (_overrides_inputDefaultAppearance = overrides.inputDefaultAppearance) !== null && _overrides_inputDefaultAppearance !== void 0 ? _overrides_inputDefaultAppearance : 'outline', root, input, incrementButton, decrementButton } = props;
|
44
44
|
const precision = React.useMemo(()=>{
|
45
45
|
return precisionFromProps !== null && precisionFromProps !== void 0 ? precisionFromProps : Math.max(calculatePrecision(step), 0);
|
46
46
|
}, [
|
@@ -174,7 +174,8 @@ const lerp = (start, end, percent)=>start + (end - start) * percent;
|
|
174
174
|
}
|
175
175
|
}
|
176
176
|
if (valueChanged || displayValueChanged) {
|
177
|
-
|
177
|
+
var _onChange;
|
178
|
+
(_onChange = onChange) === null || _onChange === void 0 ? void 0 : _onChange(e, {
|
178
179
|
value: roundedValue,
|
179
180
|
displayValue: newDisplayValue
|
180
181
|
});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useSpinButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useControllableState,\n useTimeout,\n slot,\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: slot.always(root, {\n defaultProps: nativeProps.root,\n elementType: 'span',\n }),\n input: slot.always(input, {\n defaultProps: {\n ref,\n autoComplete: 'off',\n role: 'spinbutton',\n appearance,\n type: 'text',\n ...nativeProps.primary,\n },\n elementType: 'input',\n }),\n incrementButton: slot.always(incrementButton, {\n defaultProps: {\n tabIndex: -1,\n children: <ChevronUp16Regular />,\n disabled: nativeProps.primary.disabled,\n 'aria-label': 'Increment value',\n type: 'button',\n },\n elementType: 'button',\n }),\n decrementButton: slot.always(decrementButton, {\n defaultProps: {\n tabIndex: -1,\n children: <ChevronDown16Regular />,\n disabled: nativeProps.primary.disabled,\n 'aria-label': 'Decrement value',\n type: 'button',\n },\n elementType: 'button',\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"],"names":["React","useFieldControlProps_unstable","getPartitionedNativeProps","mergeCallbacks","useControllableState","useTimeout","slot","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","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","always","defaultProps","elementType","autoComplete","role","type","primary","tabIndex","children","disabled","valueToDisplay","onBlur","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave"],"mappings":"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"}
|
1
|
+
{"version":3,"sources":["useSpinButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useControllableState,\n useTimeout,\n slot,\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: slot.always(root, {\n defaultProps: nativeProps.root,\n elementType: 'span',\n }),\n input: slot.always(input, {\n defaultProps: {\n ref,\n autoComplete: 'off',\n role: 'spinbutton',\n appearance,\n type: 'text',\n ...nativeProps.primary,\n },\n elementType: 'input',\n }),\n incrementButton: slot.always(incrementButton, {\n defaultProps: {\n tabIndex: -1,\n children: <ChevronUp16Regular />,\n disabled: nativeProps.primary.disabled,\n 'aria-label': 'Increment value',\n type: 'button',\n },\n elementType: 'button',\n }),\n decrementButton: slot.always(decrementButton, {\n defaultProps: {\n tabIndex: -1,\n children: <ChevronDown16Regular />,\n disabled: nativeProps.primary.disabled,\n 'aria-label': 'Decrement value',\n type: 'button',\n },\n elementType: 'button',\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"],"names":["React","useFieldControlProps_unstable","getPartitionedNativeProps","mergeCallbacks","useControllableState","useTimeout","slot","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","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","always","defaultProps","elementType","autoComplete","role","type","primary","tabIndex","children","disabled","valueToDisplay","onBlur","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","typographyStyles","spinButtonClassNames","root","input","incrementButton","decrementButton","spinButtonExtraClassNames","buttonActive","fieldHeights","small","medium","useRootClassName","r","s","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":["useSpinButtonStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, 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 = 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 backgroundColor: tokens.colorNeutralBackground1,\n minHeight: fieldHeights.medium,\n padding: `0 0 0 ${tokens.spacingHorizontalMNudge}`,\n borderRadius: tokens.borderRadiusMedium,\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 '::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: 20,\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 // 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 // Animation for focus OUT\n transform: 'scaleX(0)',\n transitionProperty: 'transform',\n transitionDuration: tokens.durationUltraFast,\n transitionDelay: tokens.curveAccelerateMid,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\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 '@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});\nconst useRootStyles = makeStyles({\n small: {\n minHeight: fieldHeights.small,\n ...typographyStyles.caption1,\n paddingLeft: tokens.spacingHorizontalS\n },\n medium: {\n },\n outline: {\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 underline: {\n '::before': {\n ...shorthands.borderWidth(0, 0, '1px', 0),\n ...shorthands.borderRadius(tokens.borderRadiusNone)\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)\n },\n filled: {\n '::before': {\n ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke)\n }\n },\n 'filled-darker': {\n backgroundColor: tokens.colorNeutralBackground3\n },\n 'filled-lighter': {\n backgroundColor: tokens.colorNeutralBackground1\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 invalid: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n '::before': {\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n }\n }\n },\n disabled: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorTransparentBackground,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText')\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 '::placeholder': {\n color: tokens.colorNeutralForeground4,\n opacity: 1\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});\nconst useBaseButtonClassName = makeResetStyles({\n display: 'inline-flex',\n width: '24px',\n alignItems: 'center',\n justifyContent: 'center',\n border: '0',\n position: 'absolute',\n outlineStyle: 'none',\n height: '16px',\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 // common button layout\n gridColumnStart: '2',\n borderRadius: '0',\n padding: '0 5px 0 5px',\n ':active': {\n outlineStyle: 'none'\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 ':disabled': {\n cursor: 'not-allowed',\n color: tokens.colorNeutralForegroundDisabled\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 decrementButtonSmall: {\n ...shorthands.padding('0px', '6px', '3px', '4px'),\n height: '12px'\n },\n outline: {\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 ':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 ':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// 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 ':hover': {\n cursor: 'not-allowed'\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 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 '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 '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 * Apply styling to the SpinButton slots based on the state\n */ export const useSpinButtonStyles_unstable = (state)=>{\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 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"],"mappings":"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"}
|
1
|
+
{"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","typographyStyles","spinButtonClassNames","root","input","incrementButton","decrementButton","spinButtonExtraClassNames","buttonActive","fieldHeights","small","medium","useRootClassName","r","s","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":["useSpinButtonStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, 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 = 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 backgroundColor: tokens.colorNeutralBackground1,\n minHeight: fieldHeights.medium,\n padding: `0 0 0 ${tokens.spacingHorizontalMNudge}`,\n borderRadius: tokens.borderRadiusMedium,\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 '::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: 20,\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 // 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 // Animation for focus OUT\n transform: 'scaleX(0)',\n transitionProperty: 'transform',\n transitionDuration: tokens.durationUltraFast,\n transitionDelay: tokens.curveAccelerateMid,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\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 '@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});\nconst useRootStyles = makeStyles({\n small: {\n minHeight: fieldHeights.small,\n ...typographyStyles.caption1,\n paddingLeft: tokens.spacingHorizontalS\n },\n medium: {\n },\n outline: {\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 underline: {\n '::before': {\n ...shorthands.borderWidth(0, 0, '1px', 0),\n ...shorthands.borderRadius(tokens.borderRadiusNone)\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)\n },\n filled: {\n '::before': {\n ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke)\n }\n },\n 'filled-darker': {\n backgroundColor: tokens.colorNeutralBackground3\n },\n 'filled-lighter': {\n backgroundColor: tokens.colorNeutralBackground1\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 invalid: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n '::before': {\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n }\n }\n },\n disabled: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorTransparentBackground,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText')\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 '::placeholder': {\n color: tokens.colorNeutralForeground4,\n opacity: 1\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});\nconst useBaseButtonClassName = makeResetStyles({\n display: 'inline-flex',\n width: '24px',\n alignItems: 'center',\n justifyContent: 'center',\n border: '0',\n position: 'absolute',\n outlineStyle: 'none',\n height: '16px',\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 // common button layout\n gridColumnStart: '2',\n borderRadius: '0',\n padding: '0 5px 0 5px',\n ':active': {\n outlineStyle: 'none'\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 ':disabled': {\n cursor: 'not-allowed',\n color: tokens.colorNeutralForegroundDisabled\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 decrementButtonSmall: {\n ...shorthands.padding('0px', '6px', '3px', '4px'),\n height: '12px'\n },\n outline: {\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 ':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 ':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// 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 ':hover': {\n cursor: 'not-allowed'\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 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 '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 '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 * Apply styling to the SpinButton slots based on the state\n */ export const useSpinButtonStyles_unstable = (state)=>{\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 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"],"mappings":"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"}
|
package/lib/utils/clamp.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["clamp.ts"],"sourcesContent":["export const clamp = (value: number, min?: number, max?: number): number => {\n let nextValue = value;\n if (min !== undefined) {\n if (max !== undefined && min > max) {\n const error = new Error();\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(\n [\n `\"min\" value \"${min}\" is greater than \"max\" value \"${max}\".`,\n '\"min\" must be less than or equal to \"max\".',\n `Returning value \"${value}\".`,\n error.stack,\n ].join(),\n );\n }\n return value;\n }\n\n nextValue = Math.max(min, nextValue);\n }\n\n if (max !== undefined) {\n nextValue = Math.min(max, nextValue);\n }\n\n return nextValue;\n};\n"],"names":["clamp","value","min","max","nextValue","undefined","error","Error","process","env","NODE_ENV","console","stack","join","Math"],"mappings":"AAAA,OAAO,MAAMA,QAAQ,CAACC,OAAeC,KAAcC
|
1
|
+
{"version":3,"sources":["clamp.ts"],"sourcesContent":["export const clamp = (value: number, min?: number, max?: number): number => {\n let nextValue = value;\n if (min !== undefined) {\n if (max !== undefined && min > max) {\n const error = new Error();\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(\n [\n `\"min\" value \"${min}\" is greater than \"max\" value \"${max}\".`,\n '\"min\" must be less than or equal to \"max\".',\n `Returning value \"${value}\".`,\n error.stack,\n ].join(),\n );\n }\n return value;\n }\n\n nextValue = Math.max(min, nextValue);\n }\n\n if (max !== undefined) {\n nextValue = Math.min(max, nextValue);\n }\n\n return nextValue;\n};\n"],"names":["clamp","value","min","max","nextValue","undefined","error","Error","process","env","NODE_ENV","console","stack","join","Math"],"mappings":"AAAA,OAAO,MAAMA,QAAQ,CAACC,OAAeC,KAAcC;IACjD,IAAIC,YAAYH;IAChB,IAAIC,QAAQG,WAAW;QACrB,IAAIF,QAAQE,aAAaH,MAAMC,KAAK;YAClC,MAAMG,QAAQ,IAAIC;YAClB,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;gBACzC,sCAAsC;gBACtCC,QAAQL,KAAK,CACX;oBACE,CAAC,aAAa,EAAEJ,IAAI,+BAA+B,EAAEC,IAAI,EAAE,CAAC;oBAC5D;oBACA,CAAC,iBAAiB,EAAEF,MAAM,EAAE,CAAC;oBAC7BK,MAAMM,KAAK;iBACZ,CAACC,IAAI;YAEV;YACA,OAAOZ;QACT;QAEAG,YAAYU,KAAKX,GAAG,CAACD,KAAKE;IAC5B;IAEA,IAAID,QAAQE,WAAW;QACrBD,YAAYU,KAAKZ,GAAG,CAACC,KAAKC;IAC5B;IAEA,OAAOA;AACT,EAAE"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["getBound.ts"],"sourcesContent":["import type { SpinButtonBounds } from '../SpinButton';\n\nexport const getBound = (value: number, min?: number, max?: number): SpinButtonBounds => {\n if (min !== undefined && value === min) {\n if (max === min) {\n return 'both';\n }\n return 'min';\n } else if (max !== undefined && value === max) {\n return 'max';\n }\n\n return 'none';\n};\n"],"names":["getBound","value","min","max","undefined"],"mappings":"AAEA,OAAO,MAAMA,WAAW,CAACC,OAAeC,KAAcC
|
1
|
+
{"version":3,"sources":["getBound.ts"],"sourcesContent":["import type { SpinButtonBounds } from '../SpinButton';\n\nexport const getBound = (value: number, min?: number, max?: number): SpinButtonBounds => {\n if (min !== undefined && value === min) {\n if (max === min) {\n return 'both';\n }\n return 'min';\n } else if (max !== undefined && value === max) {\n return 'max';\n }\n\n return 'none';\n};\n"],"names":["getBound","value","min","max","undefined"],"mappings":"AAEA,OAAO,MAAMA,WAAW,CAACC,OAAeC,KAAcC;IACpD,IAAID,QAAQE,aAAaH,UAAUC,KAAK;QACtC,IAAIC,QAAQD,KAAK;YACf,OAAO;QACT;QACA,OAAO;IACT,OAAO,IAAIC,QAAQC,aAAaH,UAAUE,KAAK;QAC7C,OAAO;IACT;IAEA,OAAO;AACT,EAAE"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["precision.ts"],"sourcesContent":["/**\n * Calculates a number's precision based on the number of trailing\n * zeros if the number does not have a decimal indicated by a negative\n * precision. Otherwise, it calculates the number of digits after\n * the decimal point indicated by a positive precision.\n * @param value - the value to determine the precision of\n */\nexport function calculatePrecision(value: number | string): number {\n /**\n * Group 1:\n * [1-9]([0]+$) matches trailing zeros\n * Group 2:\n * \\.([0-9]*) matches all digits after a decimal point.\n */\n const groups = /[1-9]([0]+$)|\\.([0-9]*)/.exec(String(value));\n if (!groups) {\n return 0;\n }\n if (groups[1]) {\n return -groups[1].length;\n }\n if (groups[2]) {\n return groups[2].length;\n }\n return 0;\n}\n\n/**\n * Rounds a number to a certain level of precision. Accepts negative precision.\n * @param value - The value that is being rounded.\n * @param precision - The number of decimal places to round the number to\n */\nexport function precisionRound(value: number, precision: number, base: number = 10): number {\n const exp = Math.pow(base, precision);\n return Math.round(value * exp) / exp;\n}\n"],"names":["calculatePrecision","value","groups","exec","String","length","precisionRound","precision","base","exp","Math","pow","round"],"mappings":"AAAA;;;;;;CAMC,GACD,OAAO,SAASA,mBAAmBC,KAAsB
|
1
|
+
{"version":3,"sources":["precision.ts"],"sourcesContent":["/**\n * Calculates a number's precision based on the number of trailing\n * zeros if the number does not have a decimal indicated by a negative\n * precision. Otherwise, it calculates the number of digits after\n * the decimal point indicated by a positive precision.\n * @param value - the value to determine the precision of\n */\nexport function calculatePrecision(value: number | string): number {\n /**\n * Group 1:\n * [1-9]([0]+$) matches trailing zeros\n * Group 2:\n * \\.([0-9]*) matches all digits after a decimal point.\n */\n const groups = /[1-9]([0]+$)|\\.([0-9]*)/.exec(String(value));\n if (!groups) {\n return 0;\n }\n if (groups[1]) {\n return -groups[1].length;\n }\n if (groups[2]) {\n return groups[2].length;\n }\n return 0;\n}\n\n/**\n * Rounds a number to a certain level of precision. Accepts negative precision.\n * @param value - The value that is being rounded.\n * @param precision - The number of decimal places to round the number to\n */\nexport function precisionRound(value: number, precision: number, base: number = 10): number {\n const exp = Math.pow(base, precision);\n return Math.round(value * exp) / exp;\n}\n"],"names":["calculatePrecision","value","groups","exec","String","length","precisionRound","precision","base","exp","Math","pow","round"],"mappings":"AAAA;;;;;;CAMC,GACD,OAAO,SAASA,mBAAmBC,KAAsB;IACvD;;;;;GAKC,GACD,MAAMC,SAAS,0BAA0BC,IAAI,CAACC,OAAOH;IACrD,IAAI,CAACC,QAAQ;QACX,OAAO;IACT;IACA,IAAIA,MAAM,CAAC,EAAE,EAAE;QACb,OAAO,CAACA,MAAM,CAAC,EAAE,CAACG,MAAM;IAC1B;IACA,IAAIH,MAAM,CAAC,EAAE,EAAE;QACb,OAAOA,MAAM,CAAC,EAAE,CAACG,MAAM;IACzB;IACA,OAAO;AACT;AAEA;;;;CAIC,GACD,OAAO,SAASC,eAAeL,KAAa,EAAEM,SAAiB,EAAEC,OAAe,EAAE;IAChF,MAAMC,MAAMC,KAAKC,GAAG,CAACH,MAAMD;IAC3B,OAAOG,KAAKE,KAAK,CAACX,QAAQQ,OAAOA;AACnC"}
|
@@ -2,5 +2,5 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
3
3
|
value: true
|
4
4
|
});
|
5
|
-
const
|
6
|
-
|
5
|
+
const _export_star = require("@swc/helpers/_/_export_star");
|
6
|
+
_export_star._(require("./components/SpinButton/index"), exports);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["SpinButton.js"],"sourcesContent":["export * from './components/SpinButton/index';\n"],"names":[],"mappings":";;;;;
|
1
|
+
{"version":3,"sources":["SpinButton.js"],"sourcesContent":["export * from './components/SpinButton/index';\n"],"names":[],"mappings":";;;;;uBAAc"}
|
@@ -4,18 +4,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
});
|
5
5
|
Object.defineProperty(exports, "SpinButton", {
|
6
6
|
enumerable: true,
|
7
|
-
get: ()
|
7
|
+
get: function() {
|
8
|
+
return SpinButton;
|
9
|
+
}
|
8
10
|
});
|
9
|
-
const
|
10
|
-
const _react = /*#__PURE__*/
|
11
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
12
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
11
13
|
const _useSpinButton = require("./useSpinButton");
|
12
14
|
const _renderSpinButton = require("./renderSpinButton");
|
13
|
-
const
|
14
|
-
const
|
15
|
+
const _useSpinButtonStylesstyles = require("./useSpinButtonStyles.styles");
|
16
|
+
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
|
15
17
|
const SpinButton = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
16
18
|
const state = (0, _useSpinButton.useSpinButton_unstable)(props, ref);
|
17
|
-
(0,
|
18
|
-
(0,
|
19
|
+
(0, _useSpinButtonStylesstyles.useSpinButtonStyles_unstable)(state);
|
20
|
+
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useSpinButtonStyles_unstable')(state);
|
19
21
|
return (0, _renderSpinButton.renderSpinButton_unstable)(state);
|
20
22
|
});
|
21
23
|
SpinButton.displayName = 'SpinButton';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["SpinButton.js"],"sourcesContent":["import * as React from 'react';\nimport { useSpinButton_unstable } from './useSpinButton';\nimport { renderSpinButton_unstable } from './renderSpinButton';\nimport { useSpinButtonStyles_unstable } from './useSpinButtonStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * A SpinButton allows someone to incrementally adjust a value in small steps.\n */ export const SpinButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const state = useSpinButton_unstable(props, ref);\n useSpinButtonStyles_unstable(state);\n useCustomStyleHook_unstable('useSpinButtonStyles_unstable')(state);\n return renderSpinButton_unstable(state);\n});\nSpinButton.displayName = 'SpinButton';\n"],"names":["SpinButton","React","forwardRef","props","ref","state","useSpinButton_unstable","useSpinButtonStyles_unstable","useCustomStyleHook_unstable","renderSpinButton_unstable","displayName"],"mappings":";;;;+BAOiBA
|
1
|
+
{"version":3,"sources":["SpinButton.js"],"sourcesContent":["import * as React from 'react';\nimport { useSpinButton_unstable } from './useSpinButton';\nimport { renderSpinButton_unstable } from './renderSpinButton';\nimport { useSpinButtonStyles_unstable } from './useSpinButtonStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * A SpinButton allows someone to incrementally adjust a value in small steps.\n */ export const SpinButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const state = useSpinButton_unstable(props, ref);\n useSpinButtonStyles_unstable(state);\n useCustomStyleHook_unstable('useSpinButtonStyles_unstable')(state);\n return renderSpinButton_unstable(state);\n});\nSpinButton.displayName = 'SpinButton';\n"],"names":["SpinButton","React","forwardRef","props","ref","state","useSpinButton_unstable","useSpinButtonStyles_unstable","useCustomStyleHook_unstable","renderSpinButton_unstable","displayName"],"mappings":";;;;+BAOiBA;;;eAAAA;;;;iEAPM;+BACgB;kCACG;2CACG;qCACD;AAGjC,MAAMA,aAAa,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACjE,MAAMC,QAAQC,IAAAA,qCAAsB,EAACH,OAAOC;IAC5CG,IAAAA,uDAA4B,EAACF;IAC7BG,IAAAA,gDAA2B,EAAC,gCAAgCH;IAC5D,OAAOI,IAAAA,2CAAyB,EAACJ;AACrC;AACAL,WAAWU,WAAW,GAAG"}
|
@@ -2,5 +2,5 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
3
3
|
value: true
|
4
4
|
});
|
5
|
-
const
|
6
|
-
const _react = /*#__PURE__*/
|
5
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
6
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["SpinButton.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;
|
1
|
+
{"version":3,"sources":["SpinButton.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;iEAAuB"}
|
@@ -2,9 +2,9 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
3
3
|
value: true
|
4
4
|
});
|
5
|
-
const
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
5
|
+
const _export_star = require("@swc/helpers/_/_export_star");
|
6
|
+
_export_star._(require("./SpinButton"), exports);
|
7
|
+
_export_star._(require("./SpinButton.types"), exports);
|
8
|
+
_export_star._(require("./renderSpinButton"), exports);
|
9
|
+
_export_star._(require("./useSpinButton"), exports);
|
10
|
+
_export_star._(require("./useSpinButtonStyles.styles"), exports);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["index.js"],"sourcesContent":["export * from './SpinButton';\nexport * from './SpinButton.types';\nexport * from './renderSpinButton';\nexport * from './useSpinButton';\nexport * from './useSpinButtonStyles.styles';\n"],"names":[],"mappings":";;;;;
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export * from './SpinButton';\nexport * from './SpinButton.types';\nexport * from './renderSpinButton';\nexport * from './useSpinButton';\nexport * from './useSpinButtonStyles.styles';\n"],"names":[],"mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
|
@@ -1,14 +1,22 @@
|
|
1
|
-
/** @jsxRuntime
|
1
|
+
/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ "use strict";
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
3
3
|
value: true
|
4
4
|
});
|
5
5
|
Object.defineProperty(exports, "renderSpinButton_unstable", {
|
6
6
|
enumerable: true,
|
7
|
-
get: ()
|
7
|
+
get: function() {
|
8
|
+
return renderSpinButton_unstable;
|
9
|
+
}
|
8
10
|
});
|
9
|
-
const
|
10
|
-
const
|
11
|
+
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
|
12
|
+
const _reactutilities = require("@fluentui/react-utilities");
|
11
13
|
const renderSpinButton_unstable = (state)=>{
|
12
|
-
(0,
|
13
|
-
return /*#__PURE__*/ (0,
|
14
|
+
(0, _reactutilities.assertSlots)(state);
|
15
|
+
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
|
16
|
+
children: [
|
17
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(state.input, {}),
|
18
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(state.incrementButton, {}),
|
19
|
+
/*#__PURE__*/ (0, _jsxruntime.jsx)(state.decrementButton, {})
|
20
|
+
]
|
21
|
+
});
|
14
22
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["renderSpinButton.js"],"sourcesContent":["/** @jsxRuntime
|
1
|
+
{"version":3,"sources":["renderSpinButton.js"],"sourcesContent":["/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx, jsxs as _jsxs } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of SpinButton\n */ export const renderSpinButton_unstable = (state)=>{\n assertSlots(state);\n return /*#__PURE__*/ _jsxs(state.root, {\n children: [\n /*#__PURE__*/ _jsx(state.input, {}),\n /*#__PURE__*/ _jsx(state.incrementButton, {}),\n /*#__PURE__*/ _jsx(state.decrementButton, {})\n ]\n });\n};\n"],"names":["renderSpinButton_unstable","state","assertSlots","_jsxs","root","children","_jsx","input","incrementButton","decrementButton"],"mappings":"AAAA,0BAA0B,GAAG,iDAAiD;;;;+BAI7DA;;;eAAAA;;;4BAJ2G;gCAChG;AAGjB,MAAMA,4BAA4B,CAACC;IAC1CC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,gBAAK,EAACF,MAAMG,IAAI,EAAE;QACnCC,UAAU;YACN,WAAW,GAAGC,IAAAA,eAAI,EAACL,MAAMM,KAAK,EAAE,CAAC;YACjC,WAAW,GAAGD,IAAAA,eAAI,EAACL,MAAMO,eAAe,EAAE,CAAC;YAC3C,WAAW,GAAGF,IAAAA,eAAI,EAACL,MAAMQ,eAAe,EAAE,CAAC;SAC9C;IACL;AACJ"}
|